OmniAICreator/Qiita-1.07M huggingface dataset:
【React入門】useStateとuseEffectの基本

# useState

## useStateとは
状態を管理するreactのHookです。
通常の変数と違い再レンダリング時に値を保持できることが特徴です。

---

### 特徴
* 初期値を設定できる
* 値を更新するのにはsetter関数を使う
* 直接代入することはできない（無視される）
* setter関数は非同期なので、前の状態に依存する場合は関数形（prev => prev + 1）などで書く
* setterを他のコンポーネントに渡すと 意図しない再レンダリングの原因になるので注意

---

### 変数との違い

|種類|再レンダリングの後の状態|
|-|-|
|通常の変数|初期化される|
|useState|状態が保持される|

---

### 使用例
サンプル：カウントアプリ
```ts
import {useState} from "react"

const Count = () => {

  const [number, setNumber] = useState(0); //初期値は０
  const onCount = () => {
      setNumber(prev => prev + 1)　//一を加算
  }

    return (
        <div>
            <p>{number}</p>
            <button onClick={onCount}>一を加算</button>
        </div>
          )
}
export default Count;

```

## useEffect

useEffectは、副作用（side effect）を扱うためのHookです。
副作用とは「関数の外に影響を与える処理」のことです。
副作用とは、以下のような処理を指します：
* DOMの操作
* データの取得（fetch）
* イベントリスナーの登録・解除　など

---
特徴まとめ
*　指定した値(依存配列)が変更されたときにだけ実行される
*　初回レンダリング時も実行される
*　同じ値だと実行されない

---

### 使用例

サンプル：数値を加算するフォーム

```ts
import { useState, useEffect } from "react";

const Count = () => {
  const [number, setNumber] = useState(0); // カウントの状態
  const [addNumber, setAddNumber] = useState(0); // 追加する数値の状態

  // addNumberが変わったときにnumberに加算
  useEffect(() => {
    setNumber(prev => prev + addNumber);
  }, [addNumber]);

  return (
    <div>
      <p>{number}</p>
      <input
        type="number"
        value={addNumber}
        onChange={(e) => setAddNumber(Number(e.target.value))}
      />
    </div>
  );
};

export default Count;
```

## tips

useStateは「再レンダリングされるたびに値が保持される」というのが最大のポイント

useEffectの依存配列は、何が変わったときに副作用処理を走らせるかを明確に指定する

## まとめ

| Hook | |
|- |-|
| useState |値の保持、更新|
| useEffect|副作用処理（データの取得）|

ReactではuseStateとuseEffectを正しく使えるようになると、より動的で反応的なUIを作れるようになります。

## 関連リンク

* 公式ドキュメント：Hooks API
    https://ja.legacy.reactjs.org/docs/hooks-reference.html
* 公式チュートリアル（日本語）
    https://ja.legacy.reactjs.org/tutorial/tutorial.html
watsonx.ai/.governanceでRAGのプロンプトテンプレートを評価（日本語）

# 検証データ
質問（question）、文脈（context）、watsonx.ai/mistral-large-2による生成回答（generated_text）、およびazure OpenAI/GPT-3.5-turbo模範回答（reference_text）を含む検証データを、[RAG-Evaluation-Dataset-JA](https://huggingface.co/datasets/allganize/RAG-Evaluation-Dataset-JA)を参考に構築しました（以下参照）。
https://qiita.com/onoyu1012/items/b8cec33c2aa99765013c

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/218f04b2-ccaa-4435-9580-c48ed1a98edd.png)

# プロンプトテンプレートの作成
watsonx.aiのPrompt Labでプロンプト・テンプレートを作成＆保存。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/7c56b861-e6c6-4c3b-9a12-a8810730fbac.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/919bcae2-5a38-4a96-b415-45ec071fd863.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/2961e25e-ab4c-4db6-a5d3-b37ba9e86207.png)

# 評価実施
Evaluateをクリック、検証データをアップロードして評価実施。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/feb9e043-8154-4270-9197-f1c9e13a25a8.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/44e476ad-d8a8-4bad-b2bc-827c9fd7709b.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/fd16ca86-381e-412d-a22a-c1dc00e02a73.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/a9404065-0e9f-4744-bba2-8a98e6258458.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/d6efb08f-f1c3-4bb4-a069-56bc49400231.png)

# 評価結果

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/09f39b6a-f415-4cb9-b7bb-50cdaa62a891.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/2b0d4c88-bdbf-4362-ac5e-4bc233a4a51e.png)
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3756172/b51296ae-2357-40d7-8754-c18bb1087e9f.png)
Deepl APIの脆弱性の改善案

# DeepL API の axios 脆弱性を回避する安全な実装

こんにちは、今回は **DeepL API を導入する際に直面した axios の脆弱性問題**と、それに対する**実用的な回避策**について解説します。

この問題は私が個人開発で翻訳機能を実装した時に直面した問題でした。

## 課題
DeepL API の npm パッケージが抱える axios 脆弱性

DeepL API を簡単に使えるようにするための非公式 npm パッケージ `deepl` を導入したところ、以下のような **axios の脆弱性** が npm audit により検出されました：

### 報告された脆弱性
- **CSRF**（クロスサイトリクエストフォージェリ）
- **SSRF**（サーバーサイドリクエストフォージェリ）
- **認証情報の漏洩の可能性**

### なぜ問題か？
これらの脆弱性が存在するライブラリを利用し続けると、以下のようなリスクがあります：
- サーバー上の他サービスや認証情報への不正アクセス
- エンドユーザーのセッションハイジャック
- 開発者が意図しない外部通信

---

## 解決策：axios を使用せず、fetch による直接実装

DeepL の REST API は非常にシンプルな構造を持っているため、**fetch を使って直接リクエストを送る実装**が可能です。

### 実装例（Node.js / Next.js）
```ts
const response = await fetch("https://api-free.deepl.com/v2/translate", {
  method: "POST",
  headers: {
    Authorization: `DeepL-Auth-Key ${process.env.DEEPL_AUTH_KEY}`,
    "Content-Type": "application/x-www-form-urlencoded",
  },
  body: new URLSearchParams({
    text: "翻訳したいテキスト",
    target_lang: "EN-US",
  }),
});

const data = await response.json();
console.log(data.translations[0].text);
```

### メリット
- axios のような依存関係を追加せずに済む
- npm audit で脆弱性を報告されない
- fetch はブラウザ・Node.js 双方で利用可能

---

## 適用範囲と補足
この回避策は以下のようなプロジェクトに特に有効です：
- 外部APIを少数利用する小規模〜中規模Webアプリ
- セキュリティレビューを重視するB2B/B2Cアプリ
- 自社内にセキュリティチェックが入るプロダクト開発

> ✍️ 補足：2025年4月時点では、`deepl-node` という公式のNode SDKも提供されていますが、fetchでの軽量な実装も十分に安全かつ柔軟に運用できます。

---

## まとめ

axios は非常に便利な HTTP クライアントですが、第三者製パッケージに依存することで不要な脆弱性を取り込むリスクも存在します。

DeepL API を安全に運用するためには、**fetch によるシンプルな直接実装**が現時点での最善策の一つです。

セキュリティを意識した API 実装に取り組む方の参考になれば幸いです。

---

ご意見やフィードバックがあれば、ぜひコメントで教えてください！
New Relic アップデート(2025年3月)

2025年3月のNew Relic のアップデートをまとめて紹介です！New Relic Now+で発表された新機能の中でGAになった機能をご紹介です！

## [New Relic Now+] 特定の情報をダッシュボードでユーザーでなくても共有可能
ダッシュボードのリンクを共有して、New Relicに取り込んだデータにユーザーでない人でもアクセスできるようになりました。New Relicにアクセスできないステークホルダーにシステムの稼働状況を共有することができ、同じデータを確認することで、コミュニケーションコストの削減につながり、障害対応時間の削減やチーム間の連携が促進可能になります。
![update202503-1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485441/231afbfe-2e2b-46d2-88ad-7dd80f50b5d4.png)

## [New Relic Now+] ユーザーアクションの自動収集によりUX改善を加速
Session Replayでレイジクリックのようなユーザーの苛立ちのサインが記録されるようになりました。また、AIを使ったユーザー行動の分析で改善箇所の把握がこれまで以上に容易になり、UX改善を加速できるようになります。
![update202503-2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485441/70007f42-27ca-4862-89a4-097d53a94afb.png)

## [New Relic Now+] 動画ストリーミングの視聴体験を観測可能に
動画ストリーミングの視聴状況をリアルタイムで分析し、バッファリング率や再生エラーなど動画プレイヤーや再生プラットフォーム別に分析できるようになり、動画プレイヤーからサーバーサイドまで一気通貫で把握、改善できるようになりました。また、広告視聴の分析もでき、再生完了率や離脱ポイントの傾向など定量的な広告分析も可能です。
![update202503-3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3485441/efb671ad-beae-4296-8007-6286895655ac.png)

アップデートの詳細はこちらのブログでご確認ください。
↓↓↓↓↓↓
https://newrelic.com/jp/blog/nerdlog/new-relic-update-202503

- **2025年3月アップデート**
  - New Relic Now+： 特定の情報をダッシュボードでユーザーでなくても共有可能
  - New Relic Now+： ユーザーアクションの自動収集によりUX改善を加速
  - New Relic Now+： 動画ストリーミングの視聴体験を観測可能に
