見出し画像

GitHubでWebサーバー立ててみた話

しろくまです。ありがとうございます。
ちょっと間が空いてしまったので、短い内容でも投稿してみます。

今回やってみるのは提題の件です。
何かしら作ってみたいな~となった時にWebアプリにする!って発想はすぐ出てきますが、
サーバーどうするんか?っていうのはいつも問題なりがちでした。

今までいつもEclipseだののローカルサーバーで満足してきてましたが、
会社の先輩に簡単にできるよ!と教えてもらいました。
ほな、やってみよかー。

基本的に以下の記事を参考にさせていただきました。
無駄なくまとめられていて非常にわかりやすかったです。
ぜひご参照ください。


GitHubのアカウント名を変更する

さて、さっそくやっていこーと思ったのですが、
どうやら作成したページのURLにアカウント名が使われそう。

一応変えておこう。
と思ったのですが、案外詰まったので備忘録。

いやユーザーページのEdit Profileで行けると思いますやん。
違うんかいやー。

1.自分のユーザーアイコン(なんか丸いやつ)をクリック
 ※ページ右上のやつではなくて、
  OverViewタブとか選んだ時にでっかく表示されてる方
2./Settings/profileのページが開くので、Account>Change usernameと選択

そこまでたどり着ければあとは好きに変えられる。
意外とどこクリックしたらいいか忘れそう。


GitHub Pagesを使う

ここからは冒頭で記載させていただいたサイト様に従ってやっていくだけでございます。

まずはリポジトリを作る。
そしてリポジトリをローカルにクローンします。

とある事情により、Gitの操作はコマンドラインを使ってやることにします。
といっても初回+自分だけなので何とかなるでしょう!

git clone {クローン用URL}
大丈夫そう。

そしたらindex.htmlを作る。
一旦、全コピペで作る。

変更をコミット、プッシュする。

git add .
# ローカルリポジトリにファイルを追加し、コミットに備えてステージします

git commit -m "index.htmlの新規作成"
# 追跡された変更をコミットし、リモートリポジトリへのプッシュに備えます

git push origin main
# origin として指定したリモートリポジトリにローカルリポジトリの変更をプッシュ

git status
-> 
On branch main
Your branch is up to date with 'origin/main'.

nothing to commit, working tree clean
うまくいったみたい。

このあたりだけでも最近やっと、、、
masterとmainって何か違うんやろかって思ってたんですけど一緒の意味なんですね。最近変わったって知らなかったです。

slaveを連想するからやめたとのこと。
私がお仕事で扱ってる製品でも同じような対応が必要になったので、
なんだか勝手に親近感わきました。

さて、もうこれだけで行けるそうです。
よしゃ、わーいわーい。

https://ユーザー名.github.ioでアクセス!
はい!404エラー!
だーい。


GitHub Pagesの設定を変更

やっぱりそううまくはいってくれないんですねー。
ブラウザのキャッシュをクリアするとか、index.htmlをもう一度コミット&プッシュしなおすなどやってみましたが変わらず。

調べてみてこちらの記事を参考にさせていただきました。

私の場合、必要な設定の変更が足りていなかったみたいです。
記事の1番の設定変更ですね。

Settings>Pagesから設定を変更。


無事、アラートも画面も表示することができました~


今回は本当にWebサーバーが立っただけなので、
ここから活用していけるとよいですね。

先輩から注意事項として教えてもらったのは、
公開するものは2次配布にならないように気を付けてねとのことでした。
気を付けて使っていければと思います。

いいなと思ったら応援しよう!