Build and Scale SaaS product by Serverless technologies. / jaws-days-2019

Slide 1

Slide 1 text

B u i l d a n d S c a l e S a a S p ro d u c t b y S e r v e r l e s s t e c h n o l o g i e s . J A W S D a y s 2 0 1 9

Slide 2

Slide 2 text

H i d e t a k a O k a m o t o • Digitalcube Co. Ltd. • JP_Stripesژ౎ɾେࡕ • Alexa Campions • AWS Samurai 2017 in Japan

Slide 3

Slide 3 text

No content

Slide 4

Slide 4 text

No content

Slide 5

Slide 5 text

No content

Slide 6

Slide 6 text

No content

Slide 7

Slide 7 text

S e r v e r l e s s S PA B a c k e n d s • Auth: Cognito User Pools • API: API Gateway & Lambda • Batch: Lambda & Step Functions • Frontend: React & AWS Amplify SDK • Web Server: Netlify

Slide 8

Slide 8 text

I n t e g r a t e w i t h F a a S • Build & Deploy: Circle CI & Netlify • Payment: Stripe • Support: Intercom • etc…

Slide 9

Slide 9 text

ͳ ͥ S e r v e r l e s s / F a a S ͳ ͷ ͔ • ʮڊਓͷݞʹ৐Δʯ͜ͱͰΑΓԕ͘΁͍͚Δ • ݸਓ৘ใ؅ཧ΍ϥϯλΠϜͷ؅ཧͳͲͷ੹೚Λ෼ࢄ͢Δ • ʮ࢖ͬͨ෼͚ͩ՝ۚʯͳͷͰɺૉૣ͘ࢼͯ͠ૉૣ͘΍ΊΕΔ • ૄ݁߹ނʹඞཁͳͱ͖ʹඞཁͳ஌ࣝΛ࢓ೖΕΕ͹ྑ͍

Slide 10

Slide 10 text

· ͱ Ί A g e n d a • ૄ݁߹Ͱૉૣ͘τϥΠˍΤϥʔ • ߏ੒͸ඞͣίʔυͰ؅ཧ • “ա͗ͨΔ͸ͳ͓ٴ͹͟Δ͕͝ͱ͠” • ʮͳͥͦΕΛ͢Δͷ͔ʯΛେࣄʹ

Slide 11

Slide 11 text

A g e n d a • ૄ݁߹Ͱૉૣ͘τϥΠˍΤϥʔ • ߏ੒͸ඞͣίʔυͰ؅ཧ • “ա͗ͨΔ͸ͳ͓ٴ͹͟Δ͕͝ͱ͠” • ʮͳͥͦΕΛ͢Δͷ͔ʯΛେࣄʹ

Slide 12

Slide 12 text

A P I ɾ ϑ ϩ ϯ τ Τ ϯ υ Λ ૉ ૣ ͘ τ ϥ Π ˍ Τ ϥ ʔ • Serverless FrameworkͷStageͰdev / prodͷελοΫ෼ׂ • Gitϒϥϯν / Serverlessͷεςʔδ෼ׂͰϩʔϧόοΫΛ༰қʹ • ೔ถའମ੍Ͱ24࣌ؒ୭͔͕ϦϦʔεɾϩʔϧόοΫՄೳʹ • ޙํޓ׵ΛΩʔϓɾഁյతมߋ͸ύεมߋʴ৻ॏͳςετ

Slide 13

Slide 13 text

ૉ ૣ ͘ τ ϥ Π ˍ Τ ϥ ʔ ͢ Δ ͨ Ί ʹ • API Backend͸ϢχοτςετɾΠϯςάϨʔγϣϯςετ • Frontend͸Ϣχοτςετɾ੩తܕݕূ • ͲͪΒ΋CircleCIͰςετΛPass͠ͳ͍ͱϦϦʔεͰ͖ͳ͍ • ͦ΋ͦ΋खಈͰͷϏϧυɾσϓϩΠ͸ݪଇNG • ʮࠓ͋Δ࣮૷Λյ͍ͯ͠ͳ͍ʯอূΛ͢ΔͨΊʹ΋ɺςετ͸ॻ͘