Windows PowerShellで文字コードを一括変換（BOM付き/SJIS → UTF-8 BOMなし）

Javaファイルの文字コードが UTF-8(BOM付き)、UTF-8(BOMなし)、Shift_JIS が混在している状態になっていたので、それらをすべて UTF-8（BOMなし）に一括変換したい

Powershell
```
$folder = "C:\Your\Target\Directory"  # ←変換対象のパスに変更！

$extensions = @("*.java", "*.xml", "*.properties")

# UTF-8かどうか判定する関数
function IsUTF8([byte[]]$bytes) {
    try {
        [System.Text.Encoding]::UTF8.GetString($bytes) | Out-Null
        return $true
    } catch {
        return $false
    }
}

foreach ($ext in $extensions) {
    Get-ChildItem -Path $folder -Recurse -Filter $ext | ForEach-Object {
        $path = $_.FullName
        $bytes = [System.IO.File]::ReadAllBytes($path)

        $encoding = New-Object System.Text.UTF8Encoding $false  # UTF-8 (BOMなし)
        $text = ""

        if ($bytes.Length -ge 3 -and $bytes[0] -eq 0xEF -and $bytes[1] -eq 0xBB -and $bytes[2] -eq 0xBF) {
            $text = [System.Text.Encoding]::UTF8.GetString($bytes, 3, $bytes.Length - 3)
            Write-Host "[UTF-8 with BOM] → $path"
        }
        elseif (IsUTF8 $bytes) {
            $text = [System.Text.Encoding]::UTF8.GetString($bytes)
            Write-Host "[UTF-8 no BOM] → $path"
        }
        else {
            $sjis = [System.Text.Encoding]::GetEncoding("shift_jis")
            $text = $sjis.GetString($bytes)
            Write-Host "[Shift_JIS] → $path"
        }

        [System.IO.File]::WriteAllText($path, $text, $encoding)
    }
}
```

```
eclipse {
    classpath {
        plusConfigurations += [configurations.testRuntimeClasspath]

        file {
            whenMerged { classpath ->
                classpath.entries.each { entry ->
                    if (entry instanceof org.gradle.plugins.ide.eclipse.model.ProjectDependency) {
                        entry.entryAttributes.remove("without_test_code")
                    }
                }
            }
        }
    }
}

```
猿でもわかるAIプログラミングシリーズ 🐵💻 | [第7回]Chatbotをゼロから作る方法（Python編）


## **1. はじめに: なぜ今チャットボットを作るのか？**  
近年、ChatGPTやGeminiなどのAIチャットボットが急速に普及しています。しかし、**「実際に自分で作るとどうなるのか？」**という疑問を持つエンジニアも多いはず。  

本記事では、**Hugging FaceのTransformersライブラリ**を使って、**シンプルながら実用的なチャットボット**をゼロから構築する方法を解説します。  
**「理論だけで終わらせず、実際に動くコードを通じて学ぶ」**ことを目標にしています！  

