拡張して使うServerless&Amplify/use-with-extending-serverless-and-amplify

Transcript

1. KANAZAWA
   ֦ுͯ͠࢖͏ Serverless & Amplify
   גࣜձࣾӬ࿨γεςϜϚωδϝϯτɹञҪٛਔɾଜ্խ඙ | 2019/11/20
   

   View Slide

2. ˕
   ●
   ●
   ຊࣾʗ෱Ҫࢢ໰԰
   ౦ژࢧࣾʗਆా
   ԭೄࣄ຿ॴʗಹ೼ࢢ
   ׆ಈڌ఺
   

   View Slide

3. View Slide

4. Copyright©2016 Poppendieck.LLC
   2017
   

   View Slide

5. View Slide

6. εΫϥϜϚελʔ
   ʢେن໛޲͚ʣ
   ΤϯδχΞʗ
   εΫϥϜϚελʔ
   Ϋϥ΢υΞʔΩςΫτ
   Ϋϥ΢υΞʔΩςΫτ
   ʗεΫϥϜϚελʔ
   ΤϯδχΞ
   εΫϥϜϚελʔ
   • ܦݧ๛෋ͳΞδϟΠϧʗΫϥ΢υٕज़ऀʹΑΔ։ൃࢧԉαʔϏεɻίʔνϯά΋ՄೳͰ͢ɻ
   • POC͔Β঎༻αʔϏεͷ։ൃ·Ͱɺ෯޿͍ٕज़ྖҬʹରԠ͠·͢ɻ
   • ϦϞʔτ։ൃͳΒͰ͸ͷޮ཰ੑͱಁ໌ੑΛ௥ٻɻ͓٬༷ͱϫϯνʔϜͰϏδωεΛ੒௕ͤ͞·͢ɻ
   Point
   Agile Studio Fukuiɿ
   DX࣌୅ʹରԠͨ͠ڞ૑։ൃͱڞҭڌ఺ɻ
   ΞδϟΠϧ/Ϋϥ΢υΛ
   ಘҙͱ͢ΔΤϯδχΞνʔϜ
   

   View Slide

7. View Slide

8. ServerlessͰ࡞ΔॳΊͯͷαʔόϨε
   

   View Slide

9. KANAZAWA
   Name: ञҪ ٛਔ
   Age: 0x20୅
   Home: ژ౎෎Ӊ࣏ࢢ
   • େࡕͷখ͍͞ձࣾͰϝʔΧʔ͔Βͷडୗ։ൃ
   • ओʹܞଳ୺຤ͷ૊ΈࠐΈιϑτ
   • ಛʹܞଳి࿩ʢFOMAॳ߸ػʙAndroid4.4ʣ
   • 2014೥10݄ΑΓݱ৬
   • C/C++/Java/Objective-C/C#/JavaScript/TypeScript/etc
   

   View Slide

10. KANAZAWA
    εϚϗΞϓϦʴόοΫΤϯυͷ։ൃґཔ
    • 20೥͙Β͍΍ͬͯΔαʔϏε
    • ͍Ζ͍Ζ͋ͬͯϦχϡʔΞϧ͍ͨ͠
    • ։ൃձࣾʹෆຬʢεϐʔυײͦͷଞʣ
    

    View Slide

11. KANAZAWA
    ελʔτ࣌఺ͷঢ়گ
    • ϦχϡʔΞϧ಺༰͸ݻ·͍ͬͯͳ͍
    • ݱߦΞϓϦͷجຊػೳ͸ඞਢ
    • εϚϗΞϓϦ͸iOS/Android྆ํ
    ɹ὎ αʔό΋ΞϓϦ΋ɺಈ͘΋ͷΛૣ͘࡞Δඞཁ͕
    

    View Slide

12. KANAZAWA
    ௨ৗͷαʔόߏ੒
    AWS
    DC
    

    View Slide

13. KANAZAWA
    ௨ৗͷαʔόߏ੒
    • ϓϩϏδϣχϯά
    • εέʔϦϯά
    • ӡ༻ɾอक
    ɹ὎ ΞϓϦຊདྷͷػೳҎ֎ʹɺͦΕͳΓͷ࣌ؒͱ࿑ྗ
    

    View Slide

14. KANAZAWA
    αʔόϨεͰʂ
    • ϓϩϏδϣχϯά
    • εέʔϦϯά
    • ӡ༻ɾอक
    ɹ὎ ΞϓϦຊདྷͷػೳʹ஫ྗ
    

    View Slide

