10
23

More than 5 years have passed since last update.

最速静的Webデプロイ

Last updated at Posted at 2017-10-11

先に言うとNetlify最強。

静的コンテンツをホストしてHTTPSで表示させたい。
S3 + CloudFront でできるのだが、ちょっと手間かなと思ってた。

参考

AWS得意な人がS3よりNetlifyをオススメしててすごい参考になった。
- HTTPSの静的コンテンツをホストするならs3よりNetlifyが俺の求めていたものだった

やってみる

  1. ドメイン取得 → 名前.comで取得

  2. Netlifyでアカウント作成(要 GitHubアカウント)
    2-1. GitHubアカウントつなぎこんで、公開したいサイトに対応するリポジトリを選ぶ。
    2-2. 公開ブランチとディレクトリを選び、ビルドコマンドを入力する(デフォルトでgulpコマンドが入力されてた)
    2-3. Netlify DNS 使用するボタンポチッとしてアドレスもらう。
    2-4. お名前.com で DNSの nameserver アドレスを登録
    2-5. HTTPS対応させる Enable automatic TLS ボタン2回押すだけ。

  3. Slackにビルドの情報を通知する
    3-1. Slackに専用チャンネル作る → Webhoockのアドレス取得
    3-2. Netlify の Deploy notifications にすでに Slackへの通知が選べるプルダウンがあるので、登録

  4. 完了
    4-1. 公開ブランチにプッシュ。→自動デプロイ。初回のみ npm install が走る。
    4-2. Slack に start と succeeds の通知がくる。


↑ あとで綺麗にまとめたい。。。

サクッとできた。

ドメインがあって、GitHubアカウントがあるのであれば。
全部で小一時間で公開できる。

タスクランナーなしで、吐き出したソースを登録するでも良い。

そしてここまでNetlifyは全部無料。すごい…。

  • Unlimited sites
  • Personal or professional projects
  • Public or private code
  • HTTPS for custom domains

Pro の機能で欲しいのは、アクセス権限くらい。
一人デプロイまで持っていくのには最速だと思った。

リダイレクト

追記: http → https にリダイレクトするのを忘れてた…。

https://www.netlify.com/docs/redirects/
リダイレクトも、_redirectsっていうファイル作って書くだけ。
apatch でできる Redirect/Rewrite が大体設定可能。ほんとすごい。

301でサイト全部リダイレクトする。

http://sitename.com/*  https://sitename.com/:splat  301!

gulpでルートにファイル吐き出すように追加して完了。

10
23
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
10
23