WEBエンジニアコース
EC サイト・タスク管理・AI チャット・BI ダッシュボードの4本を、設計から実装まで自分の手で作り切る教材です。Figma と動くデモ、実装 FAQ が付きます。
49,800円税込・買い切り
- 章
- 72章
- 本文
- 約165万字
- コード例
- 1569本
- 目安の学習時間
- 約262時間










画像はすべて、教材どおりに作り切った状態の実画面です
こんな方に向いています
エンジニア志望の方(教材のみ・人のレビューはありません)
中身
実践① ECサイト開発18章・約42万字・ 目安56時間
- 01はじめにこのプロジェクトでは、ECサイトをフルスタックで制作します。目安 約1.5時間
- 02ヒアリング実務では、開発に入る前にクライアントから要望をヒアリングします。目安 約1時間
- 03企画書を読み解く実務では、ヒアリング結果を整理し「何を作るか・作らないか」をクライアントと合意するために企画書を作成します。目安 約1時間
- 04要件定義書を読み解く要件定義書は、企画書の「何を実現したいか」を エンジニアが扱える具体的な要件 に翻訳したドキュメントです。目安 約1.5時間
- 05基本設計書を読み解く基本設計書は「外部仕様」を決めるドキュメントです。目安 約2時間
- 06詳細設計書を読み解く詳細設計書は、基本設計の外部仕様を「実装に落とせる粒度」まで具体化したドキュメントです。目安 約2.5時間
- 07実装の進め方実装フェーズの章は 「Ch7-1」「Ch7-2」… のサブ章番号 で呼びます。目安 約1時間
- 08環境構築実務でも使われる「クラウド開発環境」を体験してもらうためです。目安 約3時間
- 09DB準備とプロジェクト雛形Ch7-1 で用意した Codespaces と Neon を使います。目安 約4時間
- 10商品一覧・詳細SQL 定数や mapRow などの機械的な部分は starter 同梱、ロジックは自分で書く ── という分担です。目安 約6時間
- 11カート機能DTO や ヘルパーメソッドは starter 同梱、コアロジックは皆さんが書く ── という分担です。目安 約5時間
- 12認証機能目安 約8時間
- 13レジ・注文確定(トランザクション)目安 約6時間
- 14マイページこの章はユーザー認証(Chapter 7-5)が完了している前提で進みます。目安 約4時間
- 15仕上げ(CSS・エラー・セキュリティ)機能が動くだけでは「実装完了」とは言えません。目安 約5時間
- 16実装FAQ実装中によく出る症状・対処法のリファレンス。
- 17テストと動作確認UT[単体テスト] --> IT[統合テスト]。目安 約4時間
- 18用語ミニ辞書この章は 辞書として使う章 です。目安 通読不要
実践② タスク管理アプリ17章・約46万字・ 目安67時間
- 01はじめにこのプロジェクトでは、タスク管理アプリをフルスタック + 認証つき CRUDで制作します。目安 約1.5 時間
- 02ヒアリング実務では、開発に入る前にクライアントから要望をヒアリングします。目安 約1 時間
- 03企画書を読み解く実務では、ヒアリング結果を整理し「何を作るか・作らないか」をクライアントと合意するために企画書を作成します。目安 約 6 時間
- 04要件定義書を読み解く要件定義書は、企画書の「何を実現したいか」を エンジニアが扱える具体的な要件 に翻訳したドキュメントです。目安 約 1.5 時間
- 05基本設計書を読み解く基本設計書は「外部仕様」を決めるドキュメントです。目安 約 2 時間
- 06詳細設計書を読み解く詳細設計書は、基本設計の各要素を 実装可能な粒度 まで分解するドキュメントです。目安 約2.5 時間
- 07実装の進め方ここまでの Chapter 3 〜 6 で、企画書・要件定義・基本設計・詳細設計と上流の成果物を読み解いてきました。目安 約1時間
- 08環境構築 (ローカル + Neon + 雛形起動)PJ#1 (Java + Tomcat) と違って、本 PJ はフロントとバックエンドの 2 プロセス構成です。目安 約3 時間
- 09Prisma スキーマ定義と migration / seed 投入PJ#1 (Java + JDBC) ではテーブルを schema.sql という生 DDL で書きました。目安 約 4 時間
- 10認証 API (signup / login / JWT 発行)POST /api/auth/signup で新規登録、POST /api/auth/login でログインし、レスポンスとして JWT を返します。目安 約8時間
- 11タスク CRUD API (一覧 / 作成 / 更新 / 削除 + 楽観ロック)目安 約9 時間
- 12Frontend ログイン / 登録画面と JWT 保存React + React Router で /login /signup / (タスク一覧) の 3 画面を行き来できるようにします。目安 約 6 時間
- 13タスク一覧画面 (Tailwind リスト UI + ステータスフィルタ)/tasks でログイン済みユーザーのタスクをカード状に並べた画面を作ります。目安 約7 時間
- 14タスクの作成・編集・削除モーダルこの章をやり切ると、次の 5 つができるようになります。目安 約 6 時間
- 15仕上げ(CSS・エラー・セキュリティ・デプロイ)機能が動くだけでは「実装完了」とは言えません。目安 約 8 時間
- 16実装FAQ実装中によく出る症状・対処法のリファレンス。
- 17用語ミニ辞書この章は 辞書として使う章 です。目安 通読不要
実践③ AIチャットアプリ18章・約43万字・ 目安57時間
- 01はじめにこのプロジェクトでは、AI チャットアプリをフルスタック + LLM 連携で制作します。目安 約1.5 時間
- 02ヒアリング実務では、開発に入る前にクライアントから要望をヒアリングします。目安 約1 時間
- 03企画書を読み解く実務では、ヒアリング結果を整理し「何を作るか・作らないか」をクライアントと合意するために企画書を作成します。目安 約 1 時間
- 04要件定義書を読み解く要件定義書は、企画書の「何を実現したいか」を エンジニアが扱える具体的な要件 に翻訳したドキュメントです。目安 約 1.5 時間
- 05基本設計書を読み解く基本設計書は「外部仕様」を決めるドキュメントです。目安 約 1.5 時間
- 06詳細設計書を読み解く詳細設計書は、基本設計の各要素を 実装可能な粒度 まで分解するドキュメントです。目安 約2.5 時間
- 07実装の進め方ここまでの Chapter 3 〜 6 で、企画書・要件定義・基本設計・詳細設計と上流の成果物を読み解いてきました。目安 約1時間
- 08環境構築とリポジトリの起動目安 約3 時間
- 09API スケルトンとモック応答ユーザーが送ってきた message を受け取り、ブランドのトーンに合わせた 固定応答 を返す API を組み立てます。目安 約 5 時間
- 10履歴管理とインメモリストア前章のチャット API はステートレスでしたが、本来 AI チャットは ==過去の文脈を踏まえた応答== が肝です。目安 約5 時間
- 11Frontend チャット UI と API 連携Vite + React の Frontend に、画面下部の入力欄と、ユーザー / アシスタントの吹き出しを並べたチャット UI を実装します。目安 約 8 時間
- 12OpenAI API への差し替えとプロンプト設計前章までのモック応答を、本物の OpenAI API 呼び出しに差し替えられるようにします。目安 約6 時間
- 13エラーハンドリングと安全装置AI チャットは「OpenAI の調子」「ネットワークの揺らぎ」「ユーザーの想定外入力」の三方向からエラーを浴びる宿命があります。目安 約4 時間
- 14モバイル UI とアクセシビリティ調整Figma のモバイルデザインに合わせて、ヘッダ / メッセージリスト / 入力欄が縦に並んだレイアウトを仕上げます。目安 約4 時間
- 15仕上げ(CSS・エラー・セキュリティ・デプロイ)機能が動くだけでは「実装完了」とは言えません。目安 約 8 時間
- 16実装FAQ実装中によく出る症状・対処法のリファレンス。
- 17テストと動作確認UT[単体テスト] --> IT[統合テスト]。目安 約 4 時間
- 18用語ミニ辞書この章は 辞書として使う章 です。目安 通読不要
実践④ BIダッシュボード19章・約34万字・ 目安82時間
- 01はじめにこのプロジェクトでは、EC サイト売上分析ダッシュボードをフルスタック分析ダッシュボードで制作します。目安 約 1.5 時間
- 02ヒアリング実務では、開発に入る前にクライアントから要望をヒアリングします。目安 約 1 時間
- 03提案書を読み解く実務では、ヒアリング結果を整理し「何を作るか・作らないか」をクライアントと合意するために提案書を作成します。目安 約 1 時間
- 04要件定義書を読み解く要件定義書は、提案書の「何を実現したいか」を エンジニアが扱える具体的な要件 に翻訳したドキュメントです。目安 約 2 時間
- 05基本設計書を読み解く基本設計書は「外部仕様」を決めるドキュメントです。目安 約 2 時間
- 06詳細設計書を読み解く詳細設計書は、基本設計の各要素を 実装可能な粒度 まで分解するドキュメントです。目安 約 2.5 時間
- 07実装の全体像ここまでの Ch1〜Ch6 で、提案書・要件定義・基本設計・詳細設計と上流の成果物を読み解いてきました。目安 約 1 時間
- 08環境構築 + 認証 APIS1[starter clone] --> S2[DB 用意]。目安 約 6 時間
- 09Prisma スキーマ定義と seed 投入PJ#1 (Java + JDBC) ではテーブルを schema.sql という生の DDL ファイルで書きました。目安 約 6 時間
- 10KPI 集計 API(/api/dashboard/summary)本章は PJ#4 ダッシュボードの心臓部 です。目安 約 6 時間
- 11月次売上 API(/api/dashboard/monthly)指定年の月別売上推移を返す API です。目安 約 5 時間
- 12週次・商品ランキング・カテゴリ集計 API残り 4 つの API (週次売上・商品売上ランキング・商品注文数ランキング・カテゴリ別売上) を一気に作ります。目安 約 10 時間
- 13KPI カードと Sparkline(React 側)ダッシュボードのトップページ(/)。目安 約 8 時間
- 14折れ線グラフと売上推移ページ(Recharts)==売上推移ページ(/sales)== を作ります。目安 約 8 時間
- 15ランキング横棒チャートとカテゴリ円グラフ・仕上げダッシュボードの残り 2 ページを仕上げます。目安 約 8 時間
- 16仕上げ(CSS・エラー・セキュリティ・デプロイ)機能が動くだけでは「実装完了」とは言えません。目安 約 8 時間
- 17実装 FAQ実装中によく出る症状・対処法のリファレンス。
- 18テストと動作確認T1[全 10 ケースのテスト実行] --> T2[セキュリティ最終チェック]。目安 約 6 時間
- 19用語ミニ辞書この章は 辞書として使う章 です。目安 通読不要
手に入るもの
- ・教材の本文と、章ごとの進め方
- ・Figma と動くデモ、実装 FAQ
- ・書き上げた成果物(提案書またはアプリ一式)
サポートと条件
- サポート
- Tap+人・90日
- 受講料充当
- ゆめさくエンジニアへ入学される場合、この金額を全額充当します(入学時1回限り・現金の払い戻しはありません)
- 閲覧期間
- 教材の閲覧は無期限です
- ※ 人によるレビュー・提出物の添削・ライブ講義・1on1 はありません。レビューを受けながら作りたい方はゆめさくエンジニアをご検討ください(受講料に全額充当されます)
- ※ 教材の閲覧は無期限です。サポートの期間だけ90日で終わります
1本ずつ買うこともできます
単品を4本そろえると 79,200円 です。 このコースなら約37%お得になります。