TL;DR
1分30秒でGitHub Pagesでウェブサイトを立ち上げ、hello!表示できるサイトを立ち上げます!!!
必須スキル
- GitHub、Gitの基礎的な操作ができること
手順の概要
- Repositoryを新規作成してCloneする
- index.htmlを作成する
- index.htmlを編集し、bodyに任意のメッセージを書く
- CommitしてPushする
- 設定からGitHub Pagesを有効にする
- GitHub Actionが勝手に始まるので見守る
- Deployが完了したらサイトを確認する
これだけです。作業の半分くらいはGitHub Actionが頑張ってくれてるのを見守る時間なので、作業時間は理論値で40秒くらいだと思います。
1. Repositoryを新規作成してCloneする
流石に誰でもできるので省略します。
2. index.htmlの準備
このような階層構造になれば大丈夫です。ファイル名は必ずindex.html
にしてください。
今回はシンプルなサイトを作るチュートリアルのため、内容は全然記述していませんが、このリポジトリ内に.jsや.cssを配置して読み込ませることもできます。
3. CommitしてPushする。
流石に誰でもできるので省略します。
4. 設定からGitHub Pagesを有効化する
リポジトリのSettingsに移動し、Pages→Build and deployment→Branchをmain
に設定します。
5. GitHub Actionを見守る
Actionsタブ→最新のpages build and deployment
をおし、走り出したActionを確認します。
数十秒まつと、deployが終了するので、表示されたリンクにアクセスします。
6. できたサイトを確認
サイトが公開されました!!!
補足
- これでindex.html(トップページ)ができたので、このリポジトリ内にhtmlファイルを追加していくことでサイトのページ数を増やすことができます。
- cssやjsも使えます。
- 大体なんでもできます。ただし動的サイトは作れず、静的サイトのみという制限があります。
- 別に僕はhelloを言うサイトをみんなに作って欲しいわけではなくて、サイトを立ち上げるハードルって意外と低いんだよってことを伝えたかっただけです。