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
2018-09-29.okayama.pdf
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Okamuuu
September 29, 2018
Technology
0
75
2018-09-29.okayama.pdf
Okamuuu
September 29, 2018
Tweet
Share
More Decks by Okamuuu
See All by Okamuuu
2018-08-04.js-beer-bash.pdf
okamuuu
0
78
hachiojipm#72
okamuuu
0
42
チームで取り組む Singe Page Application
okamuuu
0
810
Other Decks in Technology
See All in Technology
Codex 5.3 と Opus 4.6 にコーポレートサイトを作らせてみた / Codex 5.3 vs Opus 4.6
ama_ch
0
190
StrandsとNeptuneを使ってナレッジグラフを構築する
yakumo
1
120
22nd ACRi Webinar - NTT Kawahara-san's slide
nao_sumikawa
0
100
30万人の同時アクセスに耐えたい!新サービスの盤石なリリースを支える負荷試験 / SRE Kaigi 2026
genda
4
1.3k
顧客との商談議事録をみんなで読んで顧客解像度を上げよう
shibayu36
0
270
配列に見る bash と zsh の違い
kazzpapa3
3
160
We Built for Predictability; The Workloads Didn’t Care
stahnma
0
140
仕様書駆動AI開発の実践: Issue→Skill→PRテンプレで 再現性を作る
knishioka
2
680
コンテナセキュリティの最新事情 ~ 2026年版 ~
kyohmizu
2
370
Context Engineeringが企業で不可欠になる理由
hirosatogamo
PRO
3
630
制約が導く迷わない設計 〜 信頼性と運用性を両立するマイナンバー管理システムの実践 〜
bwkw
3
990
プロポーザルに込める段取り八分
shoheimitani
1
570
Featured
See All Featured
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.7k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
450
Lightning talk: Run Django tests with GitHub Actions
sabderemane
0
120
SEO for Brand Visibility & Recognition
aleyda
0
4.2k
Building Adaptive Systems
keathley
44
2.9k
Helping Users Find Their Own Way: Creating Modern Search Experiences
danielanewman
31
3.1k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.7k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
techseoconnect
PRO
0
110
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
10
1.1k
State of Search Keynote: SEO is Dead Long Live SEO
ryanjones
0
120
Digital Ethics as a Driver of Design Innovation
axbom
PRO
1
180
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
reverentgeek
1
350
Transcript
Contentful を使ってみました 岡山城 天守閣 2018-09-29 okamuuu 1 / 17
あくまで個人の感想です。 2 / 17
Contentful とは? いわゆる Headless CMS です。 Contentful ButterCMS storyblok GraphCMS
など 3 / 17
CMS vs Headless CMS ざっくり説明すると Response を HTML で返すのが CMS
Response を JSON で返すのが Headless CMS わかりやすく言うと WordPress は CMS Contentful は Headless CMS 4 / 17
Contentful の特徴 型を自由に定義できる 型に沿ったオブジェクトを出し入れできる CRUD 画面が現れる REST API も生える 位置情報検索もできる
個人で開発する時にとても便利 5 / 17
Contentful を使ってみた感想 CRUD 画面が自動生成される。気持ちいい。 API にちょっと癖がある。 リレーションできない? 通信回数がN+1 にならないように工夫が必要? 6
/ 17
CRUD 画面が自動生成される 7 / 17
CRUD 画面が自動生成される users という型を管理画面で作成する この時点で CRUD 画面が用意される。 そこに user object
を追加する /entries?content_type=users で一覧取得できる 8 / 17
API にちょっと癖がある 9 / 17
API にちょっと癖がある 期待している Response { "id": 2073765716208129 "name": " 神牛前3
丁目", "state: " 東京", } 10 / 17
API にちょっと癖がある { "fields": { "id": { "en-US": 2073765716208129 },
"name": { "en-US": " 神牛前3 丁目" }, "state": { "en-US": " 東京" } }, "sys": { "id": "5KsDBWseXY6QegucYAoacS", "type": "Entry", "createdAt": "2016-12-20T10:43:35.772Z", "updatedAt": "2016-12-20T10:43:35.772Z", "revision": 1 } 11 / 17
リレーションできない? 12 / 17
リレーションできない? Entry 取得した場合、関連する型の sys.id しか取得 できない。ドキュメントには include を指定するよ うに書いているが... //
console.log(user.fields.status) { sys: { type: 'Link', linkType: 'Entry', id: '6Bw3NLBDJ6KEyOc2YwucYk' } } 13 / 17
通信回数がN+1 にならないよう にする 14 / 17
通信回数がN+1 にならないよう にする リレーションができないのであれば、の話ですが 一覧表示画面を実装するときにあえて非正規化す る場面がでてくるかも Promise.all してももっさりしがちなのでできれ ば API
の向こう側で解決したい 15 / 17
まとめ Contentful はかなり便利だった なんだけどリレーションができない? ドキュメントを分かりやすくして欲しい example がもっと欲しい Cognito と Contentful
があれば色々できる予感 16 / 17
おしまい 17 / 17