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
Okamuuu
September 29, 2018
Technology
0
61
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
68
hachiojipm#72
okamuuu
0
37
チームで取り組む Singe Page Application
okamuuu
0
740
Other Decks in Technology
See All in Technology
アプリをリリースできる状態に保ったまま 段階的にリファクタリングするための 戦略と戦術 / Strategies and tactics for incremental refactoring
yanzm
6
750
Developer Experienceを向上させる基盤づくりの取り組み事例集
coconala_engineer
0
110
Optuna: a Black-Box Optimization Framework
pfn
PRO
1
110
AI活用したくてもできなかった不動産SaaSの今とこれから
nealle
0
250
AWSを始めた頃に陥りがちなポイントをまとめてみた
oshanqq
1
3.4k
Creative UIs with Compose: DroidKaigi 2024
chrishorner
1
230
四国のあのイベントの〇〇システムを45日間で構築した話 / cloudohenro2024_tachibana
biatunky
0
310
Oracle Exadata Database Service(Dedicated Infrastructure):サービス概要のご紹介
oracle4engineer
PRO
0
9.5k
SORACOMで実現するIoTのマルチクラウド対応 - IoTでのクリーンアーキテクチャの実現 -
kenichirokimura
0
350
やってやろうじゃないかメカアジャイル! / Let's do it, mechanical agile!
psj59129
1
130
サイボウズ 開発本部採用ピッチ / Cybozu Engineer Recruit
cybozuinsideout
PRO
9
41k
ロリポップ! for Gamersを支えるインフラ/lolipop for gamers infrastructure
takumakume
0
120
Featured
See All Featured
Into the Great Unknown - MozCon
thekraken
28
1.4k
A designer walks into a library…
pauljervisheath
201
24k
Large-scale JavaScript Application Architecture
addyosmani
508
110k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
38
9.2k
In The Pink: A Labor of Love
frogandcode
139
22k
Web Components: a chance to create the future
zenorocha
308
42k
For a Future-Friendly Web
brad_frost
174
9.3k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
246
1.3M
How to Ace a Technical Interview
jacobian
275
23k
Infographics Made Easy
chrislema
239
18k
Thoughts on Productivity
jonyablonski
66
4.2k
Fantastic passwords and where to find them - at NoRuKo
philnash
48
2.8k
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