OmniAICreator/Qiita-1.07M huggingface dataset:
Lambda関数でMySQLに接続する（セルフホスト）


他社が公開しているパプリックなARNではなく、自前でレイヤーを用意するやり方。
https://qiita.com/drafts/2c74e5712d841a66a7ee

## ファイル準備
任意のディレクトリに、以下２ファイルを配置

```yml:Dockerfile
FROM --platform=linux/x86_64 amazonlinux:2

ARG PYTHON_VERSION=3.11.1

RUN yum update -y && yum install -y tar gzip make gcc epel-release openssl11 openssl11-devel bzip2-devel libffi-devel \
  && curl https://www.python.org/ftp/python/${PYTHON_VERSION}/Python-${PYTHON_VERSION}.tgz | tar xz \
  && export CFLAGS=$(pkg-config --cflags openssl11) && export LDFLAGS=$(pkg-config --libs openssl11) \
  && cd Python-${PYTHON_VERSION} && ./configure && make && make install \
  && cd - && rm -rf Python-${PYTHON_VERSION}

ADD entrypoint.sh /

RUN yum install -y zip \
  && mkdir /python \
  && chmod +x /entrypoint.sh

ENTRYPOINT ["/entrypoint.sh"]
```

```shell:entrypoint.sh
#!/bin/bash -eu

SRC=/python
DIST=/dist/layer.zip

pip3 install -t ${SRC} $@
rm -f ${DIST}
zip -q -r ${DIST} ${SRC}
```

## イメージのビルド

`docker build --no-cache . -t lambda-layer`

## zip作成

`docker run --rm -v ${pwd}:/dist lambda-layer:latest XXXX`
Google Colab上でchat AIを使う

# 記事のゴール
- chat GPTを利用数制限や、個人情報など入れる情報への懸念を減らして利用したい。
    - あとは、AIをカスタマイズしたり、コマンドラインから出力を得たりもしてみたい...!
- そこで、Google Colab上でchat GPTのような生成AIを実装してみる
- chatGPTのようなインターフェースで受け答えができること

## 前提条件

- Google Colabの有料プランを契約しておくこと
    - 筆者はColab Proを契約している
    - 10/27時点で Colab Proの料金は￥1179。chatGPTよりは安い。
    - 利用したGPUは「L4 GPU」。
        - 今回は使用するモデルは「Llama-3-ELYZA-JP-8B」を選択している。使用するモデルが動かせるGPUメモリを積んでいること

## 手順

- Google Colab上に「Text generation web UI」を導入する
```bash
!git clone https://github.com/oobabooga/text-generation-webui.git
!bash /content/text-generation-webui/start_linux.sh
```

- ただ、Google Colab上で動くweb UIにブラウザからアクセスできないので、`ngrok`を経由する

```py
from pyngrok import ngrok
port = 7860  # web UIのポート番号を指定する
access_token = "ngrokのトークン"
ngrok.set_auth_token(access_token)
ngrok_tunnel=ngrok.connect(port)

public_url = ngrok_tunnel.public_url
print("PUBLIC_URL:", public_url)
```

- web UIで利用するモデルを選ぶ
    - ①`Download`欄に モデルID を入力する
        - 今回は「Llama-3-ELYZA-JP-8B」を利用する
            - 「Llama-3-ELYZA-JP-8B」は`GPT-3.5 Turbo`に匹敵するとのこと
            - openAIの利用が $20/Month かかるところを、google colabの料金で使えるのはうれしい...!
    - ②モデルID に「elyza/Llama-3-ELYZA-JP-8B-GGUF」を入れて「Get file list」を押す
    - ③取得したモデル名を入力
    - ④「Download」を押す 
    - ⑤モデルをロードする
    - ⑥モデルを選択する
    - ⑦ロードする
    - ⑧モデル設定を保存する
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2851499/d2650202-4be6-0661-b61f-002d355a845f.png" width="500" />