![Chatbot](https://example.com/chatbot-image.jpg)  
*（イメージ図: チャットボットの対話例）*  

---

## **2. チャットボットの基礎: Transformersとは？**  
**Transformers**は、自然言語処理（NLP）タスクで圧倒的な性能を発揮する**深層学習アーキテクチャ**です。  
特に、**GPTやBERT**のような大規模言語モデル（LLM）の基盤技術として知られています。  

### **🔍 主要コンポーネント**
- **Tokenization**: テキストを数値ベクトルに変換  
- **Attention Mechanism**: 文脈を理解するための仕組み  
- **Fine-tuning**: 特定のタスクにモデルを最適化  

![Transformer Architecture](https://example.com/transformer-arch.png)  
*（Transformerのアーキテクチャ概略図）*  

---

## **3. 実装編: コードで動かすチャットボット**  
ここでは、**Hugging Faceの`pipeline` API**を使って、**GPT-2ベースのチャットボット**を構築します。  

### **🛠️ 必要なライブラリ**
```bash
pip install transformers torch
```

### **💻 コード例: シンプルな対話ボット**
```python
from transformers import pipeline, AutoTokenizer

# モデルのロード（GPU利用可）
chatbot = pipeline(
    "text-generation",
    model="gpt2",
    tokenizer="gpt2",
    device="cuda" if torch.cuda.is_available() else "cpu"
)

def chat():
    print("Bot: こんにちは！何か話しましょう（'exit'で終了）")
    while True:
        user_input = input("You: ")
        if user_input.lower() == "exit":
            break
        response = chatbot(user_input, max_length=100, num_return_sequences=1)
        print(f"Bot: {response[0]['generated_text']}")

if __name__ == "__main__":
    chat()
```

### **🚀 実行例**
```
You: こんにちは！  
Bot: こんにちは！調子はどうですか？今日は何か楽しいことしましたか？
```

---

## **4. 実践的なTips & よくある落とし穴**  
### **✅ 推奨事項**
- **モデルの軽量化**: `distilgpt2`を使うと高速化可能  
- **会話のコンテキスト保持**: 過去の入出力を`prompt`に追加  
- **安全対策**: 不適切な出力をフィルタリング（例: `HuggingFaceの`text-classification`パイプライン併用）  

### **❌ 避けるべきミス**
- **トークン制限超過**: `max_length`を適切に設定（GPT-2は通常512トークンまで）  
- **無駄な再ロード**: 同じモデルを繰り返し読み込まない  
- **過剰なリクエスト**: API利用時はレートリミットに注意  

---

## **5. 発展編: カスタムチャットボットを作る**  
**より高度な利用例**として、以下のような拡張が可能です。  

### **📌 カスタムデータでFine-tuning**
```python
from transformers import Trainer, TrainingArguments

training_args = TrainingArguments(
    output_dir="./results",
    per_device_train_batch_size=4,
    num_train_epochs=3,
)

trainer = Trainer(
    model=model,
    args=training_args,
    train_dataset=train_dataset,
)
trainer.train()
```

### **🌐 FlaskでWeb API化**
```python
from flask import Flask, request, jsonify

app = Flask(__name__)

@app.route("/chat", methods=["POST"])
def handle_chat():
    data = request.json
    response = chatbot(data["message"])
    return jsonify({"reply": response[0]["generated_text"]})
```

---

## **6. まとめ: メリット・デメリットと今後の展望**  
### **👍 メリット**
- **少ないコードで最先端のNLPモデルを利用可能**  
- **オープンソースモデルを使うため、コスト削減できる**  

### **👎 デメリット**
- **大規模モデルはリソース消費が大きい**  
- **倫理的な課題（バイアス、誤情報など）への配慮が必要**  

### **🔮 将来の展望**
- **小型化技術（Quantization, Distillation）の進化**  
- **マルチモーダル（画像＋テキスト）チャットボットの台頭**  

---

**「とにかく動かしてみる」**ことで、AIの可能性を実感してください！  
質問や改善案があれば、ぜひコメントください 🚀
【備忘録】XAMPPでGitHubからcloneしたプロジェクトを開く方法（Windows）

背景
---

会社のHPの修正依頼をされたが、PHPを触るのが初めてだったのでローカル環境構築をした。  
今後もファイルパスを書き換えることがありそうなので、メモとして残しておく。

（※ただし、この方法よりもっと良い方法があるような気もしているので、そのうち改善するかも。）

---

## 環境（前提）

- XAMPPをインストール済み（`C:\xampp`）
- GitでcloneしたPHPプロジェクトをローカルで動作確認したい

例）  
```
C:\workspace\php-projects\sample-website\www
└─ index.php
```

---

## Apacheの設定変更手順

Apacheの設定ファイルを開く：

```
C:\xampp\apache\conf\httpd.conf
```

以下の箇所を書き換える：

**変更前**
```apache
DocumentRoot "C:/xampp/htdocs"
<Directory "C:/xampp/htdocs">
```

**変更後（プロジェクトのパスに変更）**
```apache
DocumentRoot "C:/workspace/php-projects/sample-website/www"
<Directory "C:/workspace/php-projects/sample-website/www">
```

※パスの区切りはスラッシュ `/` を使用。

---

## Apache再起動と動作確認

XAMPPのApacheを再起動後、ブラウザで次のURLにアクセスする。

```
http://localhost/
```

cloneしたプロジェクトのindex.phpが表示されれば完了。
Python で PDF ファイルのページの順序を並べ替える

複数の異なる PDF ファイルを 1 つの文書に統合する際、統合後の文書が適切な構造を持ち、一貫性のあるものになるように、ページの順序を調整する必要がある場合があります。この記事では、無料のライブラリを使って **Python において PDF ファイル内のページを並べ替える方法**を学ぶことができます。


## PDFを処理するための無料のPythonライブラリ
Python を使って PDF のページを扱うには、無料のサードパーティ製ライブラリである [**Free Spire.PDF for Python**](https://www.e-iceblue.com/Introduce/free-pdf-for-python.html) を利用することができます。このライブラリは、Python において PDF の生成、操作、変換などの様々な操作をサポートしています。手動で[ダウンロード](https://www.e-iceblue.com/Download/free-pdf-python.html)してインストールするか、pip コマンドを使ってインストールすることができます：
```
pip install Spire.Pdf.Free
```
:::note warn
注：この無料のライブラリには、一定のページ制限があります。
:::


## Pythonを使ってPDFのページ順を調整する
文書内容の論理性や関連性に基づいて PDF のページを並べ替えることで、PDF 文書の読みやすさを向上させることができます。Python では、Spire.PDF for Python ライブラリが提供する **`PdfDocument.Pages.ReArrange (orderArray: List [int])`** メソッドを使用することで、簡単に PDF のページ順を調整することができます。

ここで、パラメータの **`orderArray`** は新しいページ順を指定するための整数のリストです。例えば、4 ページからなる PDF 文書があり、ページ番号がそれぞれ 1、2、3、4 であるとします。これらのページを並べ替えて、ページ順を 3、1、4、2 に変更したい場合、orderArray は `[2, 0, 3, 1]` となります（PDF のページインデックスは 0 から始まります）。


**C#のコード：**
```python
from spire.pdf.common import *
from spire.pdf import *
 
# PdfDocument オブジェクトを作成する
pdf = PdfDocument()
 
# PDF ファイルを読み込む
pdf.LoadFromFile("Test.pdf")
 
# PDF のページ順を調整する
pdf.Pages.ReArrange([2, 0, 1])
 
# 結果のファイルを保存する
pdf.SaveToFile("ReorderPDFPage.pdf", FileFormat.PDF)
pdf.Close()
```

*入力ファイルと出力ファイル：*
![ReorderPDFR.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2811193/d006ac49-951e-4ba6-b20a-cb8fb978b7f8.png)


また、この Python ライブラリは、ページの余白設定、ページサイズ設定など、その他の PDF ページ設定もサポートしています。詳細なサンプルを見るには、こちらのリンクをクリックしてください：

https://www.e-iceblue.com/Tutorials/Python/Spire.PDF-for-Python/Program-Guide/Spire.PDF-for-Python-Program-Guide-Content.html
猿でもわかるAIプログラミングシリーズ 🐵💻 | [第6回]TensorFlowとPyTorch、どっちを選ぶべき？


## **1. はじめに: なぜこの議論が必要なのか？**  

「TensorFlowとPyTorch、どちらを使うべきか？」——これは多くのAIエンジニアが直面する古典的な質問です。Google Brainチームが開発したTensorFlowと、Facebookが支援するPyTorchは、どちらも優れた深層学習フレームワークですが、設計思想やユースケースに違いがあります。  

本記事では、**実務での経験を踏まえ**、以下の観点で比較・解説します：  
- **開発スタイル**（Define-and-Run vs Dynamic Graph）  
- **デバッグの容易性**  
- **本番環境（Production）への適性**  
- **コミュニティとエコシステム**  

**最後には実践的なコード例**を通じて、両者の違いを体感できる構成にしました！  

---

## **2. TensorFlow vs PyTorch: 基本設計の違い**  

### **TensorFlowの特徴**  
- **静的グラフ（Graph Mode）**: 計算グラフを先に定義し、後で実行（Define-and-Run）  
- **高いスケーラビリティ**: GoogleのTPUや大規模分散学習に最適  
- **Production向け**: TensorFlow Serving、TFLiteなどのデプロイツールが充実  

### **PyTorchの特徴**  
- **動的グラフ（Eager Mode）**: コードを逐次実行（Define-by-Run）→ **デバッグが容易**  
- **PythonicなAPI**: NumPyに近い直感的な記述  
- **研究コミュニティで人気**: 最新論文の実装がPyTorchで公開されることが多い  

![図1: 計算グラフの違い](https://example.com/tf_vs_torch_graph.png)  

---

## **3. 実践比較: 同じモデルを両フレームワークで実装**  

### **例: MNIST分類タスク（3層CNN）**  

#### **PyTorch版**  
```python
import torch
import torch.nn as nn

class CNN(nn.Module):
    def __init__(self):
        super().__init__()
        self.layers = nn.Sequential(
            nn.Conv2d(1, 32, 3),
            nn.ReLU(),
            nn.Conv2d(32, 64, 3),
            nn.ReLU(),
            nn.Flatten(),
            nn.Linear(64 * 24 * 24, 10)
        )
    
    def forward(self, x):
        return self.layers(x)

model = CNN()
loss_fn = nn.CrossEntropyLoss()
optimizer = torch.optim.Adam(model.parameters())
```

#### **TensorFlow版**  
```python
import tensorflow as tf

model = tf.keras.Sequential([
    tf.keras.layers.Conv2D(32, 3, activation='relu', input_shape=(28, 28, 1)),
    tf.keras.layers.Conv2D(64, 3, activation='relu'),
    tf.keras.layers.Flatten(),
    tf.keras.layers.Dense(10)
])

model.compile(
    optimizer='adam',
    loss=tf.keras.losses.SparseCategoricalCrossentropy(from_logits=True)
)
```

**主な違い**:  
- PyTorch: `forward()`メソッドで計算過程を明示的に定義  
- TensorFlow: Keras APIを使うとより簡潔に記述可能  

---

## **4. 実務での知見: よくある落とし穴と対策**  

### **PyTorchあるある**  
- **GPUメモリリーク**: `.to(device)`の忘れ → `torch.cuda.empty_cache()`で対処  
- **勾配爆発**: `nn.utils.clip_grad_norm_()`でクリッピング  

### **TensorFlowあるある**  
- **Graph Modeのデバッグ難しさ**: `tf.print()`やEager Modeで検証  
- **SavedModelの互換性問題**: バージョン差異に注意 → Dockerで環境固定  

![図2: デバッグ手法比較](https://example.com/debug_compare.png)  

---

## **5. 応用: どちらを選ぶべきか？**  

### **PyTorchが向いているケース**  
- 研究開発やプロトタイピング  
- カスタムレイヤーや複雑な損失関数を頻繁に変更する場合  

### **TensorFlowが向いているケース**  
- 大規模データ処理（TF Data Pipeline）  
- モバイル/エッジデバイスへのデプロイ（TFLite）  

**最新動向**:  
- PyTorch 2.0の`torch.compile()`で推論速度向上  
- TensorFlowのJAX連携（例: TensorFlow Probability）  

---

## **6. 結論: 両方使えるのが最強！**  

| 観点 | PyTorch | TensorFlow |
|------|---------|------------|
| **学習曲線** | 優しい | やや難しい |
| **デプロイ** | ONNX経由 | ネイティブサポート |
| **コミュニティ** | 研究寄り | 産業界寄り |

**アドバイス**:  
- **初心者**: PyTorchから始めて動的グラフに慣れる  
- **プロダクション要件が明確**: TensorFlow/Kerasを選択  

「結局、**問題ドメインとチームのリソース**で決めるのが正解」というのが、Googleでの実感です。  

---

**次回予告**: 「**PyTorch LightningでResearchを爆速化する方法**」🎉  
質問やフィードバックはぜひコメントへ！ 🚀  

![図3: フレームワーク選択フローチャート](https://example.com/decision_flow.png)
SAP版本确认

第一步：
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3795764/5b7c3468-87d4-406d-9661-02828c316f3b.png)
第二步：
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3795764/baea2fdd-9dc5-48f8-81f8-f28794c28823.png)

你当前的 SAP GUI 是：

✅ SAP GUI 7.60 Final Release
✅ 补丁级别 Patch 2
✅ 构建号：1935947
✅ 文件版本：7600.1.2.3390
論理積( AND )の基本 &

AND演算の使い分けについて技術だけ抜き出してまとめてみた！



## <br>問題概要

0 または 1 の整数 A と B が与えられます。 A AND B の結果を出力してください。

<br>入力例：
```
0 1
```
出力例：
```
0
```
<br>

https://paiza.jp/works/mondai/logical_operation/logical_operation__basic_step1


## <br> ❌ NGコード
```js
if (A === 1 && B === 1) {
  console.log(1);
} else {
  console.log(0);
}
```
今回の問題では条件分岐を使わないのが条件。
(`&&` はブール判定用なので、「真偽値」を返す式)


## <br>✅ OKコード
```js
const [A, B] = input.split(' ').map(Number);
console.log(A & B);
```
`&` は「ビットAND」。`1 & 1` → `1`、それ以外 → `0`

## <br>💡 技術メモ
- `&`：整数同士のビット演算（論理積）
- `&&`：ブール値の論理演算（短絡評価）
- `if`文より論理演算子で一発解決のほうがコードがスッキリ
- `x & 1 === 0` で偶数判定にも使える


### <br>📘 新しく学んだことまとめ
- `a & b` でビット単位のANDが可能
- `&` vs `&&`、用途に応じて使い分け
- ビット演算はフラグ管理や高速な条件判定に便利



<br><br>[僕の失敗談と解決話！](https://paizabeginner.wordpress.com/2025/04/23/paiza%e3%81%a7%e5%9f%ba%e6%9c%ac%e3%83%9e%e3%82%b9%e3%82%bf%e3%83%bc-%e8%ab%96%e7%90%86%e7%a9%8d-and-%e3%81%ae%e5%9f%ba%e6%9c%ac%e3%80%80/)
いつも書くCSS　【チートシート】

```css
html{
    font-size: 62.5%;
    box-sizing: border-box;
}
*,
*::before,
*::after {
  box-sizing: inherit; /* 全ての要素でhtmlのbox-sizingを継承 */
}

body {
    margin: 0;
    padding: 0;
}

.fx-row{
    display: flex;
    flex-direction: row;
}

.fx-row-center{
    display: flex;
    flex-direction: row;
    justify-content: center;
    text-align: center;
}

.fx-col{
    display: flex;
    flex-direction: column;
}

.fx-col-center{
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.h100{
    height: 100%;
}

.w100{
    width: 100%;
}

.border{
    border: 1px solid black;
}

a{
    text-decoration: none;
    color: #007bff; /* 色は好みで換えてください。 */
}

a:hover {
    color: #0056b3;
    text-decoration: underline; /* 色は好みで換えてください。 */
  }
```

## 意図
web製作していて、いつも使うcssをまとめました。
HTMLやJSXのクラス名を指定してもらえば使える感じですね。
デザインに左右されず、汎用性高く使うであろうコードをまとめてみました。
自分がweb作り始めるときに、index.css等の適当なファイル名つけて使いまわしてます。

## 個人的な感想
- Taillandとかbootstrapとかの導入考えたことありますが、融通効かなそうだなと。今はSCSSを書いてます。
- コードスニペットていうのもあるみたいですけど、なんか面倒くさそうでした（コードまとめつくってコピペでファイルつくればいいやん）。
- RY原則で、複雑になりすぎない程度にコード量は減らしたいですから、その中でもとくにデフォで使い回すのはある。
    - Qiitaや他で調べてもそういうのまとめているサイトなかったので、まとめてみました（今後に自分が開発するときのセッティングの為にもなりますし）。

## コメントどうぞ
こういうCSSをまとめたやつのこと、何て言うんでしたっけ？
素人なので、不足点あれば指摘頂きたいです。
Linucレベル１勉強メモ #8

＃ 第一章　Linuxのインストールと仮想マシン・コンテナの利用

練習問題1.8
１時間後にシステムを再起動するコマンドを、必要なオプション、引数とともに記述してください。

（解答）　shutdown -r +60

(解説）
システムを再起動するには、-rオプションをつけてshutdownコマンドを実行します。再起動実行までのタイミングは、「+60」のように『+』　に続けて時間（分）を指定するか、「22:00」のように時刻で指定できます。

シャットダウン及び再起動について。
shutdown [オプション]　時間　[メッセージ]

シャットダウンの主なオプションについて
1. -h  <br>シャットダウンする
1. -r   <br>シャットダウン後にシステムを再起動する
1. -f   <br>次回起動時にfsckをスキップする（-hまたは-rと組み合わせて利用する）
1. -F   <br>次回起動時にfsckを必ず実行する（-hまたは-rと組み合わせて利用する）
1. -k   <br>実際にはシャットダウンせず警告メッセージを通知する
1. -c   <br>現在実行中のシャットダウンをキャンセルする


オプション後の引数について
* 時間<br>+5, now, 22:00など
* メッセージ<br>""や''で囲んだ範囲がメッセージなる。
# shutdown -r +60 "Please logout immediately"

（わからない単語解説）
* fsck<br>file system checkの略で、UNIX系OSでファイルシステムの整合性を確認し、エラーを修復するコマンドです。
【EC-CUBE4.3】マスターテーブル（mtb）をTraitで拡張してもDBにカラムが追加されない

EC-CUBE4.3 では、@EntityExtension アノテーションと Trait を使って、プラグインから既存エンティティにカラムを追加することができる。

https://doc4.ec-cube.net/customize_entity

ところが、mtb_xxx系（マスターテーブル）にTraitでカラム追加しても、なぜか doctrine:schema:update では反映されなかった。

https://github.com/EC-CUBE/ec-cube/issues/6273

どうやら、ECCUBEの仕様か、バグのよう。
AWS Cognito M2M認証フローの課金変更に関する重要なお知らせ

# はじめに
AWS Summit 2025 Tokyo の申し込みを昨日行った [@\_\_\_nix___](https://twitter.com/___nix___) です。

AWSから重要な通知が届きました。Amazon CognitoのM2M（Machine-to-Machine）認証フローの課金に関する変更についてです。この変更は、多くのAWSユーザーに影響を与える可能性のある重要なアップデートです。

# 背景
- 2024年5月9日にAmazon CognitoのM2M認証フローの課金に関する発表がありました。

https://aws.amazon.com/jp/about-aws/whats-new/2024/05/amazon-cognito-tiered-pricing-m2m-usage/

- 最近になって最終警告として以下の通知がありました。
  ```
  [Notification] Reminder: Amazon Cognito pricing for OAuth 2.0 client credentials (or machine-to-machine) flow will start on May 9, 2025 [AWS Account: xxxxxxxxxxxx]
  ```


# 概要
- 2025年5月9日から、Amazon CognitoのM2M認証フローの使用に対して課金が開始されます。
- 課金対象となるのは以下の通り。
  - OAuth 2.0 client credentials grant typeで設定されたアプリケーションクライアント
  - このフローを使用したトークンリクエストの数

https://aws.amazon.com/jp/cognito/pricing/
> 基本料金: クライアント数 × 6.00 USD
> リクエスト料金: リクエスト数 × 0.00225 USD


# 調査
現在の使用状況を確認するために、以下の方法を準備してみました。

## 1. スクリプトを使用した調査
   - `check_m2m_clients.sh`スクリプトを使用して、M2M認証フローを使用しているアプリケーションクライアントを特定。
   - スクリプトの実行方法
     ```bash
     ./check_m2m_clients.sh
     ```
   - 出力結果から以下の情報を確認
     - M2M認証フローを使用しているアプリケーションクライアントの数
     - 各クライアントの使用状況
     - 不要なクライアントの特定

実行結果の例：
```bash
$ ./check_m2m_clients.sh
チェック中: us-west-2_XXXXXXXX1
チェック中: us-west-2_XXXXXXXX2
チェック中: us-west-2_XXXXXXXX3
チェック中: us-west-2_XXXXXXXX4
チェック中: us-west-2_XXXXXXXX5
チェック中: us-west-2_XXXXXXXX6
チェック中: us-west-2_XXXXXXXX7
チェック中: us-west-2_XXXXXXXX8
M2Mクライアント検出: app_client_1 (UserPool: us-west-2_XXXXXXXX8)
M2Mクライアント検出: app_client_2 (UserPool: us-west-2_XXXXXXXX8)
M2Mクライアント検出: app_client_3 (UserPool: us-west-2_XXXXXXXX8)
チェック中: us-west-2_XXXXXXXX9
```

<details>
<summary>check_m2m_clients.sh</summary>

   ```bash
#!/bin/bash

# AWS CognitoのユーザープールIDのリストを取得
user_pool_ids=$(aws cognito-idp list-user-pools --max-results 60 --query 'UserPools[*].Id' --output text)

if [ -z "$user_pool_ids" ]; then
    echo "エラー: ユーザープールが見つかりません"
    exit 1
fi

# 各ユーザープールをチェック
for user_pool_id in $user_pool_ids; do
    echo "チェック中: $user_pool_id"
    
    # アプリケーションクライアントの一覧を取得
    clients=$(aws cognito-idp list-user-pool-clients --user-pool-id "$user_pool_id" --query 'UserPoolClients[*].{ClientId:ClientId,ClientName:ClientName,AllowedOAuthFlows:AllowedOAuthFlows}' --output json)
    
    # M2Mクライアントを検出
    echo "$clients" | jq -r '.[] | select(.AllowedOAuthFlows[]? == "client_credentials") | "M2Mクライアント検出: \(.ClientName) (UserPool: \($user_pool_id))"' --arg user_pool_id "$user_pool_id"
done
   ```
   </details>

   注意事項：
   - AWS CLIとjqが必要です
   - スクリプトに実行権限を付与する必要があります（`chmod +x check_m2m_clients.sh`）
   - AWS認証情報が適切に設定されている必要があります
   - 実際のユーザープールIDを`XXXXXXXX`の部分に置き換えて使用してください

## 2. AWSマネージドコンソールで確認
確認方法は以下が参考になると思います。

https://dev.classmethod.jp/articles/amazon-cognito-tiered-pricing-m2m-usage/

# 対応
1. 現在の使用状況の確認
2. 不要なアプリケーションクライアントがあれば削除
3. 必要に応じてAWSサポートまたはアカウントチームへの問い合わせ

# 終わりに
この変更は、CognitoのM2M機能の継続的な改善と投資を可能にするための措置です。最近では、M2M認証フローのアクセストークンのカスタマイズ機能も追加されています。

# 一言
AI界隈では MCP や A2A 等目まぐるしく変化する中で AWS だけに気を取られないようにしないとですね。
とは言え、まだまだ変化が激しい AI界隈 の何にキャッチアップしていくかも重要そうです。
家計簿アプリを作る＃３６

![スクリーンショット 2025-04-23 154821.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4012588/f3ef5c28-9fec-44e0-8e3e-9aec2c7e9e96.png)
CSSPropertiesをインポートし、選択されたメニューのカラーの設定をする👆

![スクリーンショット 2025-04-23 155027.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4012588/0c7871a5-7809-414e-a7ae-ca3031609f6c.png)
textDecorationをnoneにすると、メニューをしたときに、青色になるのを防ぎ、
color inheritとすることで、親要素のカラーを受け継ぐ。（親要素でなにも色が指定されてなかったら、デフォルトの黒色）
aタグは、インライン要素で、うまく表示されない可能性もあるので、display blockで指定する。
また、activeLinkStyleで、背景色を変えたいので、backgroundColorに変える。
Linucレベル１勉強メモ　＃７

＃ 第一章　Linuxのインストールと仮想マシン・コンテナの利用

練習問題1.7
systemdを採用しているシステムで、シングルユーザーモードを開始するコマンドを選択してください。

A.  systemctl isolate single

B.  systemctl isolate single-user.target

C.  systemctl isolate rescue.target

D.  systemctl isolate system-single.target

（解答）　C.

（解説）
シングルユーザーモード（レスキューモード）は、メンテナンス用のシステム状態です。一般ユーザーのログインはできず、ネットワークも遮断されます。シングルユーザーモードに移行するには、rootユーザーで「systemctl isolate rescue.target」コマンドを実行します。選択肢A, B, Cは存在しないターゲットで使うとエラーになります。

systemdのブートターゲットについて
ターゲットの確認方法は、
$ systemctl get-default
で確認することができます。

システム起動時のログイン方法の設定の仕方について
# systemctl set-default ~~~~~

システム終了または再起動する際は、　次のコマンドを使います。
# systemctl isolate reboot.target

ターゲットの種類
* multi-user.target
 CUIログインであることを表している。
* graphical.target
　グラフィカルログインであることを表している。
* poweroff.target
　システム終了
* rescue.target
　レスキュー（シングルユーザーモード）モード
* reboot.target
　システム再起動
HDFS Balancer の設定と CLI のオプション

# この記事について

以下のドキュメントの翻訳。

https://docs.cloudera.com/runtime/7.3.1/scaling-namespaces/topics/hdfs-configurations-and-cli-options-for-the-hdfs-balancer.html

[日本語の親記事はこちら](https://qiita.com/items/ac830c20d5d771b074e3)。

# 翻訳

HDFS Balancer は、さまざまな設定オプションを変更したり、コマンドラインで設定することができます。

## [Balancer を設定するためのプロパティ](https://qiita.com/IQ_Bocchi/items/b1b7d08bbb4001548fe8)

要件に応じて、HDFS Balancer のためのさまざまなプロパティを設定することができます。

## [Balancer のコマンド(翻訳準備中)](https://docs.cloudera.com/runtime/7.3.1/scaling-namespaces/topics/hdfs-balancer-commands.html)

`hdfs balancer` コマンドのさまざまなオプションを使って、HDFS Balancer を扱うことができます。

## [Balancer の設定の推奨値(翻訳準備中)](https://docs.cloudera.com/runtime/7.3.1/scaling-namespaces/topics/hdfs-recommended-configurations-for-the-balancer.html)

HDFS Balancer はバックグラウンドモードもしくは高速モードで実行することができます。

どのモードで実行したいかに応じて、さまざまなプロパティを推奨された値に設定することができます。
クラスタのバランシングのアルゴリズム

# この記事について

以下のドキュメントの翻訳。
https://docs.cloudera.com/runtime/7.3.1/scaling-namespaces/topics/hdfs-cluster-balancing-algorithm.html

[日本語の親記事はこちら](https://qiita.com/items/ac830c20d5d771b074e3)。

# 翻訳

## クラスタのバランシングのアルゴリズム

HDFS Balancer は繰り返し実行されます。それぞれの繰り返し（イテレーション）は、以下の4つのステップから成ります。

1. ストレージのグループを分類する
1. ストレージのグループをペアリングする
1. ブロック移動をスケジュールする
1. ブロック移動を実行する

### [1. ストレージのグループを分類する](https://docs.cloudera.com/runtime/7.3.1/scaling-namespaces/topics/hdfs-step-1-storage-group-classification.html)

HDFS Balancer は最初に `getLiveDatanodeStorageReport` のRPCを NameNode に送り、すべての DataNode のすべてのストレージのレポートを取得します。ストレージのレポートには、各DataNode のストレージの使用状況、たとえばキャパシティ、dfsの使用済み容量、空き容量などが含まれます。

### [2. ストレージのグループをペアリングする](https://docs.cloudera.com/runtime/7.3.1/scaling-namespaces/topics/hdfs-step-2-storage-group-pairing.html)

HDFS Balancer は、使いすぎ、あるいは平均よりも使用量の大きいストレージをソースストレージとし、使われなさすぎ、あるいは平均よりも使用量の小さいストレージをターゲットストレージとします。そして、ソースストレージのグループをターゲットストレージのグループとペアリングします（ソース→ターゲット）。ペアリングの優先順位は、ソースおよびターゲットのストレージが同じラックにあるかどうかによって決まります。

### [3. ブロック移動をスケジューリングする](https://docs.cloudera.com/runtime/7.3.1/scaling-namespaces/topics/hdfs-step-3-block-move-scheduling.html)

それぞれのソース・ターゲットのペアについて、HDFS Balancer がソースストレージからブロックのレプリカを選び、ブロックの移動をスケジューリングします。

### [4. ブロックの移動を実行する](https://docs.cloudera.com/runtime/7.3.1/scaling-namespaces/topics/hdfs-step-4-block-move-execution.html)

HDFS Balancer はターゲットの DataNode で `DataTransferProtocol.replaceBlock(..) ` メソッドを起動することにより、スケジュールされたブロックの移動を実行します。
Linucレベル１勉強メモ　＃６

＃ 第一章　Linuxのインストールと仮想マシン・コンテナの利用

練習問題1.6
システム電源を入れてからOSが起動するまでの流れを、正しい順に並べてください。

A. init/systemd→BIOS/UEFI→ブートローダー→カーネル

B. カーネル→init/systemd→BIOS/UEFI→BIOS/UEFI

C. BIOS/UEFI→ブートローダー→カーネル→init/systemd

D. BIOS/UEFI→カーネル→ブートローダー→init/systemd

（解答）　C.

（解説）

（わからない単語解説）
* ブートローダー
　コンピュータの起動時にハードディスクなどストレージからオペレーティングシステム（OS）をメモリに読み込み、起動させるためのソフトウェアプログラム
* init/systemd
　
 


1. システムの電源を入れる
1. BIOS/UEFIが起動
1. BIOS/UEFIがハードウェアのチェックや初期化を行う
1. 起動デバイスに書き込まれたブートローダを読み込み
1. ブートローダが起動
1. ブートローダがカーネルをメモリ上へ読み込み
1. カーネルが起動
1. カーネルがメモリの初期化やシステムクロックの設定などを実施
1. カーネルが初期RAMディスクをマウント
1. カーネルがinit/systemdプロセスを実行
1. init/systemdが必要なサービスを起動した後にログインプロンプトを表示
1. 起動処理の完了
ヤマハルータで利用ポート数の変更

ヤマハルーターでポートセービング IPマスカレードを無効にしている場合の話です。
設定としては次の状況です。
```
nat descriptor backward-compatibility 1
```



ヤマハルーターのNATセッション数=カタログスペックに記載の通りといつの間にか信じ込んでいました。通信不良が発生したので、いろいろと調査しながらリファレンスを確認していたところ、

> Rev.14.01 系以降では IP マスカレードの最大使用ポート数にかかわらず以下のように設定されている
port_range1=60000-64095、port_range2=49152-59999、port_range3=44096-49151
( 初期設定ポート数は 20000 )

https://www.rtpro.yamaha.co.jp/RT/manual/rt-common/nat/nat_descriptor_masquerade_port_range.html

とのこと。

私の場合は、
```
nat descriptor masquerade port range 1 60000-64095 49152-59999 24096-49151
```
にて様子見です。


最近のヤマハルーターのデフォルトは
```
nat descriptor backward-compatibility 2
```
となっており、同一のポート番号を使用して複数の宛先ホストとのセッションを確立する機能が有効になっています。

https://www.rtpro.yamaha.co.jp/RT/docs/nat-descriptor/nat-compatibility.html
ruri-v3-130mをJMTEBで測る

日本語[modernbert-ja-130m](https://huggingface.co/sbintuitions/modernbert-ja-130m)ベースの[ruri-v3-130m](https://huggingface.co/cl-nagoya/ruri-v3-130m)がリリースされたので、[JMTEB](https://www.sbintuitions.co.jp/blog/entry/2024/05/16/130848)で評価してみた。python3.9のlinux環境だと、こんな感じ。

```
#! /bin/sh
model="cl-nagoya/ruri-v3-130m"
pip3.9 install sentence-transformers accelerate datasets jsonnet jsonargparse smart-open openai loguru tiktoken triton
test -d JMTEB || git clone --depth=1 https://github.com/sbintuitions/JMTEB
NAWK=nawk
if [ -x /usr/bin/gawk ]
then NAWK=/usr/bin/gawk
elif [ -x /usr/bin/mawk ]
then NAWK=/usr/bin/mawk
fi
find JMTEB/src -type f -print |
( while read F
  do T=`echo $F | sed 's?/src/?/src9/?'`
     mkdir -p `dirname $T`
     case $T in
     *.py) $NAWK '
{
  if(f!=1){
    if($0!~/__future__/){
      printf("from typing import Union\n");
      f=1;
    }
  }
  s=$0;
  while(match(s,/[A-Za-z]+(\[[A-Za-z ",]+\])?( \| [A-Za-z]+(\[[A-Za-z ",]+\])?)+/)>0){
    u=substr(s,RSTART,RLENGTH)
    gsub(/\|/,",",u);
    s=substr(s,1,RSTART-1)"Union["u"]"substr(s,RSTART+RLENGTH);
  }
  print s;
}' $F > $T ;;
     *) cp $F $T ;;
     esac
  done
)
( cd JMTEB/src9 && python3.9 -m jmteb --embedder SentenceBertEmbedder --embedder.model_name_or_path $model --save_dir ../../result/$model )
echo '***' $model
cat result/$model/summary.json
echo ''
```

NVIDIA A100-SXM4-40Bだと、約3時間半で以下の結果が出力された。

```
*** cl-nagoya/ruri-v3-130m
{
    "Classification": {
        "amazon_counterfactual_classification": {
            "macro_f1": 0.7790776469384886
        },
        "amazon_review_classification": {
            "macro_f1": 0.5959270853113815
        },
        "massive_intent_classification": {
            "macro_f1": 0.7968711078994167
        },
        "massive_scenario_classification": {
            "macro_f1": 0.8922123493432567
        }
    },
    "Reranking": {
        "esci": {
            "ndcg@10": 0.9321309125354799
        }
    },
    "Retrieval": {
        "jagovfaqs_22k": {
            "ndcg@10": 0.7095083666548581
        },
        "jaqket": {
            "ndcg@10": 0.6679233579709684
        },
        "mrtydi": {
            "ndcg@10": 0.40838348460420837
        },
        "nlp_journal_abs_intro": {
            "ndcg@10": 0.992308884308699
        },
        "nlp_journal_title_abs": {
            "ndcg@10": 0.9706622533924095
        },
        "nlp_journal_title_intro": {
            "ndcg@10": 0.9417008771497123
        }
    },
    "STS": {
        "jsick": {
            "spearman": 0.7465128160181561
        },
        "jsts": {
            "spearman": 0.8385564198643788
        }
    },
    "Clustering": {
        "livedoor_news": {
            "v_measure_score": 0.5688221984461402
        },
        "mewsc16": {
            "v_measure_score": 0.48905298349349013
        }
    },
    "PairClassification": {
        "paws_x_ja": {
            "binary_f1": 0.6225736879942487
        }
    }
}
```

[2月19日の記事](https://qiita.com/KoichiYasuoka/items/d36262156168b31d079d)に較べると、`Retrieval`が非常に強化されている。他も良くなっており、[Ruri](https://zenn.dev/hpp/articles/b5132c64c40d24)とModernBERTは、かなり相性がいいと言えるだろう。
PL/I 練習問題

問題4：最大値と最小値の算出
目的：配列、ループ、比較の応用
内容： 複数の数値を入力し、最大値と最小値を求めて表示する。
<details>
  <summary>回答</summary>
  
  ```
  TEST: PROCEDURE OPTIONS(MAIN);
  DECLARE N(10) FIXED;
  DECLARE I FIXED;
  DECLARE MAX FIXED;
  DECLARE MIN FIXED;

  PUT SKIP LIST('10個の整数を入力してください:');
  DO I = 1 TO 10;
    GET LIST(N(I));
  END;

  MAX = N(1);
  MIN = N(1);

  DO I = 2 TO 10;
    IF N(I) > MAX THEN MAX = N(I);
    IF N(I) < MIN THEN MIN = N(I);
  END;

  PUT SKIP LIST('最大値:', MAX);
  PUT SKIP LIST('最小値:', MIN);
