← レベル1 – ビルダー

レッスン 12/12 ⏱ 35 分

ウェブサイトをインターネットに公開

大フィナーレ:誰にでも送れる本物のアドレスを手に入れよう。

これから起きること

今まではサイトは自分のパソコンにだけある。サーバー——常にインターネットにつながったコンピュータ——にアップロードして、誰でも開けるアドレスをもらう。GitHub Pages を使う:無料で、何百万人のプログラマーが使ってる。

⚠️

保護者と一緒に。 GitHub アカウントにはメールが必要で、13歳未満は保護者が作成・管理するルール。共有のいいタイミング——作ったものを見せよう!

ステップバイステップ

  1. GitHub アカウントを作る。 github.com へ行き Sign up をクリック。メール(保護者の)、パスワード、ユーザー名を入力。ユーザー名に注意——サイトのアドレスの一部になる! jake-buildsxxjake123xx よりいい。

  2. 新しいリポジトリを作る。 リポジトリは1プロジェクト用の引き出し。緑の New ボタン(または右上の+ → New repository)。Repository namemy-websitePublic のまま Create repository

  3. サイトのファイルをアップロード。 リポジトリページで uploading an existing file リンクをクリック。my-website フォルダの 全部 をドラッグ:index.html、他の .htmlstyle.cssimages フォルダ全体。下の緑 Commit changes

  4. GitHub Pages をオン。 上の Settings タブ、左メニューの PagesBranchmain/ (root) のまま Save

  5. 1分待ってアドレスを開く。 サイトはここに:

    https://your-username.github.io/my-website/

    your-username を GitHub ユーザー名に置き換え)。すぐ動かなければ2分待って更新。

🎉 おめでとう、ビルダー!

インターネット上にウェブサイトがある。本物で、本物のアドレス。おばあちゃん、友達、先生に送ろう。始まりを思い出して:空のファイルと <h1>It works!</h1>

12レッスンで学んだこと:

サイトを更新し続けるには

ウェブサイトは本当の「完成」はない! パソコンのファイルを変えたら:

  1. GitHub でリポジトリを開く、
  2. Add file → Upload files をクリック、
  3. 変えたファイルをドラッグして Commit changes

1分以内に反映。(レベル3で、ターミナルのコマンドで——プロみたいに——もっとスマートにやる。)

💡

次は? サイトはできたけど、まだ 反応 できない。レベル2 – 魔法使い で呪文を教える:ダークモード、閲覧できるフォトギャラリー、訪問者向けクイズ。今から作る——サイトは完璧に準備できてる。

このレッスンのまとめ

🏆 あなたのディプロマ

ビルダーのフィナーレ

すべてのレッスンにチェックを入れると、修了証を印刷できます。