Slide 14

Slide 14 text

ϑ ϩ ϯ τ Τ ϯ υ ͷ ໾ ׂ ෼ ׂ • ϑϩϯτΤϯυ͸React + Redux • ViewʢHTML / CSSʣ͸Reactʹू໿ • APIͱͷ΍ΓऔΓͳͲɺσʔλͷॲཧܥ͸Reduxʹू໿ • ReduxͷStore͕SPAͷ؆қDBతཱͪҐஔʹ

Slide 15

Slide 15 text

ϑ ϩ ϯ τ Τ ϯ υ ͷ ໾ ׂ ෼ ׂ ɿ ͳ ͥ ෼ ׂ ͢ Δ ͷ ͔ • UX / σβΠϯνʔϜ͸ॲཧΛҙࣝ͢Δ͜ͱͳ͘ViewΛߋ৽ • ࣮૷νʔϜ͸ViewͷมߋΛҙࣝ͢Δ͜ͱͳ͘API·ΘΓΛߋ৽ • ʮStoreʹ͋Δ஋ʯΛյ͞Ͷ͚Ε͹ɺ͓ޓ͍ࣗ༝ʹߋ৽Մೳ • σβΠϯϦχϡʔΞϧͱػೳ௥ՃΛฒྻͰ࣮ࢪ • ʮStoreʹೖΕΔલ͔ޙ͔ʯͰ໰୊ͷ੾Γ෼͚΋Մೳ

Slide 16

Slide 16 text

A g e n d a • ૄ݁߹Ͱૉૣ͘τϥΠˍΤϥʔ • ߏ੒͸ඞͣίʔυͰ؅ཧ • “ա͗ͨΔ͸ͳ͓ٴ͹͟Δ͕͝ͱ͠” • ʮͳͥͦΕΛ͢Δͷ͔ʯΛେࣄʹ

Slide 17

Slide 17 text

ߏ ੒ ͸ ඞ ͣ ί ʔ υ Ͱ ؅ ཧ • ͢΂ͯͷϦιʔε͸ɺίʔυͰ؅ཧ • ख૊͸ݕূϑΣʔζ͔ᴈ໌ظͷҨ࢈͕΄ͱΜͲ • ୭͔͕ϛεͨ͠ͱ͖ʹɺ૊Μͩਓ͔͠໭ͤͳ͍ͷ͸NG • ख૊ -> AWS CLIͰJSONग़ྗ -> CFNʹஔ͖׵͑ OR terraform import • Serverless Framework / SAM / terraform / CDKΛ૊Έ߹Θͤͯར༻

Slide 18

Slide 18 text

؅ ཧ π ʔ ϧ ͸ Կ Λ ࢖ ͏ ΂ ͖ ͔ ʁ • ޷͖ͳ΋ͷΛ࢖͏ͷ͕Ұ൪ • SaaS͸௕ظతͳϝϯς͕ඞཁ • ͦͷ؅ཧπʔϧΛ࢖͍ଓ͚͍ͨͱࢥ͑Δ͜ͱ͕େࣄ • ɾɾɾͱ͍͏ͷ͸͖Ε͍͝ͱͱͯ͠

Slide 19

Slide 19 text

Զ త ֤ छ π ʔ ϧ ͷ ࢖ ͍ ॴ • खૣ͘API΍όονॲཧΛ࡞Γ͍ͨɿServerless Framework • ެ։API΍ෳ਺ͷϦιʔεͱ࿈ܞ͍ͨ͠ɿSAM • खͰௐ੔͢Δ͜ͱ͕͋Δ͔Βɺࠩ෼र͍͍ͨɿterraform • ະ஌ͷϦιʔεʹ௅ઓ͢ΔͷͰΨΠυ͕ཉ͍͠ɿAWS CDK