END TEST;
  ```
</details>

問題5：簡単な家計簿の作成
目的：構造体の使い方の練習
内容： 支出の内容（日付・金額）を構造体で保持し、1週間分の合計・平均を表示する。
<details>
  <summary>回答</summary>
  
  ```
  TEST: PROCEDURE OPTIONS(MAIN);
  DECLARE 1 EXPENSE(7),
            2 DAY CHAR(10),
            2 AMOUNT FIXED DEC(7,2);

  DECLARE I FIXED;
  DECLARE TOTAL FIXED DEC(7,2) INIT(0);
  DECLARE AVERAGE FIXED DEC(7,2);

  DO I = 1 TO 7;
    PUT SKIP LIST('日付と金額を入力してください (例: Mon 1234.56)');
    GET LIST(EXPENSE(I).DAY, EXPENSE(I).AMOUNT);
    TOTAL = TOTAL + EXPENSE(I).AMOUNT;
  END;

  AVERAGE = TOTAL / 7;

  PUT SKIP LIST('合計:', TOTAL);
  PUT SKIP LIST('平均:', AVERAGE);
END TEST;
  ```
</details>

問題6：九九表の出力
目的：入れ子ループの理解
内容： 九九（1～9の掛け算）の表を出力するプログラムを作成する。
<details>
  <summary>回答</summary>
  
  ```
