みなさんこんにちは!おさかなです!
今回は「【GitHub Pages】で「Webサイト」を公開する方法!」について、書いていこうと思います!
それでは、レッツゴー!!!!!
・とりあえず、Webサイトを公開したい方!
・無料のサーバーを使用したい方!
・「GitHub Pages」の使い方を知りたい方!
「GitHub Pages」って何?
GitHubが提供する「ホスティングサーバー」のことです。
今回はこれを使って、「無料でWebサイトを公開」していきます!
![](https://osakanav.com/wp-content/uploads/2020/01/20-01-28-21-06-55-641_deco-300x300.jpg)
「GitHub Pages」の始め方!
「GitHub」で「リポジトリ」を作成する!
まずGitHubにログインして、「New」ボタンをクリックして新しくリポジトリを作成します!
![](https://osakanav.com/wp-content/uploads/2020/01/github.jpg)
次に、「Repository name(リポジトリの名前)」を決めて入力します…!
(自由に決められるのでわかりやすい名前がオススメです!)
![](https://osakanav.com/wp-content/uploads/2020/01/github1.jpg)
リポジトリの名前が決まったら、「Create repository」をクリックしてリポジトリを作成します!
![](https://osakanav.com/wp-content/uploads/2020/01/github2.jpg)
このような画面になったら、無事にリポジトリが作成できている状態です!
(おめでとう…!)
赤枠の部分に表示されている「URL」は後で使用するので「メモ」を取っておいてください…!
(右側のボタンを押してコピーしておくのがオススメです…!)
![](https://osakanav.com/wp-content/uploads/2020/01/github3.jpg)
![](https://osakanav.com/wp-content/uploads/2020/01/20-01-28-21-09-25-583_deco-300x300.jpg)
公開するファイルを「push(プッシュ)」する!
ターミナル、または「Git Bash」等を使用して、下記のコードを入力していきます…!
![](https://osakanav.com/wp-content/uploads/2020/01/20-01-29-11-45-30-650_deco-160x90.jpg)
cd アップロードするファイルの場所まで移動
git init git add . git commit -m "first commit" git remote add origin 先ほど作成したリポジトリURL git push -u origin master
無事に実行されていることが確認できたら、ファイルが無事にpush(プッシュ)されています!(やった~!)
![](https://osakanav.com/wp-content/uploads/2020/01/20-01-28-21-11-21-789_deco-300x300.jpg)
「GitHub Pages」を有効化する!
それから、また「GitHub」のページに戻って、「Settings」というタブをクリックします…!
![](https://osakanav.com/wp-content/uploads/2020/01/github4jpg.jpg)
スクロールしていくと、「GitHub Pages」という項目があると思います!
![](https://osakanav.com/wp-content/uploads/2020/01/github5.png)
その中の、「Source」を「None(デフォルト)」から→「master branch」へ変更します。
![](https://osakanav.com/wp-content/uploads/2020/01/github7.png)
すると、「GitHub Pages」の項目に「URL」が表示されます…!
この「URL」をクリックするとアップロードしたファイルのページが開くと思います…!
![](https://osakanav.com/wp-content/uploads/2020/01/github6jpg.jpg)
これで無事に、「Webサイトを公開」することができました…!
(おめでとう…!🌸おつかれさまでした!)
![](https://osakanav.com/wp-content/uploads/2020/01/20-01-28-21-14-11-950_deco-300x300.jpg)
感想・まとめ
今回は「【GitHub Pages】で「Webサイト」を公開する方法!」について、書いていきました…!
いかがだったでしょうか?
とりあえず、ポートフォリオサイトを作ったけど、どうやってサイトを公開すればいいいかわからない…!という方でも、この方法でかんたんにURLを取得することができます…!(とっても便利…!)
GitHubはプログラミングを勉強していく中で、よく使うツールの1つなので、使い方に慣れておくといいと思います!(おさかなもたくさん遊んでみます…!)
![](https://osakanav.com/wp-content/uploads/2020/01/20-01-28-21-17-49-389_deco-300x300.jpg)
おさかなびではプログラミング学習中の人、ブログ初心者に向けて、「デジタル時代を楽しむためのミニ知識」をご紹介しています!
ぜひ他のページも覗いてみてください…!
それでは今回はこの辺で!
ここまで読んでくださり、ありがとうございました!
おさかなでした!
【おさかなび-osakanav-】では、この記事の感想!おさかなへの応援メッセージ!おさかなに聞きたい事、質問!記事にしてほしい内容!などを大募集中!
「氏名」「メールアドレス」「内容」の3点をご記入の上「osakana1699@gmail.com」までご応募ください!