- 上記①～⑧のステップを経由せず、Web UIを立ち上げた時点からモデルを使いたい場合は、[Text Generation Web UIのGoogle Colab向けのスクリプト](https://github.com/oobabooga/text-generation-webui/tree/main?tab=readme-ov-file#google-colab-notebook)を参照
- 「Chat」タブで質問すると、ちゃんと回答してくれる
    - 30秒～1分くらいで回答してくれる。ChatGPTのスピードに慣れていると、少し遅く感じるけどこれで半額と思えば満足。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2851499/963b6469-5184-f1dc-637b-6c165fe58a2c.png" width="500" />

## まとめ

- chatGPTより安い料金でチャットボット形式のインターフェースを持つ 生成AIを実装できた。
- UI上から使用するモデルを選べる「Text generation web UI」が非常に便利に感じた
- 今後、作ったAIをカスタマイズしたり、web API化してコマンドから実行してみたり遊んでみたい。

## 参考情報

- https://zenn.dev/headwaters/articles/78705a730b297d
    - Text generation web UIを使う上で参考にさせていただきました

## その他

- LLMを呼び出せる`Ollama`と、それをチャットボットベースのUI化できる[Open Web UI](https://docs.openwebui.com/getting-started/updating/)も検討しましたが、Google Colab上でDockerを使う必要があり、苦戦したので記事の方法にたどり着きました
    - https://zenn.dev/techcat56/articles/5863fa5ec41fe3#docker%E3%82%92%E8%B5%B7%E5%8B%95%E3%81%99%E3%82%8B
    - Google ColabでDockerを使うには[udocker](https://indigo-dc.github.io/udocker/user_manual.html)を使うことになりそうだったが、`Ollam`と`open web UI`の2つのコンテナを動かす必要があり、それを実装できなかった...
TYPING LAND行ったら人生変わったwww

## 本記事に記載されていること
・ブラインドタッチ習得していないと困ること
・タイピング練習サイト 「TYPING LAND」を通じてブラインドタッチを練習した体験記

![FireShot Capture 034 - Typing Land Official Site - typingland.higopage.com.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3835526/6c8a57cb-3e63-d6cd-4b7e-b968a501862c.png)
(https://typingland.higopage.com/ より)

## TYPING LAND　とは

TYPING LANDとは、オンラインで出来るタイピング練習サイトのことである。
https://typingland.higopage.com/
これに取り組んだ。

エンジニアになって2年が経っていた。
私はタイピングが出来ていなかった。
そう、**なんちゃってブラインドタッチ**である。
ホームポジションを意識せず、独自のタイピングで手元をチラチラ見ていた。


当時、なんとなく早く正確にタイピングできているつもりになっていた。
しかし、上司と比べて明らかにタイピングがおかしいのだ。
遅く、リズムが悪い。
（在宅で仕事せず、出社していたからのちに気付けた）

2年エンジニアとして働いていた私だったが、
自身の成長を感じられずに不安だった。

ある日、エンジニアとしての成長ロードマップを調べていると、
良い記事を見つけたので参考とすることにした。
そのロードマップの一番最初に
1ヶ月半、 **「ブラインドタッチを練習すること」** と書かれていた。

こうして、いまさら？とは心で思いつつも取り組んでみることにした。

結果、
タイピングゲームを試したが「全く」できなかった。

## ブラインドタッチが出来ないと困ること
私が「ブラインドタッチが出来ないから困った」と感じることは大きく3つだ。



**1.PC操作中に意識をとられる**
 当然ながら業務中は頭を使いながらPCを操作している。
 このとき、（えーっと、句点は読点の右隣だから...）などと考えていたら思考の邪魔である。
 タイピングに思考の領域を割いている場合ではない。生産性も上がらないだろう。
 ブラインドタッチができないまま、生産性を上げるには〜と考えていたのは謎だった。

 
**2.エンジニアとして自信がつかない**
 ブラインドタッチをいつまでも出来ないと、エンジニアとしての自信は付かない。
 仕事道具に慣れていないのだから当たり前だ。
 
 未経験だから〜を言い訳にいつまでもブラインドタッチから逃げていたらいけない。
 未経験こそ、ブラインドタッチから始めるべきだと感じる。
 （私はもっと早く取り組むべきだった）
 
 タイピングに不安がある状態で業務をするのは、ストレスが溜まった。


**3.信用を疑われる**
 自分でエンジニアとしての自信が付かないのに加えて、
 他者からもエンジニアとしての力量を疑われる。
 あなたはハサミ捌きが良い美容師とイマイチな美容師、どちらにカットを頼むだろうか。

 （ブラインドタッチができていなくても仕事で活躍する人がいるかもしれないが、
 少なくとも私はまだ見たことがない。）


## 1ヶ月半取り組んだ

**1.はじめの2週間**
毎日1時間以上取り組んだ。
多い時では3時間以上タイピングを練習していた。



なぜTYPING LNADなのかというと、
ほかのタイピング練習サイトと違い、同じ指を繰り返し練習できるからだ。
スポーツと同じで**反復練習が大切**だと考える。
実は2年前の学生の時にタイピングの練習をしたことがあったが、
速さに重点が置かれていて「どの指でどこをタイプするか」ということを考えられていなかった。
結果、同じキーを違う指でタイプすることがあった。

今回はTYPING LANDを使っていたので、
ホームポジションを意識することができた。

寿司打などはTYPING LANDに飽きたら、腕試しに使うくらいだった。
ブラインドタッチを練習するなら、TYPING LANDをおすすめする。



**2.自信が出てきた2週間**
ブラインドタッチを練習し始めてから3~4週間ごろ、以前とは違う手応えを感じていた。
TYPING LANDはワールド1~5までがすべて
はやさ：星2つ
正しさ：星1つ（100%）
の王冠獲得状態になっていた。

1ヶ月半取り組もうと決めていたが、
この頃には**ブラインドタッチができる**と自信が湧いてきていた。
TYPNG LANDでは取り組むと、（ゲームの中で）星や王冠をもらえるので嬉しい。
褒められる、認められる、というのは何かに取り組み継続する際に重要なのだと感じた。



**3.苦しかった2週間**
ラスト2週間は辛かった。
難しいタイピングに取り組んでいた上に、ノーミスを目指していた。
かなり伸び悩んでいたのを覚えている。
同じ指、同じタイプを1時間以上練習しても、満足いく結果が出ないということが続いた。
さらに仕事で帰りが遅くなることもあり、取り組むのが夜中の25時からということも珍しくなかった。


意欲は落ち、1日30分だけ取り組むことも増えた。
それでも毎日続けた。
支えになったのはタイピングを練習しようと決めたきっかけになった、ロードマップの記事であった。
ブックマークしていた。
取り組むきっかけになったものを身近に置いておく事で、
モチベーションを管理することができた。

最終的にWORLD1~6と「にほんご」ですべての王冠を取ることができた。
（数字のキーあたりはあやしい状態。）

## ふりかえり ~TYPING LANDを取り組んでみて~

率直にやってよかったと感じた。
さらに、ブラインドタッチを練習しなくなった今でも、
タイピングスキルは向上し続けていると感じる。

それは、ホームポジションの基礎を固めることができたからだ。
基礎が固まれば、あとは業務のなかでタイピングスキルは上がる。
IT業界ではブラインドタッチ以外にもやらなければならないことは沢山ある。
早めにクリアしておくほうが良さそうだ。

これは周りの自分と同じ暦のエンジニアを見ていて感じることだが、
「IT向いていないかも」という人ほどブラインドタッチを練習していないように思う。
向いているかどうかはブラインドタッチを練習してから考えるべきだと思う。

少なくともわたしはTYPING LANDに取り組む前と比べて、エンジニア人生変わったwww　と感じる。

## さいごに

わたしはTYPING LANDがタイピングゲームのなかで一番役に立ったと感じる。
取り組んでみて、自分に合わないと感じれば別のものを使ってみるのもいい。

本記事がだれかの役に立てると嬉しい。

＊さいごまで読んでいただきありがとうございました。
＊いいね・コメントしてくれると嬉しいです。
Raspberry PI で小学生の夏の工作（ScratchでLチカ）

２児の父です。
息子達が、「こんなことしたい」と言ったら、教えようと溜めているネタです。
しかしながら、勉強嫌いで、そんな日が来そうに無いのが悲しい…

**Raspberry PI の準備**
Raspberry PI のOSは、Fullで準備します。（色々遊びながら学べますしね）
テレビを使うと、家族から冷たい目で見られるので、パソコンからＶＮＣ接続ですが、最初はテレビを使うか、sshでVNCをONにする必要があります。
（テレビに接続するのも面倒なので、sshでVNCをONにしましょう）
```diff_shell:
sudo apt-get update
sudo apt-get upgrade
sudo raspi-config
```
「3 Interface Options」⇒「I3 VNC」⇒「YES」で、ＶＮＣがONになります。
日本語入力のツールもインストールしておきたいと思います。
```diff_shell:
sudo apt-get install fcitx-mozc
im-config -n fcitx
sudo reboot
```
VNC接続すると、デスクトップが英字でしたので、日本語化したいと思います。
ラズパイのアイコン ⇒「Preferences」⇒「Raspberry Pi Configuration」⇒「Localisation」タブ ⇒「Locale」より、「ja（Japanese）」に更新します。
終了させると、再起動する事になります。
Raspberry PI を再起動すると、メニューなどが日本語になります。
画面右上に![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3878922/1e8e8bdc-d5c5-52d1-3275-ef4937202899.png)なアイコンがあるので、右クリック ⇒「設定」⇒「入力メソッド」タブに「Mozc」が無ければ、ポップアップ画面左下「＋」ボタンから「Mozc」を選択して追加します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3878922/1233a680-c845-ffd3-e77f-101ca8f8c4d2.png)
この設定により、「CTRL」＋「SPACE」キーで、日本語入力がON／OFFになります。


**Raspberry PI の Scratch３ を準備しよう**
「ラスパイアイコン」⇒「プログラミング」より、「Scratch３」を起動します。

:::note warn
問題発生
Scratch３の画面が全画面より大きくて操作できない事が判明…
ＶＮＣで操作していたのですが、画面下段が表示されない問題が発生していました。
:::

:::note info
対応方法
「ラスパイアイコン」⇒「設定」⇒「Screen Configuration」より、
解像度の数字を上げて「Scratch３」の画面が全表示されるように調整しました。
:::

Scratch３の画面＜左下のアイコン：拡張機能を追加＞をクリックします。
「Raspberry PI GPIO」を選択します。
GPIOのブロックが４つ増えます。

**Raspberry PI の GPIO 接続を準備しよう**
以前の記事を参考に、LEDを接続します。
[LチカをWebで制御する](https://qiita.com/MasahiroShouya/items/9c849331046f2665b913)
※ 11番ピン（GPIO17）をプラスに使い、9番ピン（GND）をマイナスに使います。

**Scratchでプログラムの準備**
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3878922/b5704e4d-896a-fdf5-8de0-8e53f2931963.png)
日本語対応したので、「ctrl」＋「space」で日本語入力が可能になっています。
繰り返し処理や、他のピンを利用した複雑な処理に挑戦できれば、小学生としては優秀と思います。
基礎だけ教えて、後は子供たちの自由な発想で様子を見るのが良さそうです。
お疲れさまでした～。
初心者がブログサイトを作成する①(作成方法を決める)

初心者が学習しながら作成しています。
誤っている部分等あれば教えていただけると嬉しいです！

# 今回行うこと
初投稿です！
自分用のブログサイトを勉強しながら作っていこうと思っています。
> ブログ用サイトなのでとりあえず静的サイトとして動作させる予定です。

今回は**作成方法**や**使用するツール**を決めていきます。

# 目的の明確化
### 何を発信したいのか？
- 日記
- 技術ブログ
etc...

### デザイン・機能・コスト
- デザインはこだわりたい
- 後々機能を自由に追加できるようにしたい！
- あまりお金をかけたくない

# プラットフォームの選択
### CMSかSSGか
#### CMS(コンテンツマネジメントシステム)の場合
- 短期間で構築ができる(**WordPress**など)

#### SSG(静的サイトジェネレーター)の場合
- 軽量で高速
- Gitで管理できる
- デザインのカスタムや機能拡張の自由が利きそう？

今回はデザイン(**React**を使用したい)やSEOを考慮して**SSG**にしたいと思います！
> SSGはGatsbyを使用します

# デプロイとホスティング
### 現在の希望
- コストをあまりかけたくない
- 学習も兼ねたものにしたい
- Reactに適したものがいい
- 将来的に動的な機能も付けたりしたい

**→Vercelに決定！**
> CI/CDもGitHubに連携させて行う

# まとめ
- Node.js + Gatbyで開発環境をセットアップ
- Markdownで記事を書いて管理
- Vercelでホスティングして公開

**次回は開発環境の構築とGatsbyについて少し触れればと思います！
ここまで見てくださりありがとうございました！**
Perplexityとは？

## Perplexity AIの特徴

### 概要
Perplexity AIは、AI技術と検索エンジンの機能を融合させた革新的なツールであり、インターネット上の最新情報をリアルタイムで収集し、ユーザーの質問に的確に答えることができます。

### 特徴

#### 特長①：リアルタイムに最新ウェブ情報を収集
- インターネット上の情報を常にクロールし、最新の情報を取り込む。
- 最新トピックに関する質問にも正確に回答可能。
  - 例: 「2024年米国大統領選挙の最新情勢は？」
  - 例: 「イーロン・マスク氏の最新の動向は？」

#### 特長②：GPT-4の超高度な分析力を活用
- OpenAIのGPT-4を使って情報を高度に分析・要約。
- ユーザーとの対話の文脈に合わせた最適な情報を選択。
  - 例: 「最新の研究で明らかになった健康長寿の秘訣は？」
  - 例: 「イノベーションを生み出すためのアイデア発想法を教えて」
  - 例: 「SDGsの達成に向けた企業の取り組み事例を知りたい」

### 基本的な使い方
1. 公式サイト（perplexity.ai）にアクセスしてアカウントを作成。
2. トップページの入力欄に知りたい内容を入力。
3. Perplexity AIが最新情報を分析した回答を提示。
4. さらに掘り下げたい点を質問し、対話を重ねる。

### 料金プラン
Perplexity AIは、無料プランと2種類の有料プランを提供しています。

| プラン名     | 価格        | 主な特徴                                   |
|--------------|-------------|--------------------------------------------|
| 無料プラン   | $0/月      | 1日50回まで無料利用可能、基本的な検索・分析機能 |
| Proプラン    | $25/月     | 無制限の利用が可能、GPT-4の最新モデル使用、カスタムトピック設定とアラート機能 |

### 日本語対応について
- Perplexity AIは日本語にも対応していますが、質問を日本語で入力し、回答を英語で翻訳する必要があります。
- 日本語検索の精度は低い場合があり、英語検索の方が結果が良いことがあります。

## 結論
Perplexity AIは、情報をナビゲートする革新的なインターフェースであり、あなたの知的好奇心に応える最高のパートナーとなることでしょう。
CloudFormationでControlTowerをデプロイする際のKMS設定と暗号化確認手順

# 内容
CloudFormationでControlTowerを有効化する際にはいくつか、先に作って置かなけらばならないリソースがあります。

1. ControlTowerをデプロイするのに必要になる専用のIAMRole
1. ControlTower用のKMS（任意）

この今回、ControlTowerのConfigとCloudTrailのデータを暗号化したかったのですが、KMSを作成についての前提条件を忘れていたため、暗号化ができてませんでした。その備忘録として残したいと思います。
また暗号化されているのかを確認していきます。

:::note info
参照情報
https://docs.aws.amazon.com/ja_jp/controltower/latest/userguide/configure-kms-keys.html
:::



## KMSのコード


```yaml
AWSTemplateFormatVersion: '2010-09-09'
Parameters:
  HomeRegion:
    Type: String
    Description: Contorltower's Home Region
    Default: ap-northeast-1

Resources:
  ControlTowerKMSKey:
    Type: AWS::KMS::Key
    Properties:
      Description: Custom KMS Keys for AWS Control Tower
      Enabled: true
      EnableKeyRotation: false
      KeyPolicy:
        Version: '2012-10-17'
        Id: ControlTowerCustomKMSPolicy
        Statement:
          - Sid: Allow administration of the key
            Effect: Allow
            Principal:
              AWS: !Sub arn:aws:iam::${AWS::AccountId}:root
            Action:
              - 'kms:*'
            Resource: '*'

          - Sid: Allow Config to use KMS for encryption
            Effect: Allow
            Principal:
              Service: config.amazonaws.com
            Action:
              - 'kms:Decrypt'
              - 'kms:GenerateDataKey'
            Resource: '*'

          - Sid: Allow CloudTrail to use KMS for encryption
            Effect: Allow
            Principal:
              Service: cloudtrail.amazonaws.com
            Action:
              - 'kms:GenerateDataKey*'
              - 'kms:Decrypt'
            Resource: '*'
            Condition:
              StringEquals:
                aws:SourceArn: !Sub arn:aws:cloudtrail:${HomeRegion}:${AWS::AccountId}:trail/aws-controltower-BaselineCloudTrail
              StringLike:
                kms:EncryptionContext:aws:cloudtrail:arn: !Sub arn:aws:cloudtrail:*:${AWS::AccountId}:trail/*
Outputs:
  KMSKeyArn:
    Value: !GetAtt ControlTowerKMSKey.Arn
    Export:
      Name: KMSKeyArn
```

## ControlTowerの暗号化を確認してみる
### bucketの暗号化の確認

```bash
aws s3api get-bucket-encryption --bucket <バケット名>
```
**出力結果**
```JSON
{
    "ServerSideEncryptionConfiguration": {
        "Rules": [
            {
                "ApplyServerSideEncryptionByDefault": {
                    "SSEAlgorithm": "AES256"
                },
                "BucketKeyEnabled": false
            }
        ]
    }
}
```

### オブジェクトの暗号化を確認
```bash
aws s3api head-object --bucket <バケット名> --key <オブジェクトのキー>
```
**出力結果**
```JSON
{
    "AcceptRanges": "bytes",
    "Expiration": ,
    "LastModified": "2024-10-24T16:03:10+00:00",
    "ContentLength": ,
    "ETag": ,
    "VersionId": ,
    "ContentEncoding": "gzip",
    "ContentType": "application/json",
    "ServerSideEncryption": "aws:kms",
    "Metadata": {},
    "SSEKMSKeyId": 
}
```
`"ServerSideEncryption": "aws:kms",`の部分が`Kms`となっているのを確認

## まとめ
- CloudFormationでControlTowerを作成するときには前提にKMSのCloudFormationを作成しなければならない。
【あなたのAWS、攻撃されていませんか？】今すぐGuardDutyで脅威をあぶり出せ！

## はじめに
こんにちは、uiroleです！  
AWSのセキュリティ対策は重要ですが、インターネットに接続している限り、リスクは常に潜んでいます。
今回は、 **AWS GuardDuty** を使って、脅威を検出・可視化し、攻撃からAWS環境を守る方法を紹介します。
この記事で、GuardDutyの活用法を身につけて、AWS環境をより安全に保つ知識を学んでいきましょう！


## GuardDutyとは？

**Amazon GuardDuty** は、AWSのマネージド脅威検出サービスで、悪意ある活動や異常な動作を自動で監視・検出します。
GuardDutyは、以下の3つのログソースを分析して脅威を特定します

|分析するログソース | 内容 |
|---------------------------|---------------------|
| VPC Flow Logs| ネットワークの流れを分析し、不審なトラフィックを検出 |
| AWS CloudTrail Management Events | AWS APIのアクティビティを監視 |
|DNS Logs  | 悪意あるドメインへのアクセスなどを検出 |


## GuardDutyの導入方法

### 1. GuardDutyの有効化
GuardDutyを利用するには、**AWSマネジメントコンソール** にアクセスし、GuardDutyのページで「GuardDutyの有効化」をクリックするだけです。
特別な設定は不要で、クリック一つで監視が始まります。

### 2. 管理アカウントでの集中管理
GuardDutyは複数アカウントを使用するAWS環境でも、 **管理アカウント** から一元管理が可能です。
GuardDutyを集中管理することで、全AWSアカウントのセキュリティを効率的に監視できます。

### 3. サンプルフィンドの活用
GuardDutyには **サンプルフィンド** という機能があり、テストアラートを発生させることで、設定や通知の確認が可能です。
GuardDutyの挙動をテストしたい場合は、この機能で操作を確認してみましょう。


## GuardDutyのアラート内容と確認方法

GuardDutyは、異常が検出されると **フィンド** （Findings）というアラートが発生します。
フィンドは重要度に応じて、 **低・中・高** の3段階で表示されます。

- **低** : 調査は必要ないが、状況の把握をしておくべきアラート
- **中** : 早急に調査が必要なアラート
- **高** : 直ちに対応が必要な重大アラート

### アラートの確認方法
GuardDutyのアラートは、AWSマネジメントコンソールで確認可能です。
AWS LambdaやSNSと連携することで、アラートを自動通知し、迅速に対応する仕組みも構築できます。


## GuardDutyの通知設定

GuardDutyのアラートを見逃さないためには、**通知設定**を行うことが重要です。

1. **Amazon SNSで通知を設定**  
   GuardDutyとSNSを連携させ、アラート発生時にメールやSMSで通知を受け取るようにします。
   
2. **CloudWatchとの連携**  
   GuardDutyのアラートをCloudWatchに送信し、メトリクスを作成することで、ダッシュボードでリアルタイムにセキュリティ状況を可視化できます。

3. **AWS Lambdaを使用して自動応答**  
   GuardDutyが重大アラートを検知した際、AWS Lambdaで自動的にスクリプトを実行することで、迅速な対応を行えます。


## GuardDutyアラートへの対応策

GuardDutyのアラート内容に応じた対応方法を紹介します。

| アラートの種類             | 対応策                                                                                          |
|---------------------------|---------------------|
| **不正なIPアドレスからのアクセス** | 該当のIPアドレスをセキュリティグループでブロックし、アクセスを制限する |
| **異常なアクセスパターンの検出** | セキュリティ設定を見直し、必要に応じてIAMポリシーを再確認・修正する |
| **大量のデータ転送アラート**     | リソースの使用状況を確認し、CloudTrailでアクティビティログを調査                                 |
| **新しい地域からのログイン**     | 該当のアクセスキーを無効化し、2段階認証の導入を検討する                                       |

## GuardDutyのベストプラクティス

1. **Security Hubとの統合**  
   Security HubとGuardDutyを統合することで、AWSの各種セキュリティサービスのアラートを一元管理できます。
   これにより、GuardDuty以外のセキュリティリスクも包括的に把握できるようになります。

2. **CloudWatchによる監視強化**  
   GuardDutyのアラートをCloudWatchメトリクスに追加し、異常発生時にすぐ対応できるよう通知設定を行うことが推奨されています。
   CloudWatchダッシュボードでGuardDutyの状況を可視化すれば、全体のセキュリティを一目で確認できます。

## まとめ

AWS環境のセキュリティ対策を強化するためには、GuardDutyの導入が不可欠です。
異常検出機能や自動通知機能を活用し、セキュリティリスクを即座に把握することで、AWS環境を強固に守りましょう。

この記事がGuardDutyの理解に役立ったら、ぜひ「いいね」やフォローをお願いします！ GuardDutyを使ってAWSのセキュリティを高め、安心してクラウド環境を活用してください。
Wixでロゴをカルーセルにして自動で流す方法

## 背景と実施したこと
今回はノーコードツール「Wix」を使ってHP制作テクニックのご紹介です。

企業のロゴ画像などが、HP上で横に自動で流れているデザインを見たことがある人もいるでしょう。
スクラッチで組むと簡単なこの処理ですが、Wixで組むときに「あれ。これどうやるんだ？」となったので備忘録を残しておきます。


<iframe width="560" height="315" src="https://www.youtube.com/embed/DdrL6md4R5M?si=x1_JAi66Cy2Hiuqb" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>

使用している技術の情報は以下の通りです。
+ Wix（≠Wix Studio）
+ パワーポイント


## 概要
+ きれいに流そうと思うとパワポ等で画像を並べて、統一した大きさの1枚絵を作る方がよい。
+ レイアウトは「スライドショー」を選択。選択するデザインによって設定内容が変わる。
+ レイアウトの「詳細設定」から「画像をループ表示」を設定する。その他の細かい設定もここで行う。


## 手順①　ロゴを並べた一枚絵を作る
画像単体をアップしてもよいのですが、だいたい大きさ等の調整が入るので最初に16:9などの大きさに合わせて
スライドに各ロゴ画像を貼り、そのスライド1枚を流すようにした方がうまくいきます。

※スライドのサイズ比は、Wixの設定に合わせて16:9か4:3がよさそうです。
　自分の場合あ16:9を選択する方が多いです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/635205/184ead53-68b1-ac81-9bbf-d5d36466eb0a.png)


## 手順②　Wixプロギャラリーを追加、設定する
対象のページにWixプロギャラリーを追加します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/635205/3ea23f3f-8e06-c6e8-e531-c6e999b7b0a6.png)

レイアウトは「スライドショー」を選択しましょう。
お察しの通り、スライドショーを自動で流すことによってカルーセルの動きを実現しています。
なお、サムネイルも似たような動きがありますが、微妙に設定できる内容が違うので注意が必要です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/635205/b348ad63-2aca-0350-3f25-a07929523257.png)