TEST: PROCEDURE OPTIONS(MAIN);
  DECLARE I, J FIXED;

  DO I = 1 TO 9;
    DO J = 1 TO 9;
      PUT EDIT(I, '*', J, '=', I*J) (F(2), A(1), F(2), A(1), F(3));
      PUT SKIP;
    END;
    PUT SKIP;
  END;
END TEST;
  ```
</details>
Win11でbatファイルが管理者権限でも実行できない

<h2>batが実行できない</h2>
Windows11で<br>copyコマンドが入っているbatファイルをダブルクリックで実行しようとした時<br>  
copyのパス内ディレクトリ名に　日本語が含まれている　とコマンドが実行されない
<br>
<br><br>
こちらは通らないが<br>

```copy_fail.bat
@echo off
copy "\\HOSTNAME_XXX\Users\USER_XXX\Documents\tasks違うよ\task.txt" "C:\Users\USER_YYY\Documents\tasks\" /Y
```


こちらは通る<br>
```copy_sucs.bat
@echo off
copy "\\HOSTNAME_XXX\Users\USER_XXX\Documents\tasks_differ\task.txt" "C:\Users\USER_YYY\Documents\tasks\" /Y
```


管理者権限は関係ないみたい<br>
<br>


追記：そんな事はなく　UTF-8ではなくShift_JIS(ANSI)にすれば日本語も通りました
@matub-ken 　からの連絡にて発覚！

ありがとうございます！！
ペロッ…これはAI生成記事！ 見分け方のコツ

実際にChatGPTにサンプル記事を生成させてみた結果を例に、紹介します。

![スクリーン ショット 2025-04-23 に 14.17.47 午後.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/df4e06c2-d9e7-406b-baa3-9bf6a41ba449.png)


# 特徴① 箇条書きが多い ＆ 行頭が太字

特に太字は、AIからのコピペの際に `**` 記号が残っている記事も多いですね。

![スクリーン ショット 2025-04-23 に 14.12.38 午後.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/1bf99572-68e7-4da7-b389-3e010608d61e.png)


# 特徴② 見出しでやけにコロンが使われる

これは英語圏でのライティング文化の影響を受けている気がします。

![スクリーン ショット 2025-04-23 に 14.13.33 午後.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/f1355156-6df6-4215-a8be-99c00e8e8bb9.png)


# 特徴③ 抽象名詞による体言止めが多い

これも英語表現に引っ張られていますね。

![スクリーン ショット 2025-04-23 に 14.15.22 午後.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1633856/f232c21d-8078-49d6-a448-7a3d99025cc9.png)


# おまけ： AIに生成させて何が悪いの？

書き物仕事でAIを活用することについては、賛否あると思います。私も両方の言い分が理解できるので一様に肯定・否定はしていません。

- ポジティブな意見の例：もっと多くの人がAIを活用して生産性を上げるべき。活用ハードルを上げないためにも、AIを使うこと自体に目くじらは立てず、人間のレビュー反映結果も含めてその人の責任ある成果物として評価すべきだ。
- ネガティブな意見の例：ハルシネーションのリスクを防ぎきるのは難しい。人間味に欠けるし誠意や気持ちが問題になる場面も多い。

ブログや登壇資料にAIを活用する場合は、はじめから **「このコンテンツの作成はAIくんをガンガン頼ってます！でもちゃんとレビューしてますよ」** と堂々と宣言してしまえば、読み手の心象が良くなるかもしれませんね。

# おまけ2： で、お前はどう思うの？

私の場合、**「テキスト表現そのものにコンテンツとしての価値がある成果物」** に対して直接AIによる生成を使うことには消極的な立場です。理由はいくつかあります。

- 自分の求めるクオリティの成果物を生成させようとすると、プロンプトエンジニアリングや修正対応含めて逆に時間がかかる
- 自分の知見を整理して文章でうまく伝えようとする作業が楽しいので、そもそもAIにやらせるモチベーションが低い
- 自分が他人の面白そうなブログを見つけて、AI生成と分かると単純にガッカリする

（特に、誰かから強制されたわけでもない自主的なアウトプットをAIに生成させるのは、どういうモチベーションでそうなるんだろう…？と思う部分もあります）

また、AI生成テキストをそのまま投稿してしまうと、Qiitaの場合はガイドライン違反になることもあるので注意しましょう。

https://help.qiita.com/ja/articles/qiita-community-guideline#ai

逆に、以下のようなケースでは私も積極的にLLMを活用しています。

- テーマに関する事前調査
- 言葉選びに悩むときの候補表現リストアップ
- 誤字脱字の検出
- テキスト表現そのものにコンテンツ価値が低い作文作業（利用頻度の低いマニュアル、プロンプト作成など）

AIがもっと賢くなって、人間よりも圧倒的に高品質なアウトプットをサッと作ってくれる時代が早く来るといいですね！
「法務省地図XMLアダプトプロジェクト」をpmtilesにしたときのFeature ID

# 概要
以前、登記所備付地図を扱う「法務省地図XMLアダプトプロジェクト」を改造して、
コンテナ化する取り組みを書きました。
この中で地物のIDをどうするかという問題を抱えており、それに対応した内容をまとめたものになります。

https://qiita.com/shinya_nakashima/items/8865e52b5538a3032182


# 筆IDに代わるIDを生成

もともとの`地図XML`には、`筆ID`なるものが含まれています。
これは地図XMLファイルの中では、確かにID(重複の無い一意な値)なのですが、複数の地図XMLを結合する場合には被ってしまいます。

https://github.com/shinyanakashima/amx-a/issues/2

例えば、[MIERUNE](https://qiita.com/organizations/MIERUNE)さんのQGISプラグイン [qgis-mojxml-plugin](https://github.com/MIERUNE/qgis-mojxml-plugin)では、`fid`というQGISで地物に付与されるIDを利用しているようです。

とはいえQGISを使うわけではないので、地図XMLのファイル名は市区町村コード（５桁）-法務局コード（４桁）.zipとなっていることから、{都道府県名}_{地図XMLファイル名}_{筆ID}で、`ID`とすることにしました！

## 実装
`mbtiles`や`pmtimes`で利用されるMVTのFeature(地物)では、IDには`uint64`を使うようです（下記参照）。そこで、人間が判読できるようにしたID(属性情報に`global_id`として追加）、システム内で利用するID（`RFC 7946`にあるGeoJSONのID、MVTのFeature ID = `uint64`）を追加することにしました。

- まず`global_id`を生成しますが、`{都道府県名}_{地図XMLファイル名}_{筆ID}`でIDとします
- 次に`id`は、`global_id`を`SHA256`でハッシュ化したものを整数値にしました。`SHA256`は32バイト（256bit）なので、先頭8バイト = 64bitとなり、`uint64`に適合できます
- もちろん​ハッシュ衝突する可能性はありますが、その時は別途考えます🤔

### MVTでのID

> A feature MAY contain an id field. If a feature has an id field, the value of the id SHOULD be unique among the features of the parent layer.

https://github.com/mapbox/vector-tile-spec/tree/master/2.1#42-features

また、MVTで利用される`.proto`では、`uint64`で明記されているので、今回はこれを採用しました。

https://github.com/mapbox/vector-tile-spec/blob/c8d178da65cce0ea474e3d99e3368970ce217093/2.1/vector_tile.proto#L32
【React 初心者】aspida/swrを使ってグローバルミューテートしてデータを再検証する

# 環境
        "next": "15.2.3",
        "react": "^19.0.0",
        "react-dom": "^19.0.0",
        "@aspida/axios": "^1.14.0",
        "@aspida/swr": "^1.14.0",
        "aspida": "^1.14.0",
        "axios": "^1.8.4",
        "swr": "^2.3.3",
フェッチにはaxiosを使ってます
# 問題

要約
- swrを使う際の要領でuseAspidaSWRを使ってグローバルミューテートを行おうとすると再検証されない

データを更新した際などにデータを再検証させる場合にmutateを行う必要があるが、このときバインドミューテーションとグローバルミューテーションから選択できる。

バインドミューテーションはSWRからフックを呼び出す際にmutateを呼び出すことで利用できる
```typescript
const { data, mutate } = useSWR('/api/user', fetcher)

  mutate(); // 再検証
