Netlifyに登録するに当たって、いろんなサイトを参照しましたが、やはりプログラマーの人たちが書いている文章は難しく、不安は消えません。
特に参考になったのは、あひるうさぎさんの、
NetlifyとGitHubでHello Worldを表示するまでの流れ
です。ありがとうございました。
おかげさまで、うまくいきました!
index.htmlを作成
まず、以前作った、自分のパソコンの「git-test」フォルダ(ローカルリポジトリ)の中に、index.htmlを作成します。
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Netlifyで無料ホームページを公開!</title>
</head>
<body>
<h1>Netlifyで無料ホームページを公開!</h1>
<p>できたよ!</p>
</body>
</html>
こんなふうに適当に作って、保存します。これがサイトとして公開されることになります。
次に、Git Bashを起動して、
でgit-testディレクトリに移動。
そして、例の、
git commit -m "htmlファイルを作成"
git push
で、GitHubのリモートリポジトリに、index.htmlを送ってやります。
これで準備は終わりです。
Netlifyのサイトにアクセス
続いて、
にアクセスします。すると、
freeという文字に力づけられて、「Get started for free」をクリックします。
Welcomeに少し安堵しながら、GitHubをクリック。GitHubアカウントを使ってNetlifyのアカウントを作るよ、ということですね。
「Authrize netlify」をクリックすれば、Netlifyのアカウントが作成されるようです。
どういうことか今ひとつよくわからんな、と思いつつも、えいやっとクリックします。
こんなのが出てきてびびります。でも大丈夫。これは単なる説明です。「Gitでpushすれば簡単にサイトを公開できるよ」とお知らせしてくれているようです。「Next」です。
「無料で自動的にhttpsをつけてやるぞ」ということですね。「Next」です。
「ターミナル(例の黒い画面です)から離れることなく何でもできるぞ」と自慢してるようですね。「Finished」です。
すると、
となります。上の方を見ると、いつの間にかチームになっていますね。一人でやるのに。まあ、いいか。あまり文句を言ってはいけません。
さて、Gitを学んだ我らは堂々と、「New site from Git」をクリックします。
「GitHub」をクリックします。「公開するサイトのソースはGitHubにあるものを使うよ」と知らせしてやります。
すると、また認証を求められます。
「Authorize Netlify by Netlify」をクリックします。
「Only select repositories」を選びます。「All repositories」はすべてのリポジトリをサイト化する場合かな。
「Only select repositories」を選択すると、「Select repositories」が出てくるので、それをクリック。GitHubのリポジトリが出てくるので、前に作った「git-test」リポジトリを選びます。そして、「Install」をクリックします。
すると、パスワードの確認が求められます。
何のパスワードだ、と少し不安になります。GitHubのパスワードを入力して、「Confirm password」をクリックします。すると、
となります。上には、「Deploy settings」とあります。デプロイとは、ここではサイトの公開と考えればいいでしょう。
デプロイのセッティングということですが、特に何もしないで、「Deploy site」をクリックします。
なんと、これでサイトがもう作成されています。
左上のURLをクリックしてみましょう。
とページが表示されます。
すごい!
すごい!
すごい!
3行では足りません。
サイトを更新してみる
ローカルのリポジトリgit-testに戻って、そこにあるindex.htmlファイルを開きます。
という一行を書き加えます。
Git Bashを起動し、
Git Bashを起動し、
$ cd git-test
git add index.html
git commit -m "文章の追加"
git push
と打ちます。
それから、先ほどのページをブラウザで更新してみると、
それから、先ほどのページをブラウザで更新してみると、
となっています。う~む、なんて簡単なんだ!
まとめ
これで、GitとGitHubとNetlifyを使って無料でホームページを作成したり、更新したりできるようになりました。同じようにして、いくつもローカルリポジトリ(フォルダ)を作って、GitHubに置いておけば、どんどんサイトを作ることができます。
GitHubというのはサーバーのような役割をしていて、自分のパソコンからGitでpushしてデータをGitHubに送るのは、FTPソフトでサーバーにhtmlファイルなどを送るようなものだと考えればいいのでしょう。(大雑把すぎる?)FTPソフトより簡単な気もします。
長い間かかりましたが、作成できてよかった、よかった。