Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Netlifyはいいぞ #技術同人誌再販Night

Netlifyはいいぞ #技術同人誌再販Night

tatsuaki watanabe

December 04, 2018
Tweet

More Decks by tatsuaki watanabe

Other Decks in Technology

Transcript

  1. Netlifyはいいぞ
    ~2018/12/4 技術同人誌再販Night★#3~
    渡邊達明@株式会社クリモ

    View Slide

  2. 自己紹介
    ◉ 渡邊 達明(わたなべ たつあき)
    ◉ twitterとか: @nabettu
    ◉ 富士通株式会社→面白法人カヤック→独立
    ◉ 妻(代表)と法人設立
    ◉ Webフロントエンド(Vue.jsやNuxt.js)&
    アプリエンジニア(React Native)

    View Slide

  3. 作ってます

    View Slide

  4. ◉ JAM : JavaScript + API + Markup(html)の組み合わせ
    最近はシングルページアプリケーションや
    マイクロサービスアーキテクチャの
    流行りの流れでJAMstackの流行がきています
    APIサーバーにして使う 分離したSPAサイトにする

    View Slide

  5. ◉ フロントエンドとバックエンドが疎結合になる
     (それぞれの責務に集中できる)
    ◉ マークアップが既にあるのでサイト読み込みが早い
    ◉ スケールアップも簡単(料金も安い)
    ◉ セキュリティも万全(あくまでサイト側が)
    動的サイトを
    htmlでできた静的サイトに変更すると・・・

    View Slide

  6. ◉ AWS S3:独自ドメイン+SSL対応がめんどくさい
    ◉ Firebase Hosting:gitから自動でやるにはCIが必要
    ◉ GitHub Pages:サイトの公開データもgitに入れないとならな
    いし遅い
    そんな静的Webサイトの
    公開になにを使おうか・・・?
    その悩みを全部解決してくれるサービスがあるんです

    View Slide

  7. それがNetlify
    ◉ 静的サイトホスティングサービス
    ◉ GitHubなどのリポジトリと連携して、
    自動でサイトホスティングができる
    ◉ 静的サイト公開のための便利機能が
    たくさん備わっている

    View Slide

  8. Gitでブランチ切ってプッシュすると
    自動でブランチ毎の公開サイトがつくられます
    ◉ 本番サイト
    ◉ テストサイト
    ◉ 新機能のプルリクエストのサイト
    など、用途に応じてなんとブランチを切ってpushするだけで
    それぞれの確認用サイトが出来上がる!
    webhookでビルドなどももちろんできます。

    View Slide

  9. 静的サイトジェネレータを利用する場合、ビルドをCircle CIなどに
    任せていた人も、Netlifyで完結するので管理が楽になります。
    package.jsonにbuildコマンドがあれば自動で設定いらず!
    ビルドも自動でやってくれます

    View Slide

  10. 動的サイトのときには出来た痒いところを解決する
    便利機能がたくさんあります
    ◉ 独自ドメイン設定 & HTTPS化
    ◉ A/Bテストの自動出しわけ
    ◉ フォームの設置と投稿管理
    ◉ 独自のCMS&管理画面
    ◉ プリレンダリング機能(動的コンテンツなのに
    OGPが分けられる)
    ◉ Functions (AWS Lambdaのラッパー)
    などなど。。。。とにかく静的サイトの公開において問題になる事への解決
    策が取り揃っています。

    View Slide

  11. ◉ そんなNetlifyの豊富な機能を網羅的に
    紹介・具体的な使い方を書いた本が
    「ゼロから始めるNetlify」
    です。よろしくお願いします!
    Boothでも売っています!
    今日頒布する本の紹介

    View Slide

  12. 質問等あればこちらでも
    https://comets.nabettu.com/?id=saihannight
    Twitter等でも気軽にご連絡ください
    Thanks!

    View Slide