この記事ではGitHub Pagesやレンタルサーバーで初めてデプロイ(サービスリリース)した人が
「ちゃんとデプロイできてるはずなのにうまく表示されない!涙😭」
と悲しんでいるので、そんな人を1人でも減らすための記事になります。
チュートリアル通りデプロイの手順を踏めているはずなのに、GitHub Pagesで発行されたリンクはアクセスしても404エラー(ファイルが存在しない)になっている。そういった方は、rootディレクトリのトップ(githubのリポジトリの一番上の階層)にindex.htmlというファイルが存在しているかを確認し直してください。
ちなみにgithub上でのrootディレクトリがどれに相当するかというと
の赤枠の部分のファイルの階層のことを指します。
例えば、このリポジトリのcssやjsのフォルダ内はrootディレクトリから外れた階層になります。
なかなかrootディレクトリの考え方が頭に入ってこないということもあるかと思いますが、「そういうルールか」と頭の隅にでも留めておきましょう。
コンピュータは決められたファイル名(index.htmlやindex.php)のものがある場合は、
- そのファイルを自動で読み込む
- そのファイル名を省略して表示する
ことが可能です。
index.htmlというファイル名はURLでは省略されていますが、これはURLに打ってもちゃんとブラウザに表示されます。
一番初めに表示させたいファイルは明示的にするためにもindexとつけるようにしましょう。
(参照リンク)