15. KANAZAWA
    εϚϗΞϓϦଆ
    • ݱߦΞϓϦ͸iOS=Objective-CˍAndroid=Java
    • ܦݧऀෆ଍
    ɹ὎ ࡞Γ௚͍͕ͨ͠ωΠςΟϒΞϓϦͦΕͧΕΛ࡞Δ࣌ؒ͸ͳ͍
    

    View Slide

16. KANAZAWA
    ϋΠϒϦουͰʂ
    • Cordova
    • Xamarin
    • React Native
    • Native Script
    • Flutter
    

    View Slide

17. KANAZAWA
    ϋΠϒϦουͰʂ
    • Cordova
    • Xamarin
    • React Native
    • Native Script
    • Flutter
    αʔόϨεͷ࿩Ͱ͸ͳ͍ͷͰׂѪ
    

    View Slide

18. KANAZAWA
    REST APIɿNode.js + TypeScript + Jest
    εϚϗΞϓϦɿReact Native + TypeScript + Jest
    ɹ὎ ར༻͢Δٕज़Λڞ௨Խ͢Δ͜ͱ͕Ͱ͖ͨ
    

    View Slide

19. KANAZAWA
    αʔόϨεͳAPIߏ੒
    AWS
    DC
    

    View Slide

20. KANAZAWA
    αʔόϨεͳAPIߏ੒
    AWS
    DC
    Amazon API Gateway
    APIͷఆٛɾσϓϩΠɾอकΛߦ͏ͨΊͷϑϧϚωʔδυαʔϏε
    

    View Slide

21. KANAZAWA
    αʔόϨεͳAPIߏ੒
    AWS
    DC
    AWS Lambda
    ೚ҙͷίʔυΛ࣮ߦ͢ΔͨΊͷϑϧϚωʔδυαʔϏε
    

    View Slide

22. KANAZAWA
    αʔόϨεͳAPIߏ੒
    AWS
    DC
    Amazon DynamoDB
    ແݶʹεέʔϧ͢ΔNoSQLσʔλϕʔε
    

    View Slide

23. KANAZAWA
    αʔόϨεͳAPIߏ੒
    AWS
    DC
    Amazon Cognito
    γϯϓϧʹϢʔβʔΛ؅ཧ͢ΔϑϧϚωʔδυαʔϏε
    

    View Slide

24. KANAZAWA
    αʔόϨεͳAPIߏ੒
    AWS
    DC
    AWS Amplify
    

    View Slide

25. KANAZAWA
    αʔόϨεར༻ͷݒ೦
    • Ϋϥ΢υʹ͔͠ͳ͍
    ϩʔΧϧͰ࣮ߦͰ͖ͳ͍ʹςετͰ͖ͳ͍ʹ։ൃ͠ʹ͍͘
    • ߏங͕໘౗ͦ͏
    Ϛωδϝϯτίϯιʔϧʢखಈʣ͸࠶ݱੑͷ໰୊
    CLIΛεΫϦϓτͰୟ͘ͷ΋อक͕೉͘͠ͳΔ
    

    View Slide

26. KANAZAWA
    https://serverless.com
    

    View Slide

27. KANAZAWA
    Serverless FrameworkͳΒ
    • Ϋϥ΢υʹ͔͠ͳ͍
    ϩʔΧϧͰ࣮ߦͰ͖Δ
    • ߏங͕໘౗ͦ͏
    YAMLϑΝΠϧʴίϚϯυͰҰൃσϓϩΠ
    

    View Slide

28. KANAZAWA
    $ yarn global add serverless
    $ sls create -t aws-nodejs-typescript -p example-project
    Serverless: Generating boilerplate...
    Serverless: Generating boilerplate in "/Users/sakai-y/work/example-project"
    _______ __
    | _ .-----.----.--.--.-----.----| .-----.-----.-----.
    | |___| -__| _| | | -__| _| | -__|__ --|__ --|
    |____ |_____|__| \___/|_____|__| |__|_____|_____|_____|
    | | | The Serverless Application Framework
    | | serverless.com, v1.55.1
    -------'
    Serverless: Successfully generated boilerplate for template: “aws-nodejs-typescript"
    $ cd example-project
    

    View Slide

29. KANAZAWA
    

    View Slide

30. KANAZAWA
    $ yarn install
    $ sls config credentials -p aws -k [AWS AccessKey] -s [AWS SecretKey]
    $ sls deploy
    

    View Slide

