OmniAICreator/Qiita-1.07M huggingface dataset:
Unityのアニメーションに任意の姿勢を適用する方法

# はじめに
猫背気味のアバタにUnityでアニメーションをつけようとしたところ、背筋が強制的に伸ばされる問題に遭遇しました。そのため今回は問題となった状態までの再現と、それから解決に至るまでの手順を備忘録にと書き起こしました。
以下の人は参考になるかも：
任意の姿勢でアニメーションを適応したい人
アニメーション中のみアバタの姿勢を変えたい人

注）本記事ではimportしてきたモデルをアバタ、animationを適応させるために必要な情報をAvatarとしている
# 環境ならびに使用アセット
Unity 2021.3.5f1
[Basic Motions FREE](https://assetstore.unity.com/packages/3d/animations/basic-motions-free-154271)（2020.3.18以降しか対応していないため注意）

# 使用したいアバタを用意する
今回は[Makehuman](http://www.makehumancommunity.org/)で自作したアバタを使用
![normal_man.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2820849/0b5197de-86c2-bdc7-c612-6197001749d5.png)

このアバタを猫背にしてUnity上で利用したいため、さらにblenderでアーマチュアをまげ理想形に変形させる![nekoze_man.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2820849/dd8601a3-3deb-92af-c2bc-c740938241f2.png)

# Unityで動かす
まず準備として先ほど作成したアバタと「Basic Motions FREE」をUnityにimportする。
アバタ名はnekoze_male1とした。
今回使用するアバタは、アニメーションを適応させるために必要なアバタ情報を持っていなかったため作成する。

![non avatar.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2820849/65aa9c81-ef04-dfcd-5ba2-f7b13da88685.png)
Inspectorよりanimatorコンポーネントを加え、Avatar欄をクリックしてもnekoze_male1のAvatarがないことがわかる。
（上記のBasicMotionはBasic Motions FREEに内包されているモデルのAvatar）


### アバタ情報の作成
[Project]-[Assets]より自身がimportしたアバタを左クリックする。するとInspector欄が以下の画面に切り替わる。
![inspector.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2820849/9ac81027-948c-d33d-c1b2-f1274c0f681f.png)
[Rig]-[Animation Type]-[Humanoid]の順で選択し、ApplyをクリックするとAvatarが作成される。
![avatar_created.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2820849/2185ac5d-09c0-374e-604c-b8083c185d85.png)
(先ほどでなかったnekoze_male1が存在してる）

しかしControllerにBasicMotions@WalkをアタッチしGame modeを起動すると、猫背のアバタにも関わらずきれいな姿勢で歩き出してしまう。


![walking.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2820849/5ae06c02-7bd9-b31b-1ffd-2a8c355d7c21.png)
（動画を入れたかったのですが方法がわからず静止画となっています）

# 問題の解決方法
先ほどAvatarを作成するための画面まで行き、Configureをクリックすると以下の画面が開く。
![config.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2820849/163704f0-f587-9634-9008-2eac0c402e70.png)
これはアバターがアニメーションを実行する際の姿勢を表している。
先ほどはこちらを変更していなかったために、Scene上では猫背になっていたアバタに歩行のアニメーションを適応するときちんと背筋を伸ばして歩いてしまった。
これを解決する方法は2つある。
### ①直接アバタを操作する
画面中央にあるアバタのボーンを直接動かすことによって任意の姿勢を作る方法である。
この方法のメリットとして
・事前準備なしに姿勢を作成できる
・アニメーションを見て変更が行えるため微調整しやすい
・アニメーション上の姿勢を指定しているためanimatorのControllrに何か指定しない限り、従来の姿勢をとる
といったことが挙げられる。

### ②元の姿勢を使用する
Inspectorの最下部に位置しているPoseタブを開くと以下のタブが出てくる。
・Reset
　　アバタが本来持っていたボーン情報を適応させる
・Sample Bind T-Pose
　　サンプルのTポーズをとらせる
・Enforce T-Pose
   現在のボーン情報をもとに、強制的にTポーズをとらせる
![a.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2820849/5ee54cf9-18e2-8c7e-41e2-61d50ea62a4f.png)
[Reset]-[Enforce T-Pose]の順にクリックすると、任意の姿勢でアニメーションに対応したAvatarが作成される。
![nekoze.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2820849/c9d11a41-afe5-eb93-3b0f-f768cb20d87c.png)
（[Reset]-[Enforce T-Pose]の順に実行した結果）
こちらのメリットは
・事前に情報を作っていた場合スムーズに作業が行える
といったことが挙げられる。

# おわりに
ここが間違っている、ここがよくわからない等ありましたら連絡いただけると幸いです。
論文原稿は共有してもいいのか？

# はじめに

Qiita界隈の方には縁遠いかもしれませんが、備忘録を共有します。
同じようなことに悩む若手研究者の手助けになればいいと思っています。

ただし、以下の点に注意してください。
- **決してこの記事を鵜呑みにせず、自分で調べてください。**
- **情報が古くなっている可能性があります。**

# 出版物の種類

出版物（書籍、論文など）は一般的に以下の種類に分類されます。

- プレプリント preprint：**レビュー前**の最終原稿
- アクセプトされた原稿 accepted manuscript：**レビュー後**、アクセプトされたが出版されていない最終原稿
    - 出版された原稿とは、出版社により校正され、論文誌のフォーマットに当てはめられた原稿を指す
- 出版される最終版：VOR（Version of Record）

これらの出版物の共有について、[Researchgate - Copyright - General principles](https://explore.researchgate.net/display/support/Copyright) では以下のように述べられています。

- 多くの出版社は VOR を公に共有することを許可していない
- Preprints と accepted manuscripts は特定の状況下（猶予期間後など）において共有可能であることが多い

# 著者の権利


[Taylor&Francis Group - Understanding copyright for journal authors](https://authorservices.taylorandfrancis.com/publishing-your-research/moving-through-production/copyright-for-journal-authors/)

論文誌ごとに異なる（調査中…）。

# 調査したときに見かけた概念

**クリエイティブ・コモンズ・ライセンス (Creative Commons licenses)**
- よく見かけるロゴマーク
https://creativecommons.jp/licenses/

**エンバーゴ（公開猶予期間） (Embargo)**
- ある種の原稿を共有しても良いが、猶予期間が設けられていることがある
- プレスリリースにも猶予期間がある場合もある

**アーカイブ (Self-Archiving)**
- 原稿を共有すること
- Springer Nature 社で書かれがち


# Researchgate の立場


[Researchgate-Copyright](https://explore.researchgate.net/display/support/Copyright)
では以下のようなサイトがあります。

- https://explore.researchgate.net/display/support/Copyright


# 出版社ごとの規則を検索

以下のサイトに論文誌名を入力し、ページ下部の Open Access 欄を確認する。

https://www.journalguide.com/


# おわりに

- 私のための備忘録としてまとめています。調べる必要が出てきた際には update する予定です。
- コメント、ご指摘などございましたらよろしくお願いします。
【PostgreSQL】 stored functionの実行計画を確認する 【RDS、docker対応】

## はじめに
PostgreSQLのstored function(ないしストアドプロシージャ)のパフォーマンスチューニングのため、実行計画を見ようとしましたが、シンプルにexplain句などでみることはできませんでした。

```sql
explain select some_example (
  params := 'params'
);
-- 残念な出力
-- ProjectSet  (cost=0.00..5.27 rows=1000 width=32)
--   ->  Result  (cost=0.00..0.01 rows=1 width=0)
```

残念ながら中でどれだけ複雑なロジックをもっていてもブラックボックス化されてしまっているようで、残念な出力しか得られません。
今回実行計画を見る方法を調べたので方法の共有のため記事にしました。

## 方法
[auto_explain拡張機能](https://www.postgresql.jp/document/14/html/auto-explain.html)を使います。
この拡張機能は本来は自動的に遅いクエリーの実行計画をログ記録するためのものです。

stored functionを使っている場合、普通に使う分には上の残念な出力がログに流れるだけになってしまいますが、拡張機能のパラメータにlog_nested_statementsなるものがあり、これをtrueにすることでstored functionの内部の実行計画がログに記録されるようになります。

**explain の出力が上書きされたりはしません。**
stored functionの実行計画は、ログに書きだされたものを見に行きます。

## 導入手順　RDS編
auto_explainはRDSでも使用可能な拡張機能です。

https://aws.amazon.com/jp/premiumsupport/knowledge-center/rds-postgresql-tune-query-performance/

log_nested_statementsを設定するほかは、基本的にこれにならいます。

パラメータグループを新しくつくりそこで設定していくのがよいでしょう。

### 設定する項目
| 項目 | 値 |
| --- | --- |
| shared_preload_libraries | 空　もしくは　auto_explainを追加する |
| auto_explain.log_nested_statements | 1 |
| auto_explain.log_min_duration | 0 |

auto_explain.log_min_duration を0にすることですべてのクエリの実行計画を見ることができますが、ログ出力するものが増えパフォーマンスの低下の恐れがあるので、パフォチューなどをしたら適切な値にしておきましょう。

```
重要: auto_explain.log_min_duration パラメータを 0 に設定すると、パフォーマンスが低下し、記憶域スペースが広範囲に消費されます。これにより、インスタンスに問題が発生する可能性があります。
```
(出典: https://aws.amazon.com/jp/premiumsupport/knowledge-center/rds-postgresql-tune-query-performance/)

ちなみにこのパラメーターの意味は実行にかかった時間がそれ以上のクエリを出力するというものです。1にした場合は実行に1ms以上かかったクエリの実行計画が出力されるようになります。

これらのパラメータを設定しDBインスタンスを再起動することで、auto_explainが有効になります。RDSのログ出力先がcloud watchなら、cloud watchにこれらが流れていきます。重いクエリが流れていないか？のような監視につかうのもよいでしょう。n秒以上かかったクエリのシーケンシャルスキャンを見つけて通知するとかいいですね。

## 導入手順　docker編
ローカルでも使いたいなと思ったのでdockerのpostgresに導入します。
使うイメージは postgres:14.1です。

auto_explainは新たにインストールする必要はありませんでした。auto_explainはcontribの機能なのですが上記のイメージはcontribも含めてbuildしてくれているようです。

設定しないといけないことは、上記のパラメータの他にログの出力先を指定する必要があります。デフォルトでログは出さない設定になっているからです。

docker-compose.ymlでDBの起動コマンドを以下のようにしました
```
command: postgres -c log_destination=stderr -c auto_explain.log_nested_statements=true -c auto_explain.log_min_duration=0
```

こちらの
```
log_destination=stderr
```
でログ出力先を標準エラー出力にしています。

またデータの初期化のSQLの中で
```sql
LOAD 'auto_explain';
```
を実行させます。これはCREATE EXTENSIONの代わりのようなもので、これを実行することで拡張機能が有効になります。(auto_explainがSQLでアクセスできる関数を提供しないため、単に読み込ませるとドキュメントにあります。)

これでコンテナのエラー出力に、実行計画が出力されるようになります。

## まとめ
auto_explain機能をつかうとログに実行計画が流せるよ！
Pythonで直線の色をカラーマップを用いて変化させる方法

2022/10/05:最終更新
# はじめに
scatterのようにカラーマップを用いた描画を直線(plot)で行いたい．
今回はfor文を用いてそれを実現する．

scatterバージョン
![scatter.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2885323/83d13e84-a3c9-24a4-4da5-2b016b0d7fbe.png)
直線バージョン（これを実現したい）
![plot.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2885323/da795c95-3ea5-9590-fdc3-594011721bec.png)


# 開発環境
Mac OS Montery v.12.6
Python 3.9.11
numpy = 1.23.3
matplotlib = 3.6.0

# 目次
<!-- タイトルとアンカー名を編集 -->
1. for文を使う方法


<!-- 各チャプター -->
<a id="#Chapter1"></a>
# Chapter1


```python:plot.py
import matplotlib.pyplot as plt
import numpy as np

#定数の宣言
DATA_RANGE=[0,1]
DATA_NUM=10
X=np.linspace(DATA_RANGE[0],DATA_RANGE[1],DATA_NUM)[:,None]
X=np.tile(X,(2))

#描画の宣言
fig=plt.figure()
gs=fig.add_gridspec(1,1)
ax1=fig.add_subplot(gs[0,0],aspect='equal')
cmap=plt.get_cmap('viridis')

#描画開始
for index in range(X.shape[0]-1):
    ax1.plot([X[index,0],X[index+1,0]],[X[index,1],X[index+1,1]],color=cmap(index/(X.shape[0]-2)))
plt.show()

```
データベース管理システム

# 再編成
レコードの追加や更新などを繰り返していると、物理的な記憶場所が散らばるフラグメンテーションが発生し、検索や読み出し時間の遅延などの影響が出てくる。そこで、一旦別媒体に読み取って、もう```一度保存し直すことで、処理効率を上げる```ことができる。

# 再構成
業務の状況が変わった場合など、```データベースの構成そのものを変更```すること。

# 問題２の気づき
### クラスタリング
ITにおけるクラスタリングとは、```複数のコンピューターを結合したシステム```を指します。それぞれのコンピューターが持つ処理能力を```集約することで高い性能を実現```できるほか、1台のコンピューターにトラブルが生じても```残りのコンピューターで処理を継続```することが可能であることから、```可用性を高める```目的でもクラスタリングの技術は使われています。
出典　
https://www.ntt.com/bizon/glossary/j-k/clustering.html

# 出典 
https://gihyo.jp/book/2022/978-4-297-12375-8
Java Silver SE8 に一か月で合格するためのロードマップ

## はじめに
Javaエンジニアになるべく最初の入りとしてJava Silver SE8の合格を目的に1か月かけて資格を取りました。
Java Silver の試験はSE8と最新のSE11がありますがSE8のほうが範囲が狭く合格率が高いです。
試験時間もSE8は120分（56問）でSE11は180分（80問）とかなりの違いがあります。
今回は一か月以内という期間を設けたこともあり合格率少しでも高めるためにSE8を選択しました。

## 事前知識
プログラミングスクールにて半年間勉強(HTML/CSS, Java Script, PHP(Laravel))
Web制作会社にて業務経験3か月未満(PHP/Wordpress)

## 使った参考書

### [「オラクル認定資格教科書 Javaプログラマ Silver SE 8 」](https://www.amazon.co.jp/%E3%82%AA%E3%83%A9%E3%82%AF%E3%83%AB%E8%AA%8D%E5%AE%9A%E8%B3%87%E6%A0%BC%E6%95%99%E7%A7%91%E6%9B%B8-Java%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9E-Silver-SE-8/dp/4798142735/ref=sr_1_9?keywords=java+silver&qid=1664552715&qu=eyJxc2MiOiIyLjgxIiwicXNhIjoiMS45MCIsInFzcCI6IjIuMDEifQ%3D%3D&sprefix=java+silver%2Caps%2C190&sr=8-9)
通称紫本
基礎の基礎を身につけられるので最初の一冊としておすすめです。



### [「徹底攻略 Java SE 8 Silver 問題集[1Z0-808]対応」](https://www.amazon.co.jp/%E5%BE%B9%E5%BA%95%E6%94%BB%E7%95%A5-Java-Silver-%E5%95%8F%E9%A1%8C%E9%9B%86-1Z0-808/dp/4844339931/ref=sr_1_4_sspa?keywords=java+silver&qid=1664552715&qu=eyJxc2MiOiIyLjgxIiwicXNhIjoiMS45MCIsInFzcCI6IjIuMDEifQ%3D%3D&sprefix=java+silver%2Caps%2C190&sr=8-4-spons&psc=1&spLa=ZW5jcnlwdGVkUXVhbGlmaWVyPUExMVVYUENMWTBTMEU2JmVuY3J5cHRlZElkPUEwMDM0ODU2V0xBVzRBRzMxTEgwJmVuY3J5cHRlZEFkSWQ9QVk2QjZYOUFBNk9GUiZ3aWRnZXROYW1lPXNwX2F0ZiZhY3Rpb249Y2xpY2tSZWRpcmVjdCZkb05vdExvZ0NsaWNrPXRydWU=)
通称黒本
過去問が二回分収録されているのでをひたすら解きます。


### [「オラクル認定資格教科書 Javaプログラマ Silver SE 8 スピードマスター問題集 」](https://www.amazon.co.jp/%E3%82%AA%E3%83%A9%E3%82%AF%E3%83%AB%E8%AA%8D%E5%AE%9A%E8%B3%87%E6%A0%BC%E6%95%99%E7%A7%91%E6%9B%B8-Java%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%9E-Silver-SE-%E3%82%B9%E3%83%94%E3%83%BC%E3%83%89%E3%83%9E%E3%82%B9%E3%82%BF%E3%83%BC%E5%95%8F%E9%A1%8C%E9%9B%86-ebook/dp/B01C2TRNRE/ref=sr_1_3?__mk_ja_JP=%E3%82%AB%E3%82%BF%E3%82%AB%E3%83%8A&crid=3RAISBUB1KKT6&keywords=java+silver+%E3%82%B9%E3%83%94%E3%83%BC%E3%83%89%E3%83%9E%E3%82%B9%E3%82%BF%E3%83%BC&qid=1664552870&qu=eyJxc2MiOiIwLjk4IiwicXNhIjoiMC4wMCIsInFzcCI6IjAuMDAifQ%3D%3D&sprefix=java+silver+%E3%82%B9%E3%83%94%E3%83%BC%E3%83%89%E3%83%9E%E3%82%B9%E3%82%BF%2Caps%2C142&sr=8-3)
通称白本
過去問1回分収録されています。最後の追い込み用として使いました。


## 勉強の流れ
合計勉強時間50時間

「オラクル認定資格教科書 Javaプログラマ Silver SE 8 」を一周行う
勉強時間は10時間程度
個人的な理解度は50%


↓

「徹底攻略 Java SE 8 Silver 問題集[1Z0-808]対応」を2周行う
勉強時間は15時間程度
一周目の正解率は45%
二周目の正解率は70%

↓

「オラクル認定資格教科書 Javaプログラマ Silver SE 8 」を再度一周行う
勉強時間は8時間程度
個人的な理解度は75%
一回目よりはるかに理解度が高まりました。

↓

「オラクル認定資格教科書 Javaプログラマ Silver SE 8 スピードマスター問題集 」を行う
勉強時間は10時間程度
正解率は75%

↓

「徹底攻略 Java SE 8 Silver 問題集[1Z0-808]対応」を再度1周
勉強時間は4時間程度
正解率は90%

↓

「オラクル認定資格教科書 Javaプログラマ Silver SE 8 スピードマスター問題集」を再度1周
勉強時間は4時間程度
正解率は90%

あとは試験を受けるだけです

結果

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1670485/6b301bce-3e00-2c19-b434-3cd7e9458fd6.png)


合格(90%)


## 感想
試験の内容的には問題集で行った問題とほぼ同じような問題が半分くらい出ました。
2022年9月から試験時間が120分になり問題数も56問に減ったため集中力があまり続かない自分でも余裕をもって解くことができました。
紹介した参考書を最低でも2周ずつこなせば8割以上は正解できるのではないかと思います。
Javaはもともと使っていたPHPよりもはるかにルールが多く覚えるのに苦労しました。一か月仕事を休職してJavaのフレームワークであるSpring bootの勉強も併せて行っていたため実践的な理解も深まりました。
金額が高い試験のため必ず受かるという自信をもって試験に臨むことが大切ではないかと思います。
複数レコードを単一レコード・複数カラムにする

## やりたいこと
以下のようなテーブルがある場合、
```
peopleテーブル    telテーブル
| id | name |    | id | people_id | tel           |
|----|------|    |----|-----------|---------------|
| 1  | hoge |    | 1  | 1         | 090-0000-1111 |
| 2  | fuga |    | 2  | 1         | 090-0000-2222 |
| 3  | foo  |    | 3  | 2         | 090-0000-3333 |
| 4  | bar  |    | 4  | 3         | 090-0000-4444 |
```

以下の結果を得たい
```
| id | tel1          | tel2          |
|----|---------------|---------------|
| 1  | 090-0000-1111 | 090-0000-2222 |
| 2  | 090-0000-3333 | null          |
| 3  | 090-0000-4444 | null          |
| 4  | null          | null          |
```

## やり方
### 1. 複数レコードを1レコード・1カラムにする
GROUP BYでpeople.id単位でまとめ、同じpeople.idでtelが複数ある場合は配列として1つのカラムに格納する
```SQL
SELECT
  p.id,
  ARRAY_AGG(t.tel) AS concat_tel
FROM people p
LEFT JOIN tel t
  on p.id = t.people_id
GROUP BY p.id
```
結果↓
```
| id | concat_tel                    |
|----|-------------------------------|
| 1  | {090-0000-1111,090-0000-2222} |
| 2  | {090-0000-3333}               |
| 3  | {090-0000-4444}               |
| 4  | {null}                        |
```

### 2. 配列を複数カラムに分割する
```SQL
WITH concat_tel_table AS ( -- 1で作成したSQL
  SELECT
    p.id,
    ARRAY_AGG(t.tel) AS concat_tel
  FROM people p
  LEFT JOIN tel t
    on p.id = t.people_id
  GROUP BY p.id
)

SELECT
  ctt.id,
  ctt.concat_tel[1] AS tel1,
  ctt.concat_tel[2] AS tel2
FROM concat_tel_table ctt
```
↓結果
```
| id | tel1          | tel2          |
|----|---------------|---------------|
| 1  | 090-0000-1111 | 090-0000-2222 |
| 2  | 090-0000-3333 | null          |
| 3  | 090-0000-4444 | null          |
| 4  | null          | null          |
```

## あとがき
より良いやり方や、既に作られている車輪があれば教えて頂けるとありがたいです。

(追記)
修正前は`ARRAY_AGG`で配列にしたものをわざわざ`ARRAY_TO_STRING`で`,`区切りの文字列にし、
それを`REGEXP_SPLIT_TO_ARRAY`で再度配列に戻すという無駄なことをしていたので修正しました。

<details><summary>playground</summary>

https://www.db-fiddle.com/f/ub6Hhyk81Ud6qaXdRMK2j2/0

```sql:schema
CREATE TABLE people(
  id SERIAL,
  name TEXT
);

INSERT INTO people VALUES(1, 'hoge');
INSERT INTO people VALUES(2, 'fuga');
INSERT INTO people VALUES(3, 'foo');
INSERT INTO people VALUES(4, 'bar');

CREATE TABLE tel(
  id SERIAL,
  people_id INT,
  tel TEXT
);

INSERT INTO tel VALUES(1, 1, '090-000-1111');
INSERT INTO tel VALUES(2, 1, '090-000-2222');
INSERT INTO tel VALUES(3, 2, '090-000-3333');
INSERT INTO tel VALUES(4, 3, '090-000-4444');
```

```sql:sql
WITH concat_tel_table AS ( -- 1で作成したSQL
  SELECT
    p.id,
    ARRAY_AGG(t.tel) AS concat_tel
  FROM people p
  LEFT JOIN tel t
    on p.id = t.people_id
  GROUP BY p.id
)

SELECT
  ctt.id,
  ctt.concat_tel[1] AS tel1,
  ctt.concat_tel[2] AS tel2
FROM concat_tel_table ctt
```

</details>
Clara Parabricks4.0を利用する　その2

# Clara Parabricks V4.0を利用する
## Clara Parabricksのhaplotypecallerツール
`haplotypecaller`はリファレンス配列にマップされたリードからVariantをするツール

解析のためのデータとして次のファイルを準備する

- リファレンス配列とそのindex
- 解析対象となるbamファイル
- BQSR のデータファイル
- 解析対象の領域を指定するファイル(インターバル形式またはbed形式)

[Clara Parabricks4.0を利用するその1](https://qiita.com/percipere/items/48214caf3f6d6143ae5d)に引き続いて処理を行う事を想定し

前回の結果に基づいて解析対象のサンプル名は`sample`としている

```bash
$ export SAMPLE="sample"
```
として


下記のスクリプトを実行

```
docker run \
    --gpus all \
    -u `id -u`:`id -g` \
    --rm \
    --volume ${PWD}/reference:/reference \
    --volume ${PWD}/variant:/variant \
    --volume ${PWD}/parabricks_sample/Data:/fastq \
    --volume ${PWD}/Parabricks4.0:/outputdir \
    --workdir /tmp \
    nvcr.io/nvidia/clara/clara-parabricks:4.0.0-1 \
    pbrun haplotypecaller \
    --ref /reference/GCA_000001405.15_GRCh38_no_alt_analysis_set.fna \
    --in-bam /outputdir/${SAMPLE}.bam  \
    --interval-file /reference/region.bed \
    --in-recal-file /outputdir/${SAMPLE}.BQSR-report.txt \
    --out-variants /outputdir/${SAMPLE}.vcf
```

`sample.vcf`が作成される

　gvcfファイルを作成する必要がある場合には`--out-variants`の拡張子部分を`.gvcf`とすること

今回はここまで:smile:
VSCode で MySQL の操作ができるようにする

今どきっぽく MySQL も VSCode で使えるようにしてみる。

まず「MySQL」拡張をインストール。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139524/e94d6f09-3150-1172-19ac-62dc36783fb9.png)

インストールしたら、EXLORER に MYSQL が出現するので「+」を押して接続設定。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139524/77e963dd-7224-a75d-699b-02e6399103ea.png)

- ホストのアドレス
- ユーザ名
- パスワード
- 証明書ファイル

を入力していきます。
「certificate file path」で証明書ファイルを指定しますが、今回の接続はパスワード直接指定のみだったので空白で進めました。

接続できない場合
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139524/aac48fcd-33fb-70b9-47c6-fe8e1ab74cd0.png)

パスワードやユーザ名などに問題が無いのにうまくいかない場合は、以下の項目を確認してみよう。

- 「MariaDB インストール ( Ubuntu 18.04 / 20.04 / 22.04 LTS , Raspberry Pi OS)」
  - https://qiita.com/nanbuwks/items/c98c51744bd0f72a7087
  - 「外部からの接続を許す設定」
  および、
  -   - > ネットワークのいずれからもアクセス可能とする場合は(root権限で)もうひとつ webdb ユーザを作る

接続できたら中身が見えるようになるので操作するデータベースを選んで「New Query」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139524/4c818752-43e6-17e7-96e9-bcfae956e1e2.png)

操作ペインにSQLを書いて右クリックの「Run MySQL Query」で結果が得られます。
 

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139524/62bc2f41-ccc1-44bc-8a6d-26e70eeb03af.png)

最初に「New Query」を行っておけば、別の操作ペインからでも SQL 操作ができるようになります。

# 複数のクエリを実行してみる

クエリを複数書いた場合、結果セットは1つしか表示されませんが内部ではすべて実行されているみたいです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/139524/38112e33-4604-e0de-3a80-02a2e82dc8a7.png)


# 感想

SQL 文の編集が phpMyAdmin よりも簡単になるので好みですが、ルーチンの編集などはできないみたいで残念!
React-Hook-Formを使っていたらテキストフォームが入力できなくなった

# やりたいこと
下画面のようにラジオボタンの選択によってテキストフォームを出し分けたい
![input-demo.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2845689/f61e7747-fb28-1ed8-1240-a7074e56c5b6.png)

# 前提知識
- Reactの基本知識
- typescriptの基本知識
- chakra-uiの基本知識
- react-hook-formの基本知識

# 発生した問題
```react:Form.tsx
export function Form() {
  const { register, watch } = useForm();
  const [value, setValue] = useState("male");
  const watchText = watch("age", "");
  const elem = (
    <Box>
      <FormLabel>年齢</FormLabel>
      <Input
        {...register("age", {
          required: {
            value: true,
            message: "入力必須",
          },
        })}
      ></Input>
    </Box>
  );

  return (
    <Box margin="20px">
      <FormControl>
        <RadioGroup value={value} onChange={setValue}>
          <Box>
            <HStack>
              <Radio value="male">男性</Radio>
              <Fade in={value === "male"}>{elem}</Fade>
            </HStack>
          </Box>
          <Box>
            <HStack>
              <Radio value="female">女性</Radio>
              <Fade in={value === "female"}>{elem}</Fade>
            </HStack>
          </Box>
          <Box>
            <HStack>
              <Radio value="other">その他</Radio>
              <Fade in={value === "other"}>{elem}</Fade>
            </HStack>
          </Box>
        </RadioGroup>
        <Button colorScheme={"teal"}>送信</Button>
      </FormControl>
    </Box>
  );
}
```
elemでテキストフォームを定義し、ラジオボタンの選択によってelemを出現させようとしています。

しかしこれでは「男性」もしくは「女性」が選択されている場合 **テキストフォームが入力不可になってしまいます。** 
そしてなぜか「その他」を選択された状態だと入力できます。この原因が分からずかなり苦戦してしまいました。

# 原因
コンポーネント内で使われていませんが
```typescript
const watchText = watch("age", "");
```
**このwatchTextのせいで入力不可となっていました。**

watch()はreact-hook-formのメソッドで、registerによって登録したフィールド名(ここでは"age")を参照し
その入力内容を保持します。

しかし今回同じフィールド名で登録されているInput要素が３か所出現してしまっています。
これではwatchTextがどのInput要素を参照すればよいか分かりません。

これを制御するために「その他」のテキストフォームのみ入力可になっていたんだと思われます。
# 解決法
**registerのフィールド名とInput要素は１対１にしなければなりません。**
(Fadeタグのおかげで１対１になっていると思っていました:sweat_smile:)

```react
<RadioGroup value={value} onChange={setValue}>
  <Box>
    <HStack>
      <Radio value="male">男性</Radio>
      <Fade in={value === "male"}>{value === "male" && elem}</Fade>
    </HStack>
  </Box>
  <Box>
    <HStack>
      <Radio value="female">女性</Radio>
      <Fade in={value === "female"}>{value === "female" && elem}</Fade>
    </HStack>
  </Box>
  <Box>
    <HStack>
      <Radio value="other">その他</Radio>
      <Fade in={value === "other"}>{value === "other" && elem}</Fade>
    </HStack>
  </Box>
</RadioGroup>
```
このようにすることで例えば「男性」が選択された場合、各Fadeタグ内の要素は順に elem, false, false となるためInput要素を１つにすることができます。

# さいごに
単純な問題を難しく考えてしまっていましたが、同じような問題が発生した方の参考になればうれしいです！
【TypeScript】正規表現 \bと+ってなんだ　メモ

### 問題を解いていたらこんな問題が出てきた

`
文字列の中の数字の合計を計算してね。でも、数字として独立してないものは数として数えないよ。
`

#### 文章中の数字を数えるだけなら…
```typescript
const test = 'Dinner is fried chicken for 200 yen bought at 5pm!'
const arr = test.match(/[0-9]+/g);
console.log(arr);//[ '200', '5' ]
//数字を足す
```
まず、ここで「+」が出てきた
☆「+」ってなんだ？？
`
直前の文字の１文字以上の繰り返しにマッチする
/fe+ / だと "fe","fee"にマッチ。"eee"にはマッチしない。
`
参考:https://qiita.com/iLLviA/items/b6bf680cd2408edd050f

上のソースコードから「+」を抜いてみると
```typescript
const test = 'Dinner is fried chicken for 200 yen bought at 5pm!'
const arr = test.match(/[0-9]/g);
console.log(arr);//[ '2', '0', '0', '5' ]
```
数字が一文字ずつ出力された

この例だと数字にマッチして数字が続いている限りは、抽出されるよということ（あってる？）

#### 数字として独立していないものは抽出しないはどうすればいい？？
今のままだと[200]と[5]が両方抽出されている
（テキストが5pmとなっていて[5]は独立していない）

調べているとこのような書き方を見つけた
```typescript
const test = 'Dinner is fried chicken for 200 yen bought at 5pm!'
const arr = test.match(/\b\d+\b/g);
console.log(arr);//[200]
```
* 「\d+」の部分だけ見てみる
「+」は上記で記載した通り
「\d」は数値にする=[0-9]と同じ
※「\D」にすると数字以外に一致になるらしい
のようだ

* 「\b」の部分だけ見てみる
**「\b」は単語の先頭と末尾に一致する**
参考:https://www.javadrive.jp/regex-basic/meta/index4.html

例えば

* 単語の先頭が一致するか？？
```typescript
const test2 = 'abc def'
const arr2 = test2.match(/\ba/g);//aが先頭である場合のみ
console.log(arr2);[a]
```

* 単語の末尾に一致するか？？
```typescript
const test3 = 'abc def'
const arr3 = test3.match(/f\b/g);//末尾がfである場合のみ
console.log(arr3);//[f]
```

**再度、独立している数字のみ抜き出すコードを見てみる**
```typescript
const test = 'Dinner is fried chicken for 200 yen bought at 5pm!'
const arr = test.match(/\b\d+\b/g);
console.log(arr);//[200]
```

改めて見てみると
1. <font color="red">**「\d+」**</font>となっているから、数値と一致するか
1. <font color="red">**「\bxxxx\b」**</font>となっているから、先頭と末尾がxxxxと一致しているかどうか
1. 組み合わせて、<font color="red">**先頭が数字かつ末尾が数字**</font>になっているものだけを抽出
していることが分かる
wordpress関数〜メインループ・サブループ編

wordpressの投稿を表示させるのに必要なループ(繰り返し処理)をまとめました。
そもそもデータベースから投稿データを取得するという概念からまとめてます。

## クエリについて
クエリとは「問い合わせる」「訪ねる」という意味があります。
wordpressの投稿データはデータベース(My SQL)に格納されています。

データベース(My SQL)に対して、wordpressがクエリを発行して**条件に一致する投稿データ**を取得しています。

![qiita.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/717593/dccb275b-56aa-592e-9603-ae4785fe8000.png)

### メインクエリ
メインクエリは**ユーザーが要求したURL**のページの表示に必要な最低限の投稿データのみを取得するクエリで、wordpressによって自動的に生成されて自動的に発行しているので、クエリを発行する必要がありません。

### サブクエリ
メインクエリはURLに基づいて作成されているため、ページ外の投稿データは取得されません。
そのため、**ページ外のカテゴリやカスタム投稿タイプの投稿データ**を取得したい場合は、別途サブクエリを発行して投稿データを取得する必要があります。


## メインループ
メインクエリで取得したデータをテンプレート内で出力するための繰り返し処理の記述です。
` if(have_posts())`  - 記事が存在しているか確認
` while(have_posts())`  - 投稿が存在する限り繰り返し処理を行う
` the_post()`  - グローバル変数$post(投稿オブジェクト)にセットされ、投稿がなくなるまで表示される
※グローバル変数はグローバル変数　コンピュータプログラミングにおいて全てのスコープからアクセスできる変数のことである。(wiki参照)wordpress固有のグローバル変数は[Codex](https://wpdocs.osdn.jp/%E3%82%B0%E3%83%AD%E3%83%BC%E3%83%90%E3%83%AB%E5%A4%89%E6%95%B0)を確認してください。

```
<?php if ( have_posts() ) : ?>
  <?php while( have_posts() ) : the_post(); ?>
      <!-- ループさせる投稿内容　-->
  <?php endwhile;?>
<?php endif; ?>
```

### メインクエリのクエリ条件を変更する
メインループのクエリ条件を変更するにはfunction.phpにアクションフックを記述する必要があります。

(例)
カスタム投稿タイプ(info)の投稿を５件取得する場合

pre_get_posts関数に対してアクションフックを設定しています。
`is_admin() || ! $query->is_main_query()` - 管理者画面ではないかつメインクエリである場合のみ処理を行う
上記の記述がないと他の繰り返し処理にも影響が出てしまうため、忘れないようにしましょう。
```
function my_custom_query( $query ) {
 if ( !is_admin() && $query->is_main_query()) {         
    if ( is_post_type_archive('info') ) {
         $query->set( 'posts_per_page' , 5 );   
      }
     }     
    return $query; 
} add_action( 'pre_get_posts', 'my_custom_query' );
```

## サブループ(カスタム投稿)
サブクエリで発行して、取得したデータをテンプレート内で出力するための繰り返し処理の方法は２つあります。
1.WP_Query
2.get_posts
3.query_postsは現在は非推奨となっております

### 1.WP_Query
(例)
カスタム投稿タイプ(info)の投稿を５件取得する場合

```
<?php $my_query = new WP_Query();      
$args = array(         
    'post_type' => 'info', 
    'posts_per_page' => 5,    
);     
$my_query->query( $args ); ?>
<?php if( $my_query->have_posts() ): while( $my_query->have_posts() ) : $my_query->the_post();?>     
    <?php the_title( '<h2><a href="' . esc_url( get_permalink() ) . '">', '</a></h2>' ); ?>
    <p><?php the_time('Y年m月j日');?></p>
    <p><?php the_content(); ?></p>
<?php endwhile; endif; wp_reset_postdata(); ?>
```
### 2.get_posts
(例)
カスタム投稿タイプ(info)の投稿を５件取得する場合
```
<?php $args = array(         
    'post_type' => 'info', 
    'posts_per_page' => 5,        
);     
$posts_array = get_posts( $args ); ?>
<?php foreach ( $posts_array as $post ) : setup_postdata( $post ); ?>     
    <?php the_title( '<h2><a href="' . esc_url( get_permalink() ) . '">', '</a></h2>' ); ?>
    <p><?php the_time('Y年m月j日');?></p>
    <p><?php the_content(); ?></p>
<?php endforeach; wp_reset_postdata(); ?>
```

### 参考サイト
https://ja.wikipedia.org/wiki/%E3%82%B0%E3%83%AD%E3%83%BC%E3%83%90%E3%83%AB%E5%A4%89%E6%95%B0
https://wpdocs.osdn.jp/%E3%82%B0%E3%83%AD%E3%83%BC%E3%83%90%E3%83%AB%E5%A4%89%E6%95%B0
https://daeuwordpress.com/query/
https://eg-tips.com/wordpress-loop/
インスタンスユーザーデータ とは

## 勉強前イメージ

OSの初回起動時に実行されるやつくらいしか知らん

## 調査

### インスタンスユーザーデータ とは

EC2インスタンスが初回に実行するスクリプトのことを指します。
ただし、 `初回起動時` だけ実行されるので毎回起動する事に実行するものではないです。
実行権限はrootになり、記述形式は以下2つから選べます。

- シェルスクリプト形式 : `#!/bin/bash` から始める
- cloud-init形式 : `#cloud-config` から始める

ユースケースとしては、 「yum update」 や webサービスのインストール・起動など記載しておいて
EC2を初回にstartさせるだけで使える状態にすることが出来ます。

EC2のサーバ内からの確認方法は
`curl http://169.254.169.254/latest/user-data` で、結果が以下になります。

```
# curl http://169.254.169.254/latest/user-data 
#!/bin/bash
yum -y update
touch a.txt
```

ユーザデータで書かれたスクリプトの実態は `/var/lib/cloud/instance/scripts配下` にできそれを実行します。
実行権限も付いてるので、そのまま実行することも出来ます。

```
# ll /var/lib/cloud/instance/scripts/part-001 
-rwx------ 1 root root 34 Oct  4 10:45 /var/lib/cloud/instance/scripts/part-001
```

また、実行ログは `/var/log/cloud-init-output.log` に吐き出されます。

実際のマネジメントコンソール上では
EC2の作成画面で「高度な詳細」を開いたところの最後に出てきます。

![1インスタンスを起動 _ EC2 Management Console - Google Chrome.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129517/7433755e-289a-ce5d-9d7f-38f48b96013d.png)

## 勉強後イメージ

入力方式、シェルだけだと思ってたけど違う書き方もあるんや・・・
あとメタデータみたいにhttpでも見れるんだ、知らなかった。。。

## 参考

- [CloudFormationで作ったEC2インスタンスのUserDataの保存場所を探してみた](https://wp-kyoto.net/cfn-ec2-user-data/)
- [【AWS】EC2「ユーザーデータ」、「インスタンスメタデータ」について](http://www.code-magagine.com/?p=12540)
DatabricksでHiveメタストアのテーブル情報を取得する

テーブルの一覧の取得は簡単です。

```sql:SQL
SHOW TABLES;
```

しかし、上の結果から得られるテーブル一覧に含まれるテーブルのカラム情報も含めてデータとして取得したいとなると話は複雑になります。

本書では、Hiveメタストアのテーブルとそれらテーブルのカラム名、データ型を格納するデータフレームを作成する方法を説明します。

なお、[Unity Catalog](https://www.databricks.com/jp/product/unity-catalog)では、同様に機能を利用できるInformation schemaがサポートされています。

[情報スキーマ \- Azure Databricks \| Microsoft Learn](https://learn.microsoft.com/ja-jp/azure/databricks/spark/latest/spark-sql/language-manual/sql-ref-information-schema)

Sparkの`Catalog.listColums`というメソッドを使用してテーブルのカラム名、データ型を取得します。SQLの`DESCRIBE TABLE`を使う方法もありますが、パーティション情報など今回不要なデータが入ってしまうのでここでは使いません。

`Catalog.listColums`のスキーマは以下の様になりますので、スキーマを定義しておきます。

```
root
 |-- name: string (nullable = true)
 |-- description: string (nullable = true)
 |-- dataType: string (nullable = true)
 |-- nullable: boolean (nullable = true)
 |-- isPartition: boolean (nullable = true)
 |-- isBucket: boolean (nullable = true)
```

```py:Python
from pyspark.sql.types import *

schema = StructType([
    StructField("name", StringType(), True),
    StructField("description", StringType(), True),
    StructField("dataType", StringType(), True),
    StructField("nullable", BooleanType(), True),
    StructField("isPartition", BooleanType(), True),
    StructField("isBucket", BooleanType(), True)
])
```

以下の処理を実行することで、テーブル一覧を取得し、一覧に含まれるテーブルごとに`spark.catalog.listColumns`を実行します。そして、結果を一つのデータフレームにunionしていきます。

```py:Python
from pyspark.sql.functions import *

# データベース名
schemaName = "default"
spark.sql(f"USE {schemaName}")

# テーブル一覧を取得
tables_df = spark.sql("SHOW TABLES")
df = tables_df.select("TableName")
list = [x["TableName"] for x in df.collect()]

count = 0

# テーブルに対するループ
for targetTable in list:
  print("targetTable:", targetTable)
  
  # 物理ファイルがない場合などではスキーマ取得に失敗するのでtry-catchしています
  try:
    table_schema_df = spark.createDataFrame(spark.catalog.listColumns(targetTable, schemaName), schema=schema)
      
    # テーブル名を追加
    table_schema_df = table_schema_df.withColumn("tableName", lit(targetTable))
    
    if count == 0:
      return_df = table_schema_df
    else:
      return_df = return_df.union(table_schema_df)
      
    count = count + 1
      
  except:
      pass
      
display(return_df)
```

これで、テーブル名とカラム情報が格納されたデータフレームを手に入れることができます。
![Screen Shot 2022-10-05 at 15.23.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1168882/5d351bbd-bad6-3829-73a2-867a6e3a75e0.png)

# 参考資料
- [How to see all the databases and Tables in Data\.\.\.anycodings](https://www.anycodings.com/1questions/268901/how-to-see-all-the-databases-and-tables-in-databricks)
- [pyspark\.sql\.Catalog\.listColumns — PySpark 3\.3\.0 documentation](https://spark.apache.org/docs/latest/api/python/reference/pyspark.sql/api/pyspark.sql.Catalog.listColumns.html#pyspark.sql.Catalog.listColumns)


### Databricks 無料トライアル

[Databricks 無料トライアル](https://databricks.com/jp/try-databricks)
Jetpack Composeで角を丸くする

## はじめに

Jetpack Composeで丸い角のViewを作成する際にハマりました。何度もハマっている気がするので個人的なメモとして書きます。

### 正解
順番が大切です。clipを先に書くこと。
backgroundを先に書いてしまうと角が丸くなりません。

```kotlin:view.kt
Box(modifier = Modifier
                    .clip(RoundedCornerShape(20))
                    .background(color = Color.Red)
                    ) {
                    Text(
                        modifier=Modifier.padding(10.dp),
                        color = Color.White,
                        text = "テスト"
                    )
                }
```

![スクリーンショット 2022-10-05 15.00.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/629808/4cc28452-e7de-ac2a-5b97-6432694f3d49.png)
【C++】基礎備忘録

# 参考

## 基本
### 雛形
```c++
#include　<iostream> 
using namespace std;
int main(){

return 0;
}
```
`using namespace std;`を書くことで正式名称を省略できる

### 定数の定義/変数の宣言(代表的なもの)
```C++
//定数
const int NUMBER = 35;//文中のNUMBERを35として扱う

//整数型
int w;//整数を格納
bool x;//true(真)またはfalse(偽)のみ格納可
char y;//文字を1つ格納

//浮動小数点数型
double z;
```

### 入出力
```c++
int age;
cout << "年齢を入力してください";
cin >> age;
cout << "あなたの年齢は" << age << "です。" << endl; //endlで改行
```

## よく使う構文
### if
```C++
if(a > 5){
    a - 3;
}else{
    a + 3;
}
```

### for
```C++
for(a=1;a<=12;a++){
    cout << a ;
}
```

### while
```C++
while(a > 0){
    a=a-1;
}
```
Adamで勾配を伝えていないはずなのにパラメータ更新がされる場合

# はじめに
Adamを使ったニューラルネットワークの訓練をしていた際に，ぶつかった問題とその原因についてせつめいする．

# 事例
ざっくり書くと下記のような二又構造のモデルを使っていた．場面によって2つの経路のどちらかのモデルを選択して使うといった感じ．このとき，片方のモデルを使わずに誤差逆伝播をしてパラメータ更新を行ったにも関わらず，使っていない方のパタメータも更新されているという事象に遭遇した．
```python
Class Model(nn.Module):
    def __init__(self):
        self.fc = Linear()
        self.fc1 = Linear()
        self.fc2 = Linear()
    def forward(self, x, right=False):
        h = self.fc(x)
        if right:
            return self.fc1(h)
        else:
            return self.fc2(h)
```

# 原因・解決方法
Adam内に含まれているMomentumが原因だった．Adamの仕様上，直近で行ったパラメータ更新時の勾配が保存されているため，たとえ勾配を逆伝播させておらず勾配が0であっても，残っているMomentumの項のみを使ってパラメータの更新が行われてしまう．そのため，使っていないモデルのパラメータも変化する．SGDなどのMomentum項を持たないoptimizerを使うと，上記の問題が発生しない．どうしてもAdamを使いたい場合はモデルの構造をいじる必要がある．

# 簡単な再現例
```Python
import torch
import torch.nn as nn
import torch.optim as optim


class Model(nn.Module):
	def __init__(self):
		super().__init__()
		self.fc = nn.Linear(1, 1)

	def forward(self, x):
		return self.fc(x)


model = Model()
optimizer = optim.Adam(model.parameters())

x = torch.tensor([2.])
y = torch.tensor([0.])

p = model(x)
loss = nn.functional.mse_loss(p, y)
print(model.fc.weight) # tensor([[0.5239]], requires_grad=True)
optimizer.zero_grad()
loss.backward()
optimizer.step()
print(model.fc.weight) # tensor([[0.5229]], requires_grad=True)

optimizer.zero_grad()
optimizer.step()
print(model.fc.weight) # tensor([[0.5222]], requires_grad=True)
```
実際に出力される値は異なるかもしれないが，この例でもbackwardしていないのにも関わらず，パラメータの値が変化する．

# おわりに
細かい仕様を意識して書かないと面倒くさいことになりますね．
テスト用Ubuntu LinuxへのLaravelの導入の方法

laravelに挑戦したいと考える際に最初につまずくのは、必要となる必須環境が整理されていない点があります。
それらを最低限に運用できる環境までを順に追っていきたいと思います。

想定環境は、
- Ubuntu Linux 22.04.1
- Apache2 2.4.52
- MySQL 8.0.30
- PHP 8.1.2
- Laravel 9.34.0

です。

# Ubuntu Linuxのインストール
Ubuntu Linux インストール
で検索をするとたくさん出てくると思いますので、割愛。
念のために、
- 最小パッケージではなく、フルパッケージで
- 自動更新パッケージをダウンロード

を選んでインストールする。
インストール完了、起動後、各パッケージを更に最新にします。
なお、以降、あくまでもテストと言うことで、全て`root`環境下で行います。
```
apt update
apt -y upgrade
```

# 最低限必要なパッケージのインストール
試行した範囲では、下記のパッケージを追加でインストールします。
```
apt install apache2 php php-curl php-xml mysql-server mysql-client
```
LaravelはComposerで管理をするので、
```
apt install composer
```
もします。
cryptoも必要なのですが、aptではなく、snapでインストールします。
```
snap install crypto
```

# Laravelの導入
まず、管理をするプロジェクトの名前を決めます。
一旦、`project`とします。
設置場所は、ここでは、Ubuntuの流儀に則り`/var/www`配下にします。
```
cd /var/www
composer create-project laravel/laravel project --prefer-dist
```
composer実行時に、`root`で実行しないでね、と言ったメッセージが出ますが、そのまま改行で続けます。
更に、`root`でプロジェクトを作ったので、apacheで読み書きできるように、以下を実行します。
```
chgrp -R www-data project
chmod -R g+w project
```

# Apacheの設定
```
cd /etc/apache2/sites-available
vi laravel.conf
```
で`laravel.conf`を下記のように新規で作ります。
```
<VirtualHost *:80>
    ServerName project.local
    DocumentRoot /var/www/project/public
    <Directory /var/www/project>
        AllowOverride All
    </Directory>
    ErrorLog ${APACHE_LOG_DIR}/error.log
    CustomLog ${APACHE_LOG_DIR}/access.log combined
</VirtualHost>
```
既存のapacheの環境を止めて、上の設定を生かします。
```
a2dissite 000-default.conf
a2ensite laravel.conf
service apache2 restart
```
# 動作の確認
Firefoxで`http://localhost/`を開いて、下のようなページが開けば成功です。

![screenshot-laravel.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2885048/01d70f56-10d6-289c-7b58-17f3a2831840.png)
特定の S3 1バケットしかアクセスできない IAM ポリシー


特定の1個の S3 しかアクセスできない、IAM ポリシーです。
主に IAM ユーザーなんかに
よく忘れちゃうので、自身の Qiita に書き残す

以下の【バケット名】部分を希望する S3 バケットに設定しましょう。


```
{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "s3:GetBucketLocation",
                "s3:ListAllMyBuckets"
            ],
            "Resource": "arn:aws:s3:::*"
        },
        {
            "Effect": "Allow",
            "Action": [
                "s3:*"
            ],
            "Resource": [
                "arn:aws:s3:::【バケット名】",
                "arn:aws:s3:::【バケット名】/*"
            ]
        }
    ]
}
```

最初の`"s3:GetBucketLocation",` と `"s3:ListAllMyBuckets"` の権限は、S3 の中身
バケットリスト一覧が見えるようになります。（エラーはでますが）

以上
【学習】RSSの意味とFeedlyの機能について


<body>

#### 本日学習したこと   最終更新日：　2022/10/05
`・RSSについて`
`･RSSリーダー「Feedly」について`

***

###### ○RSSについて
　今回は、RSSの意味とRSSリーダー「Feedly」の簡単な機能について学習したので簡単にまとめてみました。RSSの詳しい解説や「Feedly」のダウンロードや使用方法について知りたいという方は<span><a href="https://tech-camp.in/note/technology/90556/"><font color="blue">こちら</font></a></span>がおすすめですので参考にしてみてください。

【用語まとめ】


`RSS(Really Simple Syndication)`
　ウェブサイトの新着・更新情報を簡潔に配信する仕組み

`RSSフィード`
　RSSのデータ規則に基づいて作成されたデータ

`RSSリーダー`
　RSSフィードを取得し、管理することができるツール。代表例「Feedly」

***
###### ○RSSリーダー「Feedly」について

`Feedly`
　登録したホームページやWebメディアの情報を効率よく収集できるRSSリーダー

　【Feedlyを使用することのメリット】

::: note
・必要なホームページを登録することができる
:::

::: note 
・好きなホームページを、毎回それぞれアクセスしなくても、更新情報を一度にチェックできる
:::



参考サイト:
<a href="https://tech-camp.in/note/technology/90556/">TECH CAMP ブログ</a>
<a href="https://ferret-plus.com/1942">ferret</a>

::: note warn 
<h6>Note</h6>
こちらでは、
<ul>
    <li><font color="red">自らが学習したことの積み重ね</font></li>
    <li><font color="red">備忘録</font></li>
    <li><font color="red">Qiitaの使い方の練習</font></li>
</ul>
<p>を目的として学んだことを投稿しています。</p>

<p>情報の誤りや不適切な表現がないように注意してはいますが、もし誤りがあった場合は教えていただけると幸いです。また、投稿期間により情報が違っている場合もありますのでご注意ください。</p>
:::
</body>
Bicep で ASP.NET 4.8 の WebApp を作成する


## 結論

metadata に `CURRENT_STACK` を指定する。
こんな感じ。

```bicep
param webAppName string
param location string = resourceGroup().location

resource webapp 'Microsoft.Web/sites@2022-03-01' = {
  name: webAppName
  location: location
  properties: {
    siteConfig: {
      netFrameworkVersion: 'v4.0'
      metadata: [
        {
          name: 'CURRENT_STACK'
          value: 'dotnet'
        }
      ]
    }
  }
}
```


## 参考

- [Azure Quickstart Template - webapp-windows-aspnet](https://github.com/Azure/azure-quickstart-templates/tree/master/quickstarts/microsoft.web/webapp-windows-aspnet)
Microsoft Learnのご紹介とコンテンツ多すぎ問題に対する一つの対処法【資格取得編】

株式会社船井総研デジタルのよもぎたと申します、よろしくお願いします。

みなさんはMicrosoft社の認定資格の取得を目指すとき、あるいは取得した時に、どのように学習されたでしょうか？

昔ながらの定番の資格対策本・問題集という方も多いでしょうし、最近はUdemyのような動画教材をご利用される方も増えていると思います。

それらを否定するつもりは微塵もありませんが、本記事では[Microsoft Learn](https://learn.microsoft.com/ja-jp/)をご紹介したいと思います。

## そもそもMicrosoft Learnとは？

その名の通り、Microsoftが提供している公式教材、製品ドキュメンテーションです。
教材としての特徴は、以下のことがあると私は感じています。

**良い点**
* Microsoft社公式という安心感がある。
* 最新の試験範囲をカバーしている。
* 試験範囲が過不足なくカバーされている。
* 他に対策教材がないようなマイナーな試験まで教材が提供されている。
* 誰でも無償で利用できる（アクセスするための機材や通信費は別）
* アカウント登録すれば進捗管理ができる

**いけてない点**
* 日本語がこなれていない。本当にこなれていない。
  英語ができる方は、英語のMicrosoft Learnで学習する方が良いと思います。（私が英語できないので、推測です）
* 練習問題が少ない。本当に少ない。
* 前提知識としていることは一切説明がない。

## どのコンテンツで学習すればよいのか？

良し悪しあるMicrosoft Learnですが、いざ学習しようとしたときに困るのが、膨大なコンテンツからどれをやればよいのか？と迷ってしまうことです。

資格試験合格を目指す、ということに限って言えば、簡単な方法がありますので、それをご紹介したいと思います。

1. [Microsoft Learn](https://learn.microsoft.com/ja-jp/)のサイトにアクセスします。
1. 下記のスクリーンショットの「認定資格」のリンクをクリックします。
   ![20221105_mslearn_01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2822136/bc064ce2-3647-9e52-be25-fa609b16dd45.png)
1. [Microsoft の認定資格](https://learn.microsoft.com/ja-jp/certifications/)ページに遷移します。
   1. 目的の資格のロールが分かっている方は、「ロール別に認定を参照する」の一覧から目的のロールのリンクをクリックしてください。そのロールに含まれる試験・資格の一覧が表示されます。
   1. 目的の資格がどのロールに含まれるか分からない方は、「[すべての認定資格を参照する](https://learn.microsoft.com/ja-jp/certifications/browse/)」をクリックします。試験と資格の一覧が表示されます。左のメニューで、製品別、ロール別、レベル別、認定の種類などのチェックボックスにチェックを入れていくことで、試験が絞り込まれて行きます。目的の資格・試験を見つけてください。
   * 例えば、次の図では「管理者」ロールの資格を取得する場合を赤枠で、「すべての認定資格を参照する」を青枠で囲っています。
   ![20221105_mslearn_02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2822136/5eeb3994-7864-d896-bba7-d3de7c374d1c.png)
   * たとえば、「すべての認定資格を参照する」のページで「製品：Azure」「ロール：ビジネスユーザー」と選択すると、AZ-900とSC-900の資格と試験がそれぞれヒットします。
   ![20221105_mslearn_03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2822136/75e062ea-0be7-8ac5-0806-abb3d4d4fe34.png)
   上記のスクリーンショットで言えば「4件の結果」の上に選んだフィルターが表示されています。そこについているバツ印をクリックすることで、フィルターを解除できます。リンクのたどり方によっては、最初からフィルターが設定されている場合もあるようなので、目指すものが見つからない時はあらかじめ設定されているフィルターを解除してみてください。
1. 目的の資格が見つかったら、そのリンクをクリックします。
1. 遷移した先のページの中ほどに、学習すべきMicrosoft Learnのラーニングパスまたはモジュールへのリンクがあります。こちらを学習しましょう。

---

以上です、この記事でMicrosoft Learn迷子の方を一人でも減らせれば幸いです。

最後までお付き合いいただきありがとうございました。
mysql データ移行 #1067 - Invalid default value for 'created' エラー

mariadbのバージョンのせいか、 datetime を dumpしてもうまく入らない。

sql_mode をセットしろと書いてあるが、
sudo vim /etc/my.cnf.d/server.cnf直書きしても
を意味がない

#1067 - Invalid default value for 'last_tweet'

とエラーを吐いてしまう

ということで、

・テーブルはテーブルで作成
・データは後入れ

作戦を行います。

1 まずは　テーブルをエクスポート
love_letter DB から friendsテーブルだけをエクスポート 
```
mysql -uroot -p love_letter < friends.sql
```

2 friends.sql をダウンロードしたあと、テキストエディタで開く
create文の以下を変更

```
//`last_tweet` datetime NOT NULL DEFAULT current_timestamp(),
`last_tweet` datetime DEFAULT NULL,
```

3 新サーバーにアップロード

```
mysql -uroot -p love_letter < friends.sql
```

とまぁ、地道にやっていきましょう。
コンソールで遊べるオセロを作ってみる【研修レポート】

研修でJavaを勉強しており、学習の成果を1週間という期間を設けた自主制作という形で披露することになったので、その題材としてオセロを作ることにしました。

## 何故オセロ？
本当は自主制作の題材として小さくとも日常に存在する課題をちゃんと解決するモノを作りたかったのですが、スケジュールと現状の技術力を考えると難しいと判断されたため急遽代替案を用意することに。
そこで、スケジュール感を把握しやすい既存のゲームであり、初学者の多くが通る道であるオセロを自分でもやってみることにしました。

既にありふれているモノを自主制作の題材として選ぶことに抵抗はありましたが、研修を受けている身としての自分の現時点での技術力を試すという観点では丁度よい難易度の題材だと考えました。
また、ネット上にコードが溢れているという点もそれを見ずに完成させる事で自身のコードと他人のコードを比較できるという点もメリットの一つだと考えました。

## 早速つくった
https://github.com/reoboz/java_othello

各クラス・メソッドの動きについてはREADMEに記載してあります。
皆さんが自分でオセロを作ってみる際の比較材料の一つにしていただけたら幸いです。

完成後にネットで公開されているコードと比較してみた主な違いは以下になります。

- オセロ盤にコマを置いた際のひっくり返し処理について、8方向の処理を一つずつ書いていくのが冗長な気がしたので一つにまとめた

```
    // 周囲8方向に対してreverseSpecifiedDirectionを呼び出す
	public void reverseSurroundedSquare(int[] position) {
		for (int i = -1; i < 2; i++) {
			for (int j = -1; j < 2; j++) {
				ArrayList<int[]> checkedPositionList = new ArrayList<>();
				checkedPositionList.add(position);
				reverseSpecifiedDirection(checkedPositionList, i,j);
			}
		}
	}
	
    // 指定された1方向に対して裏返せるコマを配列に追加し最後に裏返しのメソッドを呼び出す
	public void reverseSpecifiedDirection(ArrayList<int[]> checkedPositionList, int directionX, int directionY){
		int x = Misc.getLastElement(checkedPositionList)[0] + directionX;
		int y = Misc.getLastElement(checkedPositionList)[1] + directionY;
		if (!(isInRange(x,y))) {
			return;
		}
		if (squareList[y][x] == 0) {
			return;
		}
		if (squareList[y][x] != Game.playerTurn) {
			checkedPositionList.add(new int[] {x,y});
			reverseSpecifiedDirection(checkedPositionList, directionX, directionY);
		} else {
			reversePieces(checkedPositionList);
		}
	}
```
#### やりたかったこと
- クラス・メソッドをなるべく切り分けることで可読性・保守性の高いコードにする
- 説明変数を使うことで可読性の高いコードにする
- テストを書いてみる

#### できたこと
- そこそこ切り分けられた気がする
- 見ただけで中身がわからない変数を潰せた（はず）
- テスト、一応体験ぐらいはできた
- 多少のアルゴリズム（ロジック？）を必要とするオセロを作れた

#### 自信がなかったこと、もっと頑張りたいこと
- Boardクラスが突出してコード量が多くなってしまったが、これ以上切り分ける方法が思いつかなかった
- テストが結局後書きになってしまった
- ちゃんとテストがかけたかというと、ぱっと思いつくT/Fパターンを書いたのとバグを見つけたときにそれを直すためのデバッグに使ったくらいで理想とされる使い方じゃなかった
- 結局保守性を高いまま維持できたかというと、そんなでもない気がする

#### やらなかったけどあったら面白そうな機能
- GUIでの実装
- モンテカルロ木探索でのCPU実装
- ヘルプ機能（置けるマスを教えてもらえる、プレイヤーの手番でも上記探索での最善手を教えてもらえる）
- 待った！機能
- 盤面再現機能

#### 学んだこと
- 配列やオブジェクトが参照渡しであるため、メソッドの呼び出し先で書き換えた値が呼び出し元でも反映されるということをちゃんと認識した（気付かずに詰まってた）
- テストのきほんの”ｋ”ぐらいは学べた
- 最初にちゃんと設計しておくことの大切さ

## まとめ
ということで、オセロの制作レポートでした。
まだまだJavaにもオブジェクト指向にも慣れていないし、テストコードなんかは書き方もあまりよく分かっていない段階なので、今後も学習を続けその成長記録を報告していけたらと思います。

同じ学習者の皆さん、引き続き一緒によろしくお願いします。
jest.spyOnでTypeError: Cannot redefine property

テスト書いてますか？ jest.spyOnするとき以下のように書いてないでしょうか？
```js
import * as f from './functions'

jest.spyOn(f, "x").mockImplementation(() => 'x')
test('should be x', () => expect(f.x()).toBe('x'))
```

jsを書いているとクラスベースではなく関数群のmoduleを作ることが多く、またmock()書くのが面倒でついつい手を抜いてこのように書いてしまいますが、esm→cjsのファイルに対するjestのテストかつ組み合わせるトランスパイラによっては表題のエラーになります。

## TL;DR
- babel-jest, tsc-jestを使っているなら大丈夫。babel/tscがesm準拠なcjsを吐くようになったらエラーになるはず。
- swc-jest, esbuild-jestを使う際はエラーになる。
- swc-jestの場合は jest_workaround のaddonを使う（exportするものをconfigurableにするやつ）。
- 別のテストフレームワークを使う（vitestは問題ない）。
- 素直にmock()を使う。
    
## 背景

nextjsのプロダクトを脱babelしてswcに移行する際、jestのテストもswc-jestに変更した際


> TypeError: Cannot redefine property

のエラーに遭遇し、いろいろ調べてみました。


## 何が原因か

jestの実装と各トランスパイラの結果を見ればわかります。

esmで書いたものを

```js
export const a = () => {}
```
をcjsに変換すると

babel, tsc（どっちも大体同じ）

```js
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.a = void 0;
const a = () => { };
exports.a = a;
```

swc, esbuild（どっちも大体同じ）

```js
"use strict";
Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "a", {
    enumerable: true,
    get: function() {
        return a;
    }
});
var a = function() {};
```

jestの実装

https://github.com/facebook/jest/blob/fd9cd900ad0904421a3d97661fdc3337194da1f9/packages/jest-mock/src/index.ts

```typescript
let descriptor = Object.getOwnPropertyDescriptor(object, methodKey);
...
if (descriptor && descriptor.get) {
  const originalGet = descriptor.get;
  mock = this._makeComponent({type: 'function'}, () => {
      descriptor!.get = originalGet;
      Object.defineProperty(object, methodKey, descriptor!);
      });
  descriptor.get = () => mock;
  Object.defineProperty(object, methodKey, descriptor);
} else {
  mock = this._makeComponent({type: 'function'}, () => {
      if (isMethodOwner) {
      object[methodKey] = original;
      } else {
      delete object[methodKey];
      }
      });
  // @ts-expect-error overriding original method with a Mock
  object[methodKey] = mock;
}
```

descriptor.getがあるものつまりswc/esbuildでcjsにしたものになります。トランスパイラの結果はesmに準拠した形でconfigurableはデフォルト値のfalseなので、7行目にCannot redefined property errorになるわけです。

一方babel/tscはObject.definePropertyで定義するわけではなくそのままexportしているので、jestの実装の中でもelse側の処理で特にObject.definePropertyしていないのでエラーにはなりません。


## じゃあどうするか

トランスパイラを変えるとエラーになるものだから、swc/esbuildには結構この手のissueがたくさんありました。ただ双方の言い分としては本来esmはimmutableなのでbabel/tscがおかしい、知らんという話でした。以下コメントの中でswcのコミッターの人がesmをmutableにするaddonを作ってくれていますが非推奨としています。

https://github.com/swc-project/swc/discussions/5151


素直にmockを使って書くのが良さそうです。あるいは別のテストフレームワーク、チームでは一部vitestを使っていてトランスパイラはesbuildですが、こちらはspyOnの実装が異なるのでこのエラーにはならないようです。

vitestでもspyOnの実装がjestと異なるので、jestでは動いていたのにvitestでは動かないという現象がありますが、これは別の記事にしようと思います。
AI Programmerに経路検索させてみる

# AI Programmerを試してみる

2022/10/4、こんなニュースを見ました。
https://www.itmedia.co.jp/news/articles/2210/04/news134.html

以前からGithub CopilotなどAIでソースを書くサービスは知ってましたが、へぇ〜な感じ（あんまりGithub使ってないので…）でした。
サイトを見たところパッと試せそうだったので、少し遊んでみます。

# 経路検索するプログラムを作成させてみる

本業の絡みですね。

1. [AI Programmer](https://aiprogrammer.hashlab.jp/)にアクセス
1. 言語は「C++」
1. 処理内容は「出発地点と到着地点を指定したら、与えられたネットワークデータからその2点間のパスをグラフ探索するプログラム」
1. 「コードを生成」をクリック！

出てきたコードがこちらです。

```C++
#include <iostream>
#include <vector>
#include <queue>
using namespace std;

int main() {
    int n;
    cin >> n;
    vector<vector<int>> G(n);
    for (int i = 0; i < n; i++) {
        int u, k;
        cin >> u >> k;
        G[u].push_back(k);
    }
    int s, t;
    cin >> s >> t;
    queue<int> que;
    vector<bool> used(n);
    vector<int> prev(n);
    que.push(s);
    used[s] = true;
    while (!que.empty()) {
        int u = que.front();
        que.pop();
        for (int i = 0; i < G[u].size(); i++) {
            int v = G[u][i];
            if (!used[v]) {
                used[v] = true;
                prev[v] = u;
                que.push(v);
            }
        }
    }
    if (used[t]) {
        vector<int> path;
        int cur = t;
        while (cur != s) {
            path.push_back(cur);
            cur = prev[cur];
        }
        path.push_back(s);
        reverse(path.begin(), path.end());
        for (int i = 0; i < path.size(); i++) {
            cout << path[i] << " ";
        }
        cout << endl;
    } else {
        cout << "No path" << endl;
    }
    return 0;
}
```

ざっと読んだ限りでは与えられたグラフから経路を探索できそうです。

# 実際に動かしてみる！

下記のネットワークを与えます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/343307/ae44190b-6ee2-7325-4925-f4ce65ef3217.png)

Linuxでビルドします。
Reverse()はエラーになったので削除。取得したパスを始点からに並び替えるだけでグラフ探索本体には影響しません。

```Shell
g++ graph.cpp -std=C++0x -o graph
./graph
14 //辺の数を入力
1 //辺1from
2 //辺2to
1
3
2
3
2
4
3
5
4
5
4
7
5
6
5
7
6
7
7
8
7
9
8
10
9 //辺14from
10 //辺14to
1 //始点
8 //終点
8 7 4 2 1 //結果
```

cinへの入力のガイドがなくわかりづらいので注釈を入れました。
Reverse()を削除しているので終点からの経路表示になっていますが、ちゃんとネットワークを辿った結果が出ています。

多分私がこのレベルのグラフ探索のプログラム（既存の探索ライブラリなし、アルゴリズムからソースに起こす）をゼロから書いたら、30分以上はかかります。
それがものの1分も経たずに出てきました。

思っていた以上にすごかったです。
級数「2014年　大阪大学・理系(前期)　第３問」をwolframAlphaとsympyでやってみたい。

Sum[1/√n, {n,1,40000}]の整数部分

オリジナル ますいしい様

https://ameblo.jp/mathisii/entry-12767599256.html

上と同じです。大学入試数学問題集成＞【3】

https://mathexamtest.web.fc2.com/2014/201410561/2014105610100mj.html#top-0106


# wolframAlphaで

https://www.wolframalpha.com/input?i=floor%28Sum%5B1%2F%E2%88%9An%2C+%7Bn%2C1%2C40000%7D%5D%29&lang=ja

結果 398
# sympyで

```python
from sympy import *
var('n')
print("#",int(summation(1/sqrt(n), (n,1,40000))))
# 398
```

# sympyで(ますいしい様の手順で)
勉強中
Flutter Mac iOSデバッグ時にシュミレーターでキーボードを表示＆入力指定

普段実機でデバッグ作業をしていると、エディタの`iOSシュミレーター`で検証をお願いされた時、テキストフォーム入力時にあれ？　シュミレーター上でキーボードが出ない。。。なんてことがあります。

しばらく使っていなかったせいか、`iOSシュミレーター`のデフォルトでは`Mac本体`のキーボードが指定されているので
# command + shift + K

を同時押しすることで切り替えて出現させることを忘れていました。

![スクリーンショット 2022-10-05 12.08.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/da86b0bc-4b20-4904-1a76-57974137d58b.png)
![スクリーンショット 2022-10-05 12.25.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/c430471c-e269-0e5e-6b40-713c472c195d.png)
こんな感じでかな入力で表示されます。

表示されたキーボードは`TextInputType`を利用しアルファベットや数値入力が指定できます。
```dart
new TextField(
    keyboardType: TextInputType.name,
    )
```
![スクリーンショット 2022-10-05 12.31.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/5f17dadf-2952-d7f0-1641-58030bf5d26a.png)
```dart
new TextField(
    keyboardType: TextInputType.datetime,
    )
```
![スクリーンショット 2022-10-05 12.42.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/c74bd13d-d964-8add-6a39-bd52a968c061.png)
```dart
new TextField(
    keyboardType: TextInputType.emailAddress,
    )
```
![スクリーンショット 2022-10-05 12.48.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/dd2a89a6-4c45-1f6a-71a3-812605ce7ecf.png)
```dart
new TextField(
    keyboardType: TextInputType.text,
    )
```
![スクリーンショット 2022-10-05 12.50.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/2daddffe-1955-89b1-115c-a93e895d7068.png)
```dart
new TextField(
    keyboardType: TextInputType.phone,
    )
```
![スクリーンショット 2022-10-05 12.53.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/a520ad81-6b0c-2aa3-c847-931bbc0e3761.png)
逆に`none`にする事で表示させなくすることもできます。
```dart
new TextField(
    keyboardType: TextInputType.none,
    )
```
![スクリーンショット 2022-10-05 12.56.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1134006/588088b2-2f44-792e-4cbc-ca7877f76fcc.png)