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などのオンラインミーティング、お電話、貴社への訪問、いずれも可能です。
ぜひお気軽にご相談ください。
この記事は
参考になりましたか？
4
4
AUTHOR
やまかわたかし デザイナー
フロントエンドデザイナー。デザインからHTML / CSS、JSの実装を担当しています。最近はReactやReact Nativeをよく触っています。
関連記事
アプリでもっと便利に！気になる記事をチェック！
記事のお気に入り登録やランキングが表示される昨日に対応！毎日の情報収集や調べ物にもっと身近なメディアになりました。
簡単に自分で作れるWebAR
「palanAR」はオンラインで簡単に作れるWebAR作成ツールです。WebARとはアプリを使用せずに、Webサイト上でARを体験できる新しい技術です。
palanARへ
palanでは一緒に働く仲間を募集しています
正社員や業務委託、アルバイトやインターンなど雇用形態にこだわらず、
ベテランの方から業界未経験の方まで様々なかたのお力をお借りしたいと考えております。
運営メンバー
Eishi Saito 総務
SIerやスタートアップ、フリーランスを経て2016年11月にpalan（旧eishis）を設立。 マーケター・ディレクター・エンジニアなど何でも屋。 COBOLからReactまで色んなことやります。
sasakki デザイナー
アメリカの大学を卒業後、日本、シンガポールでデザイナーとして活動。
しまだ デザイナー
WebAR/VRのデザインと3DCG制作がメインです。 肩書きは「アニメ案件に関わりたいデザイナー」。
Miu マーケター
ドイツでWEBマーケティングしています。
しんのき エンジニア
主に React Native を使ったアプリ開発と AWS や Firebase を使ったサーバーレスアーキテクチャを担当しています。元々はインフラとかPHPをやっていました。
やまかわたかし デザイナー
フロントエンドデザイナー。デザインからHTML / CSS、JSの実装を担当しています。最近はReactやReact Nativeをよく触っています。
furuya エンジニア
サーバーサイド、フロントエンド、Unityと色々手を出してる雑食系エンジニア。ReactNativeが最近のマイブーム。
Sayaka Osanai デザイナー
Sketchだいすきプロダクトデザイナー。シンプルだけどちょっとかわいいデザインが得意。 好きな食べものは生ハムとお寿司とカレーです。
はらた エンジニア
サーバーサイドエンジニア Ruby on Railsを使った開発を行なっています
うえまつゆい エンジニア
サーバーサイドエンジニアからフロントエンドエンジニアになりました。主にReact Nativeでのアプリ開発をしています。
こぼり ともろう エンジニア
サーバーサイドエンジニア。SIerを経て2019年7月に入社。日々学習しながらRuby on Railsを使った開発を行っています。
ささい エンジニア
フロントエンドエンジニア WebGLとReactが強みと言えるように頑張ってます。
Damien
WebAR/VRを中心に企画・マークアップ・開発をやっています。森に住んでいます。
ゲスト デザイナー
かっきー
まりな
suzuki
taro
xR界隈のビズをやっています。新しいガジェットとか使うのが好きです。あとお寿司は玉子のお寿司が好きです。
miyagi
ogawa
雑食デザイナー。UI/UXデザインやコーディング、時々フロントエンドやってます。最近はARも。
いわもと
taishi kobari
フロントエンドの開発を主に担当してます。Blitz.js好きです。
kubota shogo
サーバーサイドエンジニア。Ruby on Railsを使った開発を行いつつ月500kmほど走っています！
nishi tomoya
aihara
グラフィックデザイナーから、フロントエンドエンジニアになりました。最近はWebAR/VRの開発や、Blender、Unityを触っています。モノづくりとワンコが好きです。