31. KANAZAWA
    ex) API GatewayͷΞΫηεϩάΛ༗ޮʹ͍ͨ͠
    

    View Slide

32. KANAZAWA
    

    View Slide

33. KANAZAWA
    ϩʔΧϧͰͷ࣮ߦ͸ʁ
    

    View Slide

34. KANAZAWA
    https://github.com/serverless/plugins
    

    View Slide

35. KANAZAWA
    https://github.com/dherault/serverless-offline
    serverless-offline
    

    View Slide

36. KANAZAWA
    ͜ΕͰΞϓϦέʔγϣϯͷ࣮૷ʹूதͰ͖Δ
    

    View Slide

37. KANAZAWA
    ՝୊ɿΦϯϓϨαʔό΁ͷ઀ଓʹݻఆIP͕ඞཁ
    AWS
    DC
    

    View Slide

38. KANAZAWA
    LambdaΛVPCʹೖΕͯΞϨίϨ͢Δඞཁ͕
    DC
    VPC
    Private subnet Public subnet
    

    View Slide

39. KANAZAWA
    https://github.com/smoketurner/serverless-vpc-plugin
    serverless-vpc-plugin
    

    View Slide

40. KANAZAWA
    $ yarn add -D serverless-vpc-plugin
    ϓϥάΠϯͷΠϯετʔϧ
    serverless.ymlʹઃఆ௥Ճ
    plugins:
    - serverless-webpack
    - serverless-vpc-plugin
    custom:
    vpcConfig:
    cidrBlock: '10.0.0.0/16'
    zones:
    - ap-northeast-1a
    - ap-northeast-1c
    

    View Slide

41. KANAZAWA
    ͜Ε͚ͩ
    

    View Slide

42. KANAZAWA
    Error ——————————————————————
    The CloudFormation template is invalid: Template format error: Number of resources, 201, is greater
    than maximum allowed, 200
    ՝୊ɿ͋Δ೔σϓϩΠ͕ࣦഊͨ͠
    

    View Slide

43. KANAZAWA
    1APIʹ͖ͭෳ਺ͷCloudFormationϦιʔε͕࡞ΒΕΔ
    • AWS::Lambda::Function
    • AWS::Lambda::Permission
    • AWS::Logs::LogGroup
    • AWS::ApiGateway::Resource
    • AWS::ApiGateway::Method
    APIʹΑͬͯ͸AWS::ApiGateway::Model͕ෳ਺ɺ͞Βʹڞ௨ͷϦιʔε
    ɹ὎ ࣮͸ݶք௿͍
    

    View Slide

44. KANAZAWA
    https://github.com/dougmoscrop/serverless-plugin-split-stacks
    serverless-plugin-split-stacks
    

    View Slide

45. KANAZAWA
    ՝୊ɿ΍Ήͳ͘σϓϩΠΛյ͢ඞཁ͕͋ͬͨ
    ɹɹɹEIP͕มΘΔˠΦϯϓϨͷઃఆมߋ͕ඞཁˠݏͳإΛ͞ΕΔ
    

    View Slide

46. KANAZAWA
    https://github.com/SC5/serverless-plugin-additional-stacks
    serverless-plugin-additional-stacks
    

    View Slide

47. KANAZAWA
    ՝୊ɿVPCʹೖΕͨLambda͸ىಈʢίʔϧυελʔτʣ͕஗͍
    ɹɹɹඇVPCͩͱ2ʙ3ඵ
    ɹɹɹVPCͩͱ9ʙ10ඵ
    

    View Slide

48. KANAZAWA
    https://github.com/FidelLimited/serverless-plugin-warmup
    serverless-plugin-warmup
    

    View Slide

49. KANAZAWA
    ՝୊ɿ։ൃ؀ڥ͚ͩඞཁͳϦιʔε
    

    View Slide

50. KANAZAWA
    https://github.com/anantab/serverless-plugin-ifelse
    serverless-plugin-ifelse
    

    View Slide

51. KANAZAWA
    custom:
    serverlessIfElse:
    - If: '"${self:custom.currentStage}" == “dev"'
    Exclude:
    - provider.role
    - provider.environment.ENV1
    - functions.func3
    - functions.func1.events.http.0.authorizer
    Set:
    provider.timeout: 90
    provider.profile: dev
    ElseExclude:
    - provider.environment.ENV2
    ElseSet:
    provider.timeout: 120
    https://github.com/anantab/serverless-plugin-ifelse/blob/master/README.md
    

    View Slide