「レイアウトを編集」から、画像をループ表示、自動でスライドのトグルをONにすると最低限の動きは実現できます。その他画像のサイズなども合わせて整えていきましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/635205/51c2f84a-6ac3-21e2-d2c8-e70956c392a9.png)

デザインの部分で不要な矢印を削除したり、その他の細かい設定を行います。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/635205/ad45ccd9-ec81-28ca-7806-b0daa85b975f.png)

## 手順③プレビュー確認、スマホ版の実装
あとはプレビューで確認して、スマホ版も忘れずに実装しましょう。
動きとしては画像を一巡したあとにわずかにストップが入るかもしれませんが、現状これが限界のようです。

またプレビュー状態では、自動再生にしていても2巡目が始まらないようですが、これは公開設定にすると問題なく動作しますのでご安心ください。（不具合？仕様？）

## まとめ
ということで、意外とできないカルーセル設定でした。
ノーコードツールは生成AIでも知見が得にくいですし、こういった細かいノウハウは従来の技術記事が一番役立つかもしれませんね。
今後も何かTipsがあれば投稿していきます。
Azure Network Security Group（NSG）とは？

AZ-104の学習をしていて、思考を整理するために記事として書き記しています。
ご参考になれば幸いです。
# Azure Network Security Group（NSG）とは？
Azure Network Security Group（以下NSG）は、Azureのリソースに対するネットワークトラフィック（通信の流れ）を制御するための機能です。ファイアウォールのような役割を持ち、リソースへのアクセスを制御しています。
仮想ネットワークの***サブネット***や***Network Interface Card(NIC)*** に適用できます。一つのNSGを複数のサブネットに割り当てたり、複数のNICに割り当てることもできます。ただ、<a href="https://learn.microsoft.com/ja-jp/azure/virtual-network/network-security-group-how-it-works#intra-subnet-traffic">サブネットとNIC</a>の両方同時に割り当てることは競合の恐れがあるため推奨されていません。
# どうしてNSGが必要？
クラウド環境では、多くのリソースがインターネットに接続されています。そのため、***セキュリティを強化***し、不正アクセスからリソースを守ることが重要です。NSGを使用することで、ネットワークレベルでのセキュリティを簡単に設定でき、リスクを最小限に抑えることができます。
# NSGの基本的な仕組み
<a href="https://learn.microsoft.com/ja-jp/azure/virtual-network/network-security-groups-overview#security-rules">NSG</a>は「ルール」の集まりです。各ルールは以下の要素で構成されています。
- 名前：ルールを識別するための名前
- 優先度: ルールの適用順序を決める数値。数値が小さいほど優先されます
- 方向: トラフィックが入ってくる「受信（Inbound）」か、出ていく「送信（Outbound）」かを指定します
- プロトコル: TCPやUDPなどの通信プロトコルを指定します
- ソースと宛先: 通信の発信元と送り先のアドレスや範囲を指定します
- ポート範囲: 対象とするポート番号を指定します
- アクション: 通信を許可（Allow）するか、拒否（Deny）するかを決めます
これらのルールに基づいて、NSGはネットワークトラフィックを制御します。
# NSGの設定方法
本記事では、**外部・サブネット・仮想マシン（VM）**という3要素を使って、NSGの設定方法を分かりやすく解説します。今回は、サブネットにNSGを適用し、NICには適用しない構成を採用します。
![nsg.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3750668/efadc6b6-7c96-bd23-691d-a0f9a2c3560e.png)

