OmniAICreator/Qiita-1.07M huggingface dataset:
リポジトリの棚卸し：複数のDocker環境を履歴付きで1つに統合した話


最近、複数の開発環境用に作っていたDockerリポジトリを1つのリポジトリにまとめる「棚卸し」をしました。

React, Python, Java, HTML/CSS, Node.js, Laravel, Jupyter などの環境を、
すべて履歴ごとまとめて `PolyDock` という統一リポジトリに統合。

最終的な成果物はこちら👇  
🔗 [PolyDock GitHub リポジトリ](https://github.com/hellomyzn/polydock)

---

## 🎯 課題

- 各言語・フレームワークのDocker環境が別々のリポジトリで管理されていて、再利用や更新が面倒
- CI/CDのセットアップや共通処理がバラバラになっていた
- フルスタックで開発する際に横断的な整理ができていなかった

---

## ✅ 解決方法：履歴を保持したまま統合

Gitには、履歴を保持したまま他のリポジトリをサブディレクトリとして取り込む方法があります。

---

## 🧭 作業ステップ（例: `docker-python` を `docker-python/` に統合）

### 1. `--mirror` で履歴付き clone

```bash
git clone --mirror git@github.com:hellomyzn/docker-python.git
```

### 2. `git filter-repo` でサブディレクトリ化

```bash
cd docker-python.git
git filter-repo --to-subdirectory-filter docker-python
cd ..
```

### 3. 一時作業用リポジトリを作って checkout

```bash
mkdir merge-python
cd merge-python
git init
git remote add origin ../docker-python.git
git remote show origin  # ← ブランチ名確認（main or master）
git pull origin master   # 例：master
cd ..
```

### 4. 統合先（`polydock`）にマージ

```bash
cd polydock
git remote add python ../merge-python
git fetch python
git branch -r  # 確認
git merge --allow-unrelated-histories python/master -m "Import docker-python"
```

### 5. コンフリクトがあれば修正して commit

```bash
git status
code README.md  # 修正
git add .
git commit
```

### 6. push！

```bash
git push origin main
```

---

## 🧹 最後に後片付け（重要！）

```bash
cd ..
rm -rf docker-python.git merge-python
```

※ 同様に他のリポジトリも `docker-react`, `docker-java`, `docker-node`, など同じ流れで統合できます。

---

## 📦 統合後の構成（PolyDock）

```
polydock/
├── docker-python/
├── docker-react/
├── docker-java/
├── docker-html-css/
├── docker-node/
├── docker-laravel/
├── docker-jupyter/
└── README.md
```

---

## 💥 詰まったところ & 解決方法

| 内容 | 問題 | 解決方法 |
|------|------|----------|
| `git pull origin main` に失敗 | コメント付きでコマンド実行した | `#` は無視されない。コメントは別の行に書く |
| `react/main - not something we can merge` | 指定ブランチが存在しない | `git branch -r` で正しいブランチ名を確認 |
| `Already up to date.` と出る | 過去に中途半端にマージされた状態 | `git remote remove xxx` → `add` → `fetch` でやり直し |
| `Merge conflict in README.md` | 複数リポジトリに同名ファイル | 手動でマージしてコミット |
| `fatal: couldn't find remote ref` | ブランチ名のタイプミス or 存在しない | `git remote show origin` で正しいブランチ確認 |

---

## 🧠 補足：`git filter-repo` について

[`git filter-repo`](https://github.com/newren/git-filter-repo) は `filter-branch` や `subtree` の後継として公式が推奨している高速・簡単な履歴書き換えツールです。

```bash
# macOS (Homebrew)
brew install git-filter-repo

# Ubuntu (apt)
sudo apt install git-filter-repo
```

---

## 📌 今後やってみたいこと

- `Makefile` を使って各環境のビルド・起動を共通化
- `docker-compose.yml` で複数環境の一括起動
- 統一した Lint や CI の仕組み導入

---

## 🙌 最後に

複数リポジトリを抱えていて「散らかってきたな…」と思ってる人には、履歴ごとの棚卸し・統合は本当におすすめです！

PolyDockのように、**1つのリポジトリで開発環境を管理する**ことで見通しも良くなり、保守・運用も楽になります。

🔗 [PolyDock GitHub リポジトリはこちら](https://github.com/hellomyzn/polydock)
Docker Composeで「host not found in upstream」が発生する原因と解決策

# やりたいこと
Docker Composeを使用して、
1. PHP（`php-container`）
2. PostgreSQL（`postgres`）
3. nginx（`nginx`）

の3つのコンテナを同時に立ち上げたい。
# 発生したエラー
`docker-compose up` でコンテナを立ち上げたが、nginx コンテナが起動せず、ブラウザで `http://localhost/calculate.php` にアクセスしても「このサイトにアクセスできません」となる。

nginxの起動時に下記のログを出力。
```shell
2025/03/12 12:53:45 [emerg] 1#1: host not found in upstream "php-container" in /etc/nginx/conf.d/default.conf:16
nginx: [emerg] host not found in upstream "php-container" in /etc/nginx/conf.d/default.conf:16
```
# 調査
1. `docker ps` でコンテナの状態を確認したところ、nginx が起動していない。
2. `docker logs [nginxのコンテナ名]` でログを確認すると、以下のエラーを出力。
```
2025/03/08 06:41:55 [emerg] 1#1: "server" directive is not allowed here in /etc/nginx/nginx.conf:1
nginx: [emerg] "server" directive is not allowed here in /etc/nginx/nginx.conf:1
```
# 原因
nginx から php-container に接続する際、コンテナ名 (php-container) を指定していたが、Docker では、異なるコンテナ間での名前解決を自動的にしてくれるわけではない。
__→ そのためnginx が php-container を見つけられない。__

# 解決策
`docker-compose.yml` にネットワークを定義、すべてのコンテナを同じネットワークに入れる。下記を全コンテナのプロパティに追記。
```yaml
    networks:
      - app-network
```

### 修正後の`docker-compose.yml`
```yaml
version: '3.8'
services:
  php-container:
    image: php:8.2-fpm
    networks:
      - app-network

  postgres:
    image: postgres:15
    environment:
      POSTGRES_USER: user
      POSTGRES_PASSWORD: password
    networks:
      - app-network

  nginx:
    image: nginx:latest
    networks:
      - app-network
    volumes:
      - ./nginx/conf.d:/etc/nginx/conf.d

networks:
  app-network:
    driver: bridge

```

__これで全コンテナが同じじネットワーク内で通信可能になる。__
nginx が php-container のコンテナ名で通信できるようになり、名前解決ができる。エラー解消しました。
テキストニュースを音声化してみた

久しぶりの投稿.LLMの勉強を優先させてるのもあり、ゼロからのOS自作入門もDay05止まってますが...

# GitHub
未完成となった.本来は、Amazon Connectで音声を届けて完成だったのですが、Amazon Connectにつては、電話番号を個人取得できないらしいので、あきらめた.
いい方法があれば、完成させる予定ですが、Pollyで音声化できたので、十分、面白かったですね.
https://github.com/mniyk/Call-News

# Motive
就職活動が全く順調ではないため、息抜きに、AWSでなんか作ってみようと思ったので.

# Use Case
1日1回アラームの代わりを想定しました.

# Tech Stack
- Python
- Amazon Polly
- AWS Lambda
- Amazon S#

# Difficulty
Amazon Connectの問題以外は、特に躓いたところはないですかね.
🌱Gitでやること毎回ググってる件

## はじめに

こんにちは！Gitにまだちょっぴりビビってる初心者です。  
「`git push` するのに毎回ググる自分、卒業したい…！」と思って、TIL（Today I Learned）運用を始めました。

で、Notionでメモ → `.md` に書き出して GitHub にアップロード、みたいな流れでやってたら、コマンド忘れる事件が多発。

ということで、**「Gitって毎回何すんだっけ？」って自分のための備忘録**をQiitaに書いておきます。  
ケース別に、**英語の意味と実行場所付きで表にまとめて**ます。誰かの助けにもなればうれしいです！

---

## 🫷 GitHubにコミット & プッシュする場合（TIL運用：Notion → GitHub）

| 順番 | コマンド | 英語の意味 | 説明 |
| --- | --- | --- | --- |
| 1 | `cd ~/til` | cd＝change directory<br>til＝Today I Learned | `tilフォルダ`に移動 |
| 2 | `touch ファイル名.md` | touch（ファイル作成） | 新しい `.mdファイル` を作成 |
| 3 | - | - | Notionに学習内容を記録 |
| 4 | - | - | Notionから `.mdファイル` に学習内容を書く |
| 5 | `git add .` ※スペースに注意 | add（追加する） | Gitに変更をステージに追加 |
| 6 | `git commit -m "メッセージ"` | commit（記録）<br>message（説明文） | メッセージ付きでコミット |
| 7 | `git push` | push（押し出す） | GitHubにアップロード（共有） |

---

## 🔍 リモートブランチを確認する場合（例：rantekun_house）

| 順番 | コマンド | 英語の意味 | 説明 | 実行場所 |
| --- | --- | --- | --- | --- |
| 1 | `cd rantekun_house` | change directory | Git管理されたフォルダに移動 | cloneした場所（例：`~/Projects`） |
| 2 | `git fetch` | fetch（取りに行く） | リモートの最新情報を取得 | Gitプロジェクトのルートディレクトリ |
| 3 | `git branch -r` | remote（リモート） | リモートのブランチ一覧を表示 | 同上 |

---

## 🔄 ブランチを作る／切り替える場合

| 順番 | コマンド | 英語の意味 | 説明 | 実行場所 |
| --- | --- | --- | --- | --- |
| 1 | `git checkout ブランチ名` | checkout（切り替える） | 既存のブランチに切り替え | プロジェクト内 |
| 2 | `git checkout -b 新ブランチ名` | `-b`＝新規ブランチ | 新ブランチを作って切り替え | プロジェクト内 |

---

## 📥 GitHubにあるプロジェクトを自分のPCにコピー（＝clone）する場合

| 順番 | コマンド | 英語の意味 | 説明 | 実行場所 |
| --- | --- | --- | --- | --- |
| 1 | `git clone リポジトリURL` | clone（複製） | GitHubのプロジェクトをローカルにコピー | どこでもOK |
| 2 | `cd フォルダ名` | cd＝change directory | コピーしたプロジェクトに移動 | 同上 |

---

## ⮑ 変更を取り消したいとき（やっちまった！って時に）

| 順番 | コマンド | 英語の意味 | 説明 | 実行場所 |
| --- | --- | --- | --- | --- |
| 1 | `git restore ファイル名` | restore（復元） | 編集を取り消す（ステージ前） | プロジェクト内 |
| 2 | `git reset HEAD ファイル名` | reset（取り消す）<br>HEAD＝今のブランチの最新コミット | ステージした変更をキャンセル | プロジェクト内 |

---

## おわりに

この表、Notionに貼っても便利やし、VSCodeの左に開いておいてもいい感じです。  
「あれ？addって何だったっけ？」ってなったら、いつでも見返せるようにしときます！

参考になったら「LGTM」代わりにスターでもなんでもしてくれたらうれしいです🙌
【アルゴリズム】二分探索

# はじめに

こんにちは。アメリカに住みながら独学でエンジニアを目指しているTairaです。
現在、Leetcodeでコーディング面接対策を始める前に重要そうなアルゴリズムをピックアップして勉強しています。
本日は二分探索についての記事を書こうと思います。アルゴリズムの中でも一番有名なのでは？と思うので同じくアルゴリズムを勉強している人は参考にしてもらえれば幸いです


## 二分探索とは？

二分探索（Binary Search）は、**ソートされた配列**の中から目的の要素を効率よく探すアルゴリズムです。
探索範囲を半分に絞りながら中央の要素とターゲットを比較し、一致すればそのインデックスを返します。
一致しない場合は、ターゲットの大小に応じて左半分または右半分に探索範囲を絞って再度検索を行います。

線形探索に比べて比較回数が大幅に少なく、高速に処理できます。

---

## 特徴
- **時間計算量**: O(log n)で処理スピードがとても速い
- **空間計算量**: O(1)（反復的な実装の場合）でメモリ消費量が少ない
- **前提条件**: 配列が昇順または降順にソートされている必要があり、すべてにあてはめることはできない。

---

## 基本問題：二分探索

### 問題:
ソートされた整数配列 `nums` と整数 `target` が与えられたとき、`target` が存在するならそのインデックスを返し、存在しない場合は `-1` を返してください。

### 例:
```python
入力: nums = [-1, 0, 3, 5, 9, 12], target = 9
出力: 4
```

### Python解法:
```python
def binary_search(nums, target):
    left, right = 0, len(nums) - 1

    while left <= right:
        mid = left + (right - left) // 2　# JavaやC,C++ 等の言語の固定サイズの整数(32bit)を使っている言語のオーバーフロー対策
                                          # Pythonなら mid = (left + right ) // 2でも問題ない
        if nums[mid] == target:
            return mid
        elif nums[mid] < target:
            left = mid + 1
        else:
            right = mid - 1

    return -1
```

---

## 類題

### 1. 挿入位置を検索する
**問題**: 目的の値を配列内に挿入するとき、ソート順を保つように挿入すべきインデックスを返してください。

```python
def search_insert_position(nums, target):
    left, right = 0, len(nums) - 1

    while left <= right:
        mid = (left + right) // 2
        if nums[mid] == target:
            return mid
        elif nums[mid] < target:
            left = mid + 1
        else:
            right = mid - 1

    return left
```

### 2. 数当てゲーム（Higher or Lower）
**問題**: `guess(num)` 関数を使って、できるだけ少ない回数で正解の数を当ててください。

```python
# デモ用の guess 関数（仮の正解を設定）
guess_number = 6

def guess(num):
    if num > guess_number:
        return -1
    elif num < guess_number:
        return 1
    else:
        return 0

def guessNumber(n):
    left, right = 1, n

    while left <= right:
        mid = (left + right) // 2
        result = guess(mid)

        if result == 0:
            return mid
        elif result == -1:
            right = mid - 1
        else:
            left = mid + 1

    return -1
```

### 学習方法
私は「アルゴリズム図鑑」というアプリで動きを確認した後、ChatGPTに問題を生成してもらい、概念をつかみながらコードを学習しています。
合わせてYoutubeで binary search algorithm pythonと調べて、二分探索の動きとコードの説明を聞きながら理解度を上げました。

https://youtu.be/DnvWAd-RGhk?si=7Qlst1eyvB4ruMtv

上記の動画は結構わかりやすいので、よかったら見てみてください。
海外はソフトウェアエンジニアになるために、コーディング面接が必須ということもあり日本と比べてアルゴリズムの解説動画がかなり豊富なので日本語検索よりも英語検索をおすすめします。

---

## まとめ
二分探索は、最も基本かつ強力な探索アルゴリズムのひとつです。
基本パターンを理解しておくことで、単なる数値探索だけでなく、挿入位置の探索や不明な値の推測など、さまざまな応用問題に対応できるようになります。
【ChatGPT＋4o Image Generation】でピクトグラムを描きます。


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

　今回は、4o Image Generationでピクトグラムを描きます。

:::note info
本記事は、ChatGPT（Plus版）
で行なっております。
画像はあります。　あしからず。
:::
　ChatGPT等の動作状況を知らせる
　　OpenAIのステータスページ。
　　　[OpenAIステータス](https://status.openai.com/)
***
　こちらも載せますね。
　　[ChatGPTが使えない？ログインできない・反応しない原因やエラー時の対処法を解説](https://aismiley.co.jp/ai_news/chatgpt-error-resolution-explanation/)
***
　では、さっそく【本題】です。

　今回は、
　　4o Image Generationで
　　　ピクトグラムを描きます。

　ピクトグラムとは
　　単純化された図柄で
　　　特定の意味を表現する
　　　　視覚記号です。

　誰にでも理解できるため、国際的な
　　コミュニケーションツールとして
　　　広く利用されています

　単純なものだと
　　トイレのマークですね。
![1743647185646.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3457238/e0a0e6cf-ffd3-4ddc-918e-6a706a7cc947.jpeg)


　ほかには
　　オリンピックの競技を
　　　示すマークとか。

　あと、道路標識なんかも
　　ピクトグラムの一種です。

　Promptは簡単です。
　　“ピクトグラム”のあとに
　　　空白を空けて、
　　　　続けて、出したい内容を
　　　　　記述します。

　例えば、さきほどのトイレだと
　　“ピクトグラム　トイレ”で
　　　済みます。

　それから
　　背景透過したい場合は、
　　　最後に“背景透過”と入れれば
　　　　OKです。

　　でも
　　　どうやら、ピクトグラムは
　　　　背景透過するものだ、と
　　　　　ChatGPTは考えているのか
　　　　　　自動に背景透過に
　　　　　　　なることもあります。

　　しかし、
　　　意識的に
　　　　入れた方がいいかも
　　　　　しれません。

　　　なったりならなかったりは
　　　　ChatGPT任せに
　　　　　なってしまいますから。

　最後に
　　ほかのも
　　　お見せしましょう。
![1743647203103.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3457238/993cab5f-9e20-427e-988d-c6d4d5be513c.jpeg)
![1743647217764.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3457238/e94bb70d-19b7-4213-837f-b6a393ebe513.jpeg)
![1743647247561.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3457238/55d3e333-2b16-4fdf-99ab-80953a915e0a.jpeg)


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

　今回は、ここまで。
Reactとバックエンドで作る！実践Web開発入門 | 第3章: バックエンドでAPIを作成

## はじめに
第2章ではReactでUIを構築しました。今回は、バックエンド（Node.jsとExpress）でAPIを作り、Reactがデータを取得できるようにします。商品リストをサーバーから提供する例を通じて、RESTful APIの基本を学びます。

## 目標
- RESTful APIの基本を理解する  
- Expressで簡単なAPIを作成する  
- フロントエンドとバックエンドの通信を準備する  

## RESTful APIとは
RESTful APIは、HTTPメソッド（GET, POSTなど）を使ってデータをやり取りする仕組みです。今回は以下のエンドポイントを作ります：
- `GET /products`: 商品リストを取得。

## バックエンドの準備
`backend`フォルダに移動し、必要な設定を行います。まだExpressをインストールしていない場合は以下を実行：
```bash
npm install express
```

## APIの実装
`backend/index.js`を以下のように更新します：
```javascript
const express = require('express');
const app = express();
const port = 5000;

// サンプルデータ
const products = [
  { id: 1, name: 'りんご', price: 100 },
  { id: 2, name: 'バナナ', price: 150 },
];

// JSON形式でデータを返す
app.use(express.json());

// GET /products エンドポイント
app.get('/products', (req, res) => {
  res.json(products);
});

app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});
```
- `products`は仮のデータベースとして使用。
- `res.json()`でJSON形式でデータを返します。

サーバーを起動：
```bash
node index.js
```
`http://localhost:5000/products`にアクセスすると、商品リストがJSONで表示されます：
```json
[
  {"id": 1, "name": "りんご", "price": 100},
  {"id": 2, "name": "バナナ", "price": 150}
]
```

## CORSの設定
React（ポート3000）からバックエンド（ポート5000）にアクセスするには、CORSを許可する必要があります。以下を実行して`cors`パッケージを追加：
```bash
npm install cors
```
`index.js`を更新：
```javascript
const express = require('express');
const cors = require('cors');
const app = express();
const port = 5000;

const products = [
  { id: 1, name: 'りんご', price: 100 },
  { id: 2, name: 'バナナ', price: 150 },
];

app.use(express.json());
app.use(cors()); // CORSを有効化

app.get('/products', (req, res) => {
  res.json(products);
});

app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});
```
これで、異なるポート間での通信が可能になります。

## APIのテスト
Postmanやブラウザで`http://localhost:5000/products`を試してください。JSONデータが正しく返されるか確認します。また、以下のようなcurlコマンドでもテストできます：
```bash
curl http://localhost:5000/products
```

## 次回予告
第4章では、ReactからこのAPIを呼び出し、商品リストを動的に表示する方法を学びます。お楽しみに！

---

この記事が役に立ったら、ぜひ「いいね」や「ストック」をお願いします！質問や感想はコメント欄で気軽にどうぞ。次回も一緒に学びましょう！
Reactとバックエンドで作る！実践Web開発入門 | 第2章: Reactで基本的なUIを構築

## はじめに
第1章でReactとバックエンドの環境を整えました。今回は、Reactを使って簡単なUIを作り、コンポーネントの基本を学びます。具体的には、商品リストを表示するページを作成します。初心者でも理解しやすいよう、ステップごとに進めます。

## 目標
- Reactのコンポーネント構造を理解する  
- StateとPropsを使ってデータを管理する  
- シンプルなUIをデザインする  

## コンポーネントの基本
Reactでは、UIを小さな「コンポーネント」に分割して管理します。今回は以下の3つを作ります：
1. **Header**: ページ上部のナビゲーション。
2. **ProductList**: 商品リストを表示。
3. **Footer**: ページ下部の情報。

## プロジェクトの準備
`frontend/src/App.tsx`を開き、デフォルトの内容を以下に置き換えます：
```tsx
import React from 'react';
import './App.css';

function App() {
  return (
    <div className="App">
      <Header />
      <ProductList />
      <Footer />
    </div>
  );
}

const Header = () => (
  <header>
    <h1>商品リスト</h1>
  </header>
);

const ProductList = () => (
  <main>
    <p>ここに商品が表示されます。</p>
  </main>
);

const Footer = () => (
  <footer>
    <p>&copy; 2025 React Web開発入門</p>
  </footer>
);

export default App;
```

## CSSの追加
`frontend/src/App.css`に以下を追加して、見た目を整えます：
```css
.App {
  text-align: center;
  font-family: Arial, sans-serif;
}

header {
  background-color: #282c34;
  padding: 20px;
  color: white;
}

main {
  min-height: 80vh;
  padding: 20px;
}

footer {
  background-color: #f1f1f1;
  padding: 10px;
  position: fixed;
  bottom: 0;
  width: 100%;
}
```
`npm start`で確認すると、シンプルなページが表示されます。

## StateとPropsでデータを扱う
商品リストにデータを追加しましょう。`ProductList`を以下のように修正します：
```tsx
const ProductList = () => {
  const [products, setProducts] = React.useState([
    { id: 1, name: 'りんご', price: 100 },
    { id: 2, name: 'バナナ', price: 150 },
  ]);

  return (
    <main>
      <h2>商品一覧</h2>
      <ul>
        {products.map((product) => (
          <li key={product.id}>
            {product.name} - {product.price}円
          </li>
        ))}
      </ul>
    </main>
  );
};
```
- `useState`で商品データを管理。
- `map`を使ってリストを動的に表示。

## Propsの活用
商品アイテムを別のコンポーネントに分けます。`App.tsx`に以下を追加：
```tsx
const ProductItem = ({ name, price }: { name: string; price: number }) => (
  <li>
    {name} - {price}円
  </li>
);

const ProductList = () => {
  const [products, setProducts] = React.useState([
    { id: 1, name: 'りんご', price: 100 },
    { id: 2, name: 'バナナ', price: 150 },
  ]);

  return (
    <main>
      <h2>商品一覧</h2>
      <ul>
        {products.map((product) => (
          <ProductItem key={product.id} name={product.name} price={product.price} />
        ))}
      </ul>
    </main>
  );
};
```
- `ProductItem`はPropsを受け取り、1つの商品を表示。

## 動作確認
ブラウザで`http://localhost:3000`を開き、商品リストが表示されるか確認してください。Header、商品リスト、Footerが整然と並びます。

## 次回予告
第3章では、バックエンドでAPIを作成し、商品データをサーバーから取得する方法を学びます。お楽しみに！

---

この記事が役に立ったら、ぜひ「いいね」や「ストック」をお願いします！質問や感想はコメント欄で気軽にどうぞ。次回も一緒に学びましょう！
Reactとバックエンドで作る！実践Web開発入門 | 第1章: プロジェクトの準備

## はじめに
Reactは、モダンなWebアプリケーションのフロントエンドを構築するための強力なライブラリです。一方、バックエンド（例: Node.jsとExpress）を使うことで、データの処理やAPIを提供できます。このシリーズでは、Reactとバックエンドを組み合わせて、実用的なWebアプリを作ります。  
第1章では、開発環境の準備とプロジェクトの初期設定を行います。初心者でも簡単に進められるよう、ステップごとに説明します。

## 目標
- Reactとバックエンドの基本を理解する  
- 開発環境を整える  
- フロントエンドとバックエンドのプロジェクトを立ち上げる  

## 必要なツール
以下のツールをインストールしてください：
1. **Node.jsとnpm**: JavaScriptの実行環境とパッケージ管理ツール。公式サイトから最新版をダウンロード。
2. **VS Code**: コードエディタ（他のエディタでも可）。
3. **ブラウザ**: ChromeやFirefoxでDevToolsを使います。

インストール後、ターミナルで以下のコマンドを実行して確認してください：
```bash
node -v
npm -v
```
バージョンが表示されればOKです。

## Reactプロジェクトの作成
Reactのプロジェクトを簡単に作るために、`create-react-app`を使います。ターミナルで以下を実行：
```bash
npx create-react-app frontend --template typescript
cd frontend
npm start
```
- `frontend`はプロジェクト名（自由に変更可）。
- `--template typescript`でTypeScriptを使用（省略可）。
- `npm start`で開発サーバーが起動し、`http://localhost:3000`で確認できます。

ブラウザに「Welcome to React」が表示されたら成功です！

### プロジェクト構造
作成されたフォルダは以下のようになります：
```
frontend/
  ├── node_modules/
  ├── public/
  ├── src/
  │   ├── App.tsx
  │   └── index.tsx
  ├── package.json
```
- `src/App.tsx`がメインコンポーネントです。

## バックエンドプロジェクトの作成
次に、Node.jsとExpressで簡単なサーバーを構築します。新しいフォルダを作り、初期化します：
```bash
mkdir backend
cd backend
npm init -y
npm install express
```
次に、`index.js`を作成し、以下のコードを追加：
```javascript
const express = require('express');
const app = express();
const port = 5000;

app.get('/', (req, res) => {
  res.send('Hello from Backend!');
});

app.listen(port, () => {
  console.log(`Server running at http://localhost:${port}`);
});
```
保存後、以下でサーバーを起動：
```bash
node index.js
```
`http://localhost:5000`にアクセスすると、「Hello from Backend!」が表示されます。

## 動作確認
- フロントエンド（React）は`http://localhost:3000`で動作。
- バックエンド（Express）は`http://localhost:5000`で動作。
2つのターミナルを使って、同時に両方を起動してみましょう。

## 次回予告
第2章では、Reactで簡単なUIを作り、コンポーネントの基本を学びます。お楽しみに！

---

この記事が役に立ったら、ぜひ「いいね」や「ストック」をお願いします！質問や感想はコメント欄で気軽にどうぞ。次回も一緒に学びましょう！
AWS Cloudshellで複数のコマンドを一括で出力する方法

# 結論
以下の環境変数を設定する。
```shell:Cloudshell
export AWS_PAGER=""
```

:::note info
export AWS_PAGER="" を実行した場合、その設定は現在のシェルセッションのみに適用されます。他のユーザーには影響を与えませんし、別のシェルセッションを開いた場合もリセットされます。
:::
Supabase で local の docker と remote の staging/prod で config.toml をうまくする

### はじめに

表題ままなのですが、supabase で開発をしていて config.toml が supabase-cli で config push や pull(というか link でdiff確認) できるのだけど、local docker と remote と環境を分けて管理したいところもあるので、その対応方法の一つを編み出してみた（大げさ）のでメモ。

### 設定方法

```bash
$ supabase config push
$ supabase link
```

って結構気持ちいい？機能があるのですが、それを実行する時って、.env を普通に使っても、環境のあれこれ整理整頓しづらかった。

ところで config.toml は、remote の supabase.com の branch には対応しているとのこと

https://supabase.com/docs/guides/local-development/cli/config#branching-config

これを利用することで supabase remote 環境で branch を切っていないシングルでの運用の時もうまくできそう。

```toml:config.toml
# For detailed configuration reference documentation, visit:
# https://supabase.com/docs/guides/local-development/cli/config
# A string used to distinguish different Supabase projects on the same host. Defaults to the
# working directory name when running `supabase init`.
project_id = "your-docker-container-base-id"

[remotes.default]
# project_id = "env(REMOTES_DEFAULT_PROJECT_ID)"  # 202504 ここで env は使えない？
project_id = "your-remote-project-id" # 20桁の英字のID

[auth]
enabled = true
# The base URL of your website. Used as an allow-list for redirects and for constructing URLs used
# in emails.
site_url = "http://localhost:5173"
# A list of *exact* URLs that auth providers are permitted to redirect to post authentication.
additional_redirect_urls = ["http://localhost:5173"]

[remotes.default.auth]
site_url = "env(REMOTES_DEFAULT_AUTH_SITE_URL)"
additional_redirect_urls = ["env(REMOTES_DEFAULT_AUTH_SITE_URL)"]

# [remotes.default.xxxx.xxxx] で色々追加できるよ
# ex.) ↓ 例えばこんな感じ
# [auth.email.smtp]
# enabled = false
# [remotes.default.auth.email.smtp]
# enabled = true
# host = "env(SMTP_HOST)"
# port = "env(SMTP_PORT)"
# user = "env(SMTP_USER)"
# pass = "env(SMTP_PASS)"
# admin_email = "env(SMTP_ADMIN_EMAIL)"
# sender_name = "env(SMTP_SENDER_NAME)"
```


```bash:.env
REMOTES_DEFAULT_PROJECT_ID="202504 ここで env は使えない？"
REMOTES_DEFAULT_AUTH_SITE_URL="https://your-website.example.com"
```

### TODO

> [remotes.default]
>  project_id = "env(REMOTES_DEFAULT_PROJECT_ID)"

これに対応していないっぽい。

もう少し調査して状況によって issue 立てるか pull request も。

そこまで project_id の秘匿にこだわる必要は今のところはないのだけれど。

### もしかしたら

.env.preview というのも supabase 関連で少し目にするので、何かしらそれで対応できる可能性もあるよ。

### 注意事項

additional_redirect_urls の配列的なところが、[まるッと一気に設定できないと思うので](https://github.com/supabase/cli/issues/2774)、もし環境変数対応するなら

```toml:config.toml
[remotes.default.auth]
site_url = "env(REMOTES_DEFAULT_AUTH_SITE_URL)"
additional_redirect_urls = [
    "env(REMOTES_DEFAULT_AUTH_ADDITIONAL_REDIERCT_URL1)",
    "env(REMOTES_DEFAULT_AUTH_ADDITIONAL_REDIERCT_URL2)",
    "env(REMOTES_DEFAULT_AUTH_ADDITIONAL_REDIERCT_URL3)",
    ]
```

```bash:.env
REMOTES_DEFAULT_AUTH_ADDITIONAL_REDIERCT_URL1="https://your-website.example.com"
REMOTES_DEFAULT_AUTH_ADDITIONAL_REDIERCT_URL2="https://her-website.example.com"
REMOTES_DEFAULT_AUTH_ADDITIONAL_REDIERCT_URL3="https://he-website.example.com"
```

こんな感じに丁寧にするしかないのかな。

### お願い

もし間違えていたり、アップデートがあって対応方法が変わったよ！とかお気づきの方は、コメントなどいただけると助かります。
ユーザーアカウントの詳細情報をPowershellで確認する方法

GUI上でコンピューターの管理からユーザー情報を確認することができる
こちらをPowershellで確認する方法を記述

# ユーザーアカウントの詳細情報をPowershellで確認
Get-WmiObject Win32_UserAccount | ? { $_.LocalAccount -eq $true } | Format-List *

出力結果は以下の形となる

<table>
  <thead>
    <tr>
      <th>名前</th> <th>説明</th>
    </tr>
  </thead>
  <tr>
    <td> AccountType </td> <td>アカウントの種類</td>
  </tr>
  <tr>
    <td> caption </td> <td>アカウント名の説明</td>
  </tr>
    <tr>
    <td> Description </td> <td>アカウントの詳細な説明</td>
  </tr>
  <tr>
    <td> Disabled </td> <td>アカウントが無効かどうか(True/False)</td>
  </tr>
    <tr>
    <td> FullName </td> <td>アカウントのフルネーム</td>
  </tr>
  <tr>
    <td> LocalAccount </td> <td>ローカルアカウントかどうか(True/False)</td>
  </tr>
    <tr>
     <tr>
    <td> Lockout </td> <td>アカウントがロック状態であるか</td>
  </tr>
    <tr>
    <td> Name </td> <td>ユーザー名</td>
  </tr>
  <tr>
    <td> PasswordChangeable </td> <td>パスワードが変更可能か</td>
  </tr>
    <tr>
    <td> SID </td> <td>セキュリティ識別子</td>
  </tr>
    <tr>
    <td> Status </td> <td>ステータス</td>
  </tr>
</table>
WSL2へのHDDのマウント

# 概要
WSL2を使ってHDDの読み込みをする際の備忘録。Linux形式(ext4)へのフォーマットは別途紹介予定。

# 環境
- OS: Windows 11
- WSL2 (Ubuntu 22.04)

# Windows側での操作
- Windows PowerShellを管理者として実行し、以下でDevice IDを調べる。
    ```
    $ GET-CimInstance -query "SELECT * from Win32_DiskDrive"
    ```
    　
- Device IDをwslにmountする。
    ```
    $ wsl --mount <DeviceID> --bare
    ```

    例えば、<DeviceID>が \\.\PHYSICALDRIVE2 の場合、
    ```
    $ wsl --mount \\.\PHYSICALDRIVE2 --bare
    ```

    とする。



# WSLでの操作
- UUIDの調査
    ```
    $ sudo blkid
    ```
    　    
- fstabへの書き込み
    ```/etc/fstab
    UUID="<UUID>" <マウントポイント> <フォーマット> defaults 0 0
    ```

    ※WSLを立ち上げる際にfstabを読み込むので、自動でマウントされるはずだが、自動で読み込めないときがある。その際には、再度、以下でfstabを読み込む。
    ```
    $ sudo mount -a
    ```
    　



参考URL
https://qiita.com/resnant/items/b208d4f95cda3433ddd9
【解説】Google Cloud Analytics Hubとは？データ共有の新しいスタンダード


データドリブンな意思決定が求められる現代において、**「組織内外での安全かつ効率的なデータ共有」**は極めて重要なテーマです。そのニーズに応えるのが、Google Cloud が提供する Analytics Hub です。

本記事では、Analytics Hubの概要、主なユースケース、利点、そして導入時の注意点（落とし穴）までをわかりやすく解説します。

Analytics Hubとは？

Analytics Hubは、BigQueryベースのデータ共有プラットフォームです。組織内、あるいはパートナー企業など外部と、安全かつ制御された方法でデータセットを共有・活用するための仕組みを提供します。

主な特徴：
✅ データアセットの検出とサブスクリプションが容易
✅ BigQueryデータセットを他組織に共有可能
✅ データクリーンルームによるプライバシー保護型コラボレーション
✅ データコピーなしの分析基盤構築
ユースケース

1. 社内部門間での安全なデータ共有
営業部門とマーケティング部門が、顧客データやキャンペーンデータを共有する際、Analytics Hubを利用することでリアルタイムに最新データを共有しつつ、アクセス制御も細かく設定できます。

2. 外部パートナーとのデータ連携
例えば、小売業が決済データを決済事業者と連携し、相互にマーケティング最適化を図るケース。クリーンルーム環境でプライバシー保護を維持しながら分析を実施可能です。

3. サードパーティデータの流通マーケットプレイス
Analytics Hubでは、データプロバイダーがパブリックデータセットを「Exchange」として公開可能。これにより、サードパーティデータの有料サブスクリプションビジネスも成立します。

データクリーンルームとは？

Analytics Hubのキモのひとつが**データクリーンルーム（DCR）**の概念です。これは、直接データに触れずに、安全な環境下で集計・分析ができる仕組みです。

メリット：
🎯 個人情報などセンシティブデータの保護
🔒 元データの移動やコピーが不要（セキュリティ向上）
🤝 複数企業間でのフェアな分析環境の構築
利点

項目	内容
セキュリティ	IAMベースの厳密なアクセス制御
コスト効率	データのコピー不要＝ストレージ節約
スピード	データ検出と共有が迅速
スケーラビリティ	グローバル規模のExchange対応
導入時の落とし穴と対策

❶ 権限管理のミス
落とし穴：アクセス制御が甘いと、意図しないデータ漏洩リスクが発生
対策：IAMロール・ビューの設計は慎重に。データポリシーの設計と監査ログの確認をセットで実施

❷ 利用者の教育不足
落とし穴：利用者がAnalytics Hubの仕組みを理解していないと、誤操作・誤解が生じる
対策：オンボーディングやトレーニングマテリアルの整備が不可欠

❸ クリーンルームの誤用
落とし穴：クリーンルームにデータをアップロードすれば安全という誤解
対策：クリーンルームでも出力制限・クエリ制御が重要。不要なJOINや明細アクセスを防止するためのテンプレートと制限設定が必要

まとめ

Analytics Hubは、安全・スケーラブルなデータ共有を実現する次世代のプラットフォームです。特に、クリーンルームのようなプライバシー重視の分析環境は、今後のデータコラボレーションの鍵を握る存在になるでしょう。

企業・組織がデータを活用してビジネスの価値を最大化するためには、ただデータを持つだけでは不十分。その共有と利活用において、どのように透明性と制御を両立させるかが問われます。
【Git初心者メモ】Android Studioからタグ作成してGitHubに反映させたかった話

Android StudioからGitHubにタグを作成＆反映させようとしたが、思ったようにいかず…。  
いろいろ試した結果と、最終的にたどり着いた方法をメモしておきます。

---

## 1. Android Studioでタグ作成してみた

まず、Android Studioの`Git`ペインから対象のコミットを右クリックして `New Tag` を選択。  
ローカルにはタグが作成されたっぽい。


## 2. タグをプッシュしようとしてみた

「Push tags」オプションをONにしてプッシュしてみたが、GitHub上にはタグが反映されない。


## 3. `Merge 'tag' into 'branch'` とは？

タグを右クリックすると「Merge 'tag' into 'branch'」的なメニューが出てきたので試してみたが、何も変わらず。
そもそもこの機能が何なのか分かっていない…。未調査。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3916302/13e457b6-148c-4744-b1e1-9cad90f3582f.png)


## 4. 結局、Android Studioはあきらめブラウザ版GitHubでタグを作成

ググるとコマンドでやれば一発らしいが、私はできれば**UI操作で完結させたい派**。

というわけで、GitHubのブラウザ版に頼ることに。

- 「Releases」から新規リリースを作成すると、同時にタグも作成される  
- 「Tags」単体でも作れそうだったが、どうやらReleasesとTagsは内部的に連動している模様  



### タグだけ付けたい場合は、次のようにすればOKだった。裏技？？本末転倒？？

1. 「Releases」から新規作成（この時にタグも作成される）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3916302/21cb032f-a8ea-4980-b445-9640c9c40852.png)
2. 作成後、Releasesを削除
3. タグだけがGitHubに残る！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3916302/b988d08e-5a4f-44ba-9e36-884fcea035f5.png)

---

## まとめ

Android Studioからタグを作成してGitHubに反映するにはちょっとした工夫が必要だった。  
「Push tags」してもリモートに反映されない場合は、**Releases経由でタグを作ってから削除する**という手段もあり。

本来の目的とはズレてる気もするけど、「UIだけでタグを付けたい派」の方には使える小技かもしれません。
家計簿アプリを作る＃２６

![スクリーンショット 2025-04-03 101002.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4012588/4c942145-cdff-4015-b6d0-36a430a76953.png)
次は、mobileOpenを受け取ります。

![スクリーンショット 2025-04-03 101047.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4012588/ee1b75cc-045a-4515-bd3a-24eeeffa20cd.png)
上記👆のように受け取ります。

![スクリーンショット 2025-04-03 101242.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4012588/5beb39c4-82aa-4899-a7dd-a816f5387ed4.png)
![スクリーンショット 2025-04-03 101359.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/4012588/b4fc1abf-eb89-44a6-ad9c-647ba12cf272.png)
mobileOpenを確認すると、boolean型なので、boolean型で型指定します👆
大きなファイルを相手に送りたい。

## 7-zipで分割圧縮を使用する。

大きなファイルを圧縮するには、7-zipを使用すると便利です。
7-zipは圧縮ファイルの一種で、下記からダウンロードして使用することができます。

7-zip：https://7-zip.opensource.jp/

その中でも今回は分割圧縮について備忘録的に残しておこうと思います。

まず、圧縮したいファイルの上で右クリック
(Windows11とか右クリックしてもない場合は、「その他のオプションを確認」をクリックしてさらにオプションを確認してください。

7-zipがあるので、そこをクリック。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2610734/bd5a2c4f-271d-4a63-ad23-e6cca838fdbb.png)

圧縮をクリックすると以下の画面が表示されるので、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2610734/0210e48c-e3a9-4c2d-b581-f4d9d332d83f.png)

