要件定義・設計・実装・デプロイまで伴走｜Laravel × React実践開発

チュートリアルの次へ進みたい方へ

LaravelやReactを学んだものの、次のような状態で止まっていませんか？

• CRUDは作れるが、その先に何を実装すればよいか分からない
• LaravelとReactの連携方法が分からない
• エラーを検索しても、自分の環境に当てはめられない
• ポートフォリオ制作が途中で止まっている
• AIが生成したコードを、そのまま使ってよいか判断できない
• 要件定義や設計書の作り方が分からない

このプランでは、Markdown形式の設計書を作成し、その設計をもとにLaravel・React・TypeScriptで実装、テスト、README作成、デプロイまで進めます。

完成コードを写すだけではなく、設計や処理の流れを理解し、自分でアプリを作り、エラーを調査・修正できる状態を目指します。

作成するWebアプリ

転職活動を管理するWebアプリ
「JobHunt Lite」 を作成します。

実装する主な機能は次のとおりです。

• ユーザー登録・ログイン
• 求人情報の登録・編集・削除
• 求人検索
• 応募状況の管理
• お気に入り管理
• ダッシュボード表示
• ユーザーごとのデータ管理
• Laravel APIとReact画面の連携
• 入力値チェック・エラー表示

単純なCRUDだけではなく、実際のWebサービスを意識した構成を経験できます。

作成する成果物

アプリ本体に加えて、開発内容を説明するための資料も作成します。

• 要件定義書
• 機能一覧
• 画面構成
• DB設計書
• API設計書
• テスト項目
• README
• GitHubリポジトリ
• 公開したWebアプリ

設計書はMarkdown形式で作成します。

コードだけでなく、「何を考えて、なぜこの構成にしたのか」まで説明できるポートフォリオを目指します。

このプランで身につくこと

• 作りたいものを機能に分解する力
• 画面・DB・APIを設計する力
• LaravelとReactを連携させる力
• Markdownで設計書を作成する力
• エラーの原因を切り分ける力
• 既存コードを読み解く力
• AIが生成したコードを確認・修正する力
• GitHubで成果物を説明する力

LaravelやReactの文法は、実装に必要な内容をその都度補足します。

文法を最初から順番に学ぶ講座ではなく、実際のアプリ開発を進めながら必要な知識を身につける形式です。

サポート形式

ZoomやGoogle Meetなどを使った、オンライン・ハンズオン形式です。

画面共有を行い、受講者自身に手を動かしていただきながら、設計、実装、エラー調査、デバッグを一緒に進めます。

サポート内容

• オンライン面談：月4回・各90分
• チャットでの質問対応
• コードレビュー
• 要件整理・画面設計
• DB・API設計
• エラーや不具合の原因調査
• Docker環境構築
• Git・GitHubの操作支援
• Markdown設計書・README作成
• ポートフォリオ制作
• デプロイ支援

単に修正方法を伝えるだけではなく、

• どこに原因があるのか
• 何を確認すればよいのか
• なぜその修正が必要なのか
• 修正後に何をテストするのか

まで整理して説明します。

開発の流れ

1. アプリの目的と利用者を整理
2. 必要な画面と機能を整理
3. Markdownで要件定義書・設計書を作成
4. DB・APIを設計
5. Laravelで認証とAPIを実装
6. React・TypeScriptで画面を実装
7. LaravelとReactを接続
8. 検索・お気に入り・応募状況管理を追加
9. 動作確認・テスト
10. コードレビューと修正
11. READMEを作成
12. Webアプリをデプロイ
13. ポートフォリオとして完成

受講期間や作業ペースに応じて、段階的に進めます。

AIツールについて

必要に応じて、ChatGPTやKiroなどのAI開発支援ツールを利用できます。

AIツールの利用は必須ではありません。

利用する場合も、生成されたコードをそのまま採用するのではなく、

• 要件に合っているか
• どのファイルが変更されたか
• なぜその修正が必要なのか
• 設計やセキュリティに問題がないか
• 何をテストすべきか

を一緒に確認します。

有料AIツールを利用する場合、その料金は本プランの受講料には含まれません。

このプランがおすすめの方

• Laravelの基礎学習を終えた方
• React・TypeScriptを使った開発に挑戦したい方
• CRUDの次へ進みたい方
• LaravelとReactの連携を学びたい方
• 設計書を作ってから実装する流れを経験したい方
• ポートフォリオを完成させたい方
• エラーを自分で調査できるようになりたい方
• AIが生成したコードを判断できるようになりたい方

受講前に必要な知識

プログラミング完全未経験者向けではありません。

次の基礎知識がある方を想定しています。

• HTML・CSSの基本
• JavaScript・PHPの基本
• Laravelで簡単な画面やCRUDを作った経験
• Gitの基本操作
• ターミナルで簡単なコマンドを実行した経験

ReactやTypeScriptの経験が浅い場合は、必要な内容を補足しながら進めます。

最終的なゴール

JobHunt Liteを完成させることだけが目的ではありません。

• 要件や機能を整理できる
• 画面・DB・APIを設計できる
• LaravelとReactを連携できる
• エラーを調査・修正できる
• AIが生成したコードを確認できる
• Webアプリを公開できる
• 作ったものを自分の言葉で説明できる

状態を目指します。

自分で考え、設計し、作り、調査し、直せるようになるための実践的な開発プランです。