Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Gatsby と Netlify で JAMstack なメディア開発
Search
jaxx2104
December 13, 2018
Technology
0
730
Gatsby と Netlify で JAMstack なメディア開発
Netlify Meetup #003
https://jamstack-tokyo.connpass.com/event/110639/
jaxx2104
December 13, 2018
Tweet
Share
More Decks by jaxx2104
See All by jaxx2104
Relative CI が気になっている話
jaxx2104
0
500
デザインファイルにおける継続的インテグレーション
jaxx2104
2
420
漸進的な変更を支えるフロントエンド設計
jaxx2104
5
2.2k
価値あるフロントエンドデザイン領域開拓
jaxx2104
0
390
サイレントヒーローを作らない取り組み
jaxx2104
1
160
開発組織のメンバーからリーダーになって
jaxx2104
0
110
Nikuman
jaxx2104
0
390
レガシーなフロントエンド環境で心理的安全性を確保する / RecoChoku Tech Night #08
jaxx2104
0
340
Vue.jsとLambdaの導入
jaxx2104
0
370
Other Decks in Technology
See All in Technology
MCP Clientを活用するための設計と実装上の工夫
yudai00
0
400
toittaにOpenTelemetryを導入した話 / Mackerel APM リリースパーティ
cohalz
1
420
FastMCPでSQLをチェックしてくれるMCPサーバーを自作してCursorから動かしてみた
nayuts
1
150
継続戦闘能⼒
sansantech
PRO
0
200
シンプルな設定ファイルで実現する AWS IAM Identity Center のユーザー管理と開発チームへの委譲 / Delegating AWS IAM Identity Center User Management with a Simple DSL
yamaguchitk333
3
510
金融システムをモダナイズするためのAmazon Elastic Kubernetes Service(EKS)ノウハウ大全
daitak
0
120
フロントエンドがTypeScriptなら、バックエンドはPHPでもいいじゃない/php-is-not-bad
hanhan1978
8
12k
TypeScript と歩む OpenAPI の discriminator / OpenAPI discriminator with TypeScript
kaminashi
1
120
CloudTrailも、GuardDutyも、VPC Flow logsも… ログ多すぎ問題の整理術
nikuyoshi
5
610
超簡単!RAGアプリケーション構築術
oracle4engineer
PRO
0
110
新卒から4年間、20年もののWebサービスと向き合って学んだソフトウェア考古学 - PHPカンファレンス新潟2025 / new graduate 4year software archeology
oguri
2
330
VueUseから学ぶ実践TypeScript #TSKaigi #TSKaigi2025
bengo4com
3
5.3k
Featured
See All Featured
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
29
2.6k
Building a Modern Day E-commerce SEO Strategy
aleyda
40
7.3k
The Cult of Friendly URLs
andyhume
78
6.4k
Six Lessons from altMBA
skipperchong
28
3.8k
How to Ace a Technical Interview
jacobian
276
23k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
1
65
Build The Right Thing And Hit Your Dates
maggiecrowley
35
2.7k
Large-scale JavaScript Application Architecture
addyosmani
512
110k
4 Signs Your Business is Dying
shpigford
183
22k
Automating Front-end Workflow
addyosmani
1370
200k
How to train your dragon (web standard)
notwaldorf
92
6k
Bash Introduction
62gerente
613
210k
Transcript
Gatsby と Netlify で Gatsby と Netlify で JAMstack なメディア開発
JAMstack なメディア開発 Netlify Meetup #003 / Futoshi Iwashita
自己紹介 自己紹介 岩下 太 @jaxx2104 Front-end engineer Recruit Lifestyle Co.
2年前 Gatsby と Netlify の記事を書いた
現在 現在 クソアプリも Netlify で作れるいい時代 参考: https://qiita.com/sadnessOjisan/items/51bb949466fdd065a5a6
静的サイトジェネレーターとの違い 静的サイトジェネレーターとの違い
個人的に重要だと思う要素 個人的に重要だと思う要素
JAMstack なメディア開発 JAMstack なメディア開発 をやっているので共有します をやっているので共有します
スタートアップにおけるメディア開発 スタートアップにおけるメディア開発 スケールしやすく 少人数で 初動を早く
課題 課題
サービスを分割しすぎると サービスを分割しすぎると 見る場所が多い... 見る場所が多い...
でもモノリシックは でもモノリシックは 避けれるなら避けたい... 避けれるなら避けたい...
None
そんな課題に! そんな課題に!
JAMstack 構成 JAMstack 構成 スタートアップのメディア開発に 最適ですよという話
こんな構成 こんな構成
工夫 工夫
UIコンポーネントをパッケージ化 UIコンポーネントをパッケージ化 両サイトから共通利用 両サイトから共通利用
GraphQL と Firebase の活用 GraphQL と Firebase の活用 サービスとメディア間のAPIの抽象化 サービスとメディア間のAPIの抽象化
どんな仕様変更でも妥協しない変化に強い設計
もちろんインフラは Netlify もちろんインフラは Netlify リリース前でもインテグレーションで PR単位でプレビュー出来てレビュー快適
少人数でスケールしやすい設計 少人数でスケールしやすい設計 コンポーネントのパッケージで共通化 APIの抽象化と再利用 Netlify でデプロイ・レビュー快適
どんどん使っていきましょう どんどん使っていきましょう
ありがとうございました ありがとうございました