2018年12月12日
デザイン
Netlifyとは？ 〜概要から導入まで〜
目次
新しい技術にチャレンジし続けるeishisのアドベントカレンダーDay12です！
前回はFirebaseのRealtime DatabaseのデータをRubyから、firebase-rubyというGemで操作を行うという記事でした。
今回は静的ホスティングサービスである「Netlify」についてご紹介します！
Netlifyとは？
Netlifyは、静的サイトをホスティングすることができるWebサービスです。
WordPress等の動的な処理のいらないLPなどの静的なWebサイトであればNetlifyを通じて公開することができます。
公開手順も非常に簡単で、公式サイトでも「Deploy your site in seconds.」とうたっているだけのことはあり、
３ステップほどで公開することができます。
( Netlify HPより )
GitHubを使っている方でしたらGitHub Pagesというサービスをご存知の方もいるかと思いますが、そちらに近いサービスになります。
GitHub Pagesについては以前にこちらの記事で触れているので、
もしよければこちらもあわせてご覧ください。
導入手順
アカウントの作成
まずは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についての導入手順についてご説明しました。
公開までの手順も簡単に行うことができ、また無料で利用することができるので(一部機能は有料)、ぜひ一度試してみてはいかがでしょうか？
Netlifyのお仕事に関するご相談
Bageleeの運営会社、palanではNetlifyに関するお仕事のご相談を無料で承っております。
zoomなどのオンラインミーティング、お電話、貴社への訪問、いずれも可能です。
ぜひお気軽にご相談ください。
この記事は
参考になりましたか？
5
4
AUTHOR
やまかわたかし デザイナー
フロントエンドデザイナー。デザインからHTML / CSS、JSの実装を担当しています。最近はReactやReact Nativeをよく触っています。
関連記事
アプリでもっと便利に！気になる記事をチェック！
記事のお気に入り登録やランキングが表示される昨日に対応！毎日の情報収集や調べ物にもっと身近なメディアになりました。
簡単に自分で作れるWebAR
「palanAR」はオンラインで簡単に作れるWebAR作成ツールです。WebARとはアプリを使用せずに、Webサイト上でARを体験できる新しい技術です。
palanARへ