Slide 20

Slide 20 text

Slide 21

Slide 21 text

ख ૣ ͘ A P I Λ ࡞ Γ ͨ ͍ ͱ ͖ ʹ ͸ S e r v e r l e s s F r a m e w o r k • Shifter / AMIMOTOͷAPI͸Serverless Framework • LambdaɾAPI GatewayɾIAMϙϦγʔͷઃఆ͕༰қ • ϓϥάΠϯ͕๛෋ͳͷͰɺTypeScript / Route53ͳͲͷૢ࡞ָ͕ • ࣮ଶ͸CloudFormationɺͨͩ͠Codeࡾܑఋ࢖͏ͳΒSAM͕༏Ґ

Slide 22

Slide 22 text

S e r v e r l e s s F r a m e w o r k ͜ Ε΍ ͬ ͱ ͘ ͱ ศ ར Ϧε τ • provider.deploymentBucketΛࢦఆͯ͠σϓϩΠόέοτΛ౷Ұ • provider.logRetentionInDays:Ͱprod / devͷϩάอ࣋ظؒΛมߋ • tokenͳͲͷηΩϡϦςΟ৘ใ͸SSMͷparameter store • serverless-prune-pluginΛೖΕΔͱݹ͍όʔδϣϯͷLambdaΛফͤΔ • serverless-ofﬂine-plugin͕API։ൃʹศར https://qiita.com/motchi0214/items/31d32d1f27fa643248fc

Slide 23

Slide 23 text

e v e n t . re s o u rc e Λ S t r a t e g y p a t t e r n Ͱ

Slide 24

Slide 24 text

Ұ ෦ Λ Ty p e S c r i p t ʹ ੾ Γ ସ ͑ த

Slide 25

Slide 25 text

Slide 26

Slide 26 text

ެ ։ A P I ΍ AW S ͷ Ϧ ι ʔε ࿈ ܞ ͕ ଟ ͍ ৔ ߹ ʹ S A M • ެ։APIͷυΩϡϝϯτΛSwaggerͰ؅ཧ • ͨͩ͠Serverless FrameworkͰ͸ͦͷ··ΠϯϙʔτͰ͖ͳ͍ • SwaggerͰυΩϡϝϯτͭ͘ΔͳΒSAM • CloudFormationͳͷͰɺෳࡶͳߏ੒؅ཧ͸SAMͷ΄͏͕༏Ґͦ͏

Slide 27

Slide 27 text

Slide 28

Slide 28 text

t e r r a f o r m i m p o r t ͸ Ғ େ • DynamoDBɾCognitoͳͲɺखͰௐ੔͢Δέʔε͕كʹΑ͋͘Δ • devͰ͏·͍ͬͨ͘ઃఆΛͦͷ··importͰίʔυԽͰ͖Δ • ίʔυ؅ཧ͍͕ͨ͠ɺݫີ͞͸͞΄ͲॏཁͰͳ͍৔߹ʹΑ͍ • CFN΋υϦϑτݕ஌ͳͲ͸͋Δ͕ɺࠓͷॴະ࢖༻

Slide 29

Slide 29 text

Slide 30

Slide 30 text

AW S C D K ͸ ͡ Ί · ͠ ͨ • AppSyncܥͷϦιʔε؅ཧʹ౤ೖ • TypeScriptͳͷͰɺIDEͰώϯτ͕ͰΔͷ͕࠾༻ཧ༝ • ύϥϝʔλʹϛε͕͋ΔͱɺCFNͷσϓϩΠલʹϏϧυͰίέΔ • ʮԶͷCFNΛյ͢΍ͭ͸ઈରʹڐ͞ͳ͍ʯਓʹ΋͓͢͢Ί • cdk synthίϚϯυͰCFNग़ྗՄೳͳͷͰɺఫୀՄೳ

Slide 31

Slide 31 text

No content

Slide 32

Slide 32 text

No content

Slide 33

Slide 33 text

No content

