自分のプロフィールページをGitHubに公開しよう

💻 この課題はPCで実際にコードを書いて取り組みましょう
1

プロジェクトフォルダを作ろう

ターミナルを開いて、プロフィールページ用のフォルダを作り、Gitリポジトリを初期化しましょう。

mkdir my-profile
cd my-profile
git init

以下のように表示されれば成功です：

Initialized empty Git repository in .../my-profile/.git/
💡 ヒント
mkdir でフォルダを作り、cd で移動してから git init を実行します。「Initialized empty Git repository」と表示されれば成功です。

参考: Git レッスン2: はじめてのGit操作

2

プロフィールHTMLを作ろう

VS Code で index.html を作成し、自分のプロフィールを書きましょう。以下の内容を含めてください：

  • <h1> で自分の名前（ニックネームでもOK）
  • <p> で自己紹介の文章
  • <ul> と <li> で好きなものリスト
💡 ヒント
から始めて、 の中に

で名前、

で自己紹介、

    で好きなものリストを書きましょう。

参考: HTML レッスン2: 文字を表示しよう

3

git status で状態を確認しよう

ファイルを作ったら、Gitの状態を確認してみましょう。

git status

以下のように赤い文字で表示されるはずです：

Untracked files:
  (use "git add <file>..." to include in what will be committed)
        index.html

これは「新しいファイルがあるけど、まだGitに記録されていない」という意味です。

💡 ヒント
赤い表示は「まだ git add されていない」という意味です。次のステップでステージに追加します。

参考: Git レッスン2: はじめてのGit操作

4

add して commit しよう

ファイルをステージに追加して、最初のコミットを作りましょう。

git add .
git commit -m "プロフィールページを作成"

コミットが成功すると、以下のように表示されます：

[main (root-commit) xxxxxxx] プロフィールページを作成
 1 file changed, XX insertions(+)
💡 ヒント
git add . で全ファイルをステージに追加し、git commit -m "メッセージ" で記録します。メッセージは「何をしたか」がわかるように書きましょう。

参考: Git レッスン2: はじめてのGit操作

5

GitHubにリポジトリを作ろう

GitHubで新しいリポジトリを作成し、ローカルと接続しましょう。

  1. GitHubにログインし、右上の「+」→「New repository」をクリック
  2. Repository name に my-profile と入力
  3. 「Add a README file」のチェックを外す
  4. 「Create repository」をクリック

作成後、ターミナルで以下を実行します：

git remote add origin https://github.com/ユーザー名/my-profile.git
git branch -M main
💡 ヒント
GitHubでリポジトリを作るとき、「Add a README file」のチェックは外してください（チェックすると push でエラーになります）。

参考: Git レッスン3: GitHubに公開

6

push して公開しよう

いよいよGitHubにコードを送信します！

git push -u origin main

成功したら、GitHubのリポジトリページ（https://github.com/ユーザー名/my-profile）をブラウザで開いてみましょう。

index.html が表示されていれば完成です！🎉

おめでとうございます！自分のコードをGitHubに公開できました。これがプログラマーとしての第一歩です。

💡 ヒント
git push -u origin main でローカルの main ブランチをGitHubに送信します。GitHubのリポジトリページをリロードして、index.html が表示されれば成功です！

参考: Git レッスン3: GitHubに公開

🎯

⚠️ つまずいたら