Level 8 チャレンジ
Claude Code で完全なプロジェクトを作って公開する
⏱ 想定 ~7 分
01 · 読む
本番です。Claude Code でゼロから完全なブックマーク管理アプリを作ります —— 完成したら GitHub にプッシュします。
ステップバイステップの手取り足取りはありません。シミュレーションもありません。あなたにはすべてのスキルがあります。 - ターミナル(Level 2)—— 移動とコマンド実行 - ファイルシステム(Level 3)—— ファイルの作成と整理 - Git(Level 4)—— バージョン管理と GitHub - Web の基礎(Level 5)—— HTML、CSS、JavaScript - Node.js(Level 7)—— 本物のプロジェクトを作る - Claude Code(Level 8)—— AI を使った開発
下の各チェック項目は追加すべき機能です。Claude Code で 1 つずつ作りましょう。各変更を git diff でレビュー。フィーチャーブランチを使う。これがプロのフローです。
焦らないでください。急がない。目標は速さではなく —— 本物の、動くものを作ることです。
02 · チェックリスト
Claude Code でゼロからブックマークマネージャーを作ります。各機能を順番に完了させましょう。学んだイテレーションのフローを使う:Claude にプロンプトを出す、変更をレビュー、コミット、次へ進む。
- 新しいプロジェクトフォルダを作り、npm で初期化
- Claude で作る:フォーム(URL + タイトル + カテゴリの欄)付き HTML ページ
- Claude で追加:localStorage 永続化
- Claude で追加:カテゴリ別にブックマークをグループ表示
- Claude で追加:検索/フィルタ機能
- Claude で追加:削除と編集機能
- 各変更を git diff でレビュー
- 各機能に git branch を使う
- 完成したプロジェクトを GitHub にプッシュ
03 · クイズ
プロの Claude Code フローで、機能を作り終えた後に来るのは?
- すぐにデプロイ
- git diff で変更をレビュー
- ブランチを削除
- 新しい機能を始める
04 · 空欄補充
Claude Code がファイルを変更したら、コミット前は必ず git _____ でレビューします。
05 · 読む
おめでとう。Claude Code で本物のアプリを作って公開しました。
少し噛みしめてください。このコースを始めたとき、ターミナルが何か知らなかった。今やもう: - コマンドラインでファイルシステムを移動できる - ファイルとフォルダを作って管理できる - git でバージョン管理ができる - Web サイトとサーバーがどう動くか理解した - ゼロから Node.js プロジェクトを作れる - AI ペアプログラミングパートナーで完全なアプリを作れる - 自分の作品を GitHub に公開できる
もうチュートリアルをなぞっているだけじゃありません。物を作っています。ソフトウェアの書き方を学ぶことと、実際に書けるようになることの差はここにあります。
あなたの GitHub プロフィールにあるブックマークマネージャーが証拠です。あなたが作った。本物のツールで。プロのフローで。
そしてこれはまだ始まりにすぎません。
ポイントまとめ
- ゼロから本物の、動くアプリを作った
- Claude Code をプロの開発ツールとして使った
- branch-build-review-commit のフローに従った
- プロジェクトが GitHub にある —— 本物のポートフォリオ
- 次へ:Level 9 —— カスタム skill であなたのフローを Claude に教える
06 · クイズ
Claude Code が機能を追加しましたが、頼んでいないファイルも変更しました。どうする?
- 全部受け入れる —— Claude が一番分かっているはず
- プロジェクト全体を削除してやり直す
- git checkout で不要なファイルを undo し、他は残す
- 無視して GitHub にプッシュ
07 · 空欄補充
新機能を作る前に新しいブランチを作るには、 git checkout -b _____ を実行します。
⚠ 全機能のインタラクティブ体験には JavaScript が必要です。JavaScript を有効にして再読み込みしてください。
※ このサイトは独立した教育プロジェクトで、Anthropic の公式製品ではありません。Claude™ は Anthropic, PBC の商標です。