🏗️ コードクエスト第2章 建築編
〜 白紙から、きみのサイトを建てろ 〜
第1章は「直す」だった。第2章は「建てる」。何もないファイルに自分の手でコードを書き、本物のウェブサイトを1枚、完成させて持ち帰ります。ステージが進むほど手本は減り、最後は白紙から2枚目を自力で建てる卒業制作。ここを出るとき、きみは「作れる人」です。
🖥️ きみのサイト(プレビュー)
🌐 (タイトル未設定)
🔧 きみのファイル
← スマホで記号をすばやく入力
🎓 卒業おめでとう。きみはもう「作れる人」だ。
育てた1枚目も、白紙から建てた卒業制作も、ぜんぶきみの作品。ダウンロードして持ち帰ろう。
🔓 最後のミッション:このツールの外でも作れることを証明せよ
1. ダウンロードした my-website.html を、メモ帳(スマホならテキストエディタアプリ)で開く
2. どこか1箇所、文章を書き換えて保存する
3. ブラウザで開き直す——変わっていたら、きみは道具がなくても作れる人だ。
💡 写真を入れたくなったら <img src="画像のURL" alt="説明">。まずは絵文字を大きく使うのも手だ(例: <p style="font-size:3rem">🚀</p>)
🌏 次は世界に公開しよう:GitHub Pagesで無料公開する方法 → しっかり派は Gitコース →
📚 もっと作れるようになる: CSSコース ・ JavaScriptコース ・ 問題ドリル
❓ 建築編とは
第1章(修理編)でコードに触れた人のための、次のステップです。全11ステージで、白紙のファイルに骨組み(HTML)→デザイン(CSS)→動き(JavaScript)を自分の手で書き、1枚のウェブサイトを完成させます。ステージが進むほど手本は減り、卒業制作では何も見ずに2枚目のサイトを建てます。チェックは「正解の文字列」ではなく、実際にページがどう動くかで判定するので、色も言葉もデザインも、ぜんぶきみの自由。進み具合とコードは自動保存されます。