OmniAICreator/Qiita-1.07M huggingface dataset:
【Homebrew】caskを検索する方法

## インストール可能なcaskを検索

インストール可能なcaskを検索するには以下のコマンドを使用します。

```terminal
brew search --casks cask名
```

```terminal
$ brew search --casks ''
==> Casks
0-ad                                                            font-times-newer-roman
010-editor                                                      font-timmana
115                                                             font-tinos
115browser                                                      font-tinos-nerd-font
1clipboard                                                      font-tiny5
```

## 説明付きで検索

説明付きで検索するには以下のコマンドを使用します。

```terminal
brew search --casks --desc cask名
```

```terminal
$ brew search --casks --desc ''
==> Casks
0-ad: (0 A.D.) Real-time strategy game
010-editor: (010 Editor) Text editor
115: (115, 115桌面版) Client for the 115 cloud storage service
115browser: (115Browser, 115浏览器) Web browser
1clipboard: (1Clipboard) Clipboard managing app
1kc-razer: (Razer macOS) Open source colour effects manager for Razer devices
1password: (1Password) Password manager that keeps all passwords secure behind one password
1password-cli: (1Password CLI) Command-line interface for 1Password
1password-cli@1: (1Password CLI) Command-line helper for the 1Password password manager
```
【AWS】エラー「RDS does not support creating a DB instance with the following combination...」の原因

# 概要
AWS CDK Deployを実施したら以下のエラーに。

> Resource handler returned message: "RDS does not support creating a DB instance with the following combination: DBInstanceClass=db.t2.micro, Engine=mysql, EngineVersion=8.0.39, LicenseModel=general-public-license. For supported combinations of instance class and database engine version, see the documentation.

# 原因と解決方法

上記エラーはMySQL バージョン8.0.39とdb.t2.microインスタンスクラスで互換性がないよ、という内容のエラーです。

このエラーの前にバージョン8.0.23で実施したら「`Cannot find version 8.0.23 for mysql`」というエラーが出たので、バージョンを最新の`8.0.39`にして実行してみたら今度は上記の互換性のエラーに。

最新にしたのにおかしいなぁ...と思っていたら、原因はインスタンスクラスの方でした。
そういえば`db.t2.micro`は2024年末で廃止になったのでした...

https://repost.aws/ja/articles/AR_Rw2Xbe5Q9O1ZPKbU5S4Mg/amazon-rds-for-sql-server-is-ending-support-for-m4-r4-and-t2-database-instances-on-march-29-2024

https://dev.classmethod.jp/articles/rds-mysql-psql-m4-r4-t2-end/

もちろん、現時点でAWS管理コンソール画面からもT2系を新規で作成することはできません。

ということで、T3系にしたらエラーが出なくなり、解決しました。

（pythonで書くCDKだと以下）

```py
            instance_type=ec2.InstanceType.of(
                ec2.InstanceClass.BURSTABLE3, ec2.InstanceSize.MICRO
            ),
```
VMを作り直したらなんかつながらなくなったとき

# VM作り直したらなんかつながらなくなったとき

設定同じだから大丈夫やろ、と思ったらつながらなくなったとき確認すること。

```
[22:43:25.767] Terminal shell path: C:\WINDOWS\System32\cmd.exe
[22:43:26.169] > @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
> @    WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!     @
> @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@
> IT IS POSSIBLE THAT SOMEONE IS DOING SOMETHING NASTY!
> Someone could be eavesdropping on you right now (man-in-the-middle attack)!
> It is also possible that a host key has just been changed.
> The fingerprint for the ED25519 key sent by the remote host is
> SHA256:().
> Please contact your system administrator.
> Add correct host key in C:\\Users\\user/.ssh/known_hosts to get rid of this message.
> Offending ECDSA key in C:\\Users\\user/.ssh/known_hosts:12
> Host key for [127.0.0.1]:22 has changed and you have requested strict checking.
> Host key verification failed.
> プロセスが、存在しないパイプに書き込もうとしました。
[22:43:26.170] Got some output, clearing connection timeout
[22:43:27.507] "install" terminal command done
[22:43:27.508] Install terminal quit with output: プロセスが、存在しないパイプに書き込もうとしました。
[22:43:27.508] Received install output: プロセスが、存在しないパイプに書き込もうとしました。
[22:43:27.508] WARN: $PLATFORM is undefined in installation script output.  Errors may be dropped.
[22:43:27.509] Failed to parse remote port from server output
[22:43:27.509] Exec server for ssh-remote+() failed: Error
[22:43:27.510] Error opening exec server for ssh-remote+(): Error
[22:43:27.510] No hints found in the recent session.
[22:43:50.090] ConfigFileWatcher: start watching file:///c:\/Users/user/.ssh/config
[22:43:50.090] ConfigFileWatcher: adding save listener
[22:43:50.091] ConfigFileWatcher: adding close listener
```

ログが一瞬で流れてしまうのでわかりにくいけれど、ログに出ている通り「リモート側とローカル側でフィンガープリントが違うよ」ということなので「C:\\Users\\(user)/.ssh/known_hosts からフィンガープリントを削除」すればよい。
tailwindcssコマンドが使えない時の対処法

## 事象

- 最新のTailwind CSSをインストールしたが、コマンドが存在しないと言われる

```bash
% npm install -D tailwindcss

up to date, audited 1352 packages in 1s

269 packages are looking for funding
  run `npm fund` for details

8 vulnerabilities (2 moderate, 6 high)

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
% npx tailwindcss init -p   
sh: tailwind: command not found
```

# 原因

`Tailwind CSS バージョン 4 以降` では、npx tailwindcss init -p コマンドが使用できないため

https://tailwindcss.com/docs/installation/using-vite

:::note warn
※ viteを使用するインストールに変わったらしい
:::

# 解決策

1. Tailwind CSSのバージョンを落とす（Tailwind CSS バージョン 3を使用する）
2. 以下の手順でTailwind CSS バージョン 4を使用する

## **1. Tailwind CSS のインストール**

プロジェクトのディレクトリで、以下のコマンドを実行して Tailwind CSS と Vite 用のプラグインをインストールします。

```sh
npm install tailwindcss @tailwindcss/vite
```

## **2. Vite の設定ファイルにプラグインを追加**

`vite.config.js` または `vite.config.ts` ファイルに Tailwind CSS のプラグインを追加します。

```ts:vite.config.ts
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import tailwindcss from '@tailwindcss/vite';

export default defineConfig({
  plugins: [react(), tailwindcss()],
});
```

## **3. CSS ファイルに Tailwind CSS をインポート**

Tailwind CSS を使用するために、CSS ファイル内で Tailwind CSS をインポートします。

**例: `src/index.css`**

```css
@import 'tailwindcss';
```

## **4. React コンポーネントでの使用例**

Tailwind CSS をインポートした後、React コンポーネント内でクラス名を使用してスタイルを適用できます。

**例: `src/App.jsx`**

```jsx
import './index.css';

function App() {
  return (
    <div className="text-center">
      <h1 className="text-3xl font-bold">Hello, Tailwind CSS!</h1>
    </div>
  );
}

export default App;
```


これで、Tailwind CSS を使用したスタイリングが可能となります。
git rebaseでコミット履歴を自由自在に編集しよう🎉 

## 🎉 Git初心者でも安心！git rebase -iでコミット履歴を自由自在に編集しよう！

こんにちは、Git好きのみなさん！
今回はGitの超便利コマンド git rebase -i（インタラクティブリベース）を楽しく学んでいきますよー！

「昔のコミットの内容を修正したい！」とか、「コミットを整理して綺麗にしたい！」と思ったことはありませんか？
そんなときに大活躍するのがこの git rebase -i なんです✨

この記事では、メリットやデメリットも紹介していきます!
それでは一緒にやってみましょう♪

## 🌟 git rebase -i のメリット・デメリット

メリット
	•	✅ コミット履歴をキレイに整えられる！
不要なコミットや間違えたコミットを修正・削除できるので、履歴がスッキリ！
	•	✅ コードレビューがしやすくなる！
履歴が整理されていると、他の人も変更内容を理解しやすいです。
	•	✅ コミットをまとめてわかりやすく整理できる！
小さい変更を一つにまとめたり、コミットを分割することができます。

デメリット
	•	⚠️ 履歴が書き換わるため、チームとの共有ブランチでは使いづらい
リモートにすでにプッシュした履歴を書き換えると、他のメンバーに影響が出る可能性があります。
	•	⚠️ 操作を間違えるとコミットを失うリスクがある
ただし、git rebase --abort で元の状態に戻せますので安心してくださいね！

以上を踏まえた上で、実際に使ってみましょう🎈

## 📌 サンプルのコミット履歴を用意しました

まずは、こんなコミット履歴があるとします。

```
$ git log --oneline

5ce576e 5
30ff21a 4
95eaecd 3
adb04d8 2
29102b1 1
```

### 💡 rebase -i の基本の使い方

例えば、3つ前のコミット（95eaecd 3）を修正したい場合は、

```
$ git rebase -i adb04d8
```

または、もっと簡単にコミット数を指定して、

```
$ git rebase -i HEAD~3
```