```
グローバルミューテーションはimport { mutate } from "swr"で呼び出す方法(useSWRConfigを呼び出しても可能)
keyを指定する必要があり、一致するkeyのデータの再検証のみを行う
```typescript
 mutate('/api/user')
```
これをaspida/swrで同様に実装しようとすると再検証がされない
```typescript
const { data } = useAspidaSWR(apiClient.user,"get")

// 別ファイル
 mutate('/api/user') // 呼び出しても再検証されない
```

# 解決方法
aspida/swrのkeyを指定する
```typescript
const { data } = useAspidaSWR(apiClient.user,"get",{key:"api/user"})

// 別ファイル
 mutate('/api/user')
```

key名はエンドポイントにしておけばまず被ることもないだろうし、特に問題はないはず

一応指定しない場合のkeyの構造について
どうやら配列型になってるっぽい?以下aspida/swrのサンプルコードから引用
```typescript
const { data: user } = useAspidaSWR(client.user);
const { data } = useAspidaSWR(client.articles, {
  query: { userId: user?.id ?? 0 },
  enabled: !!user,
});
// is an alias of
const { data } = useSWR(
  user ? [client.articles.$path({ query: { userId: user.id } }), "$get"] : null,
  () => client.articles.$get({ query: { userId: user.id } })
);
```
この配列がそれっぽい
mutateの中身はkey指定した方がスッキリしそうだし、今回の解決法でよさそう
# 参考
SWR　mutate(グローバルミューテート)
https://swr.vercel.app/ja/docs/mutation#global-mutate
aspida/swr
https://github.com/aspida/aspida/tree/main/packages/aspida-swr#readme
クリップボードの画像をファイルに落とすワンライナー


### サンプル

```powershell
Add-Type -AssemblyName System.Windows.Forms; Add-Type -AssemblyName System.Drawing; [Windows.Forms.Clipboard]::GetImage().Save("$env:USERPROFILE\Desktop\clipboard.png", [Drawing.Imaging.ImageFormat]::Png)
```

### 解説

PowerShellのクリップボードアクセス機能ではなく、.netを直接呼び出している。
【備忘録】UbuntuでインストールしたMySQLのデータを初期化するやり方


:::note warn
# 実行する前に必ず確認してください
- この記事のコマンドはAIに聞いて、実行できるか試していますが、バージョンの違いなどにより、実行できなくなっている可能性がありますので、ご了承ください
- MySQLについて詳しくは、そこまで知らないため、質問してもお答えできない場合があります
- 任意ですがバックアップをおこなってください
- 実行する場合は自己責任でお願いします
:::

## 動作環境
- OS: Ubuntu 22.04.3 LTS
- MySQL: Ver 8.0.41

下記のコマンドで、OSとMySQLのバージョンを確認できると思います。（MySQLをインストールしている時）
```
mysql --version
```

## データベースの削除・ディレクトリの初期化

起動している場合は、いったん起動停止をしましょう。
```
sudo systemctl stop mysql
```

データベースのフォルダ権限の書き換え（念のため）
```
sudo chown -R $USER:$USER /var/lib/mysql/
```

データベースのフォルダを削除
```
sudo rm -rf /var/lib/mysql/
```

データベースのフォルダの中身がなくなったか確認
```
ls -l /var/lib/mysql/
```

ディレクトリの初期化
```
sudo /usr/sbin/mysqld --user=mysql --initialize
```

一度に実行したい人向け
```
sudo systemctl stop mysql
sudo chown -R $USER:$USER /var/lib/mysql/
sudo rm -rf /var/lib/mysql/
sudo /usr/sbin/mysqld --user=mysql --initialize
```

このようなログが最後に出れば成功です
```terminalのlog.
XXXX-XX-XXTXX:XX:XX.XXXXXXZ 6 [Note] [MY-010454] [Server] A temporary password is generated for root@localhost: ${Password}
```

${Password}は一時パスワードです。再インストール時に必要となりますので、メモしておいてください。

## 起動確認

MySQLの起動
```
sudo systemctl start mysql
```

MySQLが起動しているか確認
active (running)と出ていれば、起動成功です。
```
sudo systemctl status mysql
```

MySQLへの接続
```
mysql -u root -p
```

実行すると、
```terminalのlog.
Enter password: 
```
と聞かれるので、先ほど取得した一時パスワードでログインしましょう。

成功したらMySQLのコンソールが出ると思います。
下記のようなものです。
このあとは「MySQLのコンソール」のことを「SQL画面」と呼びます
```SQL画面.
Welcome to the MySQL monitor.  Commands end with ; or \g.
Your MySQL connection id is 8
Server version: 8.0.41-0ubuntu0.22.04.1