分割ボリュームサイズに１圧縮ファイル分の最大ボリュームサイズを記載して、OK

これで分割圧縮できます。


分割圧縮された7-zipは、解凍側が7-zipを使用しているのなら、圧縮ファイルの001を解凍するだけで特に結合する必要なく解凍できます。

7-zipを使用していない人向けには、shell等で結合する必要がありますが、それはまた別の機会に。

メモなのでわかりにくいかと思いますが、基本修正しません。
まぁ、明らかに誤りがあれば直しますが。
WSLの完全アンインストールは無理（Windows10）

# エクスプローラを開いて「WSL」と検索する

<br>

一目瞭然な話。

これほど大量のWSLフォルダやファイルが残存したままだ。

一般的な削除方法のみでは不十分。

レジストリも含めて、

ジャンクファイルのような形で跡を残しており

対処しきれてないことがわかるのだ

<br>

<br>

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2698531/07731413-ab5e-4bad-af43-ee4798f5af29.png)

<br>

<br>

<br>

<br>

# 検索で確認しながら慎重にファイルを削除

<br>



全部まとめて一気に消すなら、

作業としては一発で終わりそうなものだが

膨大な量のWSL関連のフォルダが残存しており

全部消すとなったらこれは無理があるだろう。

「どうしても残ってたら困るものだけは特定して