これでエディタが立ち上がり、こんな感じの画面が表示されます👇
```
pick 95eaecd 3
pick 30ff21a 4
pick 5ce576e 5
```
```
# Commands:
#  p, pick   = コミットをそのまま使う
#  r, reword = コミットメッセージのみ変更
#  e, edit   = コミット内容を修正
#  s, squash = 前のコミットとまとめてメッセージを変更
#  f, fixup  = 前のコミットとまとめてメッセージをそのまま使用
#  x, exec   = shellコマンドを実行
```
この中のpickという部分を他のコマンドに書き換えることで、コミットを編集できます✨

### 🚀 reword でコミットメッセージを変更する

コミットメッセージだけを変更したいときは reword が便利！
```
reword 95eaecd 3
pick 30ff21a 4
pick 5ce576e 5
```
保存すると再びエディタが開き、メッセージを変更できます。
例えば「3」を「3A」に変更して保存すると完了！

🛠 edit でコミットの中身を修正する

コミットの中身を変更したい場合は edit を使います。
```
edit 95eaecd 3
pick 30ff21a 4
pick 5ce576e 5
```
保存すると修正したいコミット直後の状態に戻ります。
修正後に以下のように操作します。
```
# コミットを修正する場合
$ git add .
$ git commit --amend
```
```
# コミットを細かく分割するなど、大きく変更する場合
$ git reset HEAD^
$ git add .
$ git commit --amend
```

修正が完了したら以下で rebase を再開！
```
$ git rebase --continue
```

もし途中でやめたくなったら👇で中止できますよ。
```
$ git rebase --abort
```

### 🥞 squash で複数のコミットを1つにまとめる

コミットを1つにまとめたいときは squash の出番です！
```
pick 95eaecd 3
squash 30ff21a 4
pick 5ce576e 5
```

保存すると再びエディタが立ち上がるので、新しいコミットメッセージを入力して保存するとまとめられます！

### 🧹 fixup でコミットをまとめてメッセージを維持

コミットをまとめてメッセージもそのまま使いたい場合は fixup が便利です。
```
pick 95eaecd 3
fixup 30ff21a 4
pick 5ce576e 5
```

これでコミット4はコミット3に吸収され、メッセージは3のまま残ります！

### 🔄 コミットの順番を入れ替える

コミットの順番を入れ替えたい場合は、並べ替えるだけでOK！
```
pick 30ff21a 4
pick 95eaecd 3
pick 5ce576e 5
```

簡単でわかりやすいですね😆

### ❌ コミットを削除する

コミットを削除したい場合は、単純に該当のコミットを削除します。
```
pick 95eaecd 3
- pick 30ff21a 4  # 削除したい行
pick 5ce576e 5
```
保存するとコミット4は削除されます！

## 📝 まとめ

git rebase -i をマスターすると、コミット履歴がキレイに整理でき、プロジェクトのメンバーにも見やすい履歴を作れますね✨

ぜひいろんなプロジェクトで活用してみてくださいね〜🌈

## 最後に

この記事が役に立ったら、ぜひ「LGTM」してくれると嬉しいです！ 💖
では、また次回の記事でお会いしましょう👋
AWSが展開するIoTカテゴリのサービスの一覧

## はじめに
AWSが展開するIoTカテゴリのサービスの一覧についてまとめてみました。

## IoTカテゴリ
　AWSクラウドでIoT基盤を構築する際に利用可能なサービス群。IoTは、様々な産業で普及しており、今後も拡大が期待される技術領域なので、提供されるサービスをしっかり押さえておきたい。

## AWS IoT Analytics
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/f3562924-4912-4198-bfdb-f8732d7b2d71.png)
IoTデバイスから送信されたデータを収集、処理、保存、解析、可視化するサービス。

## AWS IoT Core
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/7407297b-9e65-44e7-aa13-d27b814235a5.png)
AWSクラウドへのセキュア接続や認証、リクエストの受付やメッセージのルーティングを行う、数十万規模のデバイスのデータ収集・リモート制御を目的としたサービス。

## AWS IoT Device Defender
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/467b99b2-3c81-4d00-95f8-9f25946b5bcf.png)
デバイスの監査、アノマリー検出・アラート通知などを行うサービス。

## AWS IoT Device Management
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/44a6c5f2-2e54-4ddd-bfc9-3c25f8ff2b32.png)
（大量の）デバイスの導入、整理、監視、リモート管理、ファームアップデート、パッチ管理を行うサービス。

## AWS IoT Events
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/c1a356f2-1224-40ef-aeee-ef2cd4520c5b.png)
デバイスから収集されたデータを継続的に監視し、定義したDetector Modelに従ってイベントを検出、アクションを実行するサービス。

## AWS IoT ExpressLink

AWSに接続可能なサードパーティ製デバイスおよびそのソフトウェア・モジュール。

## AWS IoT FleetWise
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/d012f1de-7d37-4c18-8263-71f70d24b6ae.png)
車両データをリアルタイムに収集し、AWSへ転送するサービス。

## AWS IoT Greengrass
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/a44967fb-c960-4bcb-bf29-7de220c332c9.png)
エッジコンピューティング環境を実現するためにデバイスにインストールするソフトウェアおよびサーバのサービス。

## AWS IoT RoboRunner
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/1874f85e-cb5b-4879-9a2c-410a59ba13fb.png)
ロボットを一元的に管理、コントロール、動作制御、シミュレーションするためのサービス。

## AWS IoT SiteWise
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/6e253551-092d-426f-b70a-436ea8cca478.png)
Snowball Edgeなどのゲートウェイデバイスで動作するAWSクラウドへデータをセキュアに送信するソフトウェアパッケージ。

## AWS IoT Things Graph
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/8b7af97e-8f2b-45bc-81d6-34c27f62cbec.png)
Greengrassに対応したエッジデバイスで実行するアプリケーションを、モデルを用いて視覚的に設計するUIツール。

## AWS IoT TwinMaker
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/b9e1e8d2-8414-4cb8-a014-00910d8d09f5.png)
デジタルツインを迅速に構築、監視最適化するサービス。

## AWS IoT 1-Click
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/98183d4c-4e9d-41e1-b43c-a3850c0340f4.png)
AWS IoTエンタープライズボタン、SORACOM LTE-Mボタンといった専用のデバイスからLambdaFunctionを実行するためのサービス。

## FreeRTOS
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/387980/b556cae8-40fd-4eb0-9028-b799320370fa.png)
マイクロコントローラ向けのオープンソースのIoTオペレーティングシステム。




## おわりに
ここまで読んでいただきありがとうございます！

## 参考文献
・AWSの基本・仕組み・重要用語が全部わかる教科書 (見るだけ図解) 単行本（ソフトカバー） – 2022/8/23
川畑光平 (著), 菊地貴彰 (著), 真中俊輝 (著)
p.59-60
手元でLLMを動かすロマン～AndroidスマホにOllamaを入れる～

## 背景
「手元の端末上で対話可能なAIを動かす」というロマンを実現すべく、普段利用しているAndroid端末にOllama(※)を導入し、生成AIを動かしてみました。意外と簡単に行えたため、方法を共有します。
 ※Ollamaはローカル環境でLLMを動作させるPC向けアプリケーション。コマンド一つでLLMを取得できたり、外部アクセス用のAPIが用意されていたりと使い勝手が良い。
 ※2025/4/30 記述ミスを修正

## 概要
- OllamaにはLinux向けバージョンが存在する
- Androidには仮想的なLinux環境を提供する「UseRAnd」というアプリケーションが存在する
- 「UseRAnd」上に「Ollama」をインストールしてみたところ、特に問題なく動作した

## 手順
### Ollamaのインストール
1. PlayStore等から「UseRAnd」をインストールする
2. 「UseRAnd」を起動する
3. 「Distribution」欄に表示されるOSの中から[Ubuntu]を選択する
※他のOSを利用する場合は適宜操作を読み替えること
4. 「desktop environment」を訊かれたら「Minimal」を選択する
4. 「connection type」を訊かれたら「Terminal」を選択する
6. ターミナルに入ったらソフトウェアをアップデートする
$ sudo apt update && sudo apt -y upgrade
7. 必要なアプリをインストールする
$ sudo apt install tmux
8. Ollamaのインストール用ファイルをダウンロードする
$ wget https://ollama.com/install.sh
9. ダウンロードしたファイルを解凍する
$ tar xf ollama.tgz
10. 解凍したインストーラを実行する
$ sh install.sh
11. Ollamaがインストールできたことを確認する
$ command -v ollama
→「/usr/local/bin/ollma」など、ollamaの実行コマンドの保存先が表示されたらOK

### Ollamaを使ってみる
12. Ollamaサービスを動作させるための仮想ターミナルを開く
$ tmux
13. Ollamaサービスを起動する
$ /usr/local/bin/ollama serve
14. 仮想ターミナルから抜ける(Ctrl+b→d)
15. LLMをダウンロードする(例：gemma3:1b)※
$ ollama pull gemma3:1b
→しばらく待って「success」と表示されたら成功
16. LLMを起動する
$ ollama run gemma3:1b
→対話型コンソールに入る
17. 任意の文章を入力して[改行]する
→LLMの回答が生成される

