Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up
for free
AppSync 使ってみた! サーバレスライブコマースの構築
Kazuki Miura
November 04, 2020
Technology
0
190
AppSync 使ってみた! サーバレスライブコマースの構築
#serverlessjp
Kazuki Miura
November 04, 2020
Tweet
Share
More Decks by Kazuki Miura
See All by Kazuki Miura
miu_crescent
0
57
miu_crescent
0
79
miu_crescent
0
130
miu_crescent
0
52
miu_crescent
1
240
miu_crescent
2
410
miu_crescent
5
1.9k
miu_crescent
0
490
miu_crescent
1
800
Other Decks in Technology
See All in Technology
viva_tweet_x
5
2.7k
kekeke_47
0
390
natsusan
0
200
asaju7142501
0
360
noir_neo
0
130
yasuakiomokawa
0
380
kappa4
4
2.4k
_kensh
1
180
clustervr
0
200
clustervr
0
160
yosuke_furukawa
PRO
47
16k
humank
0
220
Featured
See All Featured
bryan
30
3.3k
danielanewman
200
20k
geoffreycrofte
19
800
maggiecrowley
8
430
philhawksworth
192
8.8k
trallard
13
640
phodgson
87
3.9k
addyosmani
494
110k
bkeepers
52
4.1k
tanoku
258
24k
geeforr
332
29k
tenderlove
52
3.4k
Transcript
AppSync 使ってみた サーバレスライブコマースの構築 これまた流⽤して、別のやつを ごしらえして、 ⽇ です( ) SOURCE: CENTERS
FOR DISEASE CONTROL AND PREVENTION SeverlessMeetup#10 2020.11.04(Wed)
HTB北 テレビ HTB北 テレビ HTB北 テレビ 三浦⼀樹 三浦⼀樹 三浦⼀樹
AppSync
AppSync ちゃんと分かってないけど 薦められたので使ってみた
10⽉頭にこんなイベントを開催しました 動画を⾒ながらお買い物イベント
本番の画⾯ headerにプレイヤー 下に shopifybuybutton APIで ハッシュタグ付き ツイート持ってくる
スケジュール不明のタイミングで 限定の商品を動画の下に出したい 追加要件: 時間限定商品の販売 動画が途切れちゃうので リロードさせるのはNG 商品は予め用意するけど、 ほんとにそれを使うかはわからない
スケジュール不明のタイミングで 限定の商品を動画の下に出したい 追加要件: 時間限定商品の販売 動画が途切れちゃうので リロードさせるのはNG 商品は予め用意するけど、 ほんとにそれを使うかはわからない AppSyncのSubscriptionでいける!?
None
None
None
あんまり詳しくない⼈が説明する
・query ・mutation ・subscription
・query ・mutation ・subscription 検索 変更 すぐ更新
mutationはコンソールから直接操作 mutationの結果がsubscriptionでフロントへ queryはフロントからDynamoを
timeSaleFlg 0 or 1
query { id : 'aircaravan' } type Query { singlePost(id:
ID!): Post } { "data": { "singlePost": { "id": "aircaravan", "timeSaleFlg": 1 } } } { "id": "aircaravan", "timeSaleFlg": 1 } AppSync Amplify DynamoDB
mutation console AppSync Lambda DynamoDB コンソールで操作
mutation { timeSaleFlg: 1 } type Mutation { putPost(id:
ID, timeSaleFlg: Int!): Post } { id: "aircaravan", timeSaleFlg: event.arguments.timeSaleFlg } Item: { id: "aircaravan", timeSaleFlg: event.arguments.timeSaleFlg } { "data": { "singlePost": { "id": "aircaravan", "timeSaleFlg": 1 } } } console AppSync Lambda DynamoDB query用にDynamoDBに保存
console AppSync Amplify subscription { timeSaleFlg: 1 } type
Subscription { onPutPost: Post @aws_subscribe(mutations: ["putPost"]) } WebSocket type Mutation { putPost(id: ID, timeSaleFlg: Int!): Post } { "data": { "onPutPost": { "id": "aircaravan", "timeSaleFlg": 1 } } }
subscription timeSaleFlg = 0 timeSaleFlg = 1
subscription AppSync AppSync Amplify { timeSaleFlg: 0 } {
timeSaleFlg: 1 } shopify GraphQL 商品の入れ替えもGraphQL <v-if="timeSaleFlg"> 非表示 表示
shopifyのコレクションにして IDをshopifyのコンソールから GraphQLで⼊れ替え スケジュール不明のタイミングで 限定の商品を動画の下に出したい 追加要件: 時間限定商品の販売 動画が途切れちゃうので リロードさせるのはNG 商品は予め用意するけど、
ほんとにそれを使うかはわからない 現地でコンソールからmutation subscriptionでリロードなし!
スケジュール不明のタイミングで 限定の商品を動画の下に出したい 追加要件: 時間限定商品の販売 動画が途切れちゃうので リロードさせるのはNG 商品は予め用意するけど、 ほんとにそれを使うかはわからない 現地でコンソールからmutation subscriptionでリロードなし!
shopifyのコレクションにして IDをshopifyのコンソールから GraphQLで⼊れ替え COMPLETE!!$4くらい
not yet... H O W D O Y O U
L I K E W E D N E S D A Y ?
2020.10.28(WED) 2020.10.28(WED)
2020.11.04(WED) 2020.11.04(WED)
None
TO BE CONTINUED... H O W D O Y O
U L I K E W E D N E S D A Y ?