対象を絞って削除するぐらいしかない。」

WinSxSフォルダなどはPCの安定稼働に関わる重要なものであるし

本来は手動で簡単に削除するべきものではないからだ。

WSL関連のファルダとわかりきってるものならば削除する。

迷ったらわからなければ面倒くさがらずに確認しながら調べる。

レジストリの削除は特に慎重に行うべきであろう。

<br>

<br>

<br>

<br>

# スタートメニューからもシステムの削除を行う

<br>


タスクバーにはWSLのロゴが消えてなくて

まだそれだけでは手順が不十分であり

最後まで解決するというのがいいと思ったので。

# WSLのシステムのファイル場所を開いて削除

<br>

C:\ProgramData\Microsoft\Windows\Start Menu\Programs

本体のWindows Subsystem for Linuxを完全アンインストールしたが

ここのディレクトリに残りのファイルがしつこく残っている。

スタート（ロゴマーク）＞WSL（右クリック）＞その他＞ファイルの場所を開く＞

<br>

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2698531/79e64e8d-b5a3-4b2c-aa84-1ee37f43e3af.png)

<br>

<br>

WSLをマウスで左クリックしたら今度は右クリックで一覧から削除を選択

気になるならデスクトップ画面にあるゴミ箱の中からも削除しておく

Windowsのロゴマーク（スタート）からスタートメニュー一覧表示