### サブネットにNSGを適用する理由
仮想ネットワーク（VNet）内に存在するサブネットは、複数のリソース（VMなど）をグループ化する単位です。サブネットにNSGを適用することで、そのサブネット内のすべてのリソースに***一括して***セキュリティルールを適用できます。この方法は、管理がシンプルであり、トラフィック制御の競合も防ぐことができます。
### 受信トラフィックの流れを確認
受信トラフィックはまず外部からサブネットに到達し、サブネットに適用されたNSGで許可または拒否されます。その後、許可されたトラフィックのみが仮想マシンに送られます。今回のケースでは受信が拒否されているため、vmまで到達しません。
```
外部
  ↓
サブネット（NSGで制御）
  ↓
仮想マシン（VM）
```
### 送信トラフィックの流れを確認
送信トラフィックは、仮想マシンからサブネットに送られ、その後外部に送信されます。サブネットに適用されたNSGによって、送信トラフィックも制御され、許可されたトラフィックのみが外部に送信されます。今回のケースではポート番号80への送信が許可されています。
```
仮想マシン（VM）
  ↓
サブネット（NSGで制御）
  ↓
外部
```
# おわりに
今回の記事ではNSGの基本的な流れを記載いたしました。
学習が進みましたら、より細かい内容も追記していこうと思います。
最後までお読みいただきありがとうございました。
間違いなどがございましたら、ご指摘いただけますと幸いです。
DOMContentLoadedイベントとは

# DOMContentLoadedイベント
* DOMツリーの構築が完了したタイミングで発生するイベント
* 画像やスタイルシートなどの、依存するリソースの読み込み前に発生

# DOMツリー
HTMLドキュメントをツリー構造で表現したもの

# loadイベント
ページ全体がスタイルシートや画像などの全ての依存するリソースを含めて読み込まれた時に発生するイベント
【感想】Tableauを使ってみた【忙しい人向け】

## ■ はじめに
・この記事は忙しい人向けです。
・Tableauを3ヶ月使った感想です。
・その他BIツールとの比較は別の記事で紹介します。
・所要時間の目安（目標）：3分

## ■ 結論
BIツールを使ったことが無い方でも安心して使用できます。

・使いやすい
・アクティブユーザーが多い
・使ってみたい人はまず無料版から

### ◎ 使いやすい
・シンプルなレイアウトになっています。
・取扱説明書を読まなくても直感的に操作できます。
・ただし、専門用語は少し覚える必要アリ（ペイン、ディメンション、メジャーなど）
・簡単なグラフ作成なら初心者でも30分で作れます。
・私の場合、3ヶ月でウォーターフォールや壺型ピラミッドなど作れるようになりました。

### ◎ ユーザーが多い
・実務で困ることがよくありますが、Tableauはインターネットで検索すると助かるケースが多いと感じました。
・ユーザーが多いというのは、他のユーザーも同じ悩みを持っていたりします。
過去に同様の悩みを持っていて、解決された内容を記事にされていることがあるので捗ります。
・他のBIツールにはない魅力の一つです。

### ◎ 使ってみたい人はまずは無料版から
・2週間の無料トライアルがあります。
・その他として、「Tableau Public」は、個人利用であれば無料で使用することができます。※使用条件アリ
・百聞は一見に如かず、ぜひ一度ご自身で体験してみてください。

## ■ 終わり
・かなり端的にまとめた内容です。
・もう少し細かく知りたい方は、別の記事で投稿しているので参考にしてください。

## ■ その他
・Tableauを上達したい方は、「DataSaber」がお勧めです。
・3ヶ月間で課題をクリアすることで、「DataSaber」という資格をもらえます。（公的ではないですが、ある程度のスキルレベルを保証するものと認識していただけます）
・難易度は中級よりやや難しいレベルだと思います。
・私の場合、Tableauを使い始めると同時に「DataSaber」にトライしました。
まだ終わっていないですが、課題をこなす過程で色々なスキルを学べました。
資格の有無に限らず、スキルアップになるのでぜひお勧めします。
（私が「DataSaber」になれたましたら、いつでも「DataSaber」の申し込みウェルカムです！）
Java 文字列⇔数値 変換

Java の 文字列⇔数値 変換に関する、自分用のメモです。

# 数値 ⇒ 文字列
## valueof() メソッド
### 使用例
``` Java
int i = 0;
long l = 0L;
String s1 = String.valueof(i);
String s2 = String.valueof(l);
```

### メソッドの説明
``` Java
String クラス
public static String valueOf(int i)

public static String valueOf(long l)
```
int / long 引数の文字列表現を返す。

## +演算子
### 使用例
``` Java
int i = 0;
String s = "" + i; 
```

## toString() メソッド
### 使用例
``` Java
int i = 0;
String s = new Integer(i).toString();
```
### メソッドの説明
``` Java
String クラス
public String toString()
```
Integerの値を表すStringオブジェクトを返す。値は、符号付きの10進数表現に変換され、文字列として返される。

## toString() staticメソッド
### 使用例
``` Java
int i = 0;
String s = Integer.toString(i);
```

### メソッドの説明
``` Java
String クラス
public static String toString(int i)
```
指定された整数を表すStringオブジェクトを返す。引数は、符号付き10進数表現に変換されてから文字列として返される。

