🤖 AIとつくる
AIと一緒にアプリや自動化を作る過程
AIとつくるブログの下書きだけを絞り込む — Astro の記事一覧に付けた開発サーバー限定フィルタ
ローカルの記事一覧で公開記事と下書きが混ざって見づらくなったので、Astro の開発サーバーのときだけ出る表示切替フィルタ (すべて/公開のみ/作業中) を付けました。並び順の工夫、本番ビルドにフィルタを残さない作り、専用ページ案から表示切替になった設計相談の記録です。
AIとつくるAstro の dev サーバーが ImageNotFound から戻らない — 原因は画像インポートの対応表、Astro 5 → 7 で解消
ブログ記事を公開するたびに Astro の dev サーバーが ImageNotFound で 500 になり、再起動するまで戻らない。原因は画像インポートの対応表が古い項目を消さないことで、6.2.0 で修正済みでした。5.18.1 から 7.2.2 へ更新して他が変わっていないことを確かめた記録と、調査から判断までの Claude Code とのやりとりです。
AIとつくるルールは既定であって上限ではない — AI の素の能力を縛らない運用
Claude Code との作業ルールが増えてきた頃、モデル自体は世代ごとに賢くなっていくのに、考えを制限するルールを貯めると素の能力を活かしきれないのでは、という心配が湧きました。対策を Claude Code 自身と相談して決めた短い記録です。
AIとつくるBing Webmaster Tools に URL が登録されない — 子サイトマップを直接送信した記録
Google Search Console では 18 件登録されている URL が、Bing Webmaster Tools では 3 件でした。サイトマップインデックスの子を Bing が処理していない状態を見つけ、子サイトマップを直接送信してからの 15 日間の推移と、Claude Code とのやりとりを日時付きで載せた記録です。
AIとつくる下書きの画面に description と OGP カードを出した
記事の入口になる検索結果と SNS カードの見え方を、公開前に下書きの画面で確認できるようにしました。Astro の開発サーバーにだけ出るメタ情報プレビューと全記事の一覧ページに、description の全文と文字数、OGP 画像の切り取り、公開ステータスを出しています。
AIとつくる作業環境を 1 クリックで開く — Chrome 2 窓と Claude Code の履歴一覧を 3 画面に (Windows + WSL)
PC を起動したら 1 クリックで、左右の画面に Chrome 2 アカウント、中央に Claude Code のセッション履歴一覧が開くように。設定は WSL 側の config.json と Windows 側のショートカット。プログラム全文と Windows 側の注意点も掲載。
AIとつくる個人のタスクを GitHub issue で管理する — Phase と Status の2軸と、状態遷移のルール
アプリ開発や会社の手続きなど個人のタスクを GitHub issue と Projects で管理しています。「いつやるか」の Phase と「いまどういう状態か」の Status の2つのフィールドの意味と、どのタイミングで遷移させるかのルール、Claude Code との分担を書きました。後半には、Status に選択肢を1つ追加したときの API の仕様と、Claude Code に任せるときの注意点も。
AIとつくる「大企業部長向けプレゼン資料」という型の効き方 — Claude Code に計画から完了報告まで
写真で 1.9GB に肥大した git リポジトリの対策を、Claude Code に「大企業でプレゼンするようなイメージで」と頼み、戦略提案から完了報告までを資料として作らせました。先に全体像を資料で見渡してから進めることで、Claude Code が俯瞰を失わずに課題を理解し、その日のうちに実装まで進んだ記録です。第三者レビューを含む資料6本を載せています。
AIとつくるGmail の確認を Claude Code に任せる — 読み取り専用の CLI を作った
メールの確認を Claude Code に任せるため、Gmail を読む小さな CLI を作ってもらいました。OAuth スコープを gmail.readonly に絞った読み取り専用です。4つの案の比較、スコープの選び方、個人利用で気をつける2点、管理画面を自動操作させるときの注意点をまとめています。
AIとつくるはじめてのYouTube動画アップ — 作業約10分、残りはAI
YouTube チャンネルを整えて、はじめて動画を公開するまでの記録です。チャンネルの作り方、プロフィールの設定、音量の下ごしらえ、アップロード画面で決めること、公開予約と限定公開の違い、説明欄に外部リンクを入れるための条件までをまとめました。
AIとつくる楽譜がない新曲を、Claude Code が耳コピ動画から採譜して13鍵ピアノ用に移調するまで
楽譜が売られていない新曲を弾くために、Claude Code が YouTube の耳コピ楽譜動画をフレーム単位で画像解析して88小節を採譜し、13鍵ピアノに収まるキーへ移調するまでの記録。著作権の整理、ABC記法での楽譜管理、ピッチ解析での演奏検証も。
AIとつくるClaude Code の resume 起動を 7秒→2秒に — 原因は MCP 起動の CPU 競合、対策は常駐共有ハブ
WSL 上の Claude Code のセッション再開 (resume) が遅くなり、履歴の選択画面まで 7 秒近くかかっていました。原因は MCP サーバー 3 本の起動プロセスと本体との CPU の取り合い。MCP を PC で 1 つの常駐ハブに共有する構成に切り替えて約 2 秒になり、セッションごとに約 550MB 使っていたメモリも固定費に変わった記録です。
AIとつくる「約18分で読めます」をやめた — ブログ記事のテンプレート作りが読みやすさの見直しに広がった話
ブログの書き方ルールを Claude Code とテンプレート化しました。進めるうちに、読了時間表示をやめて文字数へ、補足の見た目の整理、文字色のコントラスト基準未達の修正、公開後に見つかった文字数カウントのバグまで、読みやすさ全般の見直しに広がった記録です。
AIとつくるClaude Code に写真の顔隠しを頼むと何往復もかかる — 顔とテキストの検出器を持たせて解決した記録
ブログ写真の顔スタンプやモザイクを Claude Code に頼むと、位置合わせだけで何往復もかかっていました。原因は AI が縮小画像から座標を目測していること。顔検出 (YuNet)・テキスト検出 (PP-OCRv3)・人物セグメンテーションを組み合わせたツールを作ってもらい、実測で「強いところ・弱いところ」を確かめた記録です。
AIとつくるClaude Code と並列でブログを書いていたら dev サーバーの取り合いになったので、git worktree で解決した
複数の Claude Code セッションでブログ記事を並列執筆していると、レビュー用の dev サーバーが公開作業のたびに壊れたり止まったりする問題が起きました。実験で原因 (Astro の .astro ディレクトリを dev と build が共有していること) を特定し、公開作業を git worktree に分離して解決するまでの記録です。
AIとつくるGitHub Pages から Cloudflare Workers + 独自ドメインへ — 個人ブログ引っ越しの記録
無料ホスティングの github.io で「Search Console が sitemap を読めない」問題に悩まされ、独自ドメイン tastasworld.com + Cloudflare Workers (static assets) へ移行しました。候補比較 (Netlify・はてなブログPro・レンタルサーバ)、お名前.com との価格比較、NS 縛りの逃げ道、実際のハマりどころまで、費用 年約1,700円の引っ越し全記録です。
AIとつくるAIのブラウザ操作にフォーカスを奪われない環境を作る — WSLg + Xvfb + VNC
Claude Code に Playwright でのブラウザ作業を任せている間、ウィンドウが前面に出て自分のタイピングが中断される問題を解決した記録です。実験でフォーカスが奪われる契機を特定し、headless にできない条件のまま Xvfb 仮想ディスプレイに隠す方法と、見たいときだけ VNC で覗く仕組みを作りました。
AIとつくる@latest の落とし穴 — mcp SDK 2.0 リリースで mcp-google-sheets がつながらなくなった話
Claude Code から Google スプレッドシートを操作する MCP サーバ (mcp-google-sheets) が、ある朝つながらなくなっていました。原因は前々日にリリースされた MCP Python SDK 2.0.0。@latest 起動と上限なしの依存指定 (mcp>=1.8.0) の組み合わせで上流のメジャーアップデートをそのまま掴んだ経緯と、バージョン固定での復旧の記録です。