WSLのシステムが一覧から消去されていることを確認できれば完了

<br>

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2698531/0b5a3c50-992f-4a8a-b606-76d45c291f4f.png)

<br>

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2698531/e895bb31-28d4-4c98-b562-c99ee8d3867e.png)

<br>

<br>

<br>

<br>

# タスクバーの「WSL Settings」をエクスプローラから削除する

<br>

C:\ユーザー\（あなたのユーザー名）\AppData\Roaming\Microsoft\Internet Explorer

\Quick Launch\User Pinned\TaskBar
ChatGPTでAIが本当に学習するのか試してみたら大失敗した

# はじめに
みなさんはChatGPTを使っていますか？
私は他のAIは使っていたのですが、ChatGPTだけは使っていませんでした。
なぜかって？それは他のAIで出来そうなことが多いと感じたからです。
ですが皆さんもご存じのように 2025年3月に新しいタイプが追加されて有名になりました。
できる機能を一通り見た所、これなら自分がやろうとしていることが実現できる！
そう感じたので契約しました。
本当は無料版で試したかったのですが、無料版での限界があったのでいきなりPlusを契約した初心者なので、参考になるかわかりませんが説明していきます。

# AIって学習するの？
ほかのAIサービスも契約していますが、それは学習型ではありません。せいぜいGeminiやAI Studioが同じスレッド内であれば省略しても意図を読み取ってくれるぐらいです。