# 文字列 ⇒ 数値
## parseInt() メソッド
### 使用例
``` Java
String s = "123";
int i = Integer.parseInt(s);
long l = Long.parseLong(s);
```

### メソッドの説明
``` Java
Integer クラス
public static int parseInt(String s)
                    throws NumberFormatException

Long クラス
public static long parseLong(String s)
                      throws NumberFormatException
```
文字列の引数を符号付き10進数の整数型として構文解析する。文字列内の文字はすべて、10進数の桁である必要がある。ただし先頭の文字だけは、ASCIIマイナス記号'-' ('\u002D')、ASCIIプラス記号'+' ('\u002B')のどちらであってもかまわない。

## intValue() メソッド
### 使用例
``` Java
String s = "123";
int i = new Integer(s).intValue();
```

### メソッドの説明
``` Java
Integer クラス
public int intValue()
```
Integerの値をintとして返す。

## valueOf() staticメソッド ⇒ intValue() メソッド
### 使用例
``` Java
String s = "123";
int i = Integer.valueOf(s).intValue();
```

### メソッドの説明
``` Java
Integer クラス
public static Integer valueOf(String s)
                       throws NumberFormatException
```
指定されたStringの値を保持するIntegerオブジェクトを返す。引数は、符号付きの10進整数を表しているとして解釈される。生成された結果は、文字列により指定された整数値を表すIntegerオブジェクトになる。
Radxa X4をUnix-benchでRPi5と比較

# 始めに
　近年、シングルボードコンピュータ(以下SBC)でもnvme SSDが使えるようになり、低消費電力のPCとして使えそうな状況になりつつあります。有名なのはRaspberry Piの最新機5で、Windows11も動きPCとしても使えそうな感じなのですが、冷却ファンも必須となり実際に何に使うのかピンと来ません。そこにintel N100を搭載したSBC Radxa X4が出ました。インテルチップなので、Windwows11もubuntuも簡単に動くということで、早速購入。日本での技適がまだ認証されていないので、[「技適未取得機器を用いた実験等の特例制度」](https://www.tele.soumu.go.jp/j/sys/others/exp-sp/)を利用して、半年間使えるようにし、実験をすることにしました。今回はまずは、Unix-benchを流してみて、実際に動かすアプリの性能がどうなのか分析するための一助にしようと考えました。

# システム比較

今回比較するシステムの概略を示します。


|項目|RadxaX4| RPi5 | RPi4 |
|----|-------|------|------|
|CPU|Intel N100|Arm Cortex-A76|Arm Cortex-A72|
|clock|Max 3.4GHz| 2.4GHz|1.5GHz|
|Memory|LPDDR5|LPDDR4|LPDDR4|
|size|8GB|8GB|8GB|
|SSD|PCIe 3.0 4-lane|PCIe 2.0 1-lane|USB 3.0|

※全てのSBCでSSDを接続し、OSを搭載。その上でUnix-benchを測定。RPi4はUSB SSDを用意しUSB3.0でOSをブートさせて使用。
Radxa X4が足回りで圧倒している感があります。

# 測定条件
・OS Ubuntu-24.04 LTS
・ベンチマーク Unix-bench
・BIOSはデフォルトで使用

# 測定結果

シングルプロセッサ結果

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/575990/cd06b3fb-0852-8a76-7ffa-dd9483716cbc.png)

マルチプロセッサ結果

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/575990/fa487fa0-6c25-de57-8233-d91a35b65441.png)

・シングルプロセッサ結果では、コアの演算能力を示すDhrystoneではRadxa X4の圧勝なのにマルチプロセッサではRPi5のほうが勝っている。電力or発熱の関係ですべてのコアをターボで動かせないため、低くなっていると考得られる。浮動小数点演算のWhetstoneにおいてもマルチコアではRadxa X4が伸び悩んでRPi5が勝った。
・足回りがわかるFile Copyは軒並みRadxa X4の圧勝となっている。また、システム系も大きくRadxa X4が勝っている。シングルスレッド性能と、足回りの差が表れていると考えられる。
・これらにより総合スコアにおいても、シングルはダブルスコア、マルチでも４割ほど差をつけられている。

よって、足回り、特にSSDがあまり性能にかかわらない、コアでの計算が多いアプリにおいてはRadxa X4とRPi5の差が小さいと考えられます。例えば、ストレージアクセスの多いリレーショナルデータベースではRadxa X4が有利、同じデータベースの類でもオンメモリでインデックス計算を行うベクトルデータベースでは、RPi5が善戦する可能性があります。

そこで、オープンソースで使えるベクトルデータベース、PostgresqlのPgvector拡張を使って、Radxa X4,RPi5,RPi4での上記の動作条件で性能を比較してみました。（今回は演算が重いivfflatインデックスを使っております）
すると、Unix-benchでは大きく差がついていたRPi5ですが、このアプリではわずかにRadxa X4に及ばないものの近い性能を示しています。（グラフが上にあるほうが高性能と考えてください）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/575990/d8b11a1c-9865-ed08-49ef-e0c0f8fb298f.png)

# 最後に
　Radxa X4が優れていますよー！という記事にするつもりだったのですが、あまりにも当たり前すぎる結果（DDR5とPCI-eの差が大きすぎます）で面白くなかったので、RPi5を応援するような記事になってしまいました。まあ、SBCでベクトルデータベースを動かすニーズは無いと思いますので、あくまでもこんな場合もありますよという話になります。
　ハイパフォーマンス(?)なSBCの分野がどのように使われていくか楽しみです。もう少しセレクションが欲しいところではあります。
【Java】配列中の最大値検索をJavaで実装してみる【アルゴリズム】

## はじめに
基礎的なアルゴリズムをJavaで実装していきます。
今回は **「配列中の最大値検索」** です。

## 配列中の最大値検索
目的：
カンマ区切りの複数の数値を受け取り、その中で最も大きい数値を検索します。

手段：
「配列に格納した値を先頭から1つずつ取り出して比較し、前より値が大きければ戻り値を更新する。
　配列の最後の値を比較し終わった時点で戻り値に入っている値が、その配列の最大値になる。」というアルゴリズムです。

## 設計
カンマ区切りの値を1つ1つ配列に格納するために `split()` を使っています。
また、1行単位で標準入力を読み込んだ場合String型になるので、それをint型に変換する処理を挟んでいます。（数値の大小比較をしたいため）

## ソース
### フォルダ構成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2524566/1dd917c6-8a51-f265-a341-e3677264ab6c.png)

### ソースコード
```java:main.java
package main;

import process.MaxSearch;

public class Main {

	public static void main(String[] args) {
//		配列中の最大値検索クラスをインスタンス化して処理をスタート
		MaxSearch maxSearch = new MaxSearch();
		maxSearch.MaxSearchStarter();
	}
}

```

```java:MaxSearch.java
package process;

import java.util.Scanner;

// 配列中の最大値検索
public class MaxSearch {
	public void MaxSearchStarter() {

		Scanner sc = new Scanner(System.in);

		System.out.println("カンマ区切りの数値を入力してください。");
		String input = sc.nextLine();
		sc.close();

		// 受け取った値をカンマで分割して配列(String型)に格納する
		String[] values = input.split(",");

		// int型に変換して別の配列に格納しなおす
		int[] intValues = new int[values.length];
		for (int i = 0; i < values.length; i++) {
			intValues[i] = Integer.parseInt(values[i].trim());
		}

		// 入力値(int型)を格納した配列をMaxSearchExec(）に渡し、その中の最大値を受け取る
		int result = MaxSearchExec(intValues);

		System.out.println("入力した配列中の最大値は\"" + result + "\"です。");

	}

	protected int MaxSearchExec(int[] values) {
		int Ans = values[0];

		for (int i = 1; i < values.length; i++) {
			if (values[i] > Ans) {
				Ans = values[i];
			}
		}

		return Ans;
	}
}
```

## 実行
![配列の最大値検索.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2524566/65990f39-d401-ad99-1757-000e8f3308db.gif)

## おわりに
アルゴリズム実装3本目でした。
配列の中身をint型に直すところはもっと効率的な書き方ができそうな気がします。
良いアイデアがあったらコメントで教えて下さい。

## 参考図書
基本情報技術者試験のアルゴリズム問題がちゃんと解ける本 第2版 [矢沢 久雄]

## その他の記事リンク
https://qiita.com/lipton2018/items/bd3e3002d70df7d98672

https://qiita.com/lipton2018/items/0e6bf8f6522daa659b4d
【BI】PowerBIとTableauの違い

# ■ 前提
・本記事は、個人的主観に基づくものであること
・PBI歴1年→Tableau歴3ヶ月での所感
・今回は”Tableau”と”PowerBI（以降、PBIと称する）”の2つを比較する
・シグマやLookerといった他のBIツールについては触れない
・コストの比較はしない

上記を踏まえ、違いは何かを述べていく

# ■ ”使い勝手の良さ”はTableau

Tableauの使い勝手が良いと感じた点は、以下の通り。
　1）UIデザイン
　2）サポート
上記理由については、これから述べていく。

---
### 1） UIデザイン
▶︎ **Tableau**
Tableauの基本画面構成は、Tableauを使ったことがない人にも馴染みやすいデザインになっている。それは画面左側にボタン配置、中央画面にレポート作成といったレイアウトだからだ。

至ってよく見かけるレイアウトだが、この**普通感**こそが直感的操作を可能とし、操作性において重要なポイントの1つである。

また、グラフ作成時にデータ集計方法を設定する作業においても
Tableauでは、迷うことなく操作ができる。
例：日付をどの粒度に設定するか、対象となるデータをペインに置いてから考えることができる。

