AppSync 使ってみた！ サーバレスライブコマースの構築

Transcript

1. AppSync 使ってみた サーバレスライブコマースの構築 これまた流⽤して、別のやつを ごしらえして、 ⽇ です( ) SOURCE: CENTERS

   FOR DISEASE CONTROL AND PREVENTION Severless
   Meetup
   #10
   2020.
   11.
   04
   (Wed)

2. HTB北 テレビ HTB北 テレビ HTB北 テレビ 三浦⼀樹 三浦⼀樹 三浦⼀樹

3. AppSync

4. AppSync ちゃんと分かってないけど 薦められたので使ってみた

5. 10⽉頭にこんなイベントを開催しました 動画を⾒ながらお買い物イベント

6. 本番の画⾯ header
   にプレイヤー 下に shopify
   buybutton API
   で ハッシュタグ付き ツイート持ってくる

7. スケジュール不明のタイミングで 限定の商品を動画の下に出したい 追加要件： 時間限定商品の販売 動画が途切れちゃうので リロードさせるのはNG 商品は予め用意するけど、 ほんとにそれを使うかはわからない

8. スケジュール不明のタイミングで 限定の商品を動画の下に出したい 追加要件： 時間限定商品の販売 動画が途切れちゃうので リロードさせるのはNG 商品は予め用意するけど、 ほんとにそれを使うかはわからない AppSync
   の
   Subscription
   でいける!?

9. None
10. None
11. None

12. あんまり詳しくない⼈が説明する

13. ・query ・mutation ・subscription

14. ・query ・mutation ・subscription 検索 変更 すぐ更新

15. mutation
    はコンソールから直接操作 mutation
    の結果が
    subscription
    でフロントへ query
    は
    フロントから
    Dynamo
    を

16. timeSaleFlg 0 or 1

17. query { id : 'aircaravan' } type Query { singlePost(id:

    ID!): Post } { "data": { "singlePost": { "id": "aircaravan", "timeSaleFlg": 1 } } } { "id": "aircaravan", "timeSaleFlg": 1 } AppSync Amplify DynamoDB

18. mutation console AppSync Lambda DynamoDB コンソールで操作

19. 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に保存

20. 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 } } }

21. subscription timeSaleFlg = 0 timeSaleFlg = 1

22. subscription AppSync AppSync Amplify { 　 timeSaleFlg: 0 } {

    　 timeSaleFlg: 1 } shopify GraphQL 商品の入れ替えもGraphQL <v-if="timeSaleFlg"> 非表示 表示

23. shopifyのコレクションにして IDをshopifyのコンソールから GraphQLで⼊れ替え スケジュール不明のタイミングで 限定の商品を動画の下に出したい 追加要件： 時間限定商品の販売 動画が途切れちゃうので リロードさせるのはNG 商品は予め用意するけど、

    ほんとにそれを使うかはわからない 現地でコンソールからmutation subscriptionでリロードなし！

24. スケジュール不明のタイミングで 限定の商品を動画の下に出したい 追加要件： 時間限定商品の販売 動画が途切れちゃうので リロードさせるのはNG 商品は予め用意するけど、 ほんとにそれを使うかはわからない 現地でコンソールからmutation subscriptionでリロードなし！

    shopifyのコレクションにして IDをshopifyのコンソールから GraphQLで⼊れ替え COMPLETE!!
    $4くらい

25. not yet... H O W D O Y O U

    L I K E W E D N E S D A Y ?

26. 2020.10.28(WED) 2020.10.28(WED)

27. 2020.11.04(WED) 2020.11.04(WED)

28. None

29. TO BE CONTINUED... H O W D O Y O

    U L I K E W E D N E S D A Y ?