たとえばあなたがJavascriptのプログラムに関して説明を求めたとします。その時に

```
> Javascriptのループ文の書き方をサンプル付きで説明して
```
このように命令したとします

次に条件分岐を同じように説明して欲しいときは

```
> 条件分岐も
```

と命令すれば Javascriptの条件分岐をサンプル付きで説明してくれます。
してくれない場合は学習していません。

AIへの命令画面の左側にプロジェクトかスレッド一覧があるので新しくスレッドを建ててから

```
> 条件分岐も
```

と説明すると状況が変わります。

# プロジェクト、スレッドって何？
ChatGPTの場合、プロジェクトとスレッドで学習が管理されています。
使い始めて3日目に書いているのとAIが説明している内容を一部含めています。
プロジェクトとスレッドはツリーのような関係で
新規プロジェクトを選ぶとプロジェクトが追加されます。
そのプロジェクトを選択した状態でAIに命令するとスレッドが建てられます。

プロジェクト1
+スレッド1
+スレッド2
プロジェクト2
+スレッド1
+スレッド2

こういう構造です。

# どうしてプロジェクトを分けるのか？
人間で言うと**頭を切り替える**というものです。
たとえば人とプログラムの話をしていて
「ちょっと話は変わるんだけど」
と食べ物の話をすることもあるでしょう
これまでと何にも関係無いことを命令するときはプロジェクトかスレッドを分けた方が良いです。

# スレッドを分けないとどうなるの？
初心者なのでやってしまいました。
私の頭の中には原稿があり、それをAIに整理してもらったところ、非常にわかりやすく整理してくれます。
かんたんな話を書いただけで、登場人物、舞台、時代背景、時間別に起きた出来事
なども書いてくれます。

これは便利とばかりに次々と原稿を同じスレッドに入力しました。
すると

```
警告：メモリ不足です
```

契約して3日でやってしまいました

ショートストーリーをどんどん入力したのですが、30作品ぐらいから反応が悪くなってきます。
そして40作品でメモリ不足になりました。

入力したデータ量は32kバイトもありません。

仕方ないので問い合わせです
```
> もしかしてメモリを圧迫してます？
鋭いご指摘です。実は大量に入力されたためメモリを圧迫しています。でもまだ大丈夫です
```
全然大丈夫じゃねぇ！！！

この状態でプロジェクトやスレッドを切り替えると快適に使えます。
もちろん新しいスレッドに学習データはありません。

# どうすればいいのか？
AIに聞いてみたところ

```
学習したデータをファイルにするので新しいスレッドに読み込ませて学習させて下さい
```

急にアナログの環境に戻った感じです。
AIに他のスレッドを指示すれば参照できるかも？
と思ったのですが、まったく異なるスレッドを参照したり
無を参照してきてこちらを困らせます