Copyright (c) 2000, 2025, Oracle and/or its affiliates.

Oracle is a registered trademark of Oracle Corporation and/or its
affiliates. Other names may be trademarks of their respective
owners.

Type 'help;' or '\h' for help. Type '\c' to clear the current input statement.

mysql> 
```

下記の「新しいパスワード」に自分が使う、安全なパスワードを入れて、SQL画面で実行してください。
```
ALTER USER 'root'@'localhost' IDENTIFIED BY '新しいパスワード';
```

「Query OK」が表示されれば変更できたことになります。

これにて、MySQLを初期化の手順を終わります。
おつかれさまでした。

SQL画面の閉じ方は下のコマンドを実行することで終了することができます。
```
exit
```

## 参考
Gemini2.0 Flash に何度質問して、実行を何回も試した上で、正確性を試した上で記事を載せています。
https://gemini.google.com/
依存性の注入

# 1. 要約
- オブジェクト指向（OOP）のデザインパターンの１つに、「**依存性の注入**」と呼ばれるものがある
- **依存性の注入**とは、クラスが必要とする依存オブジェクトを**外部から渡してもらう**設計のことを指す
- **依存性の注入**により、より柔軟なプログラムを作成することができる

# 2. 依存性の注入とは？
依存性の注入とは、あるオブジェクトAが内部で別のオブジェクトBを必要とするとき（=依存関係を持つとき）、必要なオブジェクトBを**Aの中で作成するのではなく**、オブジェクトAの外で作成をしてからオブジェクトBを渡すデザインパターンを指す。

これにより、

- 柔軟で拡張性のある設計ができる
- テストが行いやすくなる
- 依存関係が明瞭になる

等の利点がある。

## 2.1. 拡張性のある設計 - 責務の削減
プログラミングに関する原則の一つに、単一責任の原則がある。これは、クラスが担う責任を、たった1つに限定するというもの。この考え方に従えば、「依存をするものの生成」は本来そのクラスの責任ではない。依存性の注入は、この責務を他に分離する為の仕組みである。

## 2.2. テストが行いやすくなる - 依存の置き換え
依存性を外部から注入することで、本番用のオブジェクトではなく、テスト用のモックを注入することができる。これにより、ネットワーク通信やデータベース接続のような外部要因に依存する処理も、外部リソースに接続せずユニットテストを実施できるようになる。

例として、データベースを要求する `UserService` クラスがあるとする。

```python
class UserService:
    def __init__(self):
        self.db = RealDatabaseConnection()  # ← 依存が直接埋め込まれている
