Netlifyとは？ 〜概要から導入まで〜

新しい技術にチャレンジし続けるeishisのアドベントカレンダーDay12です！

前回はFirebaseのRealtime DatabaseのデータをRubyから、firebase-rubyというGemで操作を行うという記事でした。

Rubyからfirebase-rubyでRealtime Databaseにアクセスする

今回は静的ホスティングサービスである「Netlify」についてご紹介します！

Netlifyとは？

Netlifyは、静的サイトをホスティングすることができるWebサービスです。
WordPress等の動的な処理のいらないLPなどの静的なWebサイトであればNetlifyを通じて公開することができます。
公開手順も非常に簡単で、公式サイトでも「Deploy your site in seconds.」とうたっているだけのことはあり、
３ステップほどで公開することができます。

( Netlify HPより )

GitHubを使っている方でしたらGitHub Pagesというサービスをご存知の方もいるかと思いますが、そちらに近いサービスになります。

GitHub Pagesについては以前にこちらの記事で触れているので、
もしよければこちらもあわせてご覧ください。

GitHub PagesでReactアプリケーションを公開！【作りながら覚えるReact】

導入手順

アカウントの作成

まずはNetlifyのアカウントを作成します。
GitHub / GitLab / Bitbucket / メールアドレス より選択ができます。

プロジェクトの追加

アカウントの作成が終わったら、右上の「New site from Git」より新しくプロジェクトの追加を行います。

使っているバージョン管理サービスと、選択するとリポジトリ、ブランチやビルドコマンドの選択・入力ができるので、デプロイしたいサイトのリポジトリとブランチを選択します。
LP等の完全静的なWebサイトであればビルドコマンドの入力は不要です。

静的Webサイトの表示だけでしたら上記の手順で完了です。
管理画面にて、そのほか独自ドメインの設定やhttpsの設定も可能です。

独自ドメインの設定

独自ドメインの設定は設定画面より「Setup a custom domain」をクリックし設定画面へ飛びます。

上記画面に取得したドメインを入力することで設定ができます。
Netlifyではドメインはwwwサブドメインつきのドメインを推奨しているため、www付きで設定します。
httpsの設定は管理画面のドメイン設定画面内で
無料SSLであるLet’s Encryptの認証をボタン一つですることもできます。

補足

その他、ファイルの直接アップロードによるビルドにも対応しているため、
普段gitを使わない方でも使用することが可能です。

その場合は先ほどの「New site from Git」のボタンの画面で
ファイルのディレクトリごとドラッグ&ドロップすることでデプロイができます。

まとめ

今回はNetlifyについての導入手順についてご説明しました。
公開までの手順も簡単に行うことができ、また無料で利用することができるので(一部機能は有料)、ぜひ一度試してみてはいかがでしょうか？