Lock in $30 Savings on PRO—Offer Ends Soon! ⏳
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Netlifyはいいぞ #技術同人誌再販Night
Search
tatsuaki watanabe
December 04, 2018
Technology
1
490
Netlifyはいいぞ #技術同人誌再販Night
tatsuaki watanabe
December 04, 2018
Tweet
Share
More Decks by tatsuaki watanabe
See All by tatsuaki watanabe
4:3のスライド
nabettu
0
280
React Native for WebでもOGP対応がしたい! ~ TECH STAND #2 React Native 2020/12/18 ~
nabettu
1
6.7k
React Navigationを使って React Native WebでSPAを試してみた ~ React Native Meetup 2020/5/29 ~
nabettu
8
11k
OG画像のためだけのFunctionsで、 htmlベタ書き&リダイレクトをやめるんだ
nabettu
3
1.7k
React Nativeにおける ExpoとFirebaseの活用 Webとの共通化 ~ React Native Tokyo 2019/09/03 ~
nabettu
2
1.4k
A story till the netlify fun book is made
nabettu
0
710
Nuxt.js & Firebase & Netlifyでの 爆速プロトタイピングと 本格運用への足がかり
nabettu
3
880
声をかけられるフリーランスエンジニアになるには
nabettu
5
1.4k
2016-01-25いいとも発表Atomパッケージ
nabettu
0
170
Other Decks in Technology
See All in Technology
Ruby で作る大規模イベントネットワーク構築・運用支援システム TTDB
taketo1113
1
200
ログ管理の新たな可能性?CloudWatchの新機能をご紹介
ikumi_ono
0
460
regrowth_tokyo_2025_securityagent
hiashisan
0
160
Oracle Database@Google Cloud:サービス概要のご紹介
oracle4engineer
PRO
0
690
re:Invent 2025 ふりかえり 生成AI版
takaakikakei
1
170
GitLab Duo Agent Platformで実現する“AI駆動・継続的サービス開発”と最新情報のアップデート
jeffi7
0
210
SSO方式とJumpアカウント方式の比較と設計方針
yuobayashi
7
290
小さな判断で育つ、大きな意思決定力 / 20251204 Takahiro Kinjo
shift_evolve
PRO
1
570
21st ACRi Webinar - Univ of Tokyo Presentation Slide (Ayumi Ohno)
nao_sumikawa
0
120
Agentic AI Patterns and Anti-Patterns
glaforge
1
200
Lambdaの常識はどう変わる?!re:Invent 2025 before after
iwatatomoya
0
280
【CEDEC+KYUSHU2025】学生・若手必見!テクニカルアーティスト 大全 ~仕事・スキル・キャリアパス、TAの「わからない」を徹底解剖~
cygames
PRO
0
140
Featured
See All Featured
A Tale of Four Properties
chriscoyier
162
23k
The Invisible Side of Design
smashingmag
302
51k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
48
9.8k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.1k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Music & Morning Musume
bryan
46
7k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
128
54k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
9
1k
Side Projects
sachag
455
43k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.3k
Navigating Team Friction
lara
191
16k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
234
17k
Transcript
Netlifyはいいぞ ~2018/12/4 技術同人誌再販Night★#3~ 渡邊達明@株式会社クリモ
自己紹介 ◉ 渡邊 達明(わたなべ たつあき) ◉ twitterとか: @nabettu ◉ 富士通株式会社→面白法人カヤック→独立
◉ 妻(代表)と法人設立 ◉ Webフロントエンド(Vue.jsやNuxt.js)& アプリエンジニア(React Native)
作ってます
◉ JAM : JavaScript + API + Markup(html)の組み合わせ 最近はシングルページアプリケーションや マイクロサービスアーキテクチャの
流行りの流れでJAMstackの流行がきています APIサーバーにして使う 分離したSPAサイトにする
◉ フロントエンドとバックエンドが疎結合になる (それぞれの責務に集中できる) ◉ マークアップが既にあるのでサイト読み込みが早い ◉ スケールアップも簡単(料金も安い) ◉ セキュリティも万全(あくまでサイト側が) 動的サイトを
htmlでできた静的サイトに変更すると・・・
◉ AWS S3:独自ドメイン+SSL対応がめんどくさい ◉ Firebase Hosting:gitから自動でやるにはCIが必要 ◉ GitHub Pages:サイトの公開データもgitに入れないとならな いし遅い
そんな静的Webサイトの 公開になにを使おうか・・・? その悩みを全部解決してくれるサービスがあるんです
それがNetlify ◉ 静的サイトホスティングサービス ◉ GitHubなどのリポジトリと連携して、 自動でサイトホスティングができる ◉ 静的サイト公開のための便利機能が たくさん備わっている
Gitでブランチ切ってプッシュすると 自動でブランチ毎の公開サイトがつくられます ◉ 本番サイト ◉ テストサイト ◉ 新機能のプルリクエストのサイト など、用途に応じてなんとブランチを切ってpushするだけで それぞれの確認用サイトが出来上がる!
webhookでビルドなどももちろんできます。
静的サイトジェネレータを利用する場合、ビルドをCircle CIなどに 任せていた人も、Netlifyで完結するので管理が楽になります。 package.jsonにbuildコマンドがあれば自動で設定いらず! ビルドも自動でやってくれます
動的サイトのときには出来た痒いところを解決する 便利機能がたくさんあります ◉ 独自ドメイン設定 & HTTPS化 ◉ A/Bテストの自動出しわけ ◉ フォームの設置と投稿管理
◉ 独自のCMS&管理画面 ◉ プリレンダリング機能(動的コンテンツなのに OGPが分けられる) ◉ Functions (AWS Lambdaのラッパー) などなど。。。。とにかく静的サイトの公開において問題になる事への解決 策が取り揃っています。
◉ そんなNetlifyの豊富な機能を網羅的に 紹介・具体的な使い方を書いた本が 「ゼロから始めるNetlify」 です。よろしくお願いします! Boothでも売っています! 今日頒布する本の紹介
質問等あればこちらでも https://comets.nabettu.com/?id=saihannight Twitter等でも気軽にご連絡ください Thanks!