Claude Codeを使うなら知っておきたい「Webアプリ」の話
Claude Codeに「サイトを作って」と頼むと出てくるファイルが、どこに何を置いているのか。実際に作らせたコーヒー屋のサイト1つを、いいねボタンを足す→フォルダを2つに割る→Next.jsへ引っ越す、と育てながら、フロントエンド・バックエンド・データベース・フレームワークの位置関係を地図にします。コードは1行も書きません。
生成AIとの向き合い方、仕組みのつくり方、日々の開発で考えていること。 Keyaki Labsの手の内をそのまま書き残していく場所。
Claude Codeに「サイトを作って」と頼むと出てくるファイルが、どこに何を置いているのか。実際に作らせたコーヒー屋のサイト1つを、いいねボタンを足す→フォルダを2つに割る→Next.jsへ引っ越す、と育てながら、フロントエンド・バックエンド・データベース・フレームワークの位置関係を地図にします。コードは1行も書きません。
AIが全部コードを書いてくれるなら、技術のことは知らなくていいのか。知らなくても作れますが、知っていると選べます。Next.js・Ruby on Rails・Laravel・Django・Rustの5つについて「どういう性格で、だからどういう時に相性がいいのか」を並べました。習得の難しさがネックだったRustが、AIが書く時代にどう見え方を変えるかまで。
Claude Codeが、自分のパソコンの外にあるGoogleドライブまで読めるのはなぜか。その仕組みはAPIとMCPの2つで説明できます。同じ中身が人間向けの画面とプログラム向けのデータの2つの形で出てくることをブラウザで確かめ、そのうえでGoogleドライブをコマンド1行も打たずにClaude Codeへつなぎます。つないだあとに確認すべき3つのことまで。
2026年8月7日に入ったばかりのクロスセッションメッセージング。別のターミナルで動いているClaude Codeに伝言を送れる機能です。渡るのはテキストだけという仕様、同じPC内ならAnthropicのサーバーを経由しないこと、そして実際の使い方——チャットに来た依頼を人間が担当セッションに貼り付けていた作業が、窓口セッションを立てることで丸ごと消えた話まで書きました。
Claude Codeを入れてみたものの、出てきた黒い画面の前で止まってしまった方へ。覚えるコマンドはpwd・ls・cdの3つだけです。ターミナルの開き方から、Claude Codeが「起動した場所しか見ていない」という最重要ポイント、Ctrl+Cでの止め方、つまずきやすい3つのケースまで一通り押さえます。
iCloudやDropboxのクラウド同期は便利ですが、「今ちゃんと同期できているか見えない」「競合コピーが増殖する」という小さなストレスがつきまといます。ファイル単位のクラウド同期と、コミット単位のGitの違いから、この「微妙な遅さ」の正体を整理しました。
NECが2026年8月に発表した「AI自律型組織」の内容を正確に紹介し、自分がKeyaki Labsで続けているAI組織運営と構造を比べてみた記事です。合議のチェック機構や定量成果など、大手の仕組みを鏡にすることで見えてきた自分の課題を正直に書いています。
Claude Codeが出力する文章に使われているMarkdown記法の基本7つを解説します。見出し・箇条書き・リンク・コードブロックなど、今日から使える記法を一通り押さえたうえで、マークダウンと相性のよいマインドマップ表示についても触れています。
タスクの整理をほとんど自分でやらなくなった、という以前の記事の続きです。frontmatterでの状態管理、statusを「担当」ではなく「今動けるか」で決めている理由など、ObsidianやClaudeを使っている人がそのまま今日から始められる形で仕組みを公開します。
今つくっているMartenというノートアプリの紹介です。GitHubをデータの置き場にする、マルチデバイス対応のMarkdownノートアプリで、AIエージェントがそのまま触れる場所にノートを置いておけます。
Obsidianに書いたノートをAIに読ませるようになって、「書くだけ」で終わっていた記録が「後で使える知識」に変わりました。週次まとめ・分類・追記をAIに任せる、実際にやっている3つの使い方を紹介します。
Notionからの乗り換えを経て、今はタスクの整理・優先順位づけをほとんどClaudeに任せています。「ローカルのMarkdownファイルであること」が、AIエージェントとの相性を大きく左右するという実感を書きました。
GitHubというとエンジニアがコードを置く場所というイメージが強いですが、実体は「変更履歴つきのクラウドストレージ」です。ノートも設定ファイルも、AIエージェントが直接読み書きできる場所として使われ始めている理由を整理します。
タスクリストに「企画書を書く」と書いて、一向に着手できない。
先日、東京国際フォーラムで開催された「Eight EXPO 2026 夏」に参加してきました。
「まず動かしてみよう」という感覚は大切だと思っています。でも最近、それより先にやるべきことがある、と気づきました。
OpenCodeを使い始めたのは、Claude Codeへの依存が少し気になり始めたからです。
Claude Code、OpenCode、Gemini CLIと、複数のAIコーディングツールを使い分けるようになってから、「自分は何をどれくらい使っているのか」がまったく見えなくなりました。ツールごとに管理画面もバラバラで、全体を把握する手段がない。そこでローカルで動く可視化ツールを自作しました。
GoogleがGemini CLIをAntigravity CLIに統合し2026年6月18日にサービス終了すると発表。MCP設定・スキル・サブエージェントの移行手順を分かりやすくまとめます。
Gemini CLIの設定・スキル・指示ファイルの基本をまとめ、Claude Codeと設定を統一しようとしてハマった落とし穴と解決策を実録でお伝えします。
MCP・サブエージェント・hooksの入り口を紹介し、シリーズ全体を振り返ります。ここから先の中級者向け応用機能への道標となる最終回です。
議事録から週報を自動生成する定型プロンプトをカスタムスラッシュコマンドに昇格させる手順を解説します。「いつもの作業」を「使い回せる仕組み」に変える第5回。
対話だけでブラウザで動くToDoアプリを完成させます。要件の伝え方からPlan modeでの段取り確認・不具合の直し方まで、アプリ開発の一通りを体験します。シリーズ第4回。
雑な会議メモを構造化された議事録に整形するハンズオンで、プロンプトの基本・@メンション・Plan mode・スラッシュコマンドを体験します。シリーズ第3回。
ターミナル・Node.jsのインストールから初回起動・最初の対話まで、非エンジニアでも迷わない手順でClaude Codeを動かすまでを解説します。シリーズ第2回。
Claude Codeとは何か、なぜ今触るべきかを整理します。「誰でも雇えるスーパーエンジニア」という視点から、その全体像と可能性を解説するシリーズ第1回です。
madoというWebアプリを作った経緯と「AIがファイルシステムの前に立つ」というコンセプトを紹介します。情報管理ツールの入口をAIに置き換えることで、Obsidianをほとんど開かなくなった話です。
コスト削減=コンテキスト削減。サブエージェントによるコンテキスト分離とMANAGEMENT.mdによるセッション使い捨て戦略で、Claude Codeの上限問題に向き合う実践的な方法を紹介します。
Claude Codeデスクトップ版の並列エージェント対応・Routines発表、Claude Opus 4.7一般公開、Claude Designプレビュー公開。4月第3週のAnthropicニュースまとめ。
コーディングの一般化が進む中、エンジニアの価値はどこへ向かうのか。Tableauトレーナーの経験とAIオーケストレーターという概念から、次のキャリア像を考えます。
Gemma 4・Llama 4のオープンモデル2本立て発表、Cursor 3のエージェントファースト転換。4月第1週のAI重大ニュースまとめ。
Claude Codeの処理中に流れるingメッセージの正体を調査。ツール操作・フレーバー・完了通知の3種類の違いと、187語ランダム選出の仕組みを解説します。
claude --helpを読んで驚いた実用的なフラグをカテゴリ別に整理。--name、--worktree、--effortなど、知ると作業テンポが上がるオプションを紹介します。
壁打ち相手がおらず「知らないことを知らない」状態だった一人エンジニア時代。AIが技術選定の相談相手になって変わったこと、それでもAIだけでは解決しないことを振り返ります。
Claude Codeが実行するgitコマンドが何をしているのか「読める」ようになるための基礎解説。リポジトリ、コミット、ブランチなど6つのコマンドを中心に説明します。
Claude Mythosリーク、OpenAI Sora終了、Apple×Google Gemini提携の詳細、Rakuten AI 3.0公開、AnthropicvsDODの対立。3月第4週のAI重大ニュースまとめ。
CLAUDE.mdは「Claudeへの申し送り書」。たった数行書くだけで応答の質が変わる、非エンジニア向けの最小テンプレートと育て方のコツを紹介します。
システムプロンプト・RAG・ファインチューニングの違いと使い分けを、GASでbotを作り続けた実体験をもとに整理。段階的アプローチで始め方がわかります。
ナレッジ・タスク・ブログを1つのvaultに集約し、Claude Codeで一括メンテ・プラグイン自作・共同執筆まで行う実際の運用ワークフローを公開します。
GPT-5.4 mini/nano登場、Gemini Personal Intelligenceの無料開放、ClaudeがクヌースのグラフRE問題を解決、Apple新Siri詳報。3月第3週のAIニュースまとめ。
プロンプトを変えた3パターンで架空カフェのWebサイトをClaude Codeに作らせた実験。伝える情報の粒度で仕上がりが大きく変わる結果になりました。
LINEbot、Appsheet連携、外部フォームのバックエンドをすべてGASで無料構築した経験から、GASの実力と限界、使い分けの原則を体験ベースで解説します。
X、Instagram、TikTok、Discord、Slack、Notion、Shopify、Netflixの技術スタックを公開情報から調査。意外な選択と共通する傾向が見えてきます。
チャット型からCLI型コーディング支援、全自動アプリ生成まで、2026年3月時点でエンジニアが触れうるAIツールを網羅的にカタログ化しました。
Skillsによるコマンド化、非対話モード、コンテキスト圧縮など、Claude Codeの意外と知られていない便利な機能を5つ厳選して紹介します。
LLMが外部APIを呼び出して実際にアクションを起こす「Function Calling」の仕組みと設計パターン、プロンプトチューニングの勘どころを実例付きで解説します。
コードを書かなくてもAIと対話するだけでBotからWebアプリまで作れる。Claudeを使った「一緒にモノを作る」体験を実例3つとともに紹介します。
ChatGPTでエラーを解決していた2023年から、Claude Codeが自律的に動く今まで。2年間のAI活用の変遷と、AIとの関係の変化を振り返ります。
IT専門人材がいない小規模組織でもGoogle Apps Scriptなら低コスト・低ハードルでDXを始められる。代表的なユースケース3つを解説します。
AIへの話し方は精度に影響するのか、研究データと実体験をもとに考察。「人間とAIの公用語」という壮大な可能性まで話は広がります。
自作したObsidianプラグイン3つ(タスク管理・AIチャット・便利機能)を紹介します。
NotionからObsidianに乗り換えた経緯と、ローカルファイル×Claude Codeの組み合わせが最強だと感じる理由を紹介します。
Google Apps ScriptとGemini APIのFunction Callingを組み合わせて、完了報告があるまでリマインドし続けるエージェント型Botを無料で構築する方法を解説します。
Claude CodeにGoogle Drive用のMCPサーバーを追加して、ドキュメント作成・管理を自動化する導入手順をまとめました。
CLIベースのAIコーディングエージェント「Claude Code」の魅力と、普段の開発での具体的な活用方法を紹介します。