シリーズ一覧

AI が一瞬で作った、
問題だらけの EC サイトで、
設計力を段階的に鍛える。

同じコードベースを舞台に、テーマを変えながら深く学べるシリーズ構成。どこからでも始められます。

共通のコードベース

全シリーズで同じ 10_sample-ec を使います。コードベースへの理解が深まるほど、後のシリーズが有利になります。

公開中
Essential

AI 時代のコードレビュー力試験 — Essential

AI が一瞬で作った問題だらけの EC サイトのコードを読み、設計上の問題を発見・説明・改善提案する。バックエンド・フロントエンドを問わず、エンジニアとして生存するための基礎力を問う 9 問。

問数
9問（初・中・上級 各 3 問）
推奨対象
実務経験 1〜3 年
テーマ
ファイル設計・バグトレース・セキュリティ・リファクタリング
公開中
Tutorial

設計ドキュメント編 — チュートリアル

何も知らないプロジェクトにアサインされたとき、どうやって全体像を把握するか。サイトマップ・機能仕様書・ER図・画面仕様書・シーケンス図をAIで作りながら、「ドキュメントを全员で共有する意味」を体験する全 5 ステップのチュートリアル。Essential の引数にもなります。

ステップ数
5ステップ（T-01〜T-05）
推奨対象
初めてプロジェクトに入る方・何から始めるか分からない方
テーマ
サイトマップ・ER図・画面仕様書・シーケンス図・PlantUML
公開中
Documentation

設計ドキュメント編

注文キャンセル機能の実装を通じて、AI との設計コミュニケーションを学ぶ。図を描いて設計を可視化し、変更・引き継ぎを経て「設計ドキュメントを残す意味」を体験する 4 問。

問数
4問（S-01〜S-04）
推奨対象
実務経験 1〜3 年
テーマ
PlantUML・設計の可視化・AIへの引き継ぎ

UI 編・サイトフロー編

更新予定

UI 編と サイトフロー編はセットで公開予定。EC サイトの UI 改修・ページ遷移・状態管理を題材に、フロントエンドからフルスタックまでの設計力を問う。

UI 編（予定）

コンポーネント設計・CSS 設計・レスポンシブ・アクセシビリティ・フォームバリデーションを扱う予定。

推奨対象：フロントエンド志向のエンジニア

サイトフロー編（予定）

状態管理・ルーティング設計・API 設計・UX フローを扱う予定。

推奨対象：中級以上・フルスタック志向のエンジニア

リポジトリ構成

各シリーズは独立したフォルダに入っているため、やりたいものだけ取り組めます。

repository/ ├── README.md ├── 10_sample-ec/ # 全シリーズ共通の EC サイト ├── 20_essential/ # Essential（公開中） │ ├── 10_questions/ │ ├── 20_answers/ │ ├── 30_reference-answers/ │ └── 40_evaluation/ ├── 30_documentation/ # ドキュメンテーション編（公開中） │ ├── 10_questions/ │ ├── 20_answers/ │ ├── 30_reference-answers/ │ └── 40_evaluation/ ├── 40_ui/ # UI 編（更新予定） └── 50_site-flow/ # サイトフロー編（更新予定）

さあ、始めましょう

どれも同じコードベースが舞台。Essential でコードレビュー力を固め、チュートリアルでプロジェクトへの入り方を学び、設計ドキュメント編で AI との協働を深める。

Essential を見る（9問） チュートリアルを見る（T×5） 設計ドキュメント編を見る（S×4） GitHub