# 学習データは移動出来るのか？
40作品入力しているので出来れば一括で欲しいところ

```
> 他のスレッドで学習できるように一括でデータを出力して
わかりました 構成データ 001-040.zip [1]
```

これで他のスレッドで学習させたらいける！！

と思ってファイルを展開して中身を見ると 番号がファイル名になったテキストはあるものの中身がほぼ無い

```
> ファイルの中にデータが無いみたい
出力したデータは　・・・・（←欲しいデータ） です、ですがうまく出力出来ていないようです
```

詰んだわこれ

だめ元で方式を変える
```
> 他のスレッドで学習できるように一括でデータ001を単品で出力して
わかりました 構成データ 001.txt [1]
```

こっちは学習データが入ってる！！

どうやらスレッドに対するメモリが限界でデータをまとめる処理が出来ないようだ。

というわけで今現在、1ファイルの生成に5分かかっているが学習データを出力させている

# 教訓
同じスレッド内で作業を続けるな！
スレッドを建てても引き継げる**らしい**のでどんどん建てる！

他のプロジェクトはAIに1から学習させるのに2時間かかったので、この状態から他のスレッドに引き継げるのか試していますが、みなさんも注意した方が良いです。

良い方法があたらコメント下さい。
【SQL】ユーザー権限の削除(REVOKE)

## 不要な権限を削除する

### Oracle

```SQL:システム権限
REVOKE [権限名] FROM [ユーザー名];
```

```SQL:オブジェクト権限
REVOKE [権限名] ON [オブジェクト名] FROM [ユーザー名];
```

### SQL Server

```SQL:ステートメント権限
REVOKE [権限名] FROM [ユーザー名];
```

```SQL:オブジェクト権限
REVOKE [権限名] ON [オブジェクト名] FROM [ユーザー名];
```

### MySQL

```SQL:
REVOKE [権限名] ON [テーブル名] FROM [ユーザー名];
```

### PostgreSQL

```SQL:オブジェクト権限
REVOKE [権限名] ON [オブジェクト名] FROM [ユーザー名];
```


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

## 参考文献
・図解 SQL これからはじめる基本の知識 (知りたい！テクノロジー) 単行本（ソフトカバー） – 2010/12/11
島田 裕二 (著)
p.72-73
JavaScriptおすすめパララックスプラグイン

パララックス（視差効果）演出といっても上下左右スクロールや回転等様々な演出がありますが、その中でJavaScriptおすすめパララックスプラグインを紹介します。


<h2>simpleParallax.js</h2>
シンプルにパララックス演出を実装できます。<br>
<a href="https://dad-union.com/simpleparallax-js-parallax">simpleParallax.jsでのパララックス実装！</a>
<br>
<h2>ScrollMagic.js</h2>
パララックスとページスクロールと連動したアニメーションを表示できます。<br>
<a href="https://dad-union.com/scrollmagic-js-parallax-animation">ScrollMagic.jsで実現！パララックスとスクロールアニメーションの組み合わせ技術解説</a>
<br>
<h2>Rellax.js</h2>
jQuery不用で簡単にパララックスを実装できます。<br>
<a href="https://dad-union.com/rellax-js-parallax-effect">Rellax.jsで簡単にパララックス効果を実装する方法</a>
<br>
<h2>SUPERSCROLLORAMA</h2>
ページ内のコンテンツをパララックスや色々なエフェクト演出で表示できます。
<a href="https://dad-union.com/jquery-superscrollorama-js-parallax-effects-animation">jquery.superscrollorama.jsで実現するパララックスエフェクトとアニメーション</a><br>
<br>
<br>
<a href="https://dad-union.com/recommended-javascript-parallax-plugins">続きはコチラ＞＞</a>
Laravelで改行表示をしつつ、セキュリティも確保する！nl2br(e(session('message')))の意味と使い方

# ①session('message')とは？
Laravelでは、コントローラーなどでメッセージをセッションに保存できます:
```php
return redirect()->route('index')->with('message', '投稿が完了しました!');
```
これをビュー側で受け取るには、以下のようにします：
```php
{{ session('message') }}
```
ただし、これだけだと**改行が反映されません。**