```

このままだと、テスト時に常に `RealDatabaseConnection` を使ってしまう。

依存性の注入を行うと：
```python
class UserService:
    def __init__(self, db):
        self.db = db
```
このように、`db` を外部から渡すことで、本番環境とは異なるテスト用の環境を渡して `UserService` のテストを行うことができる。

## 2.3. 依存関係の明確化
依存性の注入によって、クラスが何に依存しているのかが明示的になる。コードを読む人にとって「クラスが何を前提として動作しているのか」を把握しやすくなる。

また、外部から渡される依存を明示することで、**「初期化順序」や「設定漏れ」などのバグも防止しやすくなる**という副次的なメリットもある。
【JS】document.getElementById('id名') と $('#id名')が違う

**背景**
下記みたいなコードがある。
```例１.javascript
const resetBtn = document.getElementById('reset-btn');

if (resetBtn) {  //要素が存在する場合
     //何かの操作
} else {  //要素が存在しない場合
    filter_setting();
}
```
`const resetBtn = document.getElementById('reset-btn');`を`const resetBtn = $('#reset-btn');`に変えると、下記となる。
```例２.javascript
const resetBtn = $('#reset-btn');

if (resetBtn) {  //要素が存在する場合
    //何かの操作
} else {  //要素が存在しない場合
    filter_setting();
}
```
**問題**
`resetBtn`が「存在していない」のに、`filter_setting();`が実行されない。

**原因**
例１の場合、`resetBtn`には、`id="reset-btn"`のDOM要素そのものが代入される。
例２の場合、`resetBtn`には、`id="reset-btn"`の要素をラップしたjQueryオブジェクトが代入される。
（DOM要素そのものを取り出すには`resetBtn[0]`や`resetBtn.get(0)`を使う。）

JavaScriptの`if (resetBtn)`チェックは、jQuery オブジェクトが**常に**真と評価されるため、`filter_setting();` の条件が満たされない。


**解決策**
jQuery を使って、要素が存在するかどうかをチェックするには `.length` を確認する。

```javascript
const resetBtn = $('#reset-btn'); 

if (resetBtn.length > 0) {  //要素が存在する場合
     //何かの操作
} else {  //要素が存在しない場合
    filter_setting();
}
```
[writeup] picoCTF "Inspect HTML"

# 今回の問題
picoCTFより"Inspect HTML"を解いていきます。

# 実際に解いていく
### 1. 問題文にあるWebサイトに移動する
![Inspect HTML_1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3945501/57dcdec2-7077-4c67-9a19-d08dba26fe25.png)
ふむふむ。世界には面白い暗号がありますね。
しかし、今回の問題には関係なさそうです。

### 2. とりあえずウェブインスペクタを開く
![Inspect HTML_2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3945501/592b469f-3b14-41b1-9fec-a10f260fcd4e.png)

何もヒントが得られない...ページもこれだけ...
とりあえず、ウェブインスペクタを開いて、ソースコードを確n....
!!!
HTMLのソースコードの中に、コメントアウトされたFLAGを発見しました！

# 補足
今回は特になし。
PL/I 練習問題

### 問題1：偶数・奇数の判定
目的：条件分岐と入出力の練習
内容： ユーザーに整数を入力させ、偶数か奇数かを判定して表示する。

<details>
　<summary>回答</summary>

```
TEST: PROCEDURE OPTIONS(MAIN);
  DECLARE I FIXED;

  PUT SKIP LIST('数字を入力してください');
  GET LIST(I);

  IF MOD(I,2)=0 THEN
    PUT SKIP LIST('偶数です');
  ELSE
    PUT SKIP LIST('奇数です');
END TEST;
```
</details>

### 問題2：10個の整数の平均値を求める
目的：配列、ループ、計算の基本練習
内容： 10個の整数を入力させて配列に格納し、平均値を求めて出力する。
<details>
　<summary>回答</summary>

```
TEST: PROCEDURE OPTIONS(MAIN);
 DECLARE NUM(10) FIXED;
 DECLARE TOTAL FIXED;
 DECLARE AVE FIXED;
 DECLARE I FIXED;

 PUT SKIP LIST('10個の整数を入力してください：');

 DO I = 1 TO 10;
  GET LIST(NIM(I));
  TOTAL = TOTAL + NUM(I);
END;

  AVE = TOTAL / 10

  PUT SKIP LIST('平均値は',AVE,'です。');
END TEST;
```
</details>

### 問題3：文字列を逆順にして出力
目的：文字列処理の基本
内容： 文字列を1つ入力し、それを逆順に表示するプログラムを作る。
<details>
　<summary>回答</summary>

```
TEST: PROCEDURE OPTIONS(MAIN);
  DECLARE S CHAR(100) VARYING;
  DECLARE LEN FIXED;
  DECLARE I FIXED;

  PUT SKIP LIST('文字列を入力してください:');
  GET EDIT(S) (A);

  LEN = LENGTH(S);

  PUT SKIP LIST('逆順に表示:');
  DO I = LEN TO 1 BY -1;
    PUT EDIT(S(I:1)) (A);
  END;

  PUT SKIP;
END TEST;
```
</details>
PHP本格入門_練習開始

## PHP本格入門の学習開始！

この学習書はサンプルコードと照らし合わせての学習が可能なため、非常に学習を行いやすい。
現在AIにまみれた世界だが、プログラムの基本をしっかりと学ぶ。
AIに頼る部分は頼って、全てを任せることはせず、効率よく使っていこうと思う。

自分の文章を書き出す力と、学習経過を記録としてとっておくことを目的に日々、継続する。

がんばれ俺！！
※PHP本格入門(上) 本日で3日目、ページ数100ページ目、残り600ページほど！
Brian Kernighan のアルゴリズムで高速にビット数をカウントする

# 1. 要約
- ビットのカウントを高速で行いたいとき、このアルゴリズムが有用
- 計算量は $O(K)$ （Kは入力された数字 `N` に含まれる1の個数）
- 実装は以下の通り

```python
def count_bits(n):
    count = 0
    while n > 0:
        n &= n - 1 # 最下位のビット（=1）を1つ消す
        count += 1

    return count
```

# 2. Brian Kernighan's algorithm
Brian Kernighanというカナダ人の計算機科学者が考案したビット操作に関するアルゴリズムである。このアルゴリズムを利用すると、最下位のビットを1回の演算で削除できるという特徴がある。

通常、ビット列に含まれる1の個数をカウントしようとすると、全てのビットを1つずつ見ていくことになる為、計算量は$O(\log N)$となる。しかし、この方法では1の数に応じた回数だけループが回る為、実際にはより高速に処理できる場合が多い。

# 3. アルゴリズムの動作例
例として、入力 `n` を13として考える。13を2進数に変換すると、`1101` となる。

1. n = 13 $\rightarrow$ 1101 $\rightarrow$ n & (n - 1) = `1100` (12)
2. n = 12 $\rightarrow$ 1100 $\rightarrow$ n & (n - 1) = `1000` (8)
3. n = 8 $\rightarrow$ 1000 $\rightarrow$ n & (n - 1) = `0000` (0)

$\rightarrow$ 3回で終了し、

ビット列に含まれる1の個数 = 3

と分かる。

# 4. 参考
[1] Brian Kernighan’s Algorithm: Count set bits in a number

https://yuminlee2.medium.com/brian-kernighans-algorithm-count-set-bits-in-a-number-18ab05edca93#:~:text=The%20idea%20is%20to%20subtract,be%20the%20set%20bit%20count

[2] Count set bits in an integer

https://www.geeksforgeeks.org/count-set-bits-in-an-integer/
[Unity]ビルボードUIの実装

# ビルボードUIの実装方法
備忘録です

:::note info
１．Canvasの`Render Mode`の設定を`World Space`に設定
２．UIの座標系がワールド空間上に切り替わる
:::

![スクリーンショット 2025-04-23 141058.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3847430/4f3a4bfa-d1a9-428e-9be6-68723f0d4b44.png)
windows11で、sketchup6 その76

# 概要
windows11に、sketchup6を入れてみた。
rubyで、3Dを書く。
練習問題、やってみた。

# 練習問題
音を鳴らせ。

# サンプルコード

```
def playSoundTest
	path = Sketchup.find_support_file "a1.wav", "Plugins/"
	begin
		pSound = UI.play_sound path
	rescue
		UI.messagebox $!.message
	end
end

```

以上。