「自分で作ったサイトって実際のネット上でも上手く表示されるのかな...。でもサイトを公開するのってお金かかりそうだし、難しそうだし、ハードル高そう...。」
こんな悩みにお答えします。
サイトをネット上に公開する場合、本来なら「サーバー」と「ドメイン」とかが必要です。 料金も年間〜円みたいに継続的にかかります。
でも今ではサーバー代もドメイン代も無料でサイトをネット上に公開する方法がたくさんあります。 その方法の一つをこの記事で解説します。
Netlifyを使う
結論から言うと、Netlifyというサービスがおすすめです。 Netlifyを使うことで、自分で作ったサイトを無料でネット上に公開できます。
Netlifyのアカウントを作る
まずはNetlifyのアカウントを作ります。 メールアドレスとパスワードでアカウントと作ることもできますが、そのやり方はおすすめしません。
Netlifyのアカウントを作成するときにおすすめなのは「GitHubと連携」させることです。
GitHubは、自分で書いたコードをネット上に保存しておくサービスです。
GitHubはすぐに使いこなす必要はありません。 でも、Web制作が本格的になってくると、GitHubがすごく便利です。 とりあえずGitHubのアカウントだけここで作っておきましょう。
GitHubと連携させてNetlifyのアカウントを作る方法は以下の記事で解説しています。
「GitHubのアカウントはどうやって作るの？」 という方は以下をどうぞ。
サイトを公開する
Netlifyのアカウント作成が完了すると、上の画像のようなページが表示されます。
HTMLファイルやCSSファイルが入ったフォルダを、上の画像のように点線枠の中にドラッグ&ドロップします。
上の画像のようなページが開きます。 画面左下の「Production deploys」のところに「Published」と表示されていることを確認します。
「https://〜」と書かれているのがURLです。 URLをクリックすると、自分で作ったサイトが表示されたと思います。
これで実際のネット上に、自分で作ったサイトが公開されました。
余談ですが、このようにサイトを公開することを「アップロードする」、「デプロイする」と言ったりします。 Web制作の学習でググったりしてると、たまに出てくる言葉です。
サイトを修正する
サイトを公開した後、「やっぱりこの文字のフォントサイズをもう少し大きくしたい」とかなるときもあると思います。
Netlifyなら、HTMLファイルやCSSファイルを修正してから何回でもアップロードし直すことができます。
試しに、HTMLファイルやCSSファイルの中身をVS Codeなどのエディタを使って書き換えてみてください。
Netlifyのページで左上の「Deploys」をクリックします。 修正したHTMLファイルやCSSファイルが入ったフォルダを点線枠の中にドラッグ&ドロップします。
またURLをクリックしてサイトを開いてみてください。 サイトが修正されていると思います。
フォルダの中には画像ファイルがあってもJavaScriptファイルがあっても問題なくデプロイできます。
サイトはいくつ公開できるの？
Netlifyなら結構な数のサイトをアップロードできます。 具体的には「100GB」以内であれば無料です。
サイトが「どれだけ多くの人にアクセスされたか」で、「100GB」という容量を消費します。容量を消費しても、翌月には回復します。
アップロードしたサイトに、急に数万人の人がアクセスしてくるなんてことはまずあり得ません。
「Web制作の勉強として、自分で作ったサイトをアップロードする」という目的であれば、無料で使い続けることができます。
記事は以上です。