# ②e()とは？
```php
e($value)
```
- Laravelが提供する**HTMLエスケープ関数**
- ユーザー入力などに含まれるHTMLタグや特殊文字(<,>,"など)を安全に表示するために変換します。

**例:**
```php
e('<script>alert("危険")</script>')
// =>&lt;script&gt;alert(&quot;危険&quot;)&lt;/script&gt;
```
-> **XSS対策(クロスサイトスクリプティング防止)に必須の処理**です。

# ③nl2br()とは？
```php
nl2br($string)
```
- PHPの標準関数
- **文字列中の\n(改行)を<br>タグに変換**します
- 改行をそのままHTMLで再現したいときに便利

**例:**
```php
nl2br("こんにちは\n世界")
// =>　こんにちは<br>世界
```

# ④nl2br(e(...))の意味
nl2br(e(session('message')))という順番で書く理由は、以下の通り:

- **session** **('message')** でメッセージ文字列を取得
- **e** **()** でHTMLタグや特殊文字をエスケープ(安全に)
- **nl2br** **()** で\nを<br>に変換(見た目を整える)

# ⑤{{}}ではなく{!! !!}を使う理由

LaravelのBladeでは:
- {{ ... }}　→　HTMLエスケープされた文字列を表示
- {{!! ... !!}}　→　HTMLをそのまま出力(XSSに注意)

今回、nl2br()によって<br>タグが入ってくるため、{{　}}だとエスケープされて<br> がただの文字列として表示されてしまいます。

→　よって、**{{!! !!}}を使って「HTMLをそのまま出力」する必要がある**のです。

ただし、**e()でしっかりエスケープ済みなので安全**です。

# ⑥まとめ: {!! nl2br(e(session('message'))) !!}の意味
![IMG_7753.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2246240/47f8f5ab-8870-496b-bcbd-0592636ace99.jpeg)

# ⑦おまけ:使いどころ
- お問い合わせフォームやコメント欄など、**自由入力のテキストを画面に表示する時**
- 投稿完了メッセージなどを複数行に分けて表示したい時
- Laravel + Bootstrap / Tailwind CSS と組み合わせる時にも活躍
SharePoint Listsに設定されているアクセス許可を確認する

## はじめに
SharePoint Listsにアイテムが1件以上あるかどうかでリストに対するアクセス許可の取得方法が異なるため、それぞれの方法をまとめてみました。

## １件以上ある場合
SharePoint Listsアイテムが１件以上存在する場合、特定のアイテムを指定してそのアイテムに対するアクセス許可を確認します。
アイテムごとにアクセス許可が設定されている場合、リスト全体の権限を確認する目的には適しません。

以下のリクエスト例ではSharePoint SiteのサイトIDを使用していますが、ドライブID等を代わりに使用することもできます。
```
GET https://example.sharepoint.com/sites/<siteId>/lists/<listsId>/items/<itemId>/driveitem/permissions
Authorization: Bearer <accessToken>
```

## ０件の場合
SharePoint Listsアイテムが１件も存在しない場合、リスト全体に対するアクセス許可の確認をします。
ただし、この APIは **ベータ版のため、予告なく変更される可能性がある点に注意が必要** です。
```
GET https://example.sharepoint.com/beta/sites/<siteId>/lists/<listsId>/permissions
Authorization: Bearer <accessToken>
```

## 参考
[driveItem に対する共有アクセス許可を一覧表示する](https://learn.microsoft.com/ja-jp/graph/api/driveitem-list-permissions?view=graph-rest-1.0&tabs=http "driveItem に対する共有アクセス許可を一覧表示する")
[リストに対するアクセス許可を作成する](https://learn.microsoft.com/ja-jp/graph/api/list-post-permissions?view=graph-rest-beta&viewFallbackFrom=graph-rest-1.0 "リストに対するアクセス許可を作成する")
SharePoint RESTAPIでSharePoint Listsレコード内に添付ファイルをPOSTする

## はじめに
SharePoint Lists内で画像を管理する際に **Site Asssetsなどの同じSharePoint Site内のフォルダを利用せず**、各行内にて画像等を添付ファイルとして管理する方法についてまとめました。

## FormDigestValueの取得
SharePoint RESTAPIで作成・更新・削除処理を行う場合、**OAuthを使用しない場合はFormDigestValueが必要** になります。
以下のリクエストで取得することができます。

```
POST https://example.sharepoint.com/sites/<siteName>/_api/contextinfo
Authorization: Bearer <accessToken>
Accept: application/json;odata=verbose
Content-Type: application/json;odata=verbose
```
レスポンスのJSONデータ内の`["d"]["GetContextWebInformation"]["FormDigestValue"]`に含まれる値がFormDigestValueです。

## 添付ファイルをPOSTする

```
POST https://example.sharepoint.com/sites/<siteName>/_api/web/lists/GetByTitle('testList')/items(1)/AttachmentFiles/add(FileName='testImage.png')
Authorization: Bearer <accessToken>
Accept: application/json;odata=verbose
Content-Type: application/json;odata=verbose

X-RequestDigest: <formDigestValue>
```
ちなみに、ファイル名に"Reserved_ImageAttachment_"をつけると、添付ファイルがSharePoint Listsから手動で操作できない状態でPOSTされます。

## 添付ファイルを画像列にサムネイルとして表示する
SharePoint Listsに新しいアイテムを追加する時と同様に、以下のようなJSONを POST または UPDATE することで、画像列にファイル名を設定できます。

```json
{
  "testImageColumn": {
    "fileName": "testImage.png"
  }
}
```

## 参考
[SharePoint REST API を使ってリスト アイテムの画像列を更新する](https://zenn.dev/karamem0/articles/2021_08_26_170000 "SharePoint REST API を使ってリスト アイテムの画像列を更新する")
[REST を使用してリストとリスト アイテムを操作する](https://learn.microsoft.com/ja-jp/sharepoint/dev/sp-add-ins/working-with-lists-and-list-items-with-rest "REST を使用してリストとリスト アイテムを操作する")
Laravel 10のユニットテストで"There is no active transaction"がでる。truncate削除しても出る

## 現象

Laravel 10のテスト実行時に「There is no active transaction」というエラーが発生した。一般的によく言われている原因とされるtruncateなどのデータベース操作は行っていない状態で発生しており、原因の特定が難しかった。

特徴として：

1. テストを単体で実行すると問題なく終了するが、一連のテストを連続実行すると発生する
2. データプロバイダー（dataProvider）を使用したテストで発生する傾向がある
3. PhpSpreadsheetを使った処理を含むテストで発生することがわかった
4. ログ調査の結果、トランザクションは正しく開始され（レベル1）、コミット直前まで維持されていることが確認できた

エラーメッセージからは、アクティブなトランザクションがない状態でトランザクション操作（主にロールバックやコミット）を実行しようとしていることがわかるが、トランザクションの開始と終了が適切に行われているにも関わらずエラーが発生するという矛盾した状況だった。

## 原因：特定困難も関連要素を特定

「There is no active transaction」エラーの正確な原因特定は困難でしたが、以下の要素が関連していることが判明しました：

1. **テスト間での状態共有**
   - 複数テストの連続実行時のみエラー発生
   - データプロバイダー使用時に特に発生

2. **リソース集約的な処理の影響**
   - PhpSpreadsheetを使った処理を含むテストで発生
   - メモリ管理がトランザクション状態に影響の可能性

3. **結合テストの複雑性**
   - 複数コンポーネント（ファイル操作、DB操作等）の相互作用
   - テスト粒度が大きすぎることによる問題特定の難しさ

単一の明確な原因は特定できず、「環境依存の問題」の典型例と言えます。

## 反省点：テスト設計

1. **テスト粒度**
   - 各クラス単位の単体テストをより充実させるべき
   - 大きな結合テストは問題発生時の原因特定が困難に

2. **テスト独立性**
   - テスト間で状態共有がないよう設計すべき
   - 特にDB操作やファイル操作を含むテストでは重要

## 解決策：PHPUnitのプロセス分離設定を適切に活用

今回の「There is no active transaction」エラーに対する解決策は、PHPUnitのプロセス分離機能を適切に設定することでした。

### 1. テストクラスにアノテーションを追加

問題が発生するテストクラスに以下のアノテーションを追加しました：

```php
/**
 * @runTestsInSeparateProcesses
 */
class FileImportTest extends TestCase
{
    // テストコード
}
```

これにより、このテストクラスの各テストメソッドが独立したPHPプロセスで実行されるようになり、テスト間での状態共有が防止されました。

### 2. プロセス分離の選択的適用

テスト全体に対して`phpunit.xml`でプロセス分離を有効にすることも可能ですが、以下のような新たな問題が発生する可能性があります：

```xml
<!-- 全テストでプロセス分離を有効にする設定 -->
<phpunit processIsolation="true">
```

この設定を行うと、今度は以下のようなシリアライズエラーが発生することがありました：

```
An error occurred inside PHPUnit.
Message: Serialization of 'Illuminate\Http\UploadedFile' is not allowed
```

これは、テスト間でファイルアップロード機能を使用している場合に特に発生しがちです。

### 3. 最適な解決策

最終的には、以下のアプローチを採用しました：

1. グローバルな`processIsolation`設定は無効（デフォルト）のままにする
2. リソース集約的な処理や状態共有の問題が発生しやすいテストクラスにのみ`@runTestsInSeparateProcesses`アノテーションを追加する
3. それ以外のテストは通常通りのプロセスで実行し、パフォーマンスを維持する

この方法により、問題のあるテストだけを分離して実行することができ、エラーを解消しつつもテスト全体の実行速度への影響を最小限に抑えることができました。
チームの“本気”はどう引き出されるのか？  「This Is Me」セッションから学んだ“空気”のつくり方

プロジェクトマネージャーという立場で仕事をしていると、
計画、進捗、課題、リスク…
日々追いかけるべきものはたくさんあります。

でも実際にプロジェクトを動かしているのは、「人」です。
そして、人が本気になる瞬間というのは、管理の枠を超えたところで起きている——
そんな実感を、ここ最近あらためて強く持っています。

その思いを強く後押ししてくれたのが、
映画『グレイテスト・ショーマン』の楽曲「This Is Me」のワークショップセッション映像でした。

⸻

“予定調和じゃない”チームのエネルギー

この映像は、まだ映画制作の初期段階に行われたワークショップの記録です。

歌い手のキアラ・セトルは、最初は譜面を持って後ろに立っていて、どこか遠慮しているようにも見えます。
でも、曲が進むにつれて少しずつ前に出ていき、
やがてマイクを握り、魂をぶつけるように「This Is Me」を歌い出す。

その瞬間、スタジオ全体の空気が変わったのが画面越しにもはっきり伝わってきました。
チームが一気に“ひとつの方向”を向くような、あの感覚。

あれは、準備された演出ではなく、誰かの本気が自然に場の空気を変えた瞬間でした。

⸻

あの空気を、どうすれば日常のプロジェクトに取り込めるか？

あのセッションを観ながら、自分の現場に思いを重ねました。

たとえば、レビューの場。
たとえば、ふとした1on1の会話。
そこで誰かが勇気を出して何かを言ったとき、
その想いが“場の空気ごと”変えていくような瞬間って、確かにあるんですよね。

あのセッションのような大きな感動まではいかなくても、
誰かが本気を出したくなる空気、出しても受け止めてもらえる空気を、
日々の小さなやりとりの中でつくっていけたら——
そう思いました。

あれを「目指す」というより、
あの空気のつくり方を、自分の仕事にも少しずつ“取り込んで”いきたいと思ったんです。

⸻

技術と並んで、「空気を扱う力」も実践の中で磨きたい

プロジェクトマネジメントには、たくさんの技術があります。
WBS、バーンダウンチャート、リスクログ……どれも大切な道具です。

でもそれだけでは動かないのが、チーム。
人と人のあいだに流れる空気や、信頼や、ちょっとした安心感。
そういう目に見えない要素が、実は大きな推進力になります。

あのセッションを観て、それを“思い出した”という感覚でした。

これからも、進捗を回しつつ、課題を潰しつつ、
「空気を扱う力」も、現場の実践の中で磨いていきたい。
そう思わせてくれた、とても大切な映像です。

まだ観たことのない方には、ぜひ一度おすすめしたいと思います。
たった5分ですが、プロジェクトマネジメントの“軸”に関わるヒントが、きっと見つかるはずです。

［「This Is Me」のワークショップセッション］（https://youtu.be/g91RzJqMNhU?si=CS7RZOj1MltcBeCq）
AI開発🔥VSCode Clineの"Retry"連打、もうやめませんか？Pythonで作る自動クリックツールで開発効率アップ

## 🚀 はじめに

VSCode拡張機能「Cline」、便利ですよね！✨
でも、OpenRouter API利用時の "API request failed" と "Retry" ボタンの連続クリック、ちょっと面倒に感じませんか？ 🤔

今回は、その手間を解消するPythonツール **「Cline Retry Auto Clicker」** をご紹介します！
指定範囲の色を監視して、自動でクリックしてくれるシンプルなツールです🖱️

![ツールのスクリーンショット](https://raw.githubusercontent.com/dopqLOL/Cline_Retry_Cicker/main/screenshot.png)

## 🤔 きっかけ (開発経緯)

Clineでコーディング中に他の作業をしていると、"API request failed" で止まっていることが… 😥
「この "Retry" ボタン、自動で押せないかな？」と思ったのが始まりです。
指定した場所に特定の色が現れたらクリックする単純な仕組みで、コーディングに集中できる時間を増やしたいと考えました 💪🎯

## 📂 ソースコード (リポジトリ)

ダウンロードリンクGitHubで公開しています🐙
* 📥ダウンロードリンク
* https://github.com/dopqLOL/Cline_Retry_Cicker/releases/tag/v1.0.0
* 🔗GitHubリポジトリ
*    [https://github.com/dopqLOL/Cline_Retry_Cicker](https://github.com/dopqLOL/Cline_Retry_Cicker)

## ✨ 機能紹介

このツールでできることリストです👇

*   **判定モード選択**:
    *   🎨 単色判定: 1色を監視
    *   🎨🎨 2色判定: 2色を監視 (より複雑な条件に)
*   **色検出** 👁️: 指定範囲の色を継続監視
*   **自動クリック** 🖱️: ターゲット色を2回連続検出したら自動クリック (誤クリック防止)
*   **クリック上限設定** 🔢: 指定回数で自動停止 (0 or 空欄で無制限)
*   **判定間隔調整** ⏱️: 再確認までの待機時間（秒）を設定 (PC負荷調整)
*   **判定範囲（色認識の柔軟性）** 🌈: 色検出のあいまいさを5段階で調整
*   **ホットキー操作** ⌨️: `F9` で監視ON/OFFを簡単切り替え
*   **直感的な設定** ✨: マウス操作で監視範囲・クリック地点・色を簡単設定
*   **設定の自動保存** 💾: 設定は `settings.json` に自動保存＆次回読込

## 📝 簡単な使い方

使い方はとってもシンプルです！

1.  `dist` フォルダにある `cline_retry_auto_clicker_jp.exe` を起動します。
2.  **判定モード**（単色か2色か）を選択します。
3.  **「範囲設定」** ボタンを押し、監視したい画面上のエリアをドラッグして選択します。
4.  **「クリック設定」** ボタンを押し、クリックさせたい場所を画面上でクリックします。
5.  **「色1 抽出」** ボタン（2色モードの場合は「色2 抽出」も）を押し、ターゲットとなる色が表示されている画面上のピクセルをクリックするか、色見本をクリックしてカラーピッカーから色を選択します。
6.  必要に応じて、**上限回数**、**判定間隔**、**判定範囲**を調整します。
7.  設定が完了したら **「監視 開始」** ボタンを押すか、`F9` キーを押すと監視が始まります。
8.  監視を停止したい場合は **「監視 停止」** ボタンを押すか、再度 `F9` キーを押します。

## 🛠️ セットアップ

### 📦 実行ファイル (.exe) を使う場合
特別なインストール作業は必要ありません。
`dist` フォルダ内にある `cline_retry_auto_clicker_jp.exe` をダブルクリックするだけで起動できます。

### 🐍 Pythonスクリプトから実行する場合
Python環境をお持ちの方は、スクリプトから直接実行することも可能です。
その場合、以下のライブラリが必要となります。ターミナルやコマンドプロンプトでインストールしてください。

```bash
pip install pynput pyautogui Pillow mss
```

(tkinter, threading, time, ctypes, winsound, functools は通常Pythonに標準で含まれているため、別途インストールは不要な場合が多いです)

⚠️ ご注意

アプリケーションのウィンドウは、常に他のウィンドウより手前に表示される設定になっています (Topmost) ⬆️。

範囲設定やクリック設定の操作中にキャンセルしたい場合は、ESC キーを押してください ↩️。

🎉 おわりに

今回は、自作の自動クリッカー「Cline Retry Auto Clicker」を紹介しました！
このツールが、皆さんの開発における小さな「手間」を減らし、より快適なコーディング環境の実現に貢献できれば幸いです😊

Clineの"Retry"ボタンに限らず、「画面のこの部分がこの色になったら、ここをクリックする」といった単純作業の自動化にも応用できるかもしれません👍

ご興味があれば、ぜひ一度お試しください！

📫 ご連絡

もしバグを発見された場合や、「こうすればもっと良くなるのでは」といったご意見・ご要望がありましたら、お気軽に以下の連絡先までお知らせいただけると嬉しいです。

🐦 X (旧Twitter): https://x.com/wyUMAjanaiyo

📧 Gmail: adwddwdaw@gmail.com
データサイエンティストの情報収集源

## 前提
データサイエンティストとして論文実装などを行なってきており、その際に用いる情報収集源を書いた記事です。
論文は読みますが、大学などの研究施設で研究をこなしていたわけではないです。

## 論文のリサーチ方法
まずやりたいタスクについて自然言語検索サービスで検索します。
使用ツールは以下です。
+ GeminiのDeepResearch
これはGeminiではなくてChatGPTでも構いません。
+ XのGrok
上記でWebとXの情報の両方を得られます。
リサーチャーはなんだかんだ最終的にXに回帰しまいますね。。。
自然言語検索についてはElicitを元々使用していましたが、上記のようなツールが出てきたおかげでお役御免となりました。

もちろん自然言語以外の検索もします。
使用ツールは以下です。
+ Google Scholar
+ Xでの通常の検索
また、タスク、データセットでSoTAなサービスを調べる際は、
Paper with Codeも用います。

上記のツールで見つけた論文についてConnected Papersで関連論文を調べていきます。

上記のように調べていきますが、もちろん状況に応じて柔軟に色々なツールを使い分けます。
見つけた論文のモデルについて、
Hugging FaceやGithubでどれだけいいねがあるかは参考にします。
[カンファレンスランク](https://research-p.com/column/1144)
なんかも参考にします。
論文リサーチに時間をかけすぎてもあれなので、ランク5,6番目までのものまで読むことが多いです。

## トレンドのリサーチ
松尾研のリサーチャーである小川雄太郎様が書かれた以下のサイトが参考になります。
https://zenn.dev/mkj/articles/1357a7ea2970c4
私は経営に携わるような立場には及ばないこと、まだ自分の力を磨くためには1次情報にできるだけあたる必要があると思い、上記のリンクのうち日経ビジネス、ITMediaなどの社会情勢についての情報源、Zennやはてなブログのトレンド情報、生成AIウィークリーなどは見ていません。
日経クロステックぐらいはエンジニアとして世間に疎くなりすぎたらいけないので見ています。

以下のように日々の確認効率化を図っています。
Gmailの[ラベル振り分け機能](https://www.yoshidumi.co.jp/collaboration-lab/gmail-auto-sort)で「情報収集」というラベルをつけて振り分けています。この際に受信トレイをスキップ(アーカイブする)にチェックを入れると受信トレイにメールがたまらずにすみますのでオススメです。
![images_69-7.jpeg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3885881/afc4cc75-a751-43a9-bab4-81aa0ffbcbb9.jpeg)
![スクリーンショット 0007-04-03 8.52.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3885881/ddebf7db-0a6d-4e19-8ec2-115f1b4640ae.png)


また、ブラウザArcのフォルダ機能を使って簡単に確認できるようにしています。
![スクリーンショット 0007-04-03 8.50.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3885881/d0abd154-0aea-4b61-95a8-5e52bfccd69e.png)


## まとめ
トレンドのリサーチは朝時間ある時に行うようにしていますが、正直できないことの方が多いです。
神経質にならないことが大事だと思います。
最後にまだ駆け出しエンジニアですの、皆さんがどのようにしているかもお聞かせいただけますと幸いです。
windows11で、sketchup6 その43

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

# 練習問題
sketchupで、dp 5, 5, 5で、x=5 y=5 z=5に、点を打て。

# 写真

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/0eeecd66-4998-40b7-bcc1-b2acdac196cb.png)

# サンプルコード

```

def dp(x, y, z)
	ents = Sketchup.active_model.entities
	pt1 = [x, y - 0.1, z]
	pt2 = [x - 0.1, y - 0.1, z]
	pt3 = [x - 0.1, y, z]
	face = ents.add_face pt1, pt2, pt3
	face.pushpull -0.1
end


```

以上。
windows11で、sketchup6 その42

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

# 練習問題
sketchupで、alertを、実装せよ。


# 写真

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/18104/e3aea3d6-bbe9-48d0-b308-4b484f00fbb4.png)

# サンプルコード

```
def alert(msg)
	UI.messagebox msg
end

```


以上。
「全部読まなくてよかったんだ」って気づいた日

「え、これ表示されてる値、間違ってない？」

そんな一言から、長い長いコードリーディングが始まりました。

あるWebサービスの表示値と、データベースで集計した値が微妙にズレていたんです。

依頼者の指示は「コードを頭から読んで、どこでズレてるのか探してほしい」。
正直、膨大なコードにうんざりしながらも、言われた通り最初から読み進めていました。

でも、ふとした瞬間に「このやり方、非効率すぎるんじゃ？」と我に返りました。

## 課題じゃなくて「ゴール」から考えるべきだった

今回のゴールは、「表示されている値」と「データベース上の値」に差がない状態にすること。

だったら、ゴールを起点に逆算するべきだったんですよね。

・表示している値は、どこで画面に描画されているのか？  
・その値は、どの関数で生成されているのか？  
・その関数は、どんなロジックで計算しているのか？  
・どこでデータベースとやり取りしているのか？  

こんなふうに「最終的に欲しい状態（ゴール）」から逆算すれば、コードを全部読む必要なんてなかった。

実際、そう切り替えてからはスムーズに問題箇所にたどり着けて、根本原因もすぐに特定できました。

## 「課題」ではなく「目的」から考えるという習慣

この経験を通して強く思ったのは、課題ベースで動くと視野が狭くなりやすいということ。

「課題＝データがズレてる」にフォーカスしすぎて、  
ゴールである「正しく表示される」状態を見失っていた。

結果として、時間も無駄にしたし、モヤモヤも残った。

けれど、もし最初に「どうなっていれば理想か？」を描けていれば、  
もっと早く、正確にアプローチできていたはずなんです。

## この気づきを応用していきたい

それ以来、何か問題に直面した時、まず「ゴール」をイメージするようにしています。

・どんな状態になれば満足か？  
・そのためには、どんな要素が必要か？  
・どこがブラックボックスになっているか？  

場当たり的に「とりあえずやってみる」よりも、  
地図を描いてから歩き出す方が、圧倒的に早くたどり着ける。

そんな当たり前のことを、今回のちょっとしたデータのズレが教えてくれました。
項目レベルセキュリティの接待対象が権限セットに変わっている



今までベータ機能だったのですが、権限セットがデフォルトになったみたいですね。
プレイグランド、DE環境ではちょっと注意です。

+ [I have created a new field for position object named approvers 1 which is reflecting in fields and relationship of that object but in the challenge it is throwing error that approvers is is not found on position object although it's reflecting in fields](https://trailhead.salesforce.com/trailblazer-community/feed/0D5KX00000PXjAM0A1)

システム管理者が出てこない

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/328136/0dbd3944-48c7-4a70-98ac-5125aac1307c.png)


:::note
Try disabling the following settings 

Go to   Setup -> Users -> User Management Settings & Enable “Field-Level Security for Permission Sets during Field Creation ”  

**Field-Level Security for Permission Sets during Field Creation**
 Set field-level security for permission sets when creating or editing custom fields. When this option is enabled, you configure access to the new field for permission sets instead of profiles.  

 ![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/328136/b3064ed8-348e-438c-bbb1-63dac82a519c.png)
:::