52. KANAZAWA
    serverless-merge-config
    serverless-webpack
    serverless-jest-plugin
    serverless-dynamodb-local
    serverless-offline
    serverless-aws-documentation
    serverless-iam-roles-per-function
    serverless-plugin-api-gateway-auth
    serverless-plugin-stage-variables
    serverless-plugin-split-stacks
    serverless-plugin-warmup
    serverless-scriptable-plugin
    serverless-plugin-additional-stacks
    serverless-es-logs
    serverless-plugin-ifelse
    serverless-kms-secrets
    serverless-plugin-package-json
    serverless-plugin-git-variables
    ར༻தͷϓϥάΠϯ
    

    View Slide

53. KANAZAWA
    Serverlessͷ·ͱΊ
    • Serverless FrameworkͰAPI࡞੒͸ૉૣ͘Ͱ͖Δ
    • ࠔͬͨ࣌͸ϓϥάΠϯΛ୳͢
    • ࠷ऴखஈ͸CloudFormationςϯϓϨʔτ
    

    View Slide

54. AWS Amplify ͷ֦ுੑ
    

    View Slide

55. ଜ্խ඙ a.k.a @fossamgna
    

    View Slide

56. AWS Amplifyͱ͸
    

    View Slide

57. AWS Amplify ͱ͸
    “εέʔϧ͢ΔϞόΠϧΞϓϦ͓Αͼ΢Σϒ
    ΞϓϦΛ࠷଎Ͱߏங͢Δํ๏”
    KANAZAWA
    

    View Slide

58. AWS Amplify ͷߏ੒
    CLIɿAmplifyͰΞϓϦΛߏங͢ΔͨΊͷπʔϧνΣʔϯ
    Cloud ServicesɿΞϓϦͷόοΫΤϯυ
    FrameworkɿϞόΠϧɺWeb޲͚ͷ֤SDK
    Developer ToolsɿCI/CD, ϗεςΟϯάɺϞόΠϧσόΠε
    ͷςετ؀ڥ
    KANAZAWA
    

    View Slide

59. Amplify CLIͱόοΫΤϯυ
    

    View Slide

60. Amplify CLIͷجຊίϚϯυ
    $ amplify init
    $ amplify add/remove/update
    $ amplify push
    KANAZAWA
    

    View Slide

61. Amplify CLIͷΧςΰϦ
    Authentication
    (Cognito)
    Storage
    (S3, DynamoDB)
    API
    (API Gateway, AppSync)
    Function
    (Lambda)
    KANAZAWA
    Analytics
    (Pinpoint, Kinesis)
    Interactions
    (Lex)
    

    View Slide

62. Amplify ͷΧελϚΠζ
    

    View Slide

63. Amplify ͷΧελϚΠζํ๏
    •طଘΧςΰϦʔͷςϯϓϨʔτฤू
    •ΧελϜCloudFormationελοΫͷ௥Ճ
    •ϓϥάΠϯ
    KANAZAWA
    

    View Slide

64. Amplify ΧελϚΠζͷࣄྫ
    • S3ʹΞοϓϩʔυ͞ΕͨϑΝΠϧʹରͯ͠
    CloudFrontͷॺ໊෇͖URLΛൃߦ
    • S3όέοτɺLambda͸CLIͰੜ੒ͨ͠Ϧιʔ
    εΛར༻
    KANAZAWA
    

    View Slide

65. ΧελϜCloudFormationελοΫͷ௥Ճ
    1. CloudFormationςϯϓϨʔτϑΝΠϧͷ௥Ճ͢Δ
    2. amplify/backend/backend-config.jsonͷฤू͢Δ
    3. CLIʹ௥Ճͨ͠ϦιʔεΛೝࣝͤ͞Δ
    KANAZAWA
    

    View Slide

