Save 37% off PRO during our Black Friday Sale! »

Development of a live commerce system using serverless architecture with a focus on Amplify / AppSync on production

74cec195bfb6cb5165256d88cb7fcf0f?s=47 Kazuki Miura
November 21, 2021

Development of a live commerce system using serverless architecture with a focus on Amplify / AppSync on production

Serverless EC Service with watching Video.

https://jawspankration2021.jaws-ug.jp/en

#jawspankration2021 #jawspankration #jawsug #aws

74cec195bfb6cb5165256d88cb7fcf0f?s=128

Kazuki Miura

November 21, 2021
Tweet

Transcript

  1. %FWFMPQNFOUPGBMJWFDPNNFSDF TZTUFNVTJOHTFSWFSMFTTBSDIJUFDUVSF XJUIBGPDVTPO"NQMJGZ"QQ4ZOD POQSPEVDUJPO +"841"/,3"5*0/ FBSMZJOUIFNPSOJOH ,B[VL.JVSB

  2. Hokkaido Television Broadcasting Co., Ltd. Kazuki Miura(35) JAWS-UG Sapporo Media-JAWS

    JP_Stripes Sapporo Introduction ASA(Morning) • In-house Development • Technology Selection • Architecture Design • Frontend/Backend Development • Product Management • Project Management • Respond to Inquiries
  3. amplify-cli See the documentation for details. https://docs.amplify.aws/

  4. Live Commerce Service Shop with watching Video Requirement 0. NO

    VPC 1. Stable Video Distribution 2. Don’t use brower reload 3. Don’t open another page 4. 10,000 viewers at the same time
  5. AWS Amplify Frontend Amazon CloudFront AWS Elemental MediaPackage AWS Elemental

    MediaLive AWS Elemental MediaLink DynamoDB AWS AppSync API Gateway AWS Lambda HLS / MPEG-DASH Video Switcher Auido Mixer Step Functions DynamoDB DynamoDB API Gateway OIDC CloudFront Kinesis Data Streams Kinesis Data Firehose ElasticSearch Service Viewer Count S3 HD-SDI A lot of Cameras Event Site (Physical)
  6. AWS Amplify Frontend Amazon CloudFront AWS Elemental MediaPackage AWS Elemental

    MediaLive AWS Elemental MediaLink DynamoDB AWS AppSync API Gateway AWS Lambda HLS / MPEG-DASH Video Switcher Auido Mixer Step Functions DynamoDB DynamoDB API Gateway OIDC CloudFront Kinesis Data Streams Kinesis Data Firehose ElasticSearch Service Viewer Count S3 HD-SDI A lot of Cameras Event Site (Physical)
  7. "84 7JEFP 1PXFS

  8. 'BO 'BO 'BO

  9. AWS Amplify Frontend Amazon CloudFront AWS Elemental MediaPackage AWS Elemental

    MediaLive AWS Elemental MediaLink DynamoDB AWS AppSync API Gateway AWS Lambda HLS / MPEG-DASH Video Switcher Auido Mixer Step Functions DynamoDB DynamoDB API Gateway OIDC CloudFront Kinesis Data Streams Kinesis Data Firehose ElasticSearch Service Viewer Count S3 HD-SDI A lot of Cameras Event Site (Physical)
  10. AWS Amplify Frontend Amazon CloudFront AWS Elemental MediaPackage AWS Elemental

    MediaLive AWS Elemental MediaLink DynamoDB AWS AppSync API Gateway AWS Lambda HLS / MPEG-DASH Video Switcher Auido Mixer Step Functions DynamoDB DynamoDB API Gateway OIDC CloudFront Kinesis Data Streams Kinesis Data Firehose ElasticSearch Service Viewer Count S3 HD-SDI A lot of Cameras Event Site (Physical) *OTJEFUIFEPUUFEMJOF 6TJOHBNQMJGZDMJPOMZTDIFNBEF fi OJUJPO 8IBUBNQMJGZDMJDBOUEP XFDBOUEP
  11. Amplify Frontend DynamoDB AWS AppSync REST API AWS Lambda Step

    Functions DynamoDB DynamoDB HTTP API + Cache OIDC OIDC 6OBVUIPSJ[FE
  12. Amplify Frontend REST API AWS Lambda DynamoDB + Cache 6OBVUIPSJ[FE

    'PSVTFSTCFGPSFMPHHJOHJO (PPETJUFNEBUB
  13. Amplify Frontend DynamoDB AWS AppSync OIDC 0*%$"VUIFOUJDBUJPO 6TFSEBUBBOE(PPETJUFNEBUB

  14. Amplify Frontend Step Functions DynamoDB HTTP API OIDC 0*%$"VUIFOUJDBUJPO 1BZNFOUBOE*OWFOUPSZ%BUB

  15. GraphQL ① Query • Get/List ② Mutation • Create/Update/Delete ③

    Subscription • push update to client AWS AppSync
  16. GraphQL ① Query • Get/List ② Mutation • Create/Update/Delete ③

    Subscription • push update to client AWS AppSync
  17. When Out of Stock I want to disable button without

    reloading *OTUPDL 0VUPGTUPDL "EEUP$BSU 0VUPG4UPDL without reloading
  18. Amplify DynamoDB AWS AppSync Step Functions React Lambda

  19. Amplify DynamoDB AWS AppSync ᶃDecrease Inventroy stock

  20. Amplify DynamoDB AWS AppSync ᶃDecrease Inventroy stock ᶄ InventroyStock ==

    0
  21. Amplify DynamoDB AWS AppSync ᶃDecrease Inventroy stock ᶄ InventroyStock ==

    0 ᶅɹmutation outOfStockFlg=true
  22. Amplify DynamoDB AWS AppSync ᶃDecrease Inventroy stock ᶄ InventroyStock ==

    0 ᶅɹmutation outOfStockFlg=true ᶆɹsubscription outOfStockFlg=true
  23. Amplify DynamoDB AWS AppSync ᶃDecrease Inventroy stock ᶄ InventroyStock ==

    0 ᶅɹmutation outOfStockFlg=true ᶆɹsubscription outOfStockFlg=true ᶇɹquery getInventoryTable Refetch
  24. LIMIT

  25. DynamoDB AWS AppSync Frontend 10,000 Users 10,000 access 10,000 Read

    AT THE SAME TIME ᶆɹsubscription outOfStockFlg=true ᶇɹquery getInventoryTable Refetch
  26. DynamoDB AWS AppSync Frontend 10,000 Users 10,000 access 10,000 Read

    Refetch Throttle rate per GraphQL API* 1,000 count/second Soft limit Hot partition 3,000 RCUs/second Hard limit LIMIT * In the case of subscription, it is counted when the session is opened.
  27. DynamoDB AWS AppSync Frontend 10,000 Users 10,000 access Refetch Throttle

    rate per GraphQL API* 1,000 count/second Soft limit LIMIT * In the case of subscription, it is counted when the session is opened.
  28. DynamoDB AWS AppSync Frontend 3,000 Users 3,000 access 3,000 Read

    Refetch Throttle rate per GraphQL API 1,000 count/second Soft limit Hot partition 3,000 RCUs/second Hard limit LIMIT 🔥 🔥 🔥
  29. 😱 One week before the release

  30. How to fi x

  31. Amplify DynamoDB AWS AppSync ᶃDecrease Inventroy stock ᶄ InventroyStock ==

    0 ᶅɹmutation outOfStockFlg=true ᶆɹsubscription outOfStockFlg=true ᶇɹquery getInventoryTable Refetch
  32. Amplify DynamoDB AWS AppSync ᶃDecrease Inventroy stock ᶄ All Inventory

    Data ᶅɹmutation All Inventory Data ᶆɹsubscription All Inventory Data Refetch 1BTTBMMEBUBOFFEFEGPSEJTQMBZUPUIFGSPOUFOEBTTVCTDSJQUJPOEBUB 4UPQ3FGFUDI
  33. Let's do the load test as soon as possible.

  34. Until two years ago we had never developed one.

  35. The reason why… • Development starts for the fi rst

    time for 2 years ago. • Everyone had no development experiment. • We wanted to Develop!!! • We have to increase what we don’t have to make.
  36. • VPC • IPv4??? Security Group? ACL? • EC2 •

    Toooo many instance type!! • Toooo many OS type!! • I Can’t choose one… • RDS • SQL??? • Toooo many instance type!! • Linux • Toooo many directories I don’t know. • Toooo many things I didn't prepare myself.
  37. 😱 Too dif fi cult.

  38. %PZPVLOPX4FSWFSMFTT  53:

  39. We Can Focus only on the CODE.

  40. JAWS-UG had made us Engineers.

  41. THANK YOU!