このコースのゴール
カンプを渡されたら一人で実装でき、既存サイトの修正を調べながらやり遂げられる ― ジュニアレベルのフロントエンドになる。証明として、公開済みのWebアプリとポートフォリオを完成させる。
10ヶ月のロードマップ
全6ユニットです。ユニット5では、サーバー側 (バックエンド) の世界に少しだけ越境します。
| ユニット | テーマ | 目安時間 | 達成目標 (B型) | 仕上げに作るもの |
|---|---|---|---|---|
| 1 | 模写コーディングとGit | 120時間 | 1.5ヶ月後 | LPの模写2本 (GitHubで公開) |
| 2 | JavaScript徹底基礎 | 160時間 | 3.5ヶ月後 | じゃんけん・クイズ・電卓 |
| 3 | データと非同期 ― 保存と通信 | 120時間 | 5ヶ月後 | 保存つきToDo + 住所検索アプリ |
| 4 | サイト制作実践 ― 品質を上げる | 120時間 | 6.5ヶ月後 | 架空のお店のフルサイト |
| 5 | サーバーに馴染む (バックエンドへ越境) | 120時間 | 8ヶ月後 | 自作APIで動くひとこと掲示板 |
| 6 | 卒業制作 ― 公開するWebアプリ | 160時間 | 10ヶ月後 | 公開アプリ + ポートフォリオ + 発表 |
ユニット一覧 ― ここから進む
行をクリック (タップ) すると、ユニットのページが開きます。上から順番に進みましょう。ログインしていると、ユニットごとの進み具合が表示されます。
- ユニット1: 模写コーディングとGit意味のあるHTML・Flexbox/Grid・レスポンシブ・Gitの日常運用。実務の土台をまとめて作ります。
- ユニット2: JavaScript徹底基礎変数・分岐・繰り返し・関数・配列・DOM。小さな演習を大量に解いて、読める・書けるを作ります。
- ユニット3: データと非同期localStorageでの保存、fetchでの通信、JSON。「閉じても消えない・外とつながる」アプリを作ります。
- ユニット4: サイト制作実践 ― 品質フォーム・アクセシビリティ・表示速度・多ページ設計。「動く」と「仕事になる」の差を埋めます。
- ユニット5: サーバーに馴染む (越境)Node.jsで自分のAPIを作り、fetchで呼びます。画面の向こう側が分かるフロントエンドになります。
- ユニット6: 卒業制作 ― 公開するWebアプリ企画から公開まで一人で完走し、ポートフォリオにまとめて発表します。
このコースの進め方
写経より実験
コードは写すだけでなく、必ず1か所変えて動かします。「変えたらどうなる?」の実験回数が、そのまま実力になります。
使う道具
VS Code・ブラウザの開発者ツール・GitHubを毎日使います。ユニット5からはNode.jsが加わります。すべて無料です。
エラーは教材
エラーが出たら「読む → 検索する → AIに聞く」の順で立ち向かいます。エラーと仲直りした回数が、ジュニアの実力の正体です。
コース修了のチェック (ジュニアレベルの証明)
全ユニットを終えたら、ここで最終確認をします。全部にチェックがつけば、このコースは修了です。