66. CloudFormationςϯϓϨʔτϑΝΠϧͷ௥Ճ
    amplify/backend///ͱͯ͠഑ஔ͢Δ
    {
    "AWSTemplateFormatVersion": "2010-09-09",
    "Description": "Private content resource stack creation using Amplify CLI",
    "Parameters": {
    "storageMediaContentBucketName": {
    "Type": "String",
    "Default": "storageMediaContentBucketName"
    },
    },
    "Resources": {
    "PrivteContentCloudFrontDistribution": {
    "Type" : "AWS::CloudFront::Distribution",
    "DependsOn" : [
    "OriginAccessIdentity"
    ],
    ….
    }
    }
    KANAZAWA
    

    View Slide

67. amplify/backend/backend-config.jsonͷฤू
    {
    "privatecontent": {
    "usercontent": {
    "service": "CloudFront",
    "providerPlugin": "awscloudformation",
    "dependsOn": [
    {
    "category": "storage",
    "resourceName": "MediaContent",
    "attributes": [
    "BucketName"
    ]
    }
    ]
    }
    },
    "storage": {
    "MediaContent": {
    "service": "S3",
    "providerPlugin": “awscloudformation"
    }
    }
    KANAZAWA
    

    View Slide

68. CLIʹ௥Ճͨ͠ϦιʔεΛೝࣝͤ͞Δ
    amplify env checkout Λ࣮ߦͯ͠௥Ճ͠
    ͨϦιʔεΛCLIʹೝࣝͤ͞Δ
    KANAZAWA
    

    View Slide

69. Amplify CLIϓϥάΠϯ
    • Amplify CLI͸ϓϥάΠϯͱͯ͠ߏ੒͞Ε͍ͯΔ
    • ϓϥάΠϯʹ͸4ͭͷλΠϓ͕͋Δ
    • category
    • provider
    • frontend
    • util
    KANAZAWA
    

    View Slide

70. Amplify CLIϓϥάΠϯͷ࡞੒
    • ϓϥάΠϯͷ਽ܗΛੜ੒͢ΔίϚϯυ͕༻ҙ͞ΕͯΔ
    • amplify plugin init
    • ϓϥάΠϯͷ໊લ΍λΠϓͳͲ͍͔ͭ͘ͷ࣭໰ʹ౴͑Δ
    ͱ਽ܗίʔυ͕ੜ੒͞ΕΔ
    KANAZAWA
    

    View Slide

71. Amplify CLIϓϥάΠϯͷߏ੒
    ࠷খߏ੒ͷྫ
    |_my-amplify-plugin/
    |_commands/
    | |_ help.js
    | |_ version.js
    |
    |_amplify-plugin.json
    |_index.js
    |_package.json
    KANAZAWA
    

    View Slide

72. ࣄྫͷAmplify CLIϓϥάΠϯ
    • CloudFrontΛߏ੒͢ΔͨΊͷϓϥάΠϯ
    • λΠϓ͸category
    • ΧελϜCloudFormationελοΫͷςϯϓ
    Ϩʔτ࡞੒ɺbackend-config.jsonͷฤू͕
    ϓϥάΠϯͷ࢓ࣄ
    KANAZAWA
    

    View Slide

73. Amplify CLIϓϥάΠϯͷ࣮૷
    • ϓϥάΠϯ࣮૷΋ؔ͢Δ৘ใ͸·ͩ·ͩগͳ͍
    • https://github.com/aws-amplify/amplify-cliͷιʔε͕࣮૷ͷࢀߟʹͳΔ
    • amplify-cli/packages/amplify-cli/src/extensions/amplify-helpers ഑Լʹ͸
    ϓϥάΠϯΛ࣮૷͢Δͷʹ༗༻ͳϝιου͕ͦΖ͍ͬͯΔ
    KANAZAWA
    

    View Slide

74. Amplify CLIͷΧελϚΠζͷ·ͱΊ
    • ΧελϜCloudFormationελοΫ
    • ྑ͍఺ɿຊདྷɺ௥Ճ͍ͨ͠ελοΫͱbackend-config.jsonͷฤूͷΈͰΧε
    λϚΠζͰ͖Δ
    • ΠϚΠνͳ఺ɿLambdaͷΑ͏ʹෳ਺ͷϦιʔεΛ௥Ճ͢ΔΑ͏ͳ৔߹͸࡞
    ۀ͕൥ࡶ
    • ϓϥάΠϯ
    • ྑ͍఺ɿෳ਺ͷϦιʔεΛ௥Ճ͢ΔΑ͏ͳ৔߹͸࡞ۀָ͕Ͱؒҧ͍Λى͜͠
    ʹ͍͘ɻ൚༻తͳΒଞϓϩδΣΫτͰ΋࢖͑ΔʢOSSʹͨ͠Γ΋Ͱ͖Δʣ
    • ΠϚΠνͳ఺ɿϓϩάϥϜΛॻ͘ඞཁ͕͋Δʢ࣮૷ίετ͕͔͔Δʣ
    KANAZAWA
    

    View Slide

75. KANAZAWA
    Ҏ্
    

    View Slide