私は2021年ごろから、試作したウェブページをインターネット上に公開するとき「Netlify」というサービスを使っています。
この記事ではNetlifyの基本的なことについて紹介してみようかなと思います。
Netlify というサービスがある
私は「ねっとりふぁい」と発音しています。
Netlifyはホスティングサービスと呼ばれるものの一種です。
誰でも無料で、ウェブページをインターネット上に公開することができます。
有料プランもありますが私は無料プランで十分使えています。
GitHubとの連携がオススメ
公開したいファイルをNetlifyに直接アップロードしてもよいのですが、NetlifyとGitHubを連携させると便利です。
GitHubにファイルを置くだけでNetlifyがそれを検知し、自動的に公開してくれます。
しかもGitHubのファイルを修正するたびに、自動的に最新版を公開してくれます。
Netlifyを使ったウェブページ公開をとりあえず体験したいだけであれば、GitHubのリポジトリに置くのはhtmlファイルひとつだけでOKです。
前回の記事のウェブページを公開してみた
こちら（↓）は、私が前回書いたQiita記事です。
この記事では 「気象庁APIを使って鹿児島県の天気情報を取得するウェブページ」を試しに作ってみる ということをやっています（詳しくは記事を読んでみてください）。
せっかくなのでそのページをNetlifyで公開しました。踏んだ手順は以下のとおりです。
1. GitHubに適当な名前のリポジトリを作成
リポジトリ名は適当でよいです。
リポジトリに関する設定も全てデフォルトでよいですが、恥ずかしがりやな人は非公開に設定してもよいです。
2. リポジトリにhtmlファイルを置く
htmlファイルひとつをアップロードします。
このとき、ブランチはmainでよいです。
これでリポジトリの中はそのhtmlファイルひとつだけの状態です。
3. Netlifyでプロジェクトを作る
Netlifyで「Add new project」⇒「Import an existing project」を押下すると、プロジェクト作成画面に遷移できます。
下図のように3ステップに沿ってプロジェクトを作れるようになっていて分かりやすいです。
「1. Connect to Git provider」ではGitHubを選択。
「2. Select repository」では連携させるリポジトリを選択。
「3. Configure project and deploy」ではプロジェクト名を決めて入力し、あとの設定は全てデフォルトでよいです。
4. 完了！
今回はプロジェクト名を「jmaapi001」にしたので、公開されたウェブページのURLは
https://jmaapi001.netlify.app/
となりました。
お手軽だし、発展的なこともできる
勉強がてら作ったウェブページをとりあえず公開したいとき、Netlifyはお手軽なサービスだと思います。
ウェブページ公開手段としてはGitHubPagesも有名ですが、Netlifyのほうが機能豊富なので、やりたいことによっては「GitHubPagesだと実現できないけどNetlifyだとできる」なんてこともありえます。
もしよかったら触ってみては。
以上です。