環境構築
💻 GitHub Pagesで404が表示される
Pages設定またはindex.htmlの配置が間違っている
😰 こんな症状
GitHub Pagesで公開したのに404エラーが表示される。GitHub Pagesの設定で起きやすいよ。
🔍 原因
リポジトリのSettings > PagesでSourceが設定されていない、またはindex.htmlがルートにないよ。GitHub Pagesは指定したブランチの指定したフォルダからファイルを配信するんだ。設定が正しくないとファイルが見つからず404になるよ。
❌ エラーが起きるコード
# GitHub Pages で 404 が表示される✅ 直し方
1. Settings→Pages→Sourceで正しいブランチ（main）とフォルダ（/ root）を選択する。 2. index.htmlがリポジトリのルートに存在することを確認する。 3. 変更をpushしてから数分待つ（反映に時間がかかる）。 4. URLが https://ユーザー名.github.io/リポジトリ名/ になっているか確認する。
✅ 修正後のコード
# Settings → Pages → Branch を main に設定
# index.html がルートにあるか確認この解決法は役立ちましたか？
🔗 関連するエラー
- Live Serverで日本語ファイル名が文字化けする — ファイル名に日本語を使っている
- VS Code拡張が動かない — 拡張機能が正しくインストールされていない
- Live Serverが起動しない — Live Server 拡張機能が正しく動作していない
- npm installが失敗する — パッケージのインストールでエラーが出る
- node_modules削除後にエラーが出る — node_modulesを削除したが再インストールしていない
🔗 別カテゴリの関連エラー
📖 この問題を学べるレッスン
📝 関連ブログ記事
- プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
- VS Codeのインストール方法 — インストールと初期設定を図解で解説
- プログラミング初心者が最初にやるべきこと5選 — 目的を決めて環境構築から