とにかく、Tableauは**使い手に寄り添った造り込み**になっていると言うことをお伝えしたい。

▶︎ **PowerBI**
PowerBIの基本画面構成はどうだろうか。
グラフ作成を例に考えると
レポートビューをメインで作業するとして
グラフの基となるデータは右側に配置されている。
目線が左に行ったり、右に行ったりすることになり,個人的にはこれが結構疲れる。

その点、Tableauは基本的に左側に配置してあるため
ストレスフリーで作業がスムーズに進行して捗る。


### 2） サポート

日頃ツールを使う上で、自分で解決できない問題に直面することはよくある。
どうやったら解決出来るかを思案することは大切だと思うが
納期が短い場合はそんなことも言っていられない。

▶︎ **Tableau**
Tableauの場合、アクティブユーザーが多く、またコミュニティ活動が盛んである。

インターネットでTableauを検索すれば、記事が多くヒットする。
手探りの状態で課題解決するより、類似事例を参考に取り組む方が遥かに効果的だ。
仮に類似事例が検索してもヒットしない場合は、思い切ってコミュニティに質問することもできる。Tableauユーザーは助け合い精神を持つ方が多い。困った時はきっと助けてくれるでしょう。

▶︎ **PowerBI**
PowerBIの場合、インターネットで検索すると多くの記事がヒットするが
MSLearnであることが多い。
元が英語の記事のため、機会的な和訳による解説が多く不親切だと感じる場面もある。

英語が得意な方ならフィットするかもしれないが
そうではない方には少し物足りないと感じることがあると思われる。
## ■ データのクレンジングは、強いていうならPowerBI

BIツールでデータの可視化を行うために
基となるデータのETLはほとんどの場合発生すると思う。
結論を述べると、使用にあたって両者に大きく差異は感じなかった。
少しだけ感じた点を述べていく。

▶︎ **Tableau**
TableauにはTableau Prep Builderというツールがあり
データのETL（結合、変換、格納）といった操作を行える。
ノーコードで扱えるため、初学者にも優しい。

後述するが、PowerBIからBIツールを扱い始めた自分にとって
ETLツールを都度開く手間に少し煩わしさを感じた。

▶︎ **PowerBI**
PowerBIでは、PowerQueryでETLを行う。
EXCELに近いレイアウトなので、操作に迷うことは少ない。
ただ、”M言語”と呼ばれるコードを使う必要があり、人によってはクセがあると感じる人もいるかもしれない。

TableauPrepBuilderと異なるのは、PowerBIでデータを取り込むときに同時にツールが立ち上がる点だ。
データの可視化において、ETLはほぼ発生するので同時に立ち上げるのは助かる。
個人的にその点でTableauより若干PowerBIの方が使っていて便利だと感じた。
## ■ 終わりに
ここまで述べて内容は、一個人の主観的意見であり
今後、考え方が変わることもあると思う。
コストに関しても気になるところだと思うので、別の機会に記事として紹介できるよう勉強する。


## ■ 振り返り（この記事を書いての学び・気づき）
・図や例を交えた方が、読み手に分かりやすい（理解度が異なる）
・記事を書くにあたり、改めて自分の中で向かい合うため
本当に理解できているのか、何となく理解していることを整理する機会になった。
・文章が長くなって、かえって分かりづらい内容になった。
もっと簡素にまとめることが今後Qiitaを続けていく上で磨いていく必要がある。
GithubのmainブランチにVSCodeから直接書き換える！

おはようございます。青丹です。青丹は今回のプロコンでバックエンド担当としてphpずっと書いておりました。
それをGithubのmainブランチに上げるときのコマンドを残しておこうと思います。

基本的に複数人で開発するときにGithubを使用するなら、自分のブランチを作成してそこで作業し、mainに上げるってすると思います。ただ、やり方がいまいち覚えられなかったのと、先輩からmainブランチ直接書き換えていいよと言われたので、今回はmainを直接書き換えるやーつのコマンド云々を。

# VSCodeからGithubへ
VSCodeでファイルを保存したら、、、
1. addする
```ruby:ファイルをすべてpushするとき
git add .
```
```ruby:特定のファイルをpushするとき
git add ファイル名
```

２. コメントを付けてコミットする
```ruby:
git commit -m "メッセージ"
```
`-m` はメッセージを追加できるコマンドです

３. プッシュする
```ruby:
git push
```

# GithubからVSCodeへ
Githubに上がっているものを自分の作業場所に反映する方法です
VSCodeへと書いていますが、基本pullはTermiusで作業しているサーバへ行っているので、そこでの記録です。
```ruby:
git pull
```
もしくは
```ruby:
git pull origin main
```
ここでpullしたらいろいろ出てくることがあります。
```ruby:
hint: You have divergent branches and need to specify how to reconcile them.
hint: You can do so by running one of the following commands sometime before
hint: your next pull:
hint: 
hint:   git config pull.rebase false  # merge (the default strategy)
hint:   git config pull.rebase true   # rebase
hint:   git config pull.ff only       # fast-forward only
hint: 
hint: You can replace "git config" with "git config --global" to set a default
hint: preference for all repositories. You can also pass --rebase, --no-rebase,
hint: or --ff-only on the command line to override the configured default per
hint: invocation.
fatal: Need to specify how to reconcile divergent branches.
```
こんな感じで。この状態だとpullできていません。
原因がよくわかっていないのですが、これはmargeするとpullできます。
```ruby:
git merge
```
mergeするとなにがしかのファイルが毎回開くのですが、これを閉じるのにうんざりする場合は
```ruby:
git merge -m "fix"
```
と書くとファイルが開かなくなると先輩に教えていただきました。
どういう意味かわかっていないので、また調べます。
【個人開発】絵本作成アプリを作った

# 概要

個人開発アプリを紹介します。

# アプリ紹介

絵本を作成する WEB アプリです。アプリ名は「ここえほん」です。

https://kokoehon.oizumi-yuta.com/

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/621414/7b81ddb8-ca75-51f4-0baf-868e8fe02374.png)

## 機能

### 絵本を作成・編集する

ページ追加・削除、画像アップロードができます。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/621414/f1e07f3d-e4b6-f687-82e2-cbddee8c83c4.png)

### 絵本をスライド形式で読む

作成した絵本をスライド形式で表示します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/621414/130be5a0-58d6-a255-565b-35e58a54d4d0.png)

### PDF 出力

作成した絵本を PDF で開いたり保存したりすることができます。

### ユーザー認証

アカウント登録、ログイン、ログアウト機能があります。

## 工夫した点

- 親子向けアプリのため、アイコンを多用した
- ユーザーがアプリ操作に親しみを感じるように、各ページに遷移した際、ふわっと見えるフェードインを組み込んだ

## 技術スタック

### Next.js v14

クライアントコンポーネントで実装しました。

### AWS Lambda

バックエンドは Lambda を使いました。

### Amazon API Gateway

API は API Gateway の REST API を使いました。

### Amazon DynamoDB

データベースは DynamoDB を使いました。

### Amazon Cognito

ユーザー認証は Cognito を使いました。

### AWS Amplify Hosting

フロントコードは Amplify Hosting でホストしています。

## 開発期間

- 9/30 ～ 10/27 （28 日間）
- 平日: 0時間～3時間、休日: 1時間～5時間

## 開発方法

　主に ChatGPT に聞きながら開発を進めました。開発初期はほとんど ChatGPT にコードを書いてもらいました。コード量が増えるにつれ、ChatGPT の回答の精度が下がった気がして自分で書くようになりました。

## 所感

　アプリを作る動機は、妻が以前他のスマホアプリで絵本を作っていたからです。そのため最初はスマホアプリで作ろうと思いましたが、経験がなく Flutter のセットアップで挫折し、WEB アプリで作ろうと決めました。
　でき上がったアプリを見て思ったのは、ユーザーを獲得するにはほど遠い、ということです。実際、先日妻にアプリを作ったことを伝えましたが、いまだにユーザー登録も絵本作成もしていません。伝えてからアプリを使っている姿を見ていません。
Todoアプリのデザインカンプまでを作成してみた振り返り

# 初めに
Webシステムの仕組みを知り要件通りの開発ができるようになるための個人開発をしています
そこでTodoリストアプリを作成しています
設計などは

https://qiita.com/opatu07/items/8caad9d7aae085d94111

この記事で詳細を確認できます
今回デザインカンプまで作成したのでその振り返りを行いたいと思います
GitHubはこちらから

https://github.com/opatu07/todo_manager

# 完成したページ
## ホーム画面
![スクリーンショット 2024-10-27 20.42.10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3682713/a9377f46-3444-a9bd-8cba-588849495aa4.png)

こちらがホーム画面になります
ここでできることとしては
- 「Todoカンリ」を押すとホーム画面に移動する
- 「ログイン」を押すとログイン画面に移動する
- メインコンテンツでアプリの説明を確認できる

になります

## ログイン画面
![スクリーンショット 2024-10-27 20.42.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3682713/fa359ff2-b88c-8233-c70f-4aafb57bbbee.png)


こちらがログイン画面になります
ここでできることとしては
- 「Todoカンリ」を押すとホーム画面に移動する
- メールアドレスを入力できる
- パスワードを入力できる
- 送信できる
- 一覧画面に移動できる

になります

## Todo一覧画面

![スクリーンショット 2024-10-27 20.42.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3682713/5688db21-9fb6-b6f5-fa75-f48276123ae6.png)