Slide 34

Slide 34 text

A g e n d a • ૄ݁߹Ͱૉૣ͘τϥΠˍΤϥʔ • ߏ੒͸ඞͣίʔυͰ؅ཧ • “ա͗ͨΔ͸ͳ͓ٴ͹͟Δ͕͝ͱ͠” • ʮͳͥͦΕΛ͢Δͷ͔ʯΛେࣄʹ

Slide 35

Slide 35 text

ͦ ͷ π ʔ ϧ ͱ ೥ ୯ Ґ Ͱ ෇ ͖ ߹ ͑ · ͢ ͔ ʁ • SAM / Serverless ͳͲ͸ศརͳϓϥάΠϯ͕ଟ਺͋Δ • ͨͩ͠Α͘ݟΔͱ೥୯ҐͰߋ৽͞Εͯͳ͍΋ͷ΋͋Δ • ίΞ͕ഁյతมߋΛೖΕͨͱ͖ʹɺΞϓσͰ͖ͳ͘ͳΔՄೳੑ • ʮForkͯ͠Ҿ͖ܧ͙ʯ͔ʮ୅ସҊΛ୳͢ʯ͔ʮͦ΋ͦ΋࢖Θͳ͍ʯ • Φʔφʔ͕์ஔ͍ͯ͠ͳ͚Ε͹ɺϓϧϦΫͰ௚ͯ͠͠·͏ख΋͋Δ

Slide 36

Slide 36 text

A g e n d a • ૄ݁߹Ͱૉૣ͘τϥΠˍΤϥʔ • ߏ੒͸ඞͣίʔυͰ؅ཧ • “ա͗ͨΔ͸ͳ͓ٴ͹͟Δ͕͝ͱ͠” • ʮͳͥͦΕΛ͢Δͷ͔ʯΛେࣄʹ

Slide 37

Slide 37 text

ͳ ͥ ͦ ΕΛ ࢖ ͏ ͷ ͔ • SaaS͸࡞ͬͯऴΘΓͰ͸ͳ͘ɺϦϦʔε͔ͯ͠Β͕ຊ൪ • πʔϧΛ࢖͑͹ૉૣ͘࡞ΕΔ͕ɺͦΕΛ࢖͍ଓ͚ΒΕΔ͔͸ෆ໌ • νʔϜͰͷϝϯςͳͷͰɺͦͷπʔϧΛ࢖͏ཧ༝Λอͭඞཁ͕͋Δ • terraform / CloudFormation͸͓֮͑ͯ͜͏ʢಀ͛ઌʹͳΔʣ

Slide 38

Slide 38 text

Ξ ΢ τϓ ο τ ͷ ॏ ཁ ੑ • ൒೥લʹ΍ͬͨ͜ͱ͸ɺ֮͑ͯͳ͍ • ΍ͬͨ͜ͱ͸ඞͣΞ΢τϓοτ͢Δ • Ξ΢τϓοτ͢Δ͜ͱͰɺ࣮͸צҧ͍ͩͬͨͱ͖ʹࢦఠ͞Εͯ௚ͤΔ • Ξ΢τϓοτ͸ϒϩά͚ͩͰͳ͘ɺϥΠϒϥϦͷެ։ͱ͍͏ํ๏΋

Slide 39

Slide 39 text

͜ ͷ ̍ ೥ Ͱ ࡞ ͬ ͨ ϥ Π ϒ ϥ Ϧ • cran-push: Netlify޲͚Server PushͷઃఆϑΝΠϧੜ੒πʔϧ • aws-api-responsebuilder: LambdaͷϨεϙϯεϏϧμʔ • class-resolver: APIͷύεผॲཧ෼ذʹར༻͢Δπʔϧ • stripe-utils: Stripeͷdecline codeม׵ͳͲΛू໿ • etc…

Slide 40

Slide 40 text

A l e x a D a y 2 0 1 9 : 4 / 6 K o b e https://alexaday2019.aajug.jp/