※Ollamaでは[公式のライブラリ](https://ollama.com/library)に保存されたLLMを「ollama pull」コマンド一発で追加できます。（記述は省きますがライブラリにないLLMを追加することも可能です）

![Ollama_Gemma3_UserLAnd.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3638065/8aa3a367-5e2b-4fed-986d-76b06cb04907.png)

## 雑記
昨年リリースされたGemma2の際にも驚かされましたが、先日発表されたGemma3もなかなか高性能で驚きました。特にこのサイズ感でマルチモーダルモデルというのは色々と遊べそうですね。

## 参考
https://gihyo.jp/admin/serial/01/ubuntu-recipe/0825
ターミナルの入力履歴を爆速で調べる方法

# はじめに
今までターミナルで過去のコマンドを探す時`↑`を連打したり`history` を使っていましたが、今日エンジニアの友人から素敵なツールを教えてもらいました

# peco
pecoを使うと過去に入力したコマンドを簡単に探すことができます
例えば「dockerのHello world的なコマンドってなんだったっけ？dockerまでは覚えてるんだけど...」というとき。

ターミナルを開いた状態でショートカットキー`CTRL + R`を入力すると過去の入力履歴を見ることができます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3559534/7fe75121-919a-43c3-8391-91ad6e795b17.png)

そして `QUERY >` の部分に検索したいコマンド `docker` を入力すると
![image.png](https://static.kirara-code.net/images/image_d85a66d5-c820-4590-a525-734ba7ed3fb5.png)

見つかりました！
`docker run --rm hello-world`でしたね

# インストールと設定
Homebrewで一発でインストールできます
```
brew install peco
```
そして設定ファイルにショートカットキーや諸々を記述するだけ
（以下はzshを使っている私が`CTRL + R`で検索できるように設定したものです）

```shell:~/.zshrc
function peco-select-history() {
    BUFFER=$(\history -n -r 1 | distinct | peco --query "$LBUFFER")
    CURSOR=$#BUFFER
    zle reset-prompt
}
zle -N peco-select-history
bindkey '^r' peco-select-history
```

これでpecoで`CTRL + R`で検索機能を使えるようになりました！

# 終わりに
pecoって名前かわいい(・∀・)!!!!!!

今度会社の人に「pecoって知ってる？」って言ってみよう。かわいいから。

# 参考
- https://github.com/peco/peco
- https://qiita.com/takashiuesaka/items/6bf07eac2fc20cf5e90d
SpringSecurityのlogin画面とかを無効化するコードスニペット

# SpringSecurityの認証を無効化
以下をファイルとして保存するとSpringSecurityの基本認証を無効化することができる。
あとは適当にimportして完成
```kotlin
@Configuration  
@EnableWebSecurity  
class SecurityConfig {  
    @Bean  
    fun securityFilterChain(http: HttpSecurity): SecurityFilterChain {  
        http  
            .authorizeHttpRequests { authorize ->  
                authorize.anyRequest().permitAll() // すべてのリクエストを許可  
            }  
            .formLogin { form ->  
                form.disable() // フォームログインを無効化  
            }  
            .httpBasic { basic ->  
                basic.disable() // HTTP Basic認証を無効化  
            }  
            .csrf { csrf ->  
                csrf.disable() // CSRF保護を無効化  
            }  
            .cors { cors ->  
                cors.disable() // CORS設定を無効化  
            }  
  
        return http.build()  
    }  
}
```
pythonのset型ってなんだ？

## はじめに
現在、コーディング力を向上させるために[paiza](https://paiza.jp/challenges/info)のスキルチェック問題に取り組んでいます。その中で出てきたset型について取り上げてみたいと思います。
公式ドキュメントに書かれた定義を理解してコーディングをできるようになることが目下の目標です。自分なりに公式ドキュメントから読み取った内容を整理してみたいと思います。
python公式ドキュメントのset型の説明は[こちら](https://docs.python.org/ja/3/library/stdtypes.html#set)になります。

## set型の特徴
集合型と呼ばれるもので、"set"と"frozenset"の二種類がある様です。後者は今のところ使う機会がないので、こんな人いたかも？程度に覚えておきます。
似たようなジャンルにdict(辞書型)、list(リスト型)などがあります。
set型の特徴は、listと比べて
・挿入の順序や要素の位置は記録保持しない
・重複を許容しない
といった点があげられます。
listを使っている際に重複を削除して計算したい時などに便利だと思います。

## set型の操作方法
とりあえずおさえておいた方がよさそうなものを取り上げます。
`my_set = {1, 2, 3}`とした場合、
### 1. len
集合の要素数を計算します。
```py
print(len(my_set))
# 3
```
### 2. add
要素をsetに追加する。（要素は重複しない）
※set型はappendではなくaddなのですね。
```py
my_set.add(4)
print(my_set)
# {1, 2, 3, 4}

my_set.add(3)
print(my_set)
# {1, 2, 3, 4}
```

### 3. remove
要素をsetから取り除く。
setに要素が含まれていない場合はKeyErrorになる。
```py
my_set.remove(3)
print(my_set)
# {1, 2}

my_set.remove(5)
print(my_set)
# KeyError: 5
```
### 4. discard
要素がsetに含まれていれば取り除く。含まれていなければなにもおこらない。
```py
my_set.discard(3)
print(my_set)
# {1, 2}

my_set.discard(5)
print(my_set)
# {1, 2}
```

### 5. clear
setの全ての要素を取り除く。
```p
my_set.clear()
print(my_set)
# set()
```

## まとめ
今回の記事を足掛かりに、まずは基礎的な部分から公式ドキュメントを確認する習慣を身に着けていきたいと思います。
しかし、この独特な日本語に慣れる日はくるのでしょうか・・・。
これからの時代はモノリシックよりマイクロサービスがアツい！？🔥


最近よく耳にする「マイクロサービスアーキテクチャ」ですが、  
実際どんなメリットがあるの？  
「モノリシックより本当にいいの？」って気になっている方も多いはず。

この記事では、**これからのAI時代に向けてマイクロサービスがどんな風に有利か**をサクッとまとめてみました！  

---

## 📌 前提：モノリシック vs. マイクロサービス
- **モノリシック**  
  1つの大きなアプリケーションに機能がすべて詰まっているイメージ。  
  例）レストランのメニューが1冊にまとまっている感じ。

- **マイクロサービス**  
  機能ごとにアプリを分割して、それぞれ独立して動かすイメージ。  
  例）前菜メニュー、メインメニュー、デザートメニュー…と分かれている感じ。

それぞれにメリット・デメリットがあるけど、最近はマイクロサービスに注目が集まっています。

---

## 🚀 マイクロサービスアーキテクチャの魅力
1. **新しい技術をサクッと導入できる**  
   サービスが独立しているから、一部だけを新技術に切り替えるのもラク。  
   「こっちのAIライブラリを使いたい」「あっちのフレームワーク試したい」  
   …なんてときに、全体を巻き込まなくて済むのはかなり大きい！

2. **スケーラビリティが高い**  
   重たい処理をするサービスだけガッツリ拡張すればOK。  
   例えば「画像解析部分だけめちゃくちゃサーバー増やす」みたいなことが可能。  
   モノリシックだとアプリ全体をスケールしなきゃいけないから非効率になりがち。

3. **障害の影響を最小化できる**  
   もし一つのサービスがダウンしても、ほかのサービスは平常運転できる。  
   全部ひとつにまとまってると、一箇所の不具合がアプリ全体を止める可能性が高い…！

---

## ⚠️ ちょっと気をつけたいポイント
1. **運用が複雑になる**  
   サービスの数が増えるほど、モニタリングやログ管理が大変に…。  
   ちゃんと監視・管理する仕組み（Prometheus, Grafana, ELKなど）を整える必要あり。

2. **サービス間の通信コスト**  
   ネットワーク越しにやりとりするので、呼び出し回数が多いと遅延やエラーのリスクUP。  
   「APIゲートウェイ」や「サービスメッシュ」など、通信を最適化する技術も検討しましょう。

3. **データの整合性**  
   分散アーキテクチャでは、トランザクション管理が複雑になりがち。  
   「最終的な整合性」をどう担保するか、ちゃんと設計が必要。

4. **インフラコスト**  
   サービス単位で独立してデプロイすると、どうしてもサーバーやコンテナが増える。  
   結果的にインフラの運用費用も上がりがちなので、要注意。

---

## 💡 結論：本当に「圧倒的に有利」なの？
- **マイクロサービスは確かに柔軟でスケーラブル**  
  → AIや最新技術を積極的に取り入れたいならめちゃくちゃ相性いい。  
- **ただし運用コストや複雑性も高い**  
  → チームのスキルやプロジェクト規模を考えて導入しないと痛い目に…。  

なので、**「これが最強！」というよりは、プロジェクトの特性や組織の状況を踏まえて**  
マイクロサービスを選択すると良いんじゃないかと思います。

---

## 🔖 まとめ
1. **部分的に新技術を導入しやすい**  
2. **特定機能のスケーリングが簡単**  
3. **障害影響が限定的**  
4. **でも運用・通信・コスト面のハードルは上がる**

これからのAI時代、  
「新しい技術をどんどん試したい！」「大規模化にも耐えられるようにしたい！」  
そんなチームやプロジェクトには、マイクロサービスがオススメかなと個人的には思います。
WordPressをXServer VPSに移行した

## 今まで

2012年からエックスサーバーを使用してWordPressサイトを構築していた。

費用も安く、使い方も簡単、性能も高いと、素晴らしいサービスだが、ずっと気になっていたのが多少なりともエックスサーバーに依存している点。

最近XServer VPSをお試しで使ってみたら、必要十分な機能がそろっていて、信じられないくらいコスパが良い。2GBプランなんて、現在（2025年3月）月額830円、キャッシュバックで415円。AWSのIPv4アドレス代より安いくらいだ。

そこで、エックスサーバーからXServer VPSに移転して、WordPress環境を再構築してみた。



## 考え方
私の（偏屈な）考え方としては、

- 可能な限り、何ものにも依存したくない。特定の企業・技術に依存することは可能な限り少なくしたい。となると、基本はLinux/OSS。
- 可搬性を最大限にしたい。AWSから出て行けと言われたら、風呂敷1枚にデータを入れて、明日から別の場所で同じ環境を再現できるようにしたい。

つまり **Minimum dependency, maximum portability** ということ。

それを踏まえてWordPressサイトを構築した。



## 構成
ファイルは[GitHub](https://github.com/archi-Doc/Arc.WordPress)で公開。

誰が考えても同じ結論になると思うが、基本はLinux+Docker Container/Composeで構成している。

クラウド時代の英語みたいなもの。

アーキテクチャ図は以下の通り。
![WordPress.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1378523/ab1bb43e-6380-4211-a180-845df6c83fa1.png)


[sshh](https://github.com/archi-Doc/sshh)というのは、SSHを介してコンテナ環境にアクセスするためのコンテナ。

セキュリティリスクになるため注意が必要だが、簡単にコンテナ内にアクセスして、各種ファイルの編集や、cronによる自動処理（バックアップ等）ができる。

適当なDockerイメージがなかったため自作した（バカ）。

もっとスマートなやり方があったら教えてください。



DBのコンテナは1つ。

マイクロサービスの原則からすると、WordPressコンテナ毎にDBコンテナを作る方が良いらしいが、どのみちDBには個別にアクセスしないといけないのと、メモリー節約（DBコンテナ1つで200MB）のため一つにした。



## 手順

- インスタンスにDockerをインストール。

- ポート80(http), 443(https), 2222(sshh)を通す。

- `.env`ファイルを編集。

- 各種ファイルを`~/wordpress`にコピー。

- ```bash
  docker network create wordpress-network
  docker network create traefik-network
  docker compose up
  ```

- 必要に応じ**sshh**にアクセス（`ssh -i testkey.sk -p 2222 ubuntu@your.address`）し、`backup.sh` `restore.sh` を実行。



## 注意点

### VPSサーバー

メモリーが1GBだと厳しい。2GB以上が必須。

### ドメイン

ドメイン毎にWordPressコンテナやTraefikコンテナを割り当てている（`.env`）。

独自ドメインが必要。

### Htpasswd

[サイト](https://hostingcanada.org/htpasswd-generator/)で生成できるが、下記コードではエラーになるため、

`TRAEFIK_BASIC_AUTH=traefikadmin:$2y$10$HKGpmSJI25/d5QYUGXOOo.VU1q14.D5XHeQT6lQVQycynyPMTyvPq`

以下のように修正する。

`TRAEFIK_BASIC_AUTH=traefikadmin:$$2y$$10$$HKGpmSJI25/d5QYUGXOOo.VU1q14.D5XHeQT6lQVQycynyPMTyvPq`

### wp-config.php

httpsに統一したほうが良い。

sshhでコンテナ環境にアクセスし、

```bash
cd wp_1
sudo chmod 666 wp-config.php
vi wp-config.php
```

`wp-config.php`ファイルを編集。

```php
define( 'WP_HOME', 'http://' . $_SERVER['HTTP_HOST'] . '/' );
define( 'WP_SITEURL', 'http://' . $_SERVER['HTTP_HOST'] . '/' );
```

を

```php
if (empty($_SERVER['HTTPS'])) {
    $_SERVER['HTTPS'] = 'on'; $_ENV['HTTPS'] = 'on';
}
define( 'WP_HOME', 'https://' . $_SERVER['HTTP_HOST'] . '/' );
define( 'WP_SITEURL', 'https://' . $_SERVER['HTTP_HOST'] . '/' );
```

に変更して再起動する。

### wp-content/uploads

Restoreすると、権限が変更されてアップロードできなくなることがあった。

その場合は、以下のコマンドでwp-content/uploadsフォルダーを書き込み可能にする。

```bash
sudo chmod -R a+w  ~/wp_1/wp-content/uploads
```

### 自動処理

sshhのDocker composeで、以下の環境変数を設定できる（先頭の文字が一致すれば、複数設定可能）。

`StartupCommand`：コンテナ起動時に実行するコマンド。

`CronJob`：自動処理（cron）。

### MariaDBのデータベース作成

環境変数 `MARIADB_DATABASE`を設定すれば一発で作成できるが、複数データベースを作成することができない。

`entrypoint`でSQL処理を追加している。

単一のWordPressだけなら、 `MARIADB_DATABASE`を設定して、`entrypoint`を削除すればよい。
【応用情報】ネットワーク7層モデルが覚えられない人へ！わかりやすい覚え方まとめ



応用情報のネットワーク分野で登場する「OSI参照モデル（7層）」、**めっちゃ覚えにくいですよね！？**  
物理層？ネットワーク層？TCPはどこ？ルーターは？と混乱しがち。  
この記事では、**スッと覚えられるコツ**をまとめました！  

## **OSI参照モデル（7層）の基本**
OSIモデルは、ネットワーク通信を **7つの層** に分けて考える仕組みです。  

| 層 | 役割 | 例（プロトコル・機器） |
|----|------|------------------|
| **アプリケーション層** | ユーザーが使うアプリ | HTTP, SMTP, FTP |
| **プレゼンテーション層** | データの変換・暗号化 | JPEG, GIF |
| **セッション層** | 通信の開始・維持 | SSH |
| **トランスポート層** | データの分割・再送制御 | TCP, UDP |
| **ネットワーク層** | ルーティング・IPアドレス | IP, ICMP, ルーター, ARP |
| **データリンク層** | MACアドレス・スイッチング | イーサネット, スイッチングハブ, ブリッジ |
| **物理層** | 電気信号・物理的な接続 | ケーブル, リピータハブ |

---

## **覚え方① 語呂合わせで楽しく覚える！**
7層を覚えるには、語呂合わせが便利です。  

- **英語版**：「Please Do Not Throw Sausage Pizza Away」  
  → **ソーセージピザを捨てないで！**  
- **日本語版**：「物好きなデートはネットでトラブル！センスあるプレゼントでアプローチ」  
  → 恋愛ストーリー（？）で覚える  

---

## **覚え方② 層ごとにざっくりイメージを持つ**
OSI7層を「実生活」にたとえると、こうなります！  

- **アプリケーション層 →「LINEやGmailの画面」**（ユーザーが使う）  
- **ネットワーク層 →「住所を書く」**（IPアドレスで通信経路を決める）  
- **物理層 →「郵便配達」**（実際にデータが運ばれる）  

こう考えると、各層の役割がイメージしやすくなります！  

---

## **物理層（Layer 1）とは？**
ネットワーク通信の **「物理的な部分」** を担当する層。  
ケーブルや電気信号、光信号など、データを実際に運ぶ仕組みがここに含まれます！  

### **代表的な機器：リピータ（Repeater）**
リピータは、ネットワークの信号を **増幅・中継** する装置！  

💡 **こんなときに使う！**  
- ケーブルが長すぎて信号が弱くなるとき  
- 信号をそのまま強くして、遠くに届けたいとき  

📌 **リピータの特徴**  
✅ **OSI参照モデルの物理層（Layer 1）に属する**  
✅ **データの意味は理解せず、単に信号を増幅**  
✅ **LANケーブルを延長するのに使われる**  
✅ **スイッチやルーターよりも単純な役割**  

📊 **リピータ vs スイッチ vs ルーター の違い**  

| 機器 | OSI層 | 役割 |
|----|----|------------------|
| **リピータ** | 物理層 (Layer 1) | 信号をそのまま増幅・再送信 |
| **スイッチ** | データリンク層 (Layer 2) | MACアドレスを見て転送 |
| **ルーター** | ネットワーク層 (Layer 3) | IPアドレスを見て転送 |

### **リピータのイメージ：駅のアナウンス 🎤**
🚉「この電車は○○行きです！」とアナウンスすると、遠くの人には聞こえにくくなりますよね？  
🔊 リピータは「マイクでアナウンスを大きくする」役割！  
つまり、**データの内容を理解せず、ただ増幅しているだけ** ってことです！  

---

## **覚え方③ 「何層の話？」と考えるクセをつける**
試験で問われやすいのは、  
**「○○は何層？」** という問題。  

例えば、  
- **「HTTPは何層？」** → **アプリケーション層**（人が使う）  
- **「ルーターは何層？」** → **ネットワーク層**（IPアドレスでルーティング）  
- **「スイッチは何層？」** → **データリンク層**（MACアドレスで制御）  
- **「リピータは何層？」** → **物理層**（信号を増幅）  

これを意識すると、どの層に何があるのか、スムーズに整理できます！  

---

## **まとめ**
OSI7層は覚えにくいけど、  
✅ **語呂合わせで楽しく覚える**  
✅ **ざっくりイメージを持つ**  
✅ **何層の話か意識する**  
この3つを意識すれば、スッと頭に入ります！  

ネットワーク問題で詰まりがちな人は、ぜひ試してみてくださいね！  

※この記事はChatGPTを活用して作成しました
Installed CUDA12.8.1 + CUDNN9 on Ubuntu22.04 on WSL2 on Windows11

環境構築だけで１日がおわった。。

- ハードウェア構成
```
OS: Windows11 pro
Processor: 13th Gen Intel(R) Core(TM) i5-13500   2.50 GHz
Installed RAM: 64.0 GB (63.8 GB usable)
GPU: RTX4090
```
- WSL上にUbuntu22.04をインストール
power shellを起動して、下記を実行
```
wsl --install Ubuntu-22.04
```
- Docker Desktopをインストール
下記にアクセスしてDocker Desktop Installerをダウンロード、インストーラーに従ってDocker Desktopをインストールする
```
https://docs.docker.com/desktop/setup/install/windows-install/
```
　その後、docker.desktopを起動し、Setting->Resource->WSL integration->Ubuntu22.04をクリックしてWSL上のUbuntu22.04でdockerを使用できるようにする。
- nvidia-container-toolkitをインストール
power shellからubuntu22.04を起動し、下記を実行する
```
curl -fsSL https://nvidia.github.io/libnvidia-container/gpgkey | sudo gpg --dearmor -o /usr/share/keyrings/nvidia-container-toolkit-keyring.gpg \
  && curl -s -L https://nvidia.github.io/libnvidia-container/stable/deb/nvidia-container-toolkit.list | \
    sed 's#deb https://#deb [signed-by=/usr/share/keyrings/nvidia-container-toolkit-keyring.gpg] https://#g' | \
    sudo tee /etc/apt/sources.list.d/nvidia-container-toolkit.list
sudo apt-get update
sudo apt-get install -y nvidia-container-toolkit
sudo nvidia-ctk runtime configure --runtime=docker
sudo systemctl restart docker
```
- nvidia/cuda:12.8.1-cudnn-runtime-ubuntu22.04をRunする
```
sudo docker run -v ${PWD}/share2host:/root/share2host -it --gpus=all --name cu12.8.1_v -p 8888:8888 nvidia/cuda:12.8.1-cudnn-runtime-ubuntu22.04
```
　ちなみに、
　　-v xxx.. Host側との共有フォルダは/root/share2host
　　-p xxx.. Host側のポート8888とコンテナ内部のポート8888を接続
　してます。
- CUDA12.8.1をインストール

作成したContainer cu12.8.1_vに入って、
```
docker start cu12.8.1_v
docker attach cu12.8.1_v
```

https://developer.nvidia.com/cuda-downloads?target_os=Linux&target_arch=x86_64&Distribution=Ubuntu&target_version=22.04&target_type=deb_network

公式ページに従って、下記を実行する
```
wget https://developer.download.nvidia.com/compute/cuda/repos/ubuntu2204/x86_64/cuda-keyring_1.1-1_all.deb
dpkg -i cuda-keyring_1.1-1_all.deb
apt-get update
apt-get -y install cuda-toolkit-12-8
```
nvcc -Vでインストールできてるか確認
```
root@1f0fffe99111:/# nvcc -V
nvcc: NVIDIA (R) Cuda compiler driver
Copyright (c) 2005-2025 NVIDIA Corporation
Built on Fri_Feb_21_20:23:50_PST_2025
Cuda compilation tools, release 12.8, V12.8.93
Build cuda_12.8.r12.8/compiler.35583870_0
```
- CUDNNをインストール

https://developer.nvidia.com/cudnn-downloads?target_os=Linux&target_arch=x86_64&Distribution=Ubuntu&target_version=22.04&target_type=deb_network

公式ページに従って、下記を実行する
```
wget https://developer.download.nvidia.com/compute/cuda/repos/ubuntu2204/x86_64/cuda-keyring_1.1-1_all.deb
dpkg -i cuda-keyring_1.1-1_all.deb
apt-get update
apt-get -y install cudnn
apt-get -y install cudnn-cuda-12
```
日本語プログラミング言語Mindで「たらい回し関数」（リカーシブコール）２

## あまり回さない「たらい回し関数」
「たらい回し関数」で　検索すると　いくつか記事がありますが、「たらい回し関数」の再帰呼び出し回数が　飛躍的に大きくなるのは、同じ結果を何度も再計算しているからで、一度計算した結果を保存し参照すれば、圧倒的に　再帰呼び出し回数が減る。ことが分かります。
日本語プログラミング言語mind8で試してみましたので　ご覧ください。
## Mindプログラム
``` 
tarai2.src
呼び出し回数は　変数。
たらい回し結果構造体は　構造体
　　　結果は　ワード変数
　　　一次元は　102個の　結果
　　　二次元は　102個の　一次元
　　　全体は　102個の　二次元。
   
たらい回し結果有構造体は　構造体
　　　結果有は　ワード変数
　　　一次元有は　102個の　結果有
　　　二次元有は　102個の　一次元有
　　　全体は　102個の　二次元有。
   
たらい回しとは
      ｘは  変数
      ｙは  変数
      ｚは  変数
　　　x2は　変数
　　　y2は　変数
      z2は　変数
　　　たらい回し結果は　ワード変数
      ｘと  ｙと  ｚに  入れ
      xに　２を　加え　x2に　入れる
      yに　２を　加え　y2に　入れる
      zに　２を　加え　z2に　入れる　　　

　　　呼び出し回数を　一つ増加し

      結果有(x2,y2,z2)  ならば
　　　　　結果(x2,y2,z2)を　返し　終わり
　　　　　つぎに 
      結果有(x2,y2,z2)に　１を　入れる
      
      ｘが  ｙ  以下  
            ならば 
　　	　　　　　yを 結果(x2,y2,z2)に　入れる　
　　　　　　　　 ｙを  返し
　　　　　　さもなければ
                    ［ｘ － １］と  ｙと  ｚを  たらい回し
　　　　　　　　　　［ｙ － １］と  ｚと  ｘを  たらい回し
　　　　　　　　　　［ｚ － １］と  ｘと  ｙを  たらい回し
　　　　　　　　　　たらい回しし たらい回し結果に　入れる
　　　　　　　　　　たらい回し結果を　結果(x2,y2,z2)に　入れる　　
　　　　　　　　　 たらい回し結果を　返す
　　　　　　つぎに。
メインは 
　　　ixは　変数
　　　iyは　変数
      izは　変数
		起動引数個数が　3と　等しい
　　　　　　ならば
	　　　　呼び出し回数を　クリアし
  		起動引数(1)を 数値変換し　捨て　ixに　入れる
	 	起動引数(2)を 数値変換し　捨て　iyに　入れる
 		起動引数(3)を 数値変換し　捨て　izに　入れる
　　　　　　　　「たらい回し開始します。」と　表示し
				 ixと　iyと　izとを　
      　　　 　　たらい回し  数値表示する
　　　　　　　　「です。」と　表示し　
		呼び出し回数を　数値表示する　
　　　　　　　　「回呼び出し」と　表示する
　　　　　　　　改行する
　　　　　　　
            さもなければ
　　　　　　　　　「起動引数個数は３個です。」と　表示し　改行する
　　　　　　つぎに
。
```
x,y,z は０以上100以下まで可能です
## 実行結果
```
c:\mind8\pmind\lesson>tarai 8 4 0
たらい回し開始します。8です。12605回呼び出し

c:\mind8\pmind\lesson>tarai2 8 4 0
たらい回し開始します。8です。177回呼び出し

c:\mind8\pmind\lesson>tarai 10 5 0
たらい回し開始します。10です。343073回呼び出し

c:\mind8\pmind\lesson>tarai2 10 5 0
たらい回し開始します。10です。297回呼び出し

c:\mind8\pmind\lesson>tarai 12 6 0
たらい回し開始します。12です。12604861回呼び出し

c:\mind8\pmind\lesson>tarai2 12 6 0
たらい回し開始します。12です。449回呼び出し

c:\mind8\pmind\lesson>tarai 14 7 0
たらい回し開始します。14です。588802013回呼び出し

c:\mind8\pmind\lesson>tarai2 14 7 0
たらい回し開始します。14です。633回呼び出し

c:\mind8\pmind\lesson>tarai2 16 8 0
たらい回し開始します。16です。849回呼び出し

c:\mind8\pmind\lesson>tarai2 18 9 0
たらい回し開始します。18です。1097回呼び出し

c:\mind8\pmind\lesson>tarai2 20 10 0
たらい回し開始します。20です。1377回呼び出し
```
tarai は、純粋に再帰呼び出ししています。
tarai2 が改良版です。
### 「たらい回し関数の価値」
「たらい回し関数の価値」は、再帰呼び出しの回数が大きいことにありますので、tarai2 が改良版　というのは間違いかも知れませんね。
【JavaScript】モジュールシステム、ECMAScriptモジュールについて

# モジュール化
コードを分割し、再利用可能な単位にする仕組み のこと。
これにより、コードの管理がしやすくなり、再利用性や保守性が向上する。

# メリット
** コードの管理・再利用がしやすくなる **
具体的には次のようなメリットがある
-  名前空間の衝突を防げる
    -  同じ名前の変数・関数が上書きされるのを防ぐ
-  コードの再利用がしやすい
    -  便利な変数や関数を複数箇所にコピペする必要がなくなる
-  コードが分割できて管理しやすい
    -  機能ごとにファイルを分けられるので、整理しやすく修正しやすい
        -  例）計算する機能だけをmath.jsにわける


# 主なモジュールシステム
## ECMAScriptモジュール（ESM）
読み：エクマスクリプト
- import / export を使う
- ブラウザ & Node.js で使える（標準仕様）
- 非同期ロードが可能（ブラウザ環境）
- 拡張子は .js / .mjs

＜使い方＞
```js
// utils.js（モジュール化されたファイル）
export function greet(name) {
  return `Hello, ${name}!`;
}

// main.js（モジュールを使うファイル）
import { greet } from "./utils.js";
console.log(greet("Alice")); // Hello, Alice!

```

## CommonJS（CJS）
- require / module.exports を使う
- Node.js のデフォルトのモジュールシステム
- 同期的な読み込み（ブラウザでは使えない）

＜使い方＞
```js
// utils.js
module.exports.greet = function(name) {
  return `Hello, ${name}!`;
};

// main.js
const { greet } = require("./utils");
console.log(greet("Alice")); // Hello, Alice!

```
## その他
AMD（Asynchronous Module Definition）、UMD（Universal Module Definition）

# 参考
https://jsprimer.net/basic/module/#module

https://ics.media/entry/16511/
Git 運用 PRのワークフロー。PRレビューは"PRの記載粒度"が重要！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2680230/c26f8933-96b3-4a9b-a1d0-3e3723f48186.png)

# はじめに

[前回](https://qiita.com/magic10r/items/bda0e023259a34839acd)に続き、Git 運用についてまとめです。
今回は PR レビューのワークフローをまとめます。

以前上司の PR 内容の細かさに"レベルの違い"を感じたのは、今となっては良い思い出

## PR レビューの目的

- コードの品質を維持
- マージ先ブランチ（develop）のコミット履歴を直線的に保つ

## 役割

- レビュー担当者（レビュアー）
- レビュー対象者（レビュイー）


## レビュー前の準備

### ブランチの最新化（レビュイー）

- マージ先（`develop`ブランチ）から作業ブランチ（`feature`ブランチ）に `fast forward` できる必要があります
- できない場合は、以下の手順で `Rebase` を行います：

```shell
# カレント
git switch feature/#6-add-new-feature

# リポジトリを最新化
git fetch
   
# developブランチにRebase（コンフリクトがあれば解決）
git rebase origin/develop
```

### 変更をリモートに反映（レビュイー）

```shell
# --force-with-leaseで安全に強制プッシュ
git push --force-with-lease -u origin feature/#6-add-new-feature
```

## レビューのプロセス

### 初回レビュー（レビュアー）

- レビュアーが変更内容を確認
- 指摘事項を PR のコメントとして記載

### 修正対応（レビュイー）

```shell
# 必要に応じてdevelopブランチの変更を取り込む
git fetch
git rebase origin/develop
  
# コードを修正し、コミットする

# 修正をプッシュ（必要な場合は--force-with-lease付き）
git push -u origin feature/#6-add-new-feature
```

### レビュー完了まで

- レビュアーが修正内容を確認、レビュイーが修正対応を繰り返す

## マージと後処理

### PRのマージ（レビュアー）

- 修正が完了したら PR をマージ(クローズ)

### ブランチの後処理 (レビュイー)

- レビュアーが PR をマージする時に、画面からブランチを削除する
    - 一時的な feature ブランチを削除。ただし、永続的なブランチは除く

# おわりに

文字にするとスッキリしますね。PR 運用では"PRの記載粒度"がとても重要になります。
私を含め、実際に PR ワークフローを経験された方も、すっごく雑な PR を出してくる時があるので、しっかりと認識合わせが必要です。（この"PRの記載粒度"については実際の PR を見てもらうのが一番）
あと、PR からマージする際に `Merge` を行うのか、`Rebase` を行うのかも決まってないプロジェクトとかもあるので、今後まとめたいです。
Vue3 + VueRouter で離脱防止ポップアップ作成


![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2609563/463335da-85fa-4e0f-9a80-2751a3e0c604.png)

編集フォームなどから離脱する際に出てくるこの画面

## 前提

- vue: v3.5.13
- vue-router: 4.5.0
- Composition API

## ポイント
・ブラウザでの制御箇所（戻る・リロードなど）とVueRouterでの制御箇所、それぞれで作ってあげる必要があります。


## VueRouter部分
``` js
<script setup>
import { onBeforeRouteLeave } from 'vue-router'

onBeforeRouteLeave((to, from) => {
  if (to.name != "next"){
    const answer = window.confirm(
    "入力内容は破棄されますが、よろしいですか？"
    )
    if (!answer) return false
  }
})
```
:::note info
`onBeforeRouteLeave()`を使用することで、現在のページから離れる前段階で処理を呼び出すことができます。今回は確認用のポップアップを呼び出します。
:::

:::note 
`to`からは遷移先の、`from`からは遷移元のルートオブジェクトが使用できます。今回は遷移先のオブジェクトに対してアクセスし、入力後の画面かを確認しています。
:::

冒頭でも述べましたが、戻るボタンやリロード等、ブラウザ側の操作で画面から離れる場合には`onBeforeRouteLeave()`が動作しません。こちらは別途作成しましょう。

#### onBeforeRouteLeave()に関しての詳細

https://router.vuejs.org/guide/advanced/navigation-guards.html


## ブラウザ部分
``` js
<script setup>
const confirm = (e) => {
        e.preventDefault()
        e.returnValue ="入力内容は破棄されますが、よろしいですか？"
}

window.addEventListener("beforeunload", confirm)
</script>
```
こちらは生のJSで書いてあげる必要があります。

:::note
ほとんどのブラウザでは`returnValue`に設定した値ではなく、ブラウザ固有のメッセージが表示されます。
:::

:::note warn
ブラウザによっては画面に対して操作が行われていない場合、戻るボタン等を押しても`beforeunload`が呼ばれません。フォームなどに値を入力した状態でお試しください。
:::
### `beforeunload`についてはこちら
https://developer.mozilla.org/ja/docs/Web/API/Window/beforeunload_event




## コード
```js
<script setup>
import { onBeforeRouteLeave } from 'vue-router'

const confirm = (e) => {
        e.preventDefault()
        e.returnValue =" confirmText"
}

window.addEventListener("beforeunload", confirmBrowserRouter)





onBeforeRouteLeave((to, from) => {
  if (to.name != "next"){
    const answer = window.confirm(
    "入力内容は破棄されますが、よろしいですか？"
    )
    if (!answer) return false
  }
})
</script>
````
さくらのクラウド検定 受験記録

# はじめに

最近いろいろなクラウド関連の勉強ついでに、さくらのクラウド検定というものがあることを知ったので、受けてみることにしました。

https://www.sakura.ad.jp/certification/

zero2oneというサイトからIDを作って申し込みを行います。

https://zero2one.jp/reservation-sakuracloudcertificate/

年に2回の決まった試験日時にインターネットで受験する仕組みです。

# 勉強したこと

zero2oneというサイトから無料の教材にアクセスすることができるようになっているので、ひたすら動画を見ました。

https://zero2one.jp/product/sakuracloudcertificate/


## 模擬テスト

一応勉強したものの、当日の直前に試した模擬試験では71%の正答率。合格基準が明らかになっていないので何とも言えませんが、かなり雲行き怪しい！？

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/940466/9929b92f-039f-48c5-8a73-88e243934540.png)

# さくらのクラウドの特徴

国産クラウドであること以外に、いくつか面白い特徴があったのでご紹介です。

## 通信無料
仮想サーバは時間単位に課金されますが、通信には費用が掛からない。

## 単年度プリペイド
「プリペイド」というリザーブドインスタンスのような前払い機能があるのですが、通常の1年とかのプランと別で「単年度プリペイド」という3月までの予約が存在します。これは会計年度が4月始まりの企業にとって嬉しい点だと思います。

## 石狩リージョン
東京と石狩（北海道）にリージョンがあります。日本沈没というドラマでは日本列島がほぼ海に沈んでも、北海道と九州の一部が残っていたので、本当にそうなった場合は役に立つと思います。

## Sandbox
マネコンの操作習熟のための環境が無料で利用できるので、直接触って体で覚えたい派も安心です。AWSでもBuilder Labsという時限付きの練習環境はありますが、こちらは実際にリソースが作られるわけではなく、操作の体感だけできるようです。

## その他学んだことのメモ

* ウェブアクセラレーターでキャッシュ可能なファイルサイズは2GBまで。ファイル形式の制限はなし。
* さくらのクラウドサーバのSLAは99.95%
* ローカルルータとのピア設定ではリソースIDとシークレットキーが必要
* サーバにディスクを接続する際には、サーバを停止してディスクタブで「接続」
* GPUプランで提供されるNVIDIA V100
* 高火力PhyはNVIDIA H100
* サーバのプラン変更を行うと別リソースになるため、継続利用の割引が外れるため要注意！
* オブジェクトストレージにはディレクトリなし
* パケットフィルタはステートレスなので戻り通信も定義が必要
* AWS接続オプションを使うと、AWSとの閉域接続が可能
* マルウェア対策は提供なし、マーケットプレイス等を利用する
* VPCルータのサイト間VPN機能では、認証方法として事前共有鍵（Pre-Shared Key）
* シングルサーバコントロールパネルは接続先サーバを制限して外部向けに操作を許可する
* サーバのメモリ割当量の上限値は、1クラウドアカウント当たり、各ゾーンごとに合計300GB
* ルータ＋スイッチにはグローバルIPアドレスがバンドルされておりインターネット接続できる

## 受けてみて思ったこと

* 試験開始前にログインすると、開始時間までのカウントダウンが始まっていて急に緊張しました
* 100問を60分はなかなか短いので、わかりそうもない問題は仮の答えを入れて後でチェックとしました
* 知識が問われる問題も多く、業務で利用しているわけでなければ暗記する量が多かったです

# 試験結果

合格できました！！

![1-1-basic-rgb-default.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/940466/9a5b936d-1d8b-4dcb-a695-28605984cd93.png)

### それにしても
試験の結果が出るまで約2週間。長かった～

# おわりに

他のクラウドに比べると、独自カラーの強い国産クラウドですが、試験のシステムも全部さくらのクラウドで動いているのだろうと思うと、不思議な感覚でした。
勉強方法が公式教材しかないので、もう少しバリエーションが欲しいところです。また自宅で試験を受けるのはなんとなく抵抗ありますが、かといってスタバというわけにもいかず、試験センターなどでできるようにしてほしいところです。国産クラウドとして、ガバメントクラウド影響事業者に選ばれたそうなので、もっと利用者を増やしてほしいと願います！

https://www.sakura.ad.jp/corporate/information/newsreleases/2023/11/28/1968214232/

# 参考文献

https://qiita.com/dingtianhongjie/items/8a62e7ad05d352c61d34

https://www.future.ad.jp/futuremedia/sakuracloud_certificate2024no2/
Pythonで例外処理 try: except

# try catchとやることは同じ
Java Scriptの書き方に慣れていると、try catchで例外処理を書いていると、「ああ、例外処理が書いてあるな」と見てわかりますが、Pythonの`try: except`を見ると独特だなと戸惑うことがありました。

**JavaScriptで例外が発生するコード**
[jsfiddle](https://jsfiddle.net/)を使用して実行することができます。


```js
try {
    // 例外が発生する可能性のあるコード
    let result = 10 / 0;  // JavaScriptではこれは Infinity になるので、別の例外を発生させます
    throw new Error("テスト例外");
} catch (e) {
    // すべての例外をキャッチ
    console.error(`エラーが発生しました: ${e.message}`);
} finally {
    // 常に実行される
    console.log("finally ブロックは常に実行されます");
}
```

実行結果
![スクリーンショット 2025-03-16 15.11.35.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4036518/dd83ba5f-b09f-4cb3-8ce5-cfe2226493d5.png)

**Pythonで例外を発生させる**
try catchと違って`()`がないですが同じようにエラーをキャッチする処理を記述することができます。　

- `try:`の下の実行したい処理を書く.
- `except`に例外処理を書く.
    - `ZeroDivisionError`: 除算またはモジュロ演算の第2引数がゼロだった.
    - `Exception`: すべての非終了例外の共通基底クラス.
    - `as`は別名（エイリアス）をつけることができます。長いエラー名を`e`というエイリアスにする.
- `finally`はエラーが発生してもしなくても実行される.

```py
try:
    # 例外が発生する可能性のあるコード
    result = 10 / 0
except ZeroDivisionError as e:
    # 特定の例外をキャッチ
    print(f"ゼロ除算エラー: {e}")
except Exception as e:
    # その他の例外をキャッチ
    print(f"その他のエラー: {e}")
else:
    # 例外が発生しなかった場合に実行
    print("例外は発生しませんでした")
finally:
    # 常に実行される
    print("finally ブロックは常に実行されます")
```

実行結果
![スクリーンショット 2025-03-16 15.12.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4036518/5651bab1-bfa6-4912-b61b-7a75e78ee737.png)


## まとめ
今回はPythonで例外処理 `try: except`の解説をしてみました。

Python公式のサイトは日本語翻訳もされているので学習はしやすいので技術書を読まなくても基本文法の学習は可能です。

[Python公式](https://docs.python.org/ja/3.13/tutorial/errors.html)
DeepLabCutをGPU環境でインストール・セットアップする手順とトラブルシューティング

## **概要**
DeepLabCutをUbuntu環境でセットアップし、GPUを活用して動作させる手順を記録します。本記事では、インストール中に発生した問題とその解決方法についても詳しく解説します。

## **環境情報**
- **OS**: Ubuntu
- **GPU**: NVIDIA GeForce RTX 3060 Ti
- **CUDA**: 12.0
- **Python**: 3.10（Anaconda仮想環境）
- **DeepLabCut**: 3.0.0rc7


## **インストール手順**

### **1. Anacondaのインストール**
まず、Ubuntu上でAnacondaをインストールしました。以下の手順で進めました：
1. Anaconda公式サイトからインストーラーをダウンロード。
2. インストーラーを実行：
   ```bash
   bash Anaconda3-x.x.x-Linux-x86_64.sh
   ```
3. `.bashrc`にAnacondaのPATHを追加し、`source ~/.bashrc`で反映。


### **2. 仮想環境の作成**
DeepLabCut専用の仮想環境「DEEPLABCUT」を作成しました。
```bash
conda create -n DEEPLABCUT python=3.10
conda activate DEEPLABCUT
```


### **3. PyTorchのインストール**
CUDA 12.0に対応したPyTorchをインストールしました。
```bash
mamba install pytorch torchvision torchaudio pytorch-cuda=11.8 -c pytorch -c nvidia
```

**確認**:
PyTorchが正しくインストールされているか確認しました。
```bash
python -c "import torch; print(torch.__version__)"
python -c "import torch; print(torch.cuda.is_available())"
```
結果：
- PyTorchバージョン：2.5.1
- GPU認識：`True`



### **4. DeepLabCutのインストール**
DeepLabCutをインストールしました。
```bash
pip install --pre deeplabcut
```

**確認**:
DeepLabCutが正しく動作しているか確認しました。
```bash
python -c "import deeplabcut; print(deeplabcut.__version__)"
```
結果：
- バージョン：3.0.0rc7

ただし、「light mode」でロードされ、GUIが使用できない状態でした。



## **発生した問題と解決方法**

### **問題 1: DeepLabCutが「light mode」でロードされる**
#### **原因**:
`wxPython`がインストールされていないため、GUI機能が使用できない。

#### **解決方法**:
1. 必要なシステムライブラリ（GTK+関連）をインストール：
   ```bash
   sudo apt update
   sudo apt install libgtk-3-dev libgtk-3-0 libjpeg-dev libtiff-dev libpng-dev build-essential libx11-dev libxext-dev libxrender-dev libxtst-dev libxi-dev
   ```
2. Conda経由で`wxPython`をインストール：
   ```bash
   conda install -c conda-forge wxpython
   ```



### **問題 2: Pip経由で`wxPython`のビルドが失敗**
#### **原因**:
システムに必要なGTK+やその他の開発ライブラリが不足しているため、ビルドプロセスが失敗。

#### **解決方法**:
Conda経由で事前ビルド済みの`wxPython`をインストールすることで問題を回避。



### **問題 3: CUDAバージョンとPyTorchの互換性**
#### **原因**:
PyTorchはCUDA 11.8までのサポートが安定しており、CUDA 12.0環境では一部機能に問題が出る可能性あり。

#### **解決方法**:
CUDA 11.8に対応したPyTorch（`pytorch-cuda=11.8`）を使用することで解決。



## **最終確認**

以下のコマンドでDeepLabCut GUIが正常に動作することを確認しました：
```bash
python -m deeplabcut
```



## **まとめ**

本記事では、DeepLabCutをGPU環境でセットアップする手順と発生した問題への対処法について詳しく記録しました。以下が重要なポイントです：

1. PyTorchはCUDAバージョンとの互換性に注意。
2. GUI機能には`wxPython`が必要。Conda経由でインストールすると簡単。
3. 必要なシステムライブラリ（GTK+関連）を事前に準備することが重要。

これらの手順に従えば、DeepLabCutをGPU環境下で効率的に使用できます。

Citations:
[1] https://ppl-ai-file-upload.s3.amazonaws.com/web/direct-files/21190619/3de57721-5955-41d4-be29-3be59e2c1075/paste.txt
Git 運用 一人プロジェクト。でも、開発時のワークフローは必要！

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2680230/dcb93eb3-093e-4b6e-a1e4-a8807236833a.png)

# はじめに

[前回](https://qiita.com/magic10r/items/7d6a803a74e2d21b7a55)に続き、Git 運用についてまとめです。
今回はざっくりと開発時の Git ワークフローをまとめます。

## 事前準備

### リポジトリのクローン

```shell
git clone https://github.com/example/example-project.git
cd example-project
```

## 課題の作成

### 課題（Issue）の作成

- GitHub 上で新しい Issue を作成
  - Issue は出来る限り具体的に細かく作成。単位が曖昧で大きい場合は、子 Issue を作成する
- 課題番号を確認（例：#6）

## ブランチ作成と開発

### ブランチの作成

```shell
# レポジトリを最新化
git fetch

# 新しい機能ブランチを作成
# ベースはマージ先ブランチ origin/develop
git checkout -b feature/#6-add-new-feature origin/develop
```
:::note
「ブランチの命名規則と管理」については、今後記載予定
:::

### コードの実装とコミット

```shell
# コードを修正
# 変更したファイルをステージング
git add .

# 意味のあるコミットメッセージ
git commit -m "feat: #6 Add new feature implementation"
```

- [コミットメッセージ](https://qiita.com/magic10r/items/7d6a803a74e2d21b7a55) を参照

### リモートブランチへのプッシュ

```shell
# 初回のプッシュ
# 初回でリモートの追跡ブランチを設定したので、次回以降は git push だけでよい
git push -u origin feature/#6-add-new-feature
```

## コードレビュー

### Pull Request（PR）の作成

- GitHub web 画面で `feature/#6-add-new-feature` から `develop` への PR を作成
- PR を Issue と関連付けさせる。Issue の右サイドの Development から PR を選択する。これで PR をマージすると、Issue が自動的にクローズされる

### レビューフロー

:::note
「PRレビュー」については、今後記載予定
:::


# おわりに

GitHub の `Issue` と `PR` のワークフローは開発には必須。すごく簡単な事だけど、意外と運用してなプロジェクトもある。
「一人プロジェクトだから必要ない」と言っている方、いつか引き継ぐ時に GitHub の内容は素晴らしい引継ぎ財産になりますよー
Autonomous Database (ADB-S) のOCPU新規インスタンス構築終了

2025年３月４日よりAutonomous Database Serverless (ADB-S) で新規インスタンスを作成する時にOCPUが選択できなくなったようです。
※オラクル社はECPUの使用を推奨しています

# OCPU / ECPU
## OCPU
* Oracle Cloud Infrastructure (OCI) のCPUの単位
* 物理CPUの1コアに相当
* 他のクラウドベンダ(AWS等)では1スレッドを最小単位として1vCPUとしているため、1OCPU = 2vCPU の関係
(ハイパースレッディングを有効にしている場合)
* オラクルの価格表ではvCPUでの価格も併記されている
https://www.oracle.com/jp/cloud/price-list/

## ECPU
* 2023年頃からOCIに導入された新しいCPUの単位
* 抽象的な単位であり、必ずしも物理コアやスレッドと同等ではない
* CPU性能の変化に依存しない一貫した価格体系とするために導入された
* 現時点では 4 ECPU = 1 OCPUの価格設定となっている
* OCPUより細かい単位のため、より柔軟なリソース増減が可能になっている
  * 最低2ECPU。1ECPUずつ増減可能
* BYOLにも利用可能
* ADB-SではダウンタイムなしでOCPUからECPUに移行可能

## ECPUに対応しているサービス
* Autonomous Database (ADB-S / ADB-D)(ADW / ATP)
  * ECPUでは自動バックアップのストレージ費用が別途必要になる
* APEX Application Development
* Autonomous JSON Database
* Exadata Cloud@Customer (ExaDB-C@C)
* Exadata Database Service on Dedicated Infrastructure (ExaDB-D)
* Exadata Database Service on Exascale Infrastructure (ExaDB-XS)
* MySQL HeatWave
* Full Stack Disaster Recovery
* Observability and Management Platform
pythonの仮想環境 ”venv” の作成・起動・停止の備忘録

時々venvを作成してみようと思うことがあるのですが、毎回作成方法を忘れてしまうため、ここに整理しておこうと思います。
私はWindowsユーザーですが、WSL経由でエディタを立ち上げているため、下記コマンドはLinuxの場合になります。

## venvの作成方法
```
python3 -m venv "ディレクトリ名"
```
・自分が使用したいディレクトリに作成すること。

## venvの起動方法
```
source "ディレクトリ名"/bin/activate
```
・binとは、venv環境につくられたバイナリファイル。仮想環境のスクリプトやコマンドが保存されている。
・いま自分のいるディレクトリがどこなのかに気を付ける。作成したディレクトリにいる時は、

`source bin/activate`になる。ここでディレクトリ名を入力するとエラーがでる。


## venvの停止方法
```
deactivate
```
・仮想環境が壊れることがあるため、作業後は`deactivate`を忘れないようにする。
JavaScript 入門 ①

# JavaScript とは

JavaScript（JS） は、主に Webページに**動的な機能**を追加するためのプログラミング言語 です。
Webブラウザ上で動作し、HTML や CSS と連携して、ユーザーの操作に応じた動的な動作を実現できます。


![スクリーンショット 2025-03-20 204010.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4034432/60154af9-2fe0-4d2b-bbf1-2afe5dddc79b.png)

今回は簡単な例を見ながらJavaScriptを学んでいく

## 例1 「ボタンをクリックすると文字が変わる」実装

以下のコードを考える

```html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScript入門</title>
</head>
<body>
    <h1 id="message">こんにちは！</h1>
    <button onclick="changeText()">クリックして変更</button>

    <script>
        function changeText() {
            document.getElementById("message").textContent = "JavaScriptを学ぼう！";
        }
    </script>
</body>
</html>
```

**`<h1 id="message">`**：変更するテキストを囲む要素

**`<button>`**：クリックしたら動作するボタン

**`onclick="changeText()"`**：ボタンをクリックすると changeText 関数が実行される
**`document.getElementById("message").textContent = "JavaScriptを学ぼう！";`**
→ id="message" のテキストを変更する!

このコードを実装するとつぎのようになる。


![スクリーンショット 2025-03-20 204831.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4034432/a25d6e93-3dac-4767-94d8-1969f3be6bcc.png)

この画面の「クリックして変更」と書かれてある部分をクリックすると以下のようになる。

![スクリーンショット 2025-03-20 204919.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4034432/f9c60af2-08ca-4ed2-bc4d-223945ac0609.png)

「こんにちは！」の部分が「JavaScriptを学ぼう！」にかわりました。
このようにJavaScriptはWebのフロント部分を動的に変化させることが可能となります。

## 例2 「入力テキストの表示」

つづいて以下のコードを試す。
```html
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScript 入門</title>
</head>
<body>
    <h1>JavaScript 入門</h1>
    
    <input type="text" id="userInput" placeholder="ここに入力">
    <button onclick="displayText()">表示</button>

    <p id="outputText">ここに入力内容が表示されます</p>

    <script>
        function displayText() {
            // 入力フォームの値を取得
            let inputText = document.getElementById("userInput").value;
            
            // 取得した値を画面に表示
            document.getElementById("outputText").textContent = inputText;
        }
    </script>
</body>
</html>
```

**`<input type="text" id="userInput">`**
→ ユーザーがテキストを入力するフォーム

**`<button onclick="displayText()"表示</button>`**
→ ボタンをクリックすると displayText 関数が実行される

**`document.getElementById("userInput").value;`**
→ 入力フォームの値を取得する

**`document.getElementById("outputText").textContent = inputText;`**
→ 取得した値を `<p>` の中に表示する

これを実装すると以下のようになる

![スクリーンショット 2025-03-20 205521.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4034432/bda0443f-6c1b-4c45-a909-a5205d9518f9.png)

このテキストボックスに例えば

![スクリーンショット 2025-03-20 205535.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4034432/d7de67d1-8fcc-4852-b330-777edc62515b.png)

このようにテキストをいれ、「表示」ボタンを押すと

![スクリーンショット 2025-03-20 205548.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4034432/620e53c1-dd89-4a55-94ba-74108828f71e.png)

このように表示される。
ffmpeg を使って画像に動画を合成する話

## はじめに

FFmpeg を使って画像に動画を合成（画像を背景にして動画を重ね）し、一つの動画にする方法を個人的にまとめました。

## 動画を画像の上に重ねる

### 基本的な方法

```
$ ./ffmpeg -i image.png -i video.mp4 -filter_complex "[0][1]overlay=0:0" output.mp4
```

`image.png`: 背景にする画像ファイル
`video.mp4`: 重ねたい動画ファイル
`overlay`: 画像上の座標（動画の表示位置）
`output.mp4`: 出力ファイル名

### 動画のサイズを変更して重ねる

```
$ ./ffmpeg -i image.png -i video.mp4 -filter_complex "[1]scale=680:512[v];[0][v]overlay=62:38" output.mp4
```

`[1]scale=680:512[v]`: 動画のサイズを 680:512 にリサイズ
`[0][v]overlay=62:38`: 画像の (62, 38) の位置に動画を配置

![ffmpeg_overlay_output2.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/497517/75a7c648-0ab7-4fa7-ba8c-2602b14f64ed.gif)

## 素材提供
いらすとや様
https://www.irasutoya.com/

Pexels 様
https://www.pexels.com/
キーペアを別アカウントに移行する方法

## 概要
EC2で利用しているキーペアを別アカウントに移行する方法を調べてみました。
業務では利用しなかったのですが、メモがてら残しておきます。

## 手順
1. コンソールにログインし、EC2の画面にてキーペアを選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882356/d7af7653-b078-4ae9-b2b3-0e911135707e.png)
2. アクションからキーペアをインポートする
2. 以下画面になる
![スクリーンショット 2025-03-19 051210.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882356/8931047a-704d-49b5-905d-ffc7ce023ab1.png)
4. 手元にある秘密鍵から公開鍵ーを作成する
　```
　ssh-keygen -y -f [秘密鍵の名前] > [作成する公開鍵の名前]
　```
 ※windowsを利用していたので、
 　powershellにて上記コマンドを実行しました
5. 作成した公開鍵をメモ帳で開く
5. ssh-rsaから始まっている全文をコピーし貼り付ける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3882356/88aaebff-94b6-457c-97e2-c369bcc79e9b.png)
7. キーペアをインポートする

## まとめ
上記手順にて、EC2起動時にインポートしたキーを利用できるようになります。
使う機会があるのかわかりませんが、誰かのためになれば幸いです。