こちらがTodo一覧画面になります
ここでできることとしては
- 作成したTodoを確認できる

になります

## Todo新規登録画面

![スクリーンショット 2024-10-27 20.43.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3682713/7179ffa2-47de-cd62-3e3a-017c49cd755a.png)

こちらがTodo新規登録画面になります
ここでできることとしては
- タイトル、内容を入力できる
- 登録ボタンを押してTodo一覧画面へ移動する

になります

# 開発の反省点
## 良かったところ
- 4画面作ることができた
- gitflowを守ることができた
- マージリクエストのテンプレを確立できた
- 時間の管理をできた

## 反省するところ
- 少し想定していた仕様と異なっている
タイトルの「todoカンリ」が「Todoカンリ」にしなければいけなかった
またログイン画面のフッターの位置がずれていた
- 作成時間が超過してしまった
6日で作る想定だったが少しすぎてしまった

## 反省点を改善する方法
- 仕様が異なっている点
自分が作成した仕様書をマージリクエストを送る際に確認する癖をつける
エクセルでテストや確認する点をまとめているのでそこに記入する
- 作成時間について
平日になかなか時間が取れないので土日にまとめて開発する
平日に開発以外のタスクを終わらせておく

# 終わりに
次はJavaScriptのajax処理を適用しようと思っているので
この反省を生かして開発を進めていこうと思っています
JatpackComposeで画像をズームさせるためのライブラリ"Zoomable"



# Zoomable
ImageViewをズームするためのライブラリです

https://github.com/usuiat/Zoomable



# 準備

新規で作成しても大体書いてありますが、settings.gradle内にmavenCentral()があることを確認します。
```
pluginManagement {
    repositories {
        mavenCentral()
    }
}
```
```
dependencies {

    implementation("net.engawapg.lib:zoomable:1.6.2")
    
}
```

# 使い方
基本的には　Modifierに
```
.zoomable(rememberZoomState())
```
を追加するだけで使えます


```
    Image(
        painter = painterResource(id = R.drawable.ic_launcher_background),
        contentDescription = null,
        modifier = Modifier.padding(150.dp,150.dp)
            .zoomable(rememberZoomState()),
    )
```

![Videotogif.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2394054/12a99078-9bdc-e3b4-9b5d-34be25a2d19c.gif)



# できること
* シングルタップ、ダブルタップでのズームの無効
```
　onTap = {},
　onDoubleTap = {},
```

* １本指でのズーム
```
　enableOneFingerZoom = false,
```

* ズーム中に画面端へ到達した際にさらにスクロールできるようにするか否か
```
　scrollGesturePropagation = ScrollGesturePropagation.ContentEdge
　// または
　scrollGesturePropagation = ScrollGesturePropagation.NotZoomed
```
wslでrust その2

# 概要
wslでrustやってみた。
systemにrandが、無いらしい。
randクレートを呼びつけて、使ってみた。
zundokoやってみた。

# 操作手順

```
~$ ls
elixir	fpga	git	osero.livemd	project	rust	test.db
~$ cd rust

~/rust$ cargo new zundoko
		 Created binary (application) `zundoko` package
~/rust$ cd zundoko

~/rust/zundoko$ cargo add rand
		Updating crates.io index
			Adding rand v0.8.5 to dependencies.
						 Features:
						 + alloc
						 + getrandom
						 + libc
						 + rand_chacha
						 + std
						 + std_rng
						 - log
						 - min_const_gen
						 - nightly
						 - packed_simd
						 - serde
						 - serde1
						 - simd_support
						 - small_rng
		Updating crates.io index
~/rust/zundoko$ explorer.exe .
~/rust/zundoko$ explorer.exe .

~/rust/zundoko$ cargo build
	Downloaded rand_core v0.6.4
	Downloaded proc-macro2 v1.0.89
	Downloaded rand_chacha v0.3.1
	Downloaded byteorder v1.5.0
	Downloaded getrandom v0.2.15
	Downloaded zerocopy-derive v0.7.35
	Downloaded ppv-lite86 v0.2.20
	Downloaded quote v1.0.37
	Downloaded unicode-ident v1.0.13
	Downloaded rand v0.8.5
	Downloaded zerocopy v0.7.35
	Downloaded syn v2.0.85
	Downloaded libc v0.2.161
	Downloaded 13 crates (1.6 MB) in 0.91s
	 Compiling proc-macro2 v1.0.89
	 Compiling unicode-ident v1.0.13
	 Compiling libc v0.2.161
	 Compiling byteorder v1.5.0
	 Compiling cfg-if v1.0.0
	 Compiling quote v1.0.37
	 Compiling syn v2.0.85
	 Compiling getrandom v0.2.15
	 Compiling rand_core v0.6.4
	 Compiling zerocopy-derive v0.7.35
	 Compiling zerocopy v0.7.35
	 Compiling ppv-lite86 v0.2.20
	 Compiling rand_chacha v0.3.1
	 Compiling rand v0.8.5
	 Compiling zundoko v0.1.0 (/home/ore/rust/zundoko)
error: couldn't read src/main.rs: stream did not contain valid UTF-8

error: could not compile `zundoko` (bin "zundoko") due to previous error

~/rust/zundoko$ cargo build
	 Compiling zundoko v0.1.0 (/home/ore/rust/zundoko)
		Finished dev [unoptimized + debuginfo] target(s) in 1.04s
  
~/rust/zundoko$ cargo run
		Finished dev [unoptimized + debuginfo] target(s) in 0.10s
		 Running `target/debug/zundoko`
ズン ズン ズン ズン ドコ	キ・ヨ・シ！

~/rust/zundoko$ cargo run
		Finished dev [unoptimized + debuginfo] target(s) in 0.22s
		 Running `target/debug/zundoko`
ズン ズン ズン ドコ ズン ドコ ドコ ドコ ドコ ズン ズン ズン ズン ズン ドコ	キ・ヨ・シ！
~/rust/zundoko$




```

# サンプルコード

```

use rand::Rng;

fn main() {
	let mut zcnt = 0;
	let mut rng = rand::thread_rng();
	loop 
	{
		let zd = rng.gen();
		print!("{} ", if zd {"ズン"} else {"ドコ"});
		if zd 
		{
			zcnt += 1
		} 
		else if zcnt >= 4 
		{
			break
		} 
		else 
		{
			zcnt = 0
		}
	}
	println!(" キ・ヨ・シ！");
}





```

以上
AtCoder ABC377 振り返り(Python A~C)

初の投稿です。記録のために書きます。本番ではのA~Cの3完でした。


## A問題
https://atcoder.jp/contests/abc377/tasks/abc377_a

### 問題概要
長さ3の文字列を入れ替えてABCを作ることができるか？

### 解答
文字列中にA,B,Cが1個ずつあるかを確認して、問題を解いた。
```python
s = input()

if s.count("A") == 1 and s.count("B") == 1 and s.count("C") == 1:
    print("Yes")
else:
    print("No")
```
普通に文字列をソートして、ABCになっているか判定でよかったと思う。


## B問題
https://atcoder.jp/contests/abc377/tasks/abc377_b

### 問題概要
8×8のマスにコマをいくつか置く、コマは飛車のように縦横に動ける。
コマにとられないようなマスはいくつあるか？

### 解答
1. コマの位置を取得し、移動可能マスを塗りつぶす
1. 塗りつぶされていないマスを数えてた
```python
# 駒があるマス目の座標を取得し、リストに格納
# その後移動可能マスを塗りつぶし、塗りつぶされていないマスを取得
grid = [list(input()) for _ in range(8)]

# print(grid)
# 駒の位置取得
koma = []
for y in range(8):
    for x in range(8):
        if grid[y][x] == "#":
            koma.append((y, x))

# 移動可能マスを塗りつぶす
for y, x in koma:
    for i in range(8):
        grid[y][i] = "#"
        grid[i][x] = "#"

ans = 0
for y in range(8):
    for x in range(8):
        if grid[y][x] == ".":
            ans += 1

print(ans)
```
詳しくはC問題で解説するが、コマの存在する可能性のあるマスをsetで持ち、64から引いてもよかった。


## C問題
https://atcoder.jp/contests/abc377/tasks/abc377_c


### 問題概要
N×Nのマス目にコマがM個ある。コマは一定の動き方をする。
コマにとられないマスはいくつあるか？

### 解答
1. 移動先をリストでもっておく
1. それぞれのコマの初期位置を記録
1. 1. それぞれのコマが取りうる位置をsetで記録
1. N×N - (コマの取りうる位置) で答えを求める
```python
n, m = map(int, input().split())

# x, yの移動方向
moves =[(2, 1), (1, 2), (-1, 2), (-2, 1),
        (-2, -1), (-1, -2), (1, -2), (2, -1)]

catch = set()
koma = []
for _ in range(m):
    a, b = map(int, input().split())
    koma.append((a, b))
    catch.add((a, b))

# 8方向に移動できるかどうか
for x, y in koma:
    for dx, dy in moves:
        if 1<= x+dx <= n and 1<= y+dy <= n:
            catch.add((x+dx, y+dy))


ans = n**2 - len(catch)
print(ans)
```


## 感想
今回は約１か月ぶりのABCだったが、Cまで19分弱で解けた。最近C問題の精進をしていたので、成果が出てよかったと思う。また、久しぶりの緑パフォーマンスを出せることができた。おかげでレートが44も上がっておいしかった。

一方、時間がたくさん余ったにもかかわらずD問題は全く分からなかった。一瞬、尺取り法を思いついたが、考察力と計算量の概算ができなくて3完に終わってしまったのは悔しい。今後は、C問題の早解きと、D問題の正解が壁になりそうなので続けて精進していきたい。
EC2をWordpressサーバーとして構築する(terraform)

## はじめに
今回はEC2をWordpressサーバーとして構築します。条件は以下の通り。

- 構築はterraformを使用
- コストは最小限に抑える
- 最低限のセキュリティは担保する

練習用で実践するので、実際にwordpressを使用してホームページを運用したい場合には今回ご紹介するアーキテクチャはセキュリティや可用性等の観点から足りていない部分が多いですが、コストがもう少しかかっても大丈夫な方向けの構成も紹介していこうと思います。

## 前提条件
- AWS CLIをインストール済みでprofile等の設定が完了している
- terraformをインストール済みで基本的な使い方が分かる

あまり深いことはしないのですが、ご自分でterraformを使用してリソースを作成した方なら問題ないかと思います。

## 今回のアーキテクチャ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492874/7450998f-9585-f5a9-0f09-7bd3db07a32f.png)


構成図を書くのも悲しいくらい何もないのですが、今回はコストを抑えつつEC2をwordpressサーバーとして構築したいのでこの構成にしています。
本来はCloudFront,ALBをEC2の全面に起き、EC2はプライベートサブネットに配置すべきです。
今回はEC2のSecurityGroupに自宅PCのIPからのみ接続を許可するようにして最低限のセキュリティを担保していきます。
SSM接続できるようにインスタンスプロファイルを設定することで毎回sshでログインする手間が省けるのでおすすめです。
## 実践的なアーキテクチャ
もう少しコストをかけてもいい場合は以下のような構成にしたいです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3492874/e61d3222-0bcb-3694-2d2c-91520d33dc55.png)



変更点
- Route53,CloudFrontを使用して独自ドメインを取得することで、任意のドメインでWordpressを公開することができる
- ALBをパブリック、EC2をプライベートサブネットに配置することでEC2へ直接アクセスさせない
- DBとサーバー（EC2）を分けることで可用性の向上
- サーバーからインターネットにアクセスする際はNatGatewayを使用することでサーバーのIPを秘匿できる

ただ上記の場合は、ALB、NatGateway、RDSで料金がそこそこかかりますのでご注意ください。
## terraform
以下でterraformのソースコードを公開しているので参考にしてみてください。
READMEに使い方を記載しています。
https://github.com/takaakihoya/aws-ec2-wordpress

作成されるリソースの一覧としては以下です。
| リソースタイプ                      | 数   |
|--------------------------------|-----|
| `aws_instance`                 | 1   |
| `aws_iam_role`                | 1   |
| `aws_iam_instance_profile`     | 1   |
| `aws_vpc`                      | 1   |
| `aws_subnet`                   | 4   |
| `aws_internet_gateway`         | 1   |
| `aws_route_table`              | 2   |
| `aws_security_group`           | 1   |

## ハマったポイント
EC2作成時にユーザーデータを設定してWordpressに必要なものをいくつか設定したのですが、ここが結構ハマりましたので共有します。

1.ユーザーデータはルートユーザー権限で実行されるので、`sudo`が不要
2.インストールしたパッケージの不適合

特に2.でかなりつまずきました。
いろいろなブログを参考にしましたが、結局公式のリファレンス通りに実行するのが一番早かったです。。
https://docs.aws.amazon.com/ja_jp/linux/al2023/ug/hosting-wordpress-aml-2023.html

今回他にも色々とハマったポイントはありましたが、terraformで作成しているので作り直すのがとても楽で、こういった検証時にスクラップ＆ビルドを繰り返す際はIaCの恩恵をとても感じました。

## おわりに
とりあえずこれでEC2でwordpressを実行することはできます。
コストをかけてもいい場合はより実践的なアーキテクチャで構築することをおすすめします。
【Flutter】PopScopeの使い方とonPopInvokedWithResult()実装のポイント

## はじめに

FlutterのPopScopeを使用して、Androidで戻るジェスチャ（OSの戻るボタンや横スワイプ）が実行されたときの処理の追加方法を紹介します。

## PopScopeの使い方
最上位のウィジェットをラップして使用します。

```
class SampleView extends ConsumerWidget {
  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return PopScope(
      child: Scaffold(
        ...省略...
      )
    )
  }
}
```

PopScope()の引数にcanPop: falseとonPopInvokedWithResult()を追加します。  
```
    return PopScope(
      canPop: false,
      onPopInvokedWithResult: (didPop, __) async {
        if (didPop == true) return;

        if (isEditing) {
            // 画面遷移して良いか確認する
            if (isOk) {
              Navigator.of(context).pop();
            }
        }else {
            Navigator.of(context).pop();
        }
      },
      child: Scaffold(
        ...省略...
      )
    )
```
`canPop`: システムの戻るジェスチャによりpopさせるかの設定。自分の意図したタイミングでpopさせるためfalseにする。
`onPopInvokedWithResult()`: popが試みられたとき（戻るジェスチャが使用されたときと、`Navigator.of(context).pop();`が実行されたとき）に発火する。
`didPop`: 戻る操作が成功したかを示す。成功した場合はこれ以上処理しないためにreturnする。

## ポイント
`canPop:false`を設定している状態で戻るジェスチャを使用すると、`onPopInvokedWithResult()`は`didPopd:false`の状態で発火します。これを利用してバックボタンを押したときの動作を制御します。

`onPopInvokedWithResult()`内で画面をpopする処理を入れるとき、didPopのガード節を入れないと、`onPopInvokedWithResult()`が再帰的に呼び出され、エラーが発生します。

## まとめ
ドキュメントを読んでもよくわからない箇所が多かったので検証しつつ記事にまとめました。このあたりもう少し直感的になってくれると嬉しいですね。

ここまで読んでいただけた方はいいね・ストックをよろしくお願いします。

Flutter製の便利すぎる単語帳アプリ[Bestflip](https://study.bestop.jp/bestflip-product/)を配信しているのでそちらも見ていただけたら嬉しいです。

## 参考文献
https://api.flutter.dev/flutter/widgets/PopScope-class.html
Swaggerの（公式で想定された）defaultの使い方

## この記事を書こうと思った経緯
仕事でSwaggerのコードを書くことになった。
既存コードを参考にし新しいAPI分のコードを作成しようと思ったが、色々な書き方が混在していたためどれが正しい書き方か分からなくなり、混乱した。
特に気になったのが、exampleとdefaultの使い方だった。

## 結論
必須パラメータに`default`を使うことは誤り。→普通に`required`を使うこと！で、もし必須なら（そのパラメータには何らかの値がセットされることになるので）default値は使われることはない。

sample値として`default`を使うことは誤り。→普通に`example` か `examples`を使う！


## 公式の仕様書
https://swagger.io/docs/specification/v3_0/describing-parameters/


> ### **Default Parameter Values**
> 
> Use the `default` keyword in the parameter schema to specify the default value for an optional parameter. The default value is the one that the server uses if the client does not supply the parameter value in the request. The value type must be the same as the parameter’s data type. A typical example is paging parameters such as `offset` and `limit`:

また、以下のようにも記載されている。
> ### **Common Mistakes**
> 
> There are two common mistakes when using the `default` keyword:
> 
> - Using `default` with `required` parameters or properties, for example, with path parameters. This does not make sense – if a value is required, the client must always send it, and the default value is never used.
> - Using `default` to specify a sample value. This is not intended use of `default` and can lead to unexpected behavior in some Swagger tools. Use the `example` or `examples` keyword for this purpose instead. See [Adding Examples](https://swagger.io/docs/specification/adding-examples/).

## その他、Swagger関連で参考になった記事
全体像を再確認できる。久しぶりに書くことになった際におすすめ。
https://qiita.com/rllllho/items/53a0023b32f4c0f8eabb

フューチャーさんの分かりやすい記事。
https://future-architect.github.io/articles/20200409/

また、このような規約も公開されているんですね。（すごい😊）
https://future-architect.github.io/coding-standards/documents/forOpenAPISpecification/OpenAPI_Specification_3.0.3.html#%E3%81%AF%E3%81%97%E3%82%99%E3%82%81%E3%81%AB

## あとがき（独り言）
以下、（愚痴に近いですが笑）swaggerをあまり触ったことがない私バックエンドエンジニアが本気でSwaggerを書くことになり、既存コードに修正を加える際に思ったことです。

まず、社内で**ルールをもっと厳格に決めた方がいい。**

正しい英語にする。pagenationという単語がありました、おかしいですよね😅（paginationかなと）
かといってすでにいろんなところで使われているオブジェクトですから、そう簡単に変えるわけにもいかないからそのまま使うことになって
　→　大体そのままになる。エディターでスペルミスのエラーが出まくる。。

で、この記事で書いたdefaultの誤用ですね。え、なんでレスポンスのexamepleのノリでdefault使ってるの？🤔とか。

（エンジニアは往々にして無意識のうちに過去の書き方を踏襲して、統一感を重視する傾向があると思いますが、その結果間違った書き方が増えていくわけです。）
統一されていないのもアレですが🧐

これらを反面教師にして、新しいプロジェクトのコードはなるべく気をつけるようにしています。
最近はAIによるレビューもできるし、やりようはいくらでもあるかと。
スペルはやっぱり大事。英語で書くんだから、、
ただ和製英語がダメと言っている訳ではなく、それはそれでわかりやすいからOK。せめて英単語として存在しているものはそれを使おう、と。

あと勝手に小文字で繋げるのやめて〜（独り言）
pagenation・pagination、updator・updater、reponsetime・responseTime　ここら辺はあるあるですかね。