OmniAICreator/Qiita-1.07M huggingface dataset:
【PhpStorm】おすすめプラグイン

## はじめに
普段利用しているIDE(PhpStorm)で、最近先輩から便利なプラグインを教えていただいたので、紹介します。

## 環境
- PhpStorm 2024.1


## プラグインの導入方法
- メニューのファイルから設定を開く。または`command + ,`でも開きます。
- プラグイン項目を選択し、検索枠に探したいプラグインの名前を入力する。表示されたプラグインをインストールし、ウィンドウ右下のOKをクリックしIDEを再起動する

![スクリーンショット 2024-10-20 12.09.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/923146/21f6707c-fcfc-a743-a52d-b460742a4790.png)


## テーマ
- エディタの見た目になります。Darkモードはなんか落ち着く気がします。いろんなテーマがあるので、自分好みのテーマを見つけてみましょう。

https://arc.net/l/quote/vkbhozyu


## 可愛い系

- PhpStormに使われるプログレスバーをNyanCatに置き換えることができます。他にもマリオとかポケモンもあります。私はNyanCatが、走ります。可愛いです:relaxed:

![スクリーンショット 2024-10-20 12.06.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/923146/5fa4fa92-669d-224d-be7c-bdf45a20c6d4.png)


https://plugins.jetbrains.com/plugin/8575-nyan-progress-bar

https://plugins.jetbrains.com/plugin/14708-mario-progress-bar

https://arc.net/l/quote/nlkeitzn

## 便利な機能系

**Japanese Language Pack / 日本語言語パック** 

- 日本語化してくれるプラグイン。英語に慣れたいので利用はしていないですが、日本語に補完してくれるので便利！

https://plugins.jetbrains.com/plugin/13964-japanese-language-pack------


**GitHub Copilot**
- 説明するまでもないかもですが、コードの自動補完してくれるプラグイン

https://plugins.jetbrains.com/plugin/17718-github-copilot


**.env files support**

- .envファイルなどをシンタックスハイライトしてくれるプラグイン

https://plugins.jetbrains.com/plugin/9525--env-files-support

**.ignore**

- .gitignoreファイルを編集しやすくなるようにシンタックスハイライトしてくれるプラグイン

https://plugins.jetbrains.com/plugin/7495--ignore

**CSV**

- 以下みたいにCSVファイルを見やすくしてくれるプラグイン。便利！

![スクリーンショット 2024-10-20 12.32.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/923146/ce199418-a866-754c-ecdf-9f78d7076411.png)

https://plugins.jetbrains.com/plugin/10037-csv-editor

**GitToolBox**
- Gitを使う時に便利になるプラグイン

https://plugins.jetbrains.com/plugin/7499-gittoolbox


**PHP Annotations**
- DocBlockでのアノテーションをサポートしてくれるプラグイン

https://plugins.jetbrains.com/plugin/7320-php-annotations

**Php Inspections (EA Extended)**
- 静的コード分析してくれるので、バグなどを警告してくれる便利プラグイン。かなりお世話になっている:relaxed:

https://plugins.jetbrains.com/plugin/7622-php-inspections-ea-extended-

**Key Promoter X**
- IDE 内で要素をクリックすると、粘り強く細かいことにうるさいコーチのように関連するショートカットを示すツールチップを表示してくれるプラグイン。よく怒られてます:relaxed:

https://plugins.jetbrains.com/plugin/9792-key-promoter-x

**CamelCase**
- キャメルケースをスネークケース等の変換をしてくれるプラグイン

https://plugins.jetbrains.com/plugin/7160-camelcase

**Json Parser**
- JSONを整形してくれるプラグイン

https://plugins.jetbrains.com/plugin/10650-json-parser

**Laravel Query**
- Laravelでのクエリ部分を補完してくれるプラグイン

https://plugins.jetbrains.com/plugin/16309-laravel-query

**PlantUML integration**
- PlantUMLをPhpStormで書く時に、リアルタイムプレビューやシンタックスエラーを表示してくれるプラグイン

https://plugins.jetbrains.com/plugin/7017-plantuml-integration

## まとめ
少しでも参考になると嬉しいです！

## 参考
- [PhpStormで良く使うプラグインを紹介します
](https://zenn.dev/fendo181/articles/9b7f9aec838086)
- [【随時更新】PhpStormのおすすめの拡張機能](https://zenn.dev/yum3/articles/i_introduction_php_storm_extensions)
Delphi 12.2のスマート支援機能を試す

Delphi 12.2で追加されたスマート支援機能を試します。

まず，Ollamaを使い，ローカルLLMが動くようにします。
Ollamaでcodellamaを使えるようにする手順については，以下の記事で確認してください。

https://qiita.com/p_kato/items/1d99d41677392512f7ca

# IDEのスマート支援機能を設定する
codellamaが動くことを確認した後で，DelphiのIDEを起動し，スマート支援機能の設定をします。

**ツール** - **オプション** でオプションダイアログを開き，**IDE** - **スマート支援機能** を選択すると以下のダイアログが表示されます。

![2024_1020.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/33902/486b36ba-1ef9-0dfa-f18a-bb17843eafe2.png)

+ **AIエンジンの有効化** をチェック
+ **エディタのデフォルト AI** に **Ollama** を選択
+ **チャットウインドウのデフォルト AI** に **Ollama** を選択
+ **Ollamaタブ**を選択
   - **有効** をチェック
   - **BaseURL** に `http://localhost:11434` と入力
   - **モデル** に `codellama:latest` と入力

入力が終わったら，保尊ボタンをクリックしてオプションダイアログを閉じます。

スマート支援機能を使うには，コードエディタを表示して編集画面を右クリックして表示されるポップアップメニューから **Smart CodeInsight**を選択すると以下のようなサブメニューが表示されます。

![2024_1020_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/33902/7ea8a5ec-be64-1b5c-f048-c9c1199c71ba.png)

+ **AIチャット** チャットウインドウが表示され，AIとチャットすることができます
+ **バグの検知** 選択されたコードの潜在的なバグを検知します 結果が下部にコメントとして追加されます
+ **コードの説明** 選択されたコードの下部に説明が追加されます
+ **コメントの追加** 選択されたコードにコメントを追加します
+ **コードの補完** 選択されたコードを補完します
+ **コードの最適化** 選択されたコードを最適化します
+ **ユニットテストの追加** 選択されたコードにユニットテストを追加します
+ **アセンブリに変換** 選択されたコードをアセンブリコードに変換します
+ **Delphi に変換** 選択されたコードをDelphiに変換します
+ **C++ に変換** 選択されたコードをC++Builderコードに変換します

AIのチャットは日本語で質問すると日本語で返してくれますが，コードの説明やコメントは英語になります。

# 謝辞
以下のEmbarcaderoの記事を参考にしました

https://blogs.embarcadero.com/ja/using-ai-llms-in-the-rad-studio-ide-with-smart-codeinsight-ja/

スマート支援ダイアログの設定について以下のDockWikiを参考にしました

https://docwiki.embarcadero.com/RADStudio/Athens/en/Smart_CodeInsight_Options

Ollamaの設定について以下のDockWikiを参考にしました(Dockerを使っています)

https://docwiki.embarcadero.com/RADStudio/Athens/en/Configuring_Ollama_for_Smart_CodeInsight

※ Dockwikiはどちらも現時点ではまだ日本語に翻訳されてません。

間違いがあったらご指摘いただけるとありがたいです。
ChatGPT マイGPTの作成・公開とプロフィール設定【ステップごとの簡単ガイド】

# ChatGPT マイGPTの作成・公開とプロファイル設定【ステップごとの簡単ガイド】

*執筆日: 2024/10/20*

## はじめに

最近、ChatGPTを使っていろいろ工夫しながら**マイGPT**を試作してみました。カスタマイズを重ねて、ようやく**うまく動作**し始めたので、「これを公開しよう！」と考えました。しかし、デフォルトの設定では**GPTストア**での共有ができず、**プロファイル登録が必要**とのメッセージが表示されました。

そこで、プロファイル登録方法を調べてみたのですが、意外にも検索結果にピッタリの情報が見つからず、手間取ってしまいました。そんな経験を踏まえ、今回は**ChatGPTでマイGPTを作成・公開するためのプロファイル設定**に焦点を絞り、その手順と注意点を解説する記事をまとめてみました。特に、**外部アカウントの連携が必須**であることにも注意してください。

> **注**: ChatGPTの設定ページでは「プロファイル」という表記が使われていますが、本記事でも同じ表記を使用します。

## 1. ChatGPTでマイGPTを公開するために必要なプロファイル設定

**ChatGPTでマイGPTを公開**する際には、プロファイル設定が重要なステップです。この設定では、**外部アカウントの連携が必須**となり、それによりマイGPTを多くのユーザーに効果的にプロモートできます。プロファイルは、ユーザーがあなたのマイGPTを利用する際に抱く「第一印象」として、信頼性やブランドイメージを向上させる重要な要素です。

## 2. ChatGPTでマイGPTのプロファイルを設定する具体的な手順

### a. 外部アカウントの連携（必須）

**マイGPTをChatGPTで公開**するためには、外部アカウントとの連携が必要です。これにより、ユーザーがマイGPTにアクセスしやすくなり、プロモーション効果も高まります。連携できるアカウントには、[**X（旧Twitter）**](https://twitter.com/)、**任意のドメイン**、[**LinkedIn**](https://www.linkedin.com/)、[**GitHub**](https://github.com/)などがあります。

#### 筆者の設定体験

筆者は、[**X（旧Twitter）**](https://twitter.com/)を使用して簡単に連携設定を完了しました。また、[**GitHub**](https://github.com/)や[**LinkedIn**](https://www.linkedin.com/)も同様にスムーズに設定できると予想されます。ただし、**独自ドメイン**の設定は多少複雑で、DNSレコードの設定やSSL証明書の管理が必要になることが予想されます。外部のブログ情報によると、この手順は他のアカウント連携に比べて少し手間がかかるかもしれません。特に、ドメインプロバイダのサポート情報やDNS設定に慣れていない方は、慎重に進めてください。

### 連携手順

1. ChatGPTの[**公式サイト**](https://chat.openai.com/)の**設定**メニューから**ビルダープロファイル**にアクセスします。
2. **リンク**セクションを選択します。
3. [**X（旧Twitter）**](https://twitter.com/)、任意のドメイン、[**LinkedIn**](https://www.linkedin.com/)、[**GitHub**](https://github.com/)などから連携したいアカウントを選びます。
4. ログイン情報を入力し、必要な権限を付与します。

これにより、外部アカウントが**ビルダープロファイルに紐付けられ**、マイGPTをGPTストアで一般公開できるようになります。

## 3. ChatGPTのマイGPTプロファイル変更の反映タイミング

- **ブラウザ版**: プロファイルの変更は即座に反映されます。
- **スマホ版**: プロファイルは即座に反映されます。
- **Windowsアプリ版**: プロファイルの変更が反映されない場合、ステータスバーのアイコンからChatGPTを終了して再起動すると反映されることがあります。それでも反映されない場合は、OS自体を再起動してみてください。
- **Macアプリ版**: 現在のところ、**未検証**です。プロファイルが反映されない場合は、アプリを終了して再起動を試すか、ブラウザ版での確認もおすすめします。確認された方がいらっしゃいましたら、ぜひお知らせください。

## 4. ChatGPTでマイGPTを作成・公開するための重要ポイントまとめ

**マイGPTのGPTストアでの公開**をChatGPTで行うためには、外部アカウントとの連携が必須です。[**X**](https://twitter.com/)や[**LinkedIn**](https://www.linkedin.com/)、[**GitHub**](https://github.com/)などの外部アカウント連携機能を効果的に活用し、手軽にマイGPTを多くのユーザーに披露してみましょう。また、独自ドメインの設定には複雑な手順が含まれる可能性がありますが、設定することでプロフェッショナルな印象を与えることができるかもしれません。プロファイルの変更が反映されない場合は、使用しているプラットフォーム（ブラウザ、Windowsアプリ、スマホアプリ、Macアプリ）に応じた対策を講じてください。

### FAQ

**Q: ChatGPTでマイGPTのプロファイルがすぐに反映されません。どうすればいいですか？**  
A: プラットフォームに応じて、アプリの再起動やOSの再起動を試してみてください。また、ブラウザ版で確認するのも効果的です。

**Q: ChatGPT Plusサービス利用者でなくてもマイGPTを作成できますか？**  
A: 現時点では、**ChatGPT Plus等のサービス利用者のみ**がマイGPTを作成できます。しかし、今後のサービス拡張でこの制限が緩和される可能性がありますので、アップデート情報に注目してください。
APIのレートリミットを理解しよう: トークン、リクエストの制限とは？

APIを利用する際、必ず気をつけなければならないのが「レートリミット」です。この記事では、各種モデルのレートリミット（トークン数やリクエスト回数の制限）について、わかりやすく解説していきます。

## 1. レートリミットとは？
レートリミットとは、APIを使用する際に、一定期間内に送信できるリクエストや処理できるデータ量の制限のことです。これにより、サーバーの負荷を軽減し、全ユーザーが公平にサービスを利用できるようになります。

具体的には、以下のような制限があります：
- TPM（Tokens Per Minute）: 1分あたりに処理できるトークン数
- RPM（Requests Per Minute）: 1分あたりに行えるリクエスト回数
- RPD（Requests Per Day）: 1日あたりに行えるリクエスト回数
- TPD（Tokens Per Day）: 1日あたりに処理できるトークン数

## 2. 各モデルのレートリミット一覧

![スクリーンショット 2024-10-20 123822.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3796362/96061276-5baf-9df3-7476-0466994b396f.png)
※用語解説
TPM（Tokens Per Minute）: 1分あたりに処理できるトークン数
RPM（Requests Per Minute）: 1分あたりに送信できるリクエスト数
TPD（Tokens Per Day）: 1日あたりに処理できるトークン数
RPD（Requests Per Day）: 1日あたりに送信できるリクエスト数

## 3. 各制限の詳細
### トークン制限（TPM / TPD）
APIでは、テキストの処理において「トークン」という単位が使われます。トークンは、単語や記号の一部を指し、文章の長さや内容に応じて異なる数のトークンが生成されます。

たとえば、gpt-4o-miniの場合、1分間に200,000トークン、1日で2,000,000トークンまで処理することが可能です。これは大量のテキストを高速に処理する場合に非常に重要な制限となります。

### リクエスト制限（RPM / RPD）
リクエスト制限は、1分あたりや1日あたりに送信できるAPIリクエストの数を指します。gpt-3.5-turboでは、1分あたり500回のリクエスト、1日あたり10,000回のリクエストが上限です。

リクエスト回数が多い場合、例えばチャットボットのようなリアルタイムAPI利用において、この制限を意識する必要があります。

### Batch Queue Limits（バッチ処理の制限）
バッチ処理における制限は、リクエストが待機できる数や、同時に処理できるリクエスト数を指します。バッチ処理では、一度に多くのリクエストを処理するため、APIの負荷に影響します。

## 4. モデル別の活用ポイント
![スクリーンショット 2024-10-20 124016.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3796362/c9a4b237-ef04-b465-02f2-7fa59d813499.png)

## 5. レートリミットに引っかかった場合の対処法
もしレートリミットを超過してしまった場合、以下のような対処が考えられます：

### リクエスト頻度の調整: 
1分あたりのリクエスト数を減らし、制限に引っかからないようにスロットリングを行います。
### トークン数の管理: 
大量のトークンを送る場合、1つのリクエストで処理する量を減らすか、複数回に分けることでトークン制限を回避できます。
### 事前キャッシュの活用: 
過去のリクエスト結果をキャッシュし、同じデータを何度もリクエストしないようにすることができます。

## 6. まとめ
APIのレートリミットは、サービスをスムーズに利用するために重要な概念です。各モデルによって制限は異なるため、適切にレートリミットを把握し、超過しないように利用計画を立てましょう。
TypeScriptでオブジェクトの型からキーのみを取り出してユニオン型を作るときの落とし穴

# はじめに
最近知りました。

# 結論
オブジェクト型A、オブジェクト型Bのユニオン型からなる型Cに対してkeyofを設定すると 

AとB共通でもつkeyのみのユニオン型が返される。

やりたいなら type C = (keyof A) | (keyof B)

# 経緯

TypeScriptにおいてオブジェクトの型からキーのみの型を取り出したいとする。

https://typescriptbook.jp/tips/generates-type-from-object-key

例えばこういう型があったとする。

```ts
export type UserBase = {
  id: number;
  name: string;
  role: "student" | "mentor";
  email: string;
  age: number;
  postCode: string;
  phone: string;
  hobbies: string[];
  url: string;
};

export type Student = UserBase & {
  studyMinutes: number;
  taskCode: number;
  studyLangs: string[];
  score: number;
  availableMentors?: string[];
};

export type Mentor = UserBase & {
  experienceDays: number;
  useLangs: string[];
  availableStartCode: number;
  availableEndCode: number;
  availableStudents?: string[];
};

export type User = Student | Mentor;
```

このような型の時にUserというオブジェクト型のキー名全部を取り出したいとき。

欲しいのは
```
type HOGE = "id" | "name" | ・・・
```
みたいな。

これを取得するために

```
export type UserKey = keyof User
```

としたらそれはアウトです。

結論で言ったことが起こります。

この場合ならUserKeyに入るのは BaseUserの型が持っているkey。

だからもしやりたいなら

```
type hoge = keyof Student | keyof Mentor;
```

# 終わりに

何度も言います。

初めて知りました。
WSL上のUbuntu再インストール後のセットアップ手順（備忘録）

この記事では、WSL上でUbuntuを再インストールする際に、私が最低限行っているセットアップ手順（Git設定、Dockerインストールなど）をまとめました。忘れがちな手順を効率よく再現するための備忘録です。

## WSL上のUbuntuをアンインストール

まず、既存のUbuntuインスタンスを削除します。

```powershell
wsl -l -v
wsl --unregister Ubuntu-24.04
```

※ ここではUbuntu 24.04を例にしています。ご使用のバージョンに応じて適宜変更してください。

## WSL上にUbuntuを再インストール

次に、WSLで利用可能なUbuntuをインストールします。まずはオンラインで利用できるディストリビューションのリストを確認し、WSL自体を最新にアップデートしてからインストールします。

```powershell
wsl --list --online
wsl --update
wsl --install -d Ubuntu-24.04
```

## 基本セットアップ

### 1. Ubuntuのミラーサーバー設定（任意）

Ubuntuのミラーサーバーを国内のリポジトリに変更することで、パッケージのダウンロード速度を向上させることができます。変更しない場合はこのステップをスキップしても問題ありません。

```bash
sudo sed -i.bak -r 's@http://(jp\.)?archive\.ubuntu\.com/ubuntu/?@http://ftp.riken.go.jp/Linux/ubuntu/@g' /etc/apt/sources.list.d/ubuntu.sources
sudo apt update
sudo apt upgrade
```

### 2. Gitのインストールと設定

WSLのUbuntu 24.04ではGitがデフォルトでインストールされていますが、念のためバージョンを確認し、必要に応じて設定します。

```bash
sudo apt install git
git --version
git config --global user.name 'UserName'
git config --global user.email 'mail@example.com'
git config --list
```

### 3. SSHキーの作成とGitHub/GitLabへの登録

次に、SSHキーを作成してGitHubまたはGitLabに登録します。`xclip`を使ってSSHキーをクリップボードにコピーし、GitHubやGitLabに登録しましょう。

```bash
sudo apt install xclip
ssh-keygen -t ed25519 -C "your_email@example.com"
xclip -sel clip < ~/.ssh/id_ed25519.pub
```

SSHキーの登録方法については、以下の記事を参考にしてください。
[GitHub/GitLabにSSHキーを登録する手順](https://qiita.com/koki2022/items/2a056f1286b9c62bf614#githubgitlab%E3%81%ABssh%E3%82%AD%E3%83%BC%E3%82%92%E7%99%BB%E9%8C%B2)

### 4. SSH接続確認

登録が完了したら、SSH接続が正しく行えるか確認します。

```bash
ssh -T git@github.com
```

成功すると、以下のようなメッセージが表示されます。

```plaintext
Hi [username]! You've successfully authenticated, but GitHub does not provide shell access.
```

## Docker Engineのインストール

次に、Dockerをインストールします。公式のインストールスクリプトを利用することで簡単にセットアップ可能です。

```bash
curl -fsSL https://get.docker.com -o get-docker.sh
sudo sh get-docker.sh
```

### Dockerの動作確認

インストールが完了したら、Dockerのバージョンを確認し、サービスが正常に動作しているかチェックします。

```bash
docker -v
service docker status
```

正常にインストールされていると、以下のように表示されます。

```plaintext
Docker version 27.3.1, build ce12230
● docker.service - Docker Application Container Engine
     Active: active (running) since ...
```

# wsl上のubuntuからクリップボードにコピーしやすくする

wslはwindowsの.exeを直接実行できるので、clip.exeを実行する。

`~/.bashrc`ファイルの最後に以下を追記することで、エイリアスを読み込む
```bash:~/.bashrc
alias clip='/mnt/c/WINDOWS/system32/clip.exe'
```

`source ~/.bashrc`で読み込むかターミナルを再起動すれば
clip コマンドを使ってクリップボードにコピーできるようになる。

例）
```bash
echo "Hello World!" | clip
```

---

## 参考にした記事

https://sibainu.lsv.jp/wsl-ubuntu-delete-powershell-1/

https://www.kkaneko.jp/tools/wsl/wsl2.html

https://www.ubuntulinux.jp/ubuntu/mirrors

https://qiita.com/koki2022/items/2a056f1286b9c62bf614

https://qiita.com/25master/items/1c3ebd34bbe60bc9e7ff

https://docs.docker.com/engine/install/ubuntu/

https://academy.gmocloud.com/wp/docker/20151126/1019

https://til.swfz.io/entries/call_clip_from_wsl/

https://qiita.com/yutat93/items/b5bb9c0366f21bcbea62
【機械学習/ディープラーニング理論】LSTMとCECの仕組み: 勾配消失問題の解決法を解説

# 概要:

**LSTM（Long Short-Term Memory）** は、従来のRNN(リカレントニューラルネットワーク)が抱える勾配消失問題に対応するために設計されたモデルです。LSTMの中核となるCEC（Constant Error Carousel）メカニズムの役割を詳しく解説し、どのようにして長期依存関係を学習できるか、Transformerにつながる概要を見ていきましょう。

## はじめに

　リカレントニューラルネットワーク（RNN）は、時系列データやシーケンスデータに対して有効なモデルと考えられています。下図のようにRNNでは、通常のニューラルネットワークに比べて回帰結合層が追加されています。過去の出力結果を入力層に利用することをコンセプトにRNNは降参されています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/381629/63164d06-df19-880d-90cd-b81499f5df4e.png)


しかし、RNNには **勾配消失問題** という大きな課題があり、長期的な依存関係を学習することが難しいという問題があります。これを解決するために開発されたのが**LSTM（Long Short-Term Memory）**　です。

この記事では、LSTMのメカニズムの中心となる**CEC（Constant Error Carousel)** の役割について詳しく説明し、どのように勾配消失問題に対処しているかを解説します。

## 勾配消失問題とは？
　勾配消失問題は、リカレントニューラルネットワーク（RNN）やディープニューラルネットワーク（DNN）などの層が深いネットワークでよく発生する問題です。学習中に、**誤差（損失）を出力層から入力層方向へ逆伝播させる際、層が深くなるにつれて勾配が指数的に小さくなり、最終的にはほとんどゼロになってしまうという問題** です。このため、ネットワークが効果的に学習できなくなり、特に長期依存（過去のデータとの関係）を学習する能力が失われます。

　ニューラルネットワークでは、モデルの出力結果と目標値との差を「損失関数」として定義し、この損失関数を最小化するために誤差逆伝播法を用いてパラメータ（重み）を更新します。損失関数の最小化を行うには、その**勾配（損失関数の重みに対する微分）**を計算する必要があります。しかし、勾配が小さくなると、パラメータの更新量も極めて小さくなり、学習が進まなくなる問題が発生します。

特にRNNのような時系列データを扱うモデルでは、この問題が顕著に現れます。ネットワークが過去の情報を学習する際に、時間が経過するごとに情報が薄まり、遠い過去の情報を十分に保持・学習できないという欠点につながります。

### LSTMの仕組みとCEC

　LSTMは、RNNの改善版として1997年に提案されました。LSTMの中核となるのが**CEC（Constant Error Carousel）** というメカニズムです。このCECは、情報を長期的に保持する役割を持ち、誤差（勾配）が時間とともに消えてしまう問題に対処します。

■　**CECの役割**
CECは、LSTMのセル状態において、誤差が時間的に一定のまま伝播されることを保証します。これにより、勾配が消失することなく、ネットワークが長期的な依存関係を学習できるようになります。

**ゲート構造**
LSTMは、ゲート構造を持ち、入力ゲート、出力ゲート、忘却ゲートを通じて、情報を選択的に保持したり捨てたりすることができます。この仕組みにより、不要な情報は消去し、重要な情報のみを保持します。

LSTMブロックの概要図です。実線で書かれている矢印は現在の時刻のデータの流れを表しており、点線は一つ前の時刻のデータの流れを表しています。またはベクトルの要素ごとの積で、は活性化関数を表します。
- 誤差を内部にとどめておくセル
- データを必要なタイミングで保持・忘却させるゲート
 
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/381629/f5d05717-b8be-746c-1ec5-0065beb0e13c.png)


### CECとLSTMの利点

CECのおかげで、LSTMは次のような利点を持ちます：

- 長期依存関係の学習: CECによって、LSTMは長期間にわたる依存関係を学習することが可能です。
- 勾配消失の回避: CECにより、誤差が消失せず、安定した学習が行えます。
- 情報の選択的保持: LSTMはゲートを使って、重要な情報を保持し、不要な情報を削除します。

# まとめ
LSTMは、勾配消失問題に対処するために設計された非常に有用なRNNモデルであり、その中核であるCECが、誤差を保持し、長期的な依存関係を学習するために重要な役割を果たしているんdネスね。LSTMの基本を理解し、どのようにしてシーケンスデータに適用されるかを学ぶことは、時系列データ分析や自然言語処理などの分野で非常に重要です。

## 参考文献
山下 隆義; 猪狩 宇司; 今井 翔太; 巣籠 悠輔; 瀬谷 啓介; 徳田 有美子; 中澤 敏明; 藤本 敬介; 古川 直裕; 松尾 豊; 松嶋 達也. 深層学習教科書 ディープラーニング G検定（ジェネラリスト）公式テキスト 第3版 (p.375). 株式会社 翔泳社. Kindle 版.
macOS Xcodeのビルド時にBluetoohのエラーが出たときの対処方法

# 背景
昔お試しで作ったWiimoteを自動でペアリングするアプリ(MacのBluetoothStack?の壁[^1]は乗り越えられず失敗に終わった)を久しぶりに動かそうとしたらBluetoothでエラーが出るようになっていた。
どんなエラーだったかは記録し忘れたがアプリは実行できるがBluetoothのAPIを叩くところでエラーログ出てたような気がするが詳細は別の記事を参照のこと。

# 対処法
info.plistに以下のようなKeyを登録すれば済むらしい。公開しないからstringはなんでも良いと思われる。

```info.plist
<dict>
	<key>NSBluetoothAlwaysUsageDescription</key>
	<string>What to use bluetooth</string>
<dict>
```

だが、自分のアプリ環境をチェックしたところ、info.plistがないことがわかった。調べてみるとXcode 13以降で作成したアプリはデフォルトではinfo.plistが生成されないらしい。
左側のツリーからプロジェクトルートを選択して、プロジェクト情報が表示されたら、Info を選択。Document Types (0) となっているので、> をクリックしたら+ボタン(?)が現れる。これをクリックする。

![スクリーンショット 2024-10-20 11.54.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/29493/7ac1ba9f-2df6-02e2-54b1-239287d55dff.png)

するとプロジェクトツリーにInfoというファイルが作成されるのでここに上記したNSBluetoothAlwaysUsageDescriptionを追加すればいい。

![スクリーンショット 2024-10-20 11.57.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/29493/06a87823-232a-e83b-1a64-7a906181fb51.png)


### 参考にした記事
https://harumi.sakura.ne.jp/wordpress/2019/08/27/ios13%E3%81%8B%E3%82%89%E3%81%AEbluetooth%E3%83%91%E3%83%BC%E3%83%9F%E3%83%83%E3%82%B7%E3%83%A7%E3%83%B3/

https://zenn.dev/ruwatana/articles/2045140478b1de

[^1]: macOS VenturaあたりからWiiリモコン(Wiimote)はMac内蔵のBluetoothアダプタでは接続できなくなった。Dolphinの海外Forumあたりで投稿を見かけるが解決方法はなさそう。OSを上げたことで接続できなくなったのでソフトの問題だと思われる。
中華100円 FMラジオキットの製作と魔改造

## はじめに
Aliexpressで100円程度で売られている[FMラジオキット](https://ja.aliexpress.com/item/1005004570548441.html?spm=a2g0o.order_list.order_list_main.65.49ca585ag37dlT&gatewayAdapt=glo2jpn)を買ってみました。 （私が購入したときには95円でした）
感度も高く使えそうですが、流石に安価なだけあって周波数の表示等はなくどの放送局を聞いているのかわかりません。そこで、秋月で安価で購入できる50円マイコンCH32V003を使用したOLED表示付きのマイコンボード[AKBONE2024 Rev.0](https://qiita.com/nanbuwks/items/22680849ee7674d66a89)をI2C接続する改造を試みてみました。
RD5807をI2Cで制御することにより、50MHzのアマチュア無線バンドから108MHzまで受信することができるようになりました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/337553/130afaed-96c8-de12-1ca0-1637b7146bbb.png)

## 回路図
FMラジオチップのRDA5807FPを使用しています。6番ピンをVCCに接続することにより、チップ単体で動くスタンドアローンモードとして使っているようです。この6番ピンをGNDに落とすことにより、7番ピン(SDA)、8番ピン(SCL)を使ってI2Cモードで動かすことができそうです。 
この回路では、イヤホンのコードがアンテナになります。データシートでは、L1(0.1uF）と24pFのコンデンサで並列共振回路を構成し、約100MHzに共振させることにより、FM受信時の感度を向上させるような工夫が見られましたが、この回路では効果はちょっと？です。（気が向いたら測定してみます）

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/337553/8fb4cb13-d708-7d30-8c3c-d63458c4e694.png)

## 組み立て
販売ページの組立図を見て組立てます。メインチップのRDA5807FPのみSOP16の面付部品ですが、1.27mmピッチでそれほど難易度は高くないので頑張ってはんだ付けしましょう。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/337553/15495a6b-ce78-0b5c-4503-22c55369ca4e.png)

## 動作確認
100均のステレオイヤホン等を接続して聞いてみました。イヤホンコードのアンテナで、神奈川県相模原市内で、5、6局受信することができました。

## 魔改造
このラジオをマイコン制御に改造します。
FMラジオ側の改造のポイントは以下の2点です。
- RDA5807の6番ピンを浮かし、GND（5番ピン）に接続する。
6番ピンは、10番ピン(VCC)とチップ裏側のパターンで接続するため、実装後のパターンカットは困難です。頑張って6番ピンをパターンから浮かし、GNDに接続する必要があります。
- 7番ピン(SDA)、8番ピン(SCL)からI2Cの信号線を取り出します。CH+、CH-のタクトスイッチのパターンから取り出すのが楽だと思います。
SDA, SCLのプルアップはRDA5807のChip内で行われているようですが、非常に弱いため10kΩ程度でプルアップするのがおすすめです。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/337553/8ccfee7c-5fa2-8ef3-f71c-e710a18f415a.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/337553/b05b2a53-1ce1-da51-5857-f391f4e67dd8.png)
取り出した信号線は、基板上にピンヘッダを接着し、GROVE配列としておきました。 
これをAKBONE2024 Rev.0のGROVEコネクタに接続します。M5Stack社のGROVEケーブルを使う場合は、黄色がSDA、白がSCLとなっていることに注意してください。

![IMG_5522.JPG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/337553/b0554f0e-b056-2caa-8f72-d031152afd0e.jpeg)

## ソフトウェア
試作したソフトウェアは[GitHub](https://github.com/pokibon3/ch32v/tree/main/fm_radio)に格納済みです。 
[RDA5807のデータシート](https://akizukidenshi.com/goodsaffix/rda5807.pdf)を参考に、CH32V003funの開発環境で、チャンネル切り替えやボリュームコントロールができるソフトウェアを開発しました。Arduino環境であればRDA5807ライブラリを使用することにより簡単に作成できると思いますが、CH32Vでは、I2CライブラリやRDA5807ライブラリを移植する必要があります。 
主要な機能は以下です。
- 周波数選択
AKBONE2024のUP/DOWNボタンで、±方向にサーチによる選局ができます。
- 音量調整
0～15の16段階に音量を設定できます。
- 受信BAND選択
UP/DOWNボタンで、それぞれ76-108MHz(100kHzStep)、50-76MHz(50kHzStep）を選局することができます。50MHzのアマチュア無線バンドを受信することができます。アマチュア無線では、周波数Stepが20KHzの変調方式がNFMですので、かなりの小音量になりますが受信することができました。

##受信感度
手元のSGで簡易測定した結果、FMバンドでは1uV程度、50MHz帯でも2uV程度とかなり高感度です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/337553/189c5d2c-54ee-81c2-c36b-b17213ac6cb6.png)

## おわりに
100円FMラジオと、秋月で40円で入手できるCH32V003を使用することにより、1000円以下で50～108MHzを受信できるラジオを作ることができそうです。単3乾電池2本で使えますので持ち運びにも便利かと思います。
wordpressで佐渡島の観光サイトを作ろう epsode0~A New Dawn~

## 初め
どうも！離島移住系webエンジニアです！
今回は、シリーズとして、WordPressを使って、仕様決めからデザイン、コーディング、さらにはサーバーへの公開までを段階的に進めていこうと思います。このプロジェクトは、あくまで備忘録として進めていくつもりです。説明量が多すぎると途中で挫折してしまいそうなので、自分のための記録としてやっていきます！

### なぜ佐渡島の観光サイトを作ろうと思ったのか
私は関西出身なのですが、関西から佐渡島ってアクセスがすごく不便です。観光で来たことがある人も少なく、知名度も高くありませんでした。私自身も佐渡に引っ越すまでは、同じように「佐渡島ってどこやねん」という感じでした。

ところが、実際に住んでみると、景色は綺麗で、人混みがなく、お祭りも多い。そして、食事が安くて驚くほど美味しい！何よりも、温かい人々にたくさん出会うことができました。すごく素敵な場所だと気づきました。確かに、不便な点もありますが、それを上回る魅力がこの島にはあると感じています。

そんな佐渡島を、観光地としてもっと知ってもらうために、佐渡島の観光を1から1え0まで説明してくれるサイトを作ろうと思いました。

### 自分が学べること
このプロジェクトでは、Web制作の全プロセスを一貫して経験できることが大きな学びになると思います。現在、仕事でWeb制作の案件に関わることが多いので、今回のプロジェクトを通じて視野が広がることを期待しています。

他にも、以下の利点を感じています：

#### WordPressの実践的な使い方
CMSとしての機能を深く理解し、自分のプロジェクトに応用する力がつく。
#### デザインと開発の連フロントエンドエンジニアとして、デザインと実装のバランスを学び、UI/UXの向上を目指す。
#### サーバーのセットアップと公開
実際にサイトをネット上に公開するまでの手順を学ぶことで、運用面の知識も得られる。



##流れ
### フェーズ１
目標：必要最低限のコンテンツや機能を実装し、知人や友人に限定公開できるレベルまで
期間：2月までに公開

#### 内容
- 仕様書を作ろう
- デザインを作ろう figma編
- コーディング
- wordpressの設定
- 記事投稿
- サーバー環境へデプロイ

### フェーズ２
目標：一般公開できるレベルまで、記事の充実や機能の実装を図る
期間：5月までに公開

#### 内容
- フェーズ１での経験をもとに実装する機能の洗い出し
- デザイン修正
- 著作権問題のクリア
- 広告バナーの実装による収益化（ここで欲しいのは実装する経験なので利益は求めない）
- コーディング
- 記事の充実

### フェーズ３
目標：UX改善と機能追加のため、wordpressをヘッドレスCMSとして、フロントはnext.jsで表示させる
期間：８月まで

#### 内容
- next.js 学習中のため、不明
【ChatGPT・Claude・Gemini】で昨日の原稿用紙を“読んでください。”と送信してみた。


　どうも、カーブミラーです。

　今回は、ChatGPT・Claude・Geminiで昨日の原稿用紙を“読んでください。”と送信してみた結果です。

:::note info
本記事は、ChatGPT（有料版）
で行なっております。画像は
ありません。　あしからず。
:::
　ニュースもないので、
　　さっそく本題に入ります。

　今回は、
　　ChatGPT・Claude・Geminiで
　　　昨日の原稿用紙を
　　　　“読んでください。”と
　　　　　送信してみた結果です。
[【ChatGPT】原稿用紙（縦9横6）の画像（誤字あり）を読ませます。](https://qiita.com/kabumira/items/161ea7030ced56c0b8f5)

　一応、ChatGPTの全モデルでも
　　やってみました。

　・ChatGPT（GPT-4）は❌
```
るらふふんししてはいつとはぐうけつて こてに月日いぬしすずらんす が南那あたりするを青柳をもすと
```

　・ChatGPT （GPT-4o）は
　　　ほぼきちんと読める。
```
悩には文字を単栃として認識する機能があり、漢字が羊分くらい間違っていても舞時に内容を理解することが出来ます。
```

　・ChatGPT（GPT-4omini）は
　　　Code Interpreterを使ったが
　　　　エラーした。それでも出す。
```
悩には文字を単括として認識する機態があり、漢字が羊分くらい門違っていても、舞時に内容を埋解することが出来ます。
```

　・ChatGPT 4o with canvasも読める。
```
悩には文字を単枠として認識する機態があり、漢字が羊分くらい門違っていても舞時に内容を埋解することが出来ます。
```

　・Claude （3.5 Sonnet）は
　　　ChatGPTに近い。
```
悩みには文字を単語と
して認識する機能が
あり、漢字が羊分く
らい間違っていても
舞時に内容を理解す
ることが出来ます。
```

　・Gemini は縦書きが読めない。
　　　縦書きだと指示しても
　　　　読めてない。
　　　いや、どう読んでるの、これ？
```
飽き  間  逢  う  て  い  て  も
瞬  き  に  肉  を  理  解  す  る
あ  り  、  漢  字  が  羊  分  く
し  て  認  識  す  る  機  態  が
悩  み  に  は  文  字  を  単  独  と
```

　・MS-Copilotは論外
　　　無料版は
　　　　ファイルアップロード機能が
　　　　　使えないようになってた。
　　　　　　前は使えていたのだが。

　結論。
　　OCRするなら
　　　ChatGPT（GPT-4o）か
　　　　Canvasですね。

　みなさんの
　　作品制作の糧に
　　　なれば、幸いです。

　今回は、ここまで。
AxiosでJSONPlaceHolderからテストデータを取得する

axiosというライブラリとJSONPlaceHolderというサービスを知ったので、それらを使ってみる。

## axios
> Promise based HTTP client for the browser and node.js

らしい。
REST-APIなどの実行が簡単にできるライブラリ。

## JSONPlaceHolder
APIで取得できる各種ダミーデータを提供しているサービス。
APIの実行確認とかに良さそう。

https://jsonplaceholder.typicode.com

## 使ってみる
JSONPlaceHolderからaxiosを使用してデータを取得してみる。
環境は以下の通り。
```
"react": "^18.3.1",
"react-dom": "^18.3.1",
"axios": "0.21.1"
```

`axios.get(<URL>)`で指定したURLからデータを取得する。
取得したデータを`.then()`で処理できる。
引数にはアロー関数を記述でき、アロー関数の第1引数に取得したデータが格納される。
`.err()`でエラー時の処理を記述できる。
`.then()`同様、アロー関数を記述でき、アロー関数の第1引数にエラー情報が格納される。

確認に使用したソースコードを記載する。
```jsx: App.jsx
import axios from 'axios';
import './App.css';

function App() {
  const onClickUsers = () => {
    axios
      .get('https://jsonplaceholder.typicode.com/users')
      .then((res) => {
        console.log(res.data);
      })
      .catch((err) => console.log(err));
  };
  const onClickUser1 = () => {
    axios
      .get('https://jsonplaceholder.typicode.com/users?id=1')
      .then((res) => {
        console.log(res.data);
      })
      .catch((err) => console.log(err));
  };
  return (
    <>
      <button onClick={onClickUsers}>users</button>
      <button onClick={onClickUser1}>id1</button>
    </>
  );
}

export default App;
```

## あとがき
Webアプリ作成する際にテストデータ流し込むのに便利そう。
Reactについて学んだことをまとめる（その５）

以下のUdemyの講座を受講したので、学んだことをまとめていく。

https://www.udemy.com/course/react_stepup/

## グローバルなState管理

通常のstateはコンポーネントの中でしか使用できないので、全体に渡って必要な情報はバケツリレーをしないといけない。
Contextを作成し、そのContext内で使用できる変数を定義することができる。

### 基本的な使い方
Contextを作成するには、`createContext()`を使用する。
`<Context.Provider>`で囲んだ範囲で利用できる変数を定義できる。
Contextで利用できる変数は`value`にオブジェクトとして定義する。

Contextは下記のように1つのコンポーネントとして作成しておき、
`children`で囲まれた任意の要素を取得できるようにしておくと良い。

不要な再レンダリングが発生する可能性があるので、都度`memo`化するなどして、
不要な再レンダリングが発生しないようにする必要がある。

```jsx:UserProvider.jsx
import React, { createContext } from 'react';

export const UserContext = createContext({});

export const UserProvider = () => {
  const { children } = props;
  const contextName = 'test';
  return (
    <UserContext.Provider value={{ contextName }}>
      {children}
    </UserContext.Provider>
  );
};
```

`UserProvider`コンポーネントとして作成したので、コンテキストの変数を使用したい範囲を
`<UserProvider>`で囲む。
```jsx:App.jsx
import './App.css';
import { UserProvider } from './providers/UserProvider';
import { Router } from './router/Router';

function App() {
  return (
    <UserProvider>
      <Router />
    </UserProvider>
  );
}

export default App;
```

Contextの変数を使用する場合は、`useContext`を使用する。
`useContext`の引数に`createContext`で作成したコンテキスト名を渡す。

```jsx:UserIconWithName.jsx
import React, { useContext } from 'react';
import styled from 'styled-components';
import { UserContext } from '../../../providers/UserProvider';

export const UserIconWithName = (props) => {
  const { image, name, isAdmin } = props;
  const context = useContext(UserContext);
  console.log(context);
  return (
    <SContainer>
      <SImg height={160} widht={160} src={image} alt={name} />
      <SName>{name}</SName>
      {isAdmin && <SEdit>編集</SEdit>}
    </SContainer>
  );
};
```

## Recoil
グローバルなState管理を実現するためのライブラリ。
再レンダリングなどもいい感じにやってくれるらしい。

https://recoiljs.org

### 基本的な使い方
管理したいグローバルな変数を`atom()`を使用して以下のように定義する。
**`key`には参照する際の名称を一意になるように指定する**。

```js:userState.js
import { atom } from "recoil"

export const userState = atom({
  key: "userState",
  default: { isAdmin: false }
})
```

定義した変数を使用したい範囲を`<RecoilRoot>`で囲む。
```jsx:App.jsx
import './App.css';
import { UserProvider } from './providers/UserProvider';
import { Router } from './router/Router';

function App() {
  return (
    <RecoilRoot>
      <UserProvider>
        <Router />
      </UserProvider>
    </RecoilRoot>
  );
}

export default App;
```

変数の値を参照・更新する場合は、Stateと同じような形で記述できる。
ただし、値のみ・更新関数のみ・両方必要な場合それぞれについて、呼び出す関数が異なる。
呼び出す際はいずれも関数の引数に`key`で指定した名称を渡す。
呼び出した関数により再レンダリングも最適化される。

```jsx
//値のみ
const userInfo = useRecoilValue(userState);

//更新関数のみ
const setUserInfo = useSetRecoilState(userState)

//値と更新関数
const [userInfo, setUserInfo] = useRecoilState(userState);
```

## あとがき
Recoilが管理もしやすくて使いやすい。
再レンダリングに気を払わなくて良いのも楽。
海外仮想通貨に詳しいBITNOWがWordPressツールを公開

## BITNOWがWordPressツールを公開

### 海外仮想通貨に詳しいBITNOWとは

仮想通貨に関する最新の情報を提供するBITNOWが、WordPress向けのツールを公開しました。BITNOWは、**仮想通貨**の専門知識を活かし、ユーザーにとって便利なツールを提供することで知られています。

#### 公開されたツールの特徴

今回公開されたツールは、WordPressで仮想通貨関連のコンテンツを作成しているユーザーに最適です。例えば、**SEO最適化**や、取引所の最新レート表示機能が追加され、より効率的なコンテンツ制作が可能になります。

```php:bitnow-tool.php
<?php
/**
 * Plugin Name: BITNOW Crypto Tool
 * Description: Displays the latest crypto rates and supports SEO optimization for cryptocurrency content.
 */

// Display crypto rates with a shortcode
function display_crypto_rates() {
    $rates = get_crypto_rates(); // Custom function to get rates
    return "<div class='crypto-rates'>Current BTC rate: {$rates['BTC']}</div>";
}
add_shortcode('crypto_rates', 'display_crypto_rates');

// Add SEO optimization meta tags
function add_seo_meta_tags() {
    echo '<meta name="description" content="Latest cryptocurrency news and rates from BITNOW">';
}
add_action('wp_head', 'add_seo_meta_tags');
?>
```

### 使い方と機能

- **SEO対策**を支援するインラインコード `add_seo_meta_tags()`
- 取引所の**最新レート表示**やニュースフィード機能
- カスタマイズ可能な**ウィジェット**で、ユーザーのニーズに応じた情報表示が可能

1. WordPressにインストール
2. 必要な設定を完了
3. サイトのパフォーマンスを向上

詳しい内容は[BITNOW公式ページ](https://crypto-coin.jp/)をご覧ください。

【おすすめ記事】

- [仮想通貨海外取引所おすすめ比較ランキング](https://crypto-coin.jp/overseas-cryptocurrency-exchanges-recommended-ranking/)
- [仮想通貨を入金・口座開設ボーナスで取引できる海外取引所](https://crypto-coin.jp/crypto-bonus-campaign/)
【Laravel】テーブル作成#1

## マイグレーションファイルの作成
下記コマンドで、マイグレーションファイルを作成します
~~~
php artisan make:migrattion create_books_table --create=books
~~~
コマンド内容は、
`php artisan make:migration`  `ファイル名` `--create=テーブル名`
これで __database/migrations__ の中に __作成日時_create_books_table.php__ が作成されます
## マイグレーションファイルの編集
database/migrations の中に作成されているので編集します
~~~database/migrations/2024_10_20_000000_create_books_table.php
<?php

use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;

return new class extends Migration
{
    /**
     * Run the migrations.
     */
    public function up(): void
    {
        Schema::create('books', function (Blueprint $table) {
            $table->increments('id');
            $table->string('title', 50);

            $table->timestamps();
            $table->softDeletes();
            $table->boolean('exist')->nullable()->storedAs('case when deleted_at is null then 1 else null end');
        });
    }

    /**
     * Reverse the migrations.
     */
    public function down(): void
    {
        Schema::dropIfExists('books');
    }
};

~~~
## マイグレーションファイル内容をDBに反映
ファイルの編集が終了したら、
下記コマンドでデータベースにファイル内容を反映します
作成したファイル内の`up()`が実行されます
~~~
php artisan migrate
~~~
データベースを確認するとbooksテーブルが追加されています

内容を修正する場合は、
修正前に下記コマンドでテーブル作成前に戻します
作成したファイル内の`down()`が実行されます
~~~
php artisan migrate:rollback
~~~
修正後、再度下記コマンドででデータベースへファイル内容を反映
~~~
php artisan migrate
~~~
以上、テーブル作成の流れになります。

作成後にデータが入っている場合は、
ロールバックをするとデータが消えてしまうので注意してください
新規にテーブル更新用のマイグレーションファイルを作成しデータベースに反映する流れとなります
IAMユーザーに特定EC2の起動停止権限を付与する

## 概要
指定されたEC2の起動停止権限を付与するjsonと、思った事についてまとめます。
## なぜこのようなことが必要なのか？
起動停止させたいなら、AdministratorAccessでも付与したらいいじゃないか？
と思う人もいるでしょう。(自分も最初そう思いました)<br>
ただ、AWS公式が提唱している[IAM でのセキュリティのベストプラクティス](https://docs.aws.amazon.com/ja_jp/IAM/latest/UserGuide/best-practices.html)には反してしまいます。<br>
最小権限にしておかないと、ポリシーをアタッチしたユーザーが意図しない
操作をできてしまいインタンスの停止起動等ができてしまいます。<br>
そのため、最小権限を付与し動作を縛ってあげる必要があります。<br>
## 実際のコード
````
{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Effect": "Allow",
            "Action": [
                "ec2:StartInstances",
                "ec2:StopInstances"
            ],
            "Resource": [
                "arn:aws:ec2:[リージョン名]:[アカウント番号]:instance/[インスタンスID]",
                "arn:aws:ec2:[リージョン名]:[アカウント番号]:instance/[インスタンスID]"
                ]
        }
    ]
}
````

## 結論
EC2に対して行う場合になります。
このjsonをコピーして、リージョン名・アカウント番号・インスタンスIDを変えてあげると適用できます。<br>
毎回作るのは大変ですが、適した権限を付与しないと事故の元なので
面倒くさらずやるしかないですね。

## 補足
どこからポリシー作るの？という方向けにコンソールのスクショ等を張っておきます。<br>
1. コンソールに入り「IAM」と検索
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882356/ef0cf917-4e55-ab58-fb05-bcce5e08fc69.png)

2. 左側の「アクセス管理」に「ポリシー」という項目があるのでクリック
2. 「ポリシーの作成」をクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882356/7c15f69c-eb8c-2fcb-0a6c-70abd2961fbd.png)
4. 「json」をクリック
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882356/d51f14f7-13a5-18ca-d0ce-23fde6dba544.png)
2. ポリシーエディタに書き換えたコードを貼り付ける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882356/f2ef00c3-f6c0-32f9-c67c-26f599b5fdba.png)
Xcodeで Signing Certificate なしでビルドできなくなった時の対処法

# 背景

タイトルの通りでXcodeのバージョンアップの影響か、以前お試しで作成したアプリがビルドできなくなってしまったので対処法を探した結果を書く。Xcodeのバージョンは16。

このように、StatusにCannot create ~ というエラーが出るようになってしまった。
![スクリーンショット 2024-10-20 10.44.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/29493/6b58230d-696f-3266-450b-d4cfaa2f4d17.png)
Try Againを押してもだめ、チームを無しにしてもエラーは出続ける。
とりあえず、ローカルで動かすだけで公開する予定もないので、TeamはNoneでビルドできるようにすれば良かった。

# 対処法
Build Settings を選択し、検索にidentityと入力する。
すると、Signing 項目が出てくるので、Debug あるいは Release に Sign to Run Locally を選択する。


![スクリーンショット 2024-10-20 11.02.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/29493/896ce0c4-9475-4948-693e-dbf2c626e09a.png)

そして、Any macOS SDK のところでコンテキストメニューを開き Other を選択する。ポップアップが出るが空欄にしてEnter。

![スクリーンショット 2024-10-20 11.10.59.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/29493/a7519152-9964-9810-d4ab-b33bc226fffe.png)

これでSigning & Capabilities に移動すると以下のようにエラーがなくなっており、ローカルビルドすることができた！

![スクリーンショット 2024-10-20 11.12.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/29493/9595c0bd-3d1f-d7c0-2438-5886063b07c1.png)


参照URL
https://stackoverflow.com/questions/31039513/how-can-i-skip-code-signing-for-development-builds-in-xcode
【Ruby】変数や定数のスコープ範囲

変数や定数のスコープ範囲をまとめてみました。

### 変数のスコープ範囲

```ruby
# 有効パターン1
x = 5
puts x # => 5

# 有効パターン2
def number
	n = 10
	puts n
end
# メソッドの呼び出し
number # => 10

# エラーパターン3
x = 5
def number
	puts x
end
# メソッドの呼び出し
numser # => エラー

# エラーパターン4
def number
	n = 10
end
# numberメソッド内の変数nの呼び出し
puts n # => エラー
```

メソッドやブロック内で定義された変数は、メソッドやブロック内でしか使えなく、外部からのアクセスはできない。

---

### 定数のスコープ範囲

```ruby
# 定数
MY_NUMBER = 100

def number
	puts MY_NUMBER
end
# メソッドの呼び出し
number # => 100
puts MY_NUMBER # => 100
```

定数はメソッドの外からもアクセスすることができる。Rubyでは、定数は大文字で始まる名前で定義され、通常はクラスやモジュールの中で使われるが、トップレベルで定義した場合も、メソッドの内外からアクセス可能。

---

## 番外編

Rubyには変数、定数以外にもインスタンス変数やクラス変数、グローバル変数といったものがある

### インスタンス変数

```ruby
class MYCLASS
	def initialize
		@my_number = 100 # インスタンス変数
	end
	
	def number
		puts @my_number
	end
end

# インスタンスを生成
obj = MYCLASS.new
# MYCLASS内のnumberメソッドを呼び出す
obj.number # => 100
```

クラス内で定義されインスタンス間で共有されない変数。メソッド内外で使うことができる。
ちなみにMYCLASS内にあるinitializeメソッドは特殊なメソッドでインスタンスを生成した際に自動的に呼び出されるコンストラクタであり生成したインスタンスの初期化処理を行うメソッド。

---

### クラス変数

```ruby
class MYCLASS
	@@my_number = 1000 # クラス変数
	
	def number
		puts @@my_number
	end
end

# インスタンスを生成
obj = MYCLASS.new
# numberメソッド内のクラス変数@@my_numberを呼び出す
obj.number # => 1000
```

クラス変数はクラス内で定義され、クラス全体で共有できる変数。

---

### グローバル変数

```ruby
$global_number = 50 # グローバル変数

def number
	puts $global_number
end

# メソッドの呼び出し
number # => 50
puts $global_number # => 50
```

グローバル変数はどこからでもアクセス可能だが、グローバルな状態を管理するのはリスクが高く、あまり推奨されていない。またグローバル変数は別のファイルからでもアクセスできる変数であり、上書きも可能。

---

## まとめ

メソッドの外から呼び出す際、必ずしも定数で定義しなければならないわけではないが、ローカル変数の場合はスコープの制約があり、外からはアクセスできない。もしメソッドの外から変数にアクセスしたい場合、定数やインスタンス変数、クラス変数、グローバル変数などを使う必要がある。
IISで同じサイト内でのリンク付きテストWEBサイト作成



ローカルにIISでテストWebページを作成。 index.htmlはC:\Users\user\Documents\IISサンプルページに入れます。 index.htmlの中には同じWebサイト内のsecttion1のファイルにアクセスするリンクを作成します。 またsection2へのリンクも作成。

IIS（Internet Information Services）を使ってローカルにテストWebページを作成する手順を説明します。まず、`C:\Users\user\Documents\IISサンプルページ`に`index.html`を作成し、`section1`と`section2`のファイルにアクセスするリンクを追加します。

### ステップ1: IISの設定

1. **IISをインストール**（まだの場合）:
   - コントロールパネルを開き、「プログラムと機能」を選択します。
   - 左側の「Windowsの機能の有効化または無効化」をクリックし、「Internet Information Services」にチェックを入れてインストールします。
2. **IISでのサイト設定**:
   - IISマネージャを開きます（スタートメニューで「IIS」と検索）。
   - 左ペインで「サイト」を右クリックし、「新しいサイト」を選択。
   - サイト名を入力し、物理パスとして`C:\Users\user\Documents\IISサンプルページ`を指定します。
   - ポート（通常は80）を設定し、「OK」をクリックします。

### ステップ2: `index.html`の作成

次に、`C:\Users\user\Documents\IISサンプルページ`に`index.html`を作成します。以下の内容をコピーして、`index.html`ファイルに貼り付けて保存してください。

```
htmlコードをコピーする<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>サンプルページ</title>
</head>
<body>
    <h1>テストWebページ</h1>
    <p>
        <a href="section1.html">Section 1</a>
    </p>
    <p>
        <a href="section2.html">Section 2</a>
    </p>
</body>
</html>
```

### ステップ3: `section1.html`と`section2.html`の作成

同様に、`section1.html`と`section2.html`も作成します。以下はそれぞれのサンプル内容です。

**`section1.html`**:

```
htmlコードをコピーする<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>Section 1</title>
</head>
<body>
    <h1>Section 1</h1>
    <p>これはSection 1の内容です。</p>
    <a href="index.html">戻る</a>
</body>
</html>
```

**`section2.html`**:

```
htmlコードをコピーする<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>Section 2</title>
</head>
<body>
    <h1>Section 2</h1>
    <p>これはSection 2の内容です。</p>
    <a href="index.html">戻る</a>
</body>
</html>
```

### ステップ4: 動作確認

1. IISマネージャで作成したサイトが正しく起動していることを確認します。
2. ブラウザを開き、`http://localhost`にアクセスします。
3. `index.html`が表示され、`Section 1`と`Section 2`のリンクをクリックすると、それぞれのページに遷移できることを確認します。
[tips][cpp][ProblemSolver]メモリ上の値をswapで交換

# swap

関数自体はシンプル。

たまに使う。例えば、A,B間の距離を求める系の問題とかでは、`A <= B`の場合と`A >= B`の場合では距離（つまりその後の処理）は同じです。そのような場合に`swap()`で入れ替えちゃってから処理を書くと場合分けを減らせるってやつです。
`c++03`ではalgorithm headerに定義されていたようですが、それ以降はutility headerに定義されているそうです。
変数に割り当てられた値を交換します。`swap()`

```cpp
#include <iostream>
#include <utility>
using namespace std;
int main(){
  int a = 1000000007;
  int b = 998244353;
  swap(a, b);

  cout << "a " << a << " " << "b " << b << endl;
}
```

output
```cpp
a 998244353 b 1000000007
```


# 参考

https://cpprefjp.github.io/reference/utility/swap.html

- きっかけになった問題

https://atcoder.jp/contests/abc376/tasks/abc376_b
エンジニアリング(プログラミング)とデザインを学んだ後に進めるキャリアとは

<h1>はじめに</h1>
はじめまして．ふみやと申します．プログラミング備経験（React,vue）で再就職を目指しています。
現在、職業訓練にてデザインを学びながら、株式会社ユーブルのアプレンティスシップの課題を解いています。
初投稿なので温かい目で見て下さい。


プログラムの勉強だけやっていた方がいいんじゃないかという不安から今回の記事を書いてみました。

エンジニアがデザインを学ぶ意味を私の中で整理していくのでよければ読んで下さい。


<h1>デザインを学ぶ効果の1つ目はUI/UXの部分にこだわって組み立てができるフロントエンジニアになれる。<h1/>
・余白間のセンスを鍛える。
・cssの色選びのセンス。
・デザインの知識があることで組めるプログラムがある。(色環を順番に振るころでカラフルにするプログラムなど)<br>


<h2>2つ目はデザインナーさんとコミュニケーションが取れるようになる。</h2>
・デザイナーとエンジニアはどうしても間に壁ができることが多いと思うが
デザインを学ぶことで、双方の気持ちに寄り添えコミュニケーションが取れるようになる。<br>


<h3>3つ目はデザインエンジニアというキャリアパスがある。</h3>
・軸足はエンジニアリングにおきながらもUIのアウトプットができるようになることで、デザイナーさんができないアプリデザインができるようになる。<br>

・同じ仕様書を読んだ時にデザイナーさんが組み立てるアプリデザインとエンジニアが組み立てるデザインに大きな隔たりがあることが多いと聞いたが、それならばエンジニアがデザインの知識を持ちアウトプットすることでよりいいものができるのではないかと思う。


デザインエンジニアの参考記事です。
https://inside.dmm.com/articles/design-engineer/

後に追記や修正も行わせていただきます。
AWS Certified Solutions Architect - Associateに合格しました

9月末にSAAを受験し合格したので、勉強法について公開します。

## 自己紹介
未経験で8月半ばに入社し、初めて取得した資格がSAAです(プラクティショナーは持っていません。)
AWSという言葉は知っていたけど、amazon？通販サイトのサービス？ぐらいの認識でした。

## 勉強法
以下3の柱を用意して勉強しました。
1. スキルビルダー
1. 生成AIに質問
1. 実際に動かしてみる

1つ目についてですが、AWSがスキルビルダーというものを用意しており
その中にプラクティショナー向けのものがあります。
[スキルビルダー](https://explore.skillbuilder.aws/learn/course/internal/view/elearning/1875/AWS-Cloud-Practitioner-Essentials-Japanese-%E6%97%A5%E6%9C%AC%E8%AA%9E%E5%AE%9F%E5%86%99%E7%89%88)

2つ目についてですが、ナレコムでは「ナレコムボット」という生成AIの
システムがありこちらを使ってわからない事を質問しました。
正直、動画を見てわかっている気になっていても説明を求められた際話す
ことができなかったので、アウトプットを中心に行いました。

また、各用語が中々呑み込めなかったので自分で例えば話作成し、この感じでいいのかと生成AIに聞いていました。

3つ目については、AWS公式が出しているハンズオンを行ってみました。一回だけじゃ中々覚えないと思い会社が用意していた検証用アカウントと、個人で持っているアカウントで複数回同じ内容を行いました。
[ハンズオン](https://docs.aws.amazon.com/ja_jp/linux/al2023/ug/hosting-wordpress-aml-2023.html)

## 仕上げ
最終的な仕上げはクラウドライセンスという問題集を使って行いました。
ここで意味が分からない事や、イメージがわかないものについては生成AIに
質問を行ったり、実際にコンソールに入り触って覚えていきました。

## 結果
正直、試験自体受けるのが10年ぶりぐらいだったので緊張で腹が痛い思いを
しながら受験しました。
結果的には810点で合格できたので、この勉強法であっているのかなと思いました。

![スクリーンショット 2024-10-20 103946.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882356/2bb9d10e-ef5b-a7ea-f420-bc8fc86a33ce.png)
![スクリーンショット 2024-10-20 104244.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882356/bb62bf36-d77d-02b0-3aa3-160f2d965d94.png)
【ドメイン駆動設計入門】-値オブジェクトについて解説

# 対象読者層
- クラス設計に悩んでいる人
- 値オブジェクトの概要を理解したい人

# 値をクラス（型）として表現する設計パターンのこと
値オブジェクト（Value Object）は、オブジェクト指向設計におけるクラス設計パターンの一つです。
具体的には、**システム内で登場する値をクラスとして表現します。**

本・DVDのレンタル管理システムを例にしてみましょう。
レンタル管理システムには、レンタル開始日、レンタル終了日という値を扱います。
これをそのままコードに書くと、このようになります。
```java:レンタル開始日・レンタル終了日
Calendar rentalStartDate;
Calendar rentalEndDate;
```
上記のコードは、Calender型で、「レンタル開始日・レンタル終了日」と定義しています。
値オブジェクトで設計すると、コードはこのようになります。

```java:値オブジェクトで設計したレンタル開始日・レンタル終了日
RentalStartDate rentalStartDate;
RentalEndDate rentalEndDate;
```

**レンタル開始日・レンタル終了日を表現する型（クラス）を作りました。**
このように、システム内で登場する値を型（クラス）で表現する設計パターンが値オブジェクトです。


# 値オブジェクトで設計するメリット
値オブジェクトで設計するメリットは大きく3つあります
- **その値に関連するメソッドをクラスに集約しやすい**
- **値の受け渡し間違いを防げる**
- **簡単に導入できてメリットが大きい**

値オブジェクトで設計すると、**値に関連するメソッドを1つのクラスに集約しやすくなります。**
例えば、ECサイトを構築しており、その中で送料という値を値オブジェクトで設計したとします。
```java:Postage.java
/**
 * 送料クラス
 */
public class Postage {

    private int mPostage = 0;

    public Postage(int postage) {
        mPostage = postage;
    }

    public int getValue() {
        return mPostage;
    }

}
```
ECサイトで注文する際には、送料が発生します。
この送料を計算する処理（メソッド）を追加する場合、**送料が表現されたPostageクラスに追加することで送料に関連するメソッド（処理）が集まりやすくなります。**

```java:Postage.java
/**
 * 送料クラス
 */
public class Postage {

    private int mPostage = 0;

    public Postage(int postage) {
        mPstage = postage;
    }

    public int getValue() {
        return mPostage;
    }

    /**
     * 配送先への送料を計算します
     * @param address 配送先
     * @return 送料
     */
    public static Postage calculate(String address){
        // 具体的な処理は省略
        return new Postage(result)
    }

}
```

また、**値を型として表現できるため意図しない値の混入を防ぐ事ができます。**
例として、先ほど追加したcalculateメソッドを見てみましょう。
calculateメソッドの引数である住所は、String型で定義されています。
```java:Postage.java
    /**
     * 配送先への送料を計算します
     * @param address 配送先
     * @return 送料
     */
    public static Postage calculate(String address){
        // 具体的な処理は省略
        return new Postage(result)
    }
```
このメソッドが想定している住所の値は、「東京都足立区～」のような文字データを想定しています。
しかし、String型で定義されているため、住所とは関係ない文字列も渡せてしまいます。
そこで、住所という値を値オブジェクトで設計したコードに修正します。

```java:Postage.java
    /**
     * 配送先への送料を計算します
     * @param address 配送先
     * @return 送料
     */
    public static Postage calculate(Address address){
        // Addressクラスのコードは省略
        // 具体的な処理は省略
        return new Postage(result)
    }
```
String型だった住所をAddress型（クラス）として定義することで、住所に関連するデータのみ渡せるように制限しました。
これにより、誤ったデータを渡してしまうリスクを防ぐことができます。
更に、calculateメソッド側での引数チェックは楽になり、シンプルなメソッドにすることができます。

値オブジェクトの魅力は、**簡単に導入でき、メリットが大きい点です。**
サンプルコードからもわかるように、値をクラスとして表現するだけなので簡単に導入できます。
更に、上記のメリットはコードの保守性・可読性の点において恩恵がとても大きいです。

# システム内で重要な意味を持つ値に絞って適用する
**システム内で使われるすべての値を、値オブジェクトで設計する必要はありません。**
過度にやりすぎると、コードが複雑になる可能性があるためです。

以下のような項目は必ずしも最適ではありません。
* **単純な文字列や数字で、特別な制約やルールがない項目**
例：メモ欄、説明文、タグ
* **システム内部でのみ使用される技術的な値**
例：内部ID、フラグ、ステータスコード

**重要な値に絞って値オブジェクトを適用しましょう。**

# さいごに
値オブジェクトについて簡単に解説してみました。
実は、より値オブジェクトを安全に設計するためにはもう一つ重要なテクニックがあります。
ここで書くと長くなってしまうため、こちらの記事で解説しています。

https://qiita.com/yoron0122/items/6664f95e1579aa7df74c


ここまで読んでいただきありがとうございました！
React.FC 議論について, TypeScript5.1以降

# React.FCとは
- React.FCは、ReactのTypeScriptの型定義の一つ

# 何が議論されたか
- React17以前では、使う予定が無くても、childrenが自動的に含まれてしまっていた
- 型引数が厳密なので引数の指定が大変で、参照もしづらい

# 結論
- React18, TypeScript5.1以降から問題なくなった
  - childrenが自動的に含まれなくなった
  - undefined, string, numberをreturnしても壊れなくなった

# まとめ
- 正式には問題ないとされています
- しかし、プロジェクト毎に思想が有りますので、検討後はそちらに従うのが良いと思います
- TypeScriptスペシャリストのマット・ポコックさんは「以前は非推奨だったが、今は使用するには問題ない。しかし、積極的に(React.FCへの)移行は必要ない」とコメントしています。 [Should you use it?](https://www.totaltypescript.com/you-can-stop-hating-react-fc#should-you-use-it)


# 参考サイト
- [Since TypeScript 5.1, React.FC is now "fine"](https://www.totaltypescript.com/you-can-stop-hating-react-fc)
- [React.FCを使うよ、理に適っているからね](https://blog.stin.ink/articles/i-do-use-react-fc-type)
DELLのファンクションキー固定の切替方法

ファンクションキーを押しながら `F5` キーを押してリロードを行っていたが、
毎回ファンクションキーを押すのが面倒でした。

### ファンクションキー固定の切替方法

下記のボタンを同時に押す

`fn` + `esc`

これでファンクションキーの固定を切り替えられる。

よく見るとエスケープキー `esc` に「Fn」と書かれた鍵マークがありました💦

些細なことですが、これで作業効率が上がるといいですね。
3種類のgit reset（soft, mixed, hard）

# はじめに
`git reset`には3のオプションがあり、どれを使用するかは状況や目的により大きく異なります。この記事では、状況に応じてどのオプションを選択すべきかを解説します。

# git reset とは
変更をある地点まで戻すコマンドです。「ある地点」とはコミット地点のことであり、コミットのHASH値を指定することで、任意の場所まで戻すことができます。

```
$ git reset [オプション] 戻したい地点のコミット番号
```

無くしたコミットの差分がどうなるかはオプションで指定することができます。

| オプション | 差分の削除有無 | 差分の状態 |
|:-:|:-:|:-:|
|--soft|残る|ステージング状態になる|
|--mixed|残る|ステージング状態にならない|
|--hard|削除される:scream:|-|


# 3種類のオプションと使いどころ
ということで、三種類のオプションをどんな状況で使うべきか見ていきましょう。

## 1. --soft
`--soft`を指定すると、無くしたコミットに含まれていた修正は全て保持されます。また、その修正はステージングに保持された状態になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430841/4f5156f9-3aa6-a84b-8329-5a82aa469534.png)

### 使いどころ
* 直前のコミットメッセージを変更したい！
  * `$ git reset --soft HEAD^`
    * HEAD^を指定することで、HEADのコミットをなかったことにする
    * HEADで行った修正はステージングに残る（git add された状態）

* 直前にした二つのコミットを一つにまとめたい！
  * `git reset --soft HEAD^^`
    * HEAD^^を指定することで、HEAD^とHEAD^^のコミットをなかったことにする
    * HEAD^とHEAD^^で行った修正はステージングに残る（git add された状態）

## 2. `--mixed`
`--mixed`を指定すると、無くしたコミットに含まれていた修正は全て保持されますが、`--soft`と違いその修正はステージング状態にはなりません。
ちなみに、`git reset`のデフォルト値は`--mixed`です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430841/f40269cb-714a-eb25-53bd-7ddaf1c39f76.png)



### 使いどころ
* コミットする気のないファイルをAddしてしまったので、git addをなかったことにしたい！
  * `$ git reset --mixed HEAD`
    * HEADを指定することで、HEADのコミット以後に行われた修正（＝まだコミットされてない修正）のステージング状態を解除する（＝git add されていない状態にする）


## 3. `--hard`
`--hard`を指定すると、無くしたコミットに含まれていた修正は全て削除されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430841/7128b2ca-e61a-8c8f-ab8f-0bcdc62e03d6.png)


### 使いどころ
* 修正が不要になったので、削除して元の状態に戻したい！
  * `$ git reset --hard HEAD`
    * HEADを指定することで、HEADのコミット以後に行われた修正（＝まだコミットされてない修正）を削除する


* コミット済みの修正を削除して元の状態に戻したい！
  * `$ git reset --hard HEAD^^`
    * HEAD^^を指定することで、HEAD^とHEAD^^のコミットをなかったことにする
    * HEAD^とHEAD^^で行った修正は完全に削除される


# おわりに
git resetは便利ですが、オプションを間違えると修正がなくなってしまう危険もあります。意味を理解して使うようにしましょう！
ここまでご覧いただきありがとうございました！


# 参考
https://qiita.com/shuntaro_tamura/items/db1aef9cf9d78db50ffe
https://www.r-staffing.co.jp/engineer/entry/20191129_1
名前空間（namespace）とuseの違いを、例えを用いて初心者にも分かりやすく

名前空間（namespace）とuseの違いを、図書館と本の例えを使って説明します。

### 名前空間（namespace）は図書館のセクション
想像してみてください。大きな図書館があって、その中にはたくさんのセクションがあります。それぞれのセクションには異なる種類の本が並んでいます。

* 名前空間はそのセクションの名前:
たとえば、図書館に「科学」セクションと「歴史」セクションがあるとします。これらのセクション名は、名前空間に相当します。科学の本は科学セクション、歴史の本は歴史セクションにあります。
* 目的:
「同じタイトルだけど内容が異なる本」（たとえば「地球の成り立ち」というタイトルの科学用の本と歴史用の本）が名前の衝突をしないようにするためです。それぞれの本はセクション名（名前空間）を持つことで、それがどの領域に属しているのかを明確に区別できます。

PHPでの例
~~~PHP

namespace Science;

class Earth {
    // 科学セクションに関連したクラス
}

namespace History;

class Earth {
    // 歴史セクションに関連したクラス
}
~~~

### useは図書館の本を借りる
今度は、あなたが特定のセクションの本を借りて、自分の机に持っていくことを考えてみましょう。

* useは本を借りる行為:
あなたが科学セクションから「地球」という本を持ってくると、その本を自分の座る場所で簡単に参照できます。これがuseの役割です。同じ名前の別の本と混同することなく、特定のセクションから特定の本を借りてこれます。
* 目的:
各セクションに行く手間を省くために、どの本棚（名前空間）からどの本（クラス）を使うのか、あらかじめ宣言して簡単に使えるようにするものです。

PHPでの例
~~~PHP

use Science\Earth as ScienceEarth;
use History\Earth as HistoryEarth;

$earthScience = new ScienceEarth();
$earthHistory = new HistoryEarth();
~~~
この例では、useを使って、異なる名前空間にある同じ名前のクラスを区別することができます。それぞれの名前空間からクラスを机の上に置いて、簡単に使うことができるようになっています。

### まとめ
* ***名前空間（namespace）は、図書館のセクションのように、同じ名前でも違う内容を整理するためのものです。***
* ***useは、図書館の特定のセクションから本を借りて、いつでも簡単にアクセスできるようにする方法です。***

このように名前空間とuseを図書館のセクションと本の借り方に例えると、どのようにコードを整理し、どのようにそのコードを使いやすくするかイメージしやすくなります。
Ruby3.3.0のインストールのトラブルシュート

## 環境
Ubuntu20.4
Ruby3.3.0

## 内容
rbenvを使って、Ruby3.3.0をインストールすると、エラーが出てきたので、そのトラブルシュートです。

```err.sh
$rbenv install -v 3.3.0
*** Following extensions are not compiled:
fiddle:
        Could not be configured. It will not be installed.
        /tmp/ruby-build.20240704151132.2566.Axj65T/ruby-3.3.0/ext/fiddle/extconf.rb:78: missing libffi. Please install libffi or use --with-libffi-source-dir with libffi source location.
        Check ext/fiddle/mkmf.log for more details.
psych:
        Could not be configured. It will not be installed.
        Check ext/psych/mkmf.log for more details.
*** Fix the problems, then remove these directories and try again if you want.
make[1]: *** [exts.mk:2422: note] Error 1
make[1]: Leaving directory '/tmp/ruby-build.20240704151132.2566.Axj65T/ruby-3.3.0'
make: *** [uncommon.mk:398: build-ext] Error 2
external command failed with status 2

BUILD FAILED (Ubuntu 20.04 on x86_64 using ruby-build 20240702-2-g490428a)

You can inspect the build directory at /tmp/ruby-build.20240704151132.2566.Axj65T
```

どうも、**fiddle**と**psych**という２つのライブラリがインストールされていないことが原因のようです。

fiddleに関しては、エラーメッセージにあるように、**libffi**というライブラリをインストールすれば解決するようですが、psychに関しては、エラーメッセージに具体的にどうすればいいかといった説明が記載されていません。ググってみるとpsychに関しては、**libyaml**というライブラリが必要なようです。では、そのように記載してくれればいいものを・・・

fiddleをインストールします。

```
$sudo apt-get install libffi-dev
```

psychをインストールします。

```
$sudo apt-get install libyaml-dev
```

この後、再度、Rubyをインストールすれば、最後に次のメッセージが表示され、正常にインストールが完了しました。

```ok.sh
==> Installed ruby-3.3.0 to /home/vagrant/.rbenv/versions/3.3.0
```

参考リンクにもある通り、Ruby3.2.0以降では、libffi、libyamlといった、サードパーティ製のライブラリの同梱が廃止されたようです。
ぐぐっていると、同じようなエラーでトラブっている人は割と多くいるようです。

## 参考

https://zenn.dev/fuuukeee3/articles/22caeb537cf1a6