Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
©2018 Wantedly, Inc. Deploy Web-frontend app with BuildKit our experimental deploy flow for web-frontend Docker Meetup Tokyo #26 21.Nov.2018 - @izumin5210
Slide 2
Slide 2 text
©2018 Wantedly, Inc. izumin5210 Engineer at Wantedly, Inc. ‣ Wantedly People - Backend - Golang, Ruby, etc. - Web Frontend - Advisor, Reviewer, Frontend Ops, etc. ‣ Lead Gopher ʢ˞ࣗশʣ ‣ Wrote github.com/izumin5210/grapi
Slide 3
Slide 3 text
©2018 Wantedly, Inc. ˞8FCϑϩϯτΤϯυͷ ා͍΄ͱΜͲ ͠·ͤΜ
Slide 4
Slide 4 text
©2018 Wantedly, Inc. Deploy flow Typical one in Wantedly
Slide 5
Slide 5 text
©2018 Wantedly, Inc. Deploy flow Typical one in Wantedly 0QFOQVMMSFR
Slide 6
Slide 6 text
©2018 Wantedly, Inc. Deploy flow Typical one in Wantedly .BOBHFE$*TFSWJDFT 0QFOQVMMSFR )PPL 5FTUT EPDLFSCVJME EPDLFSQVTI
Slide 7
Slide 7 text
©2018 Wantedly, Inc. Deploy flow Typical one in Wantedly .BOBHFE$*TFSWJDFT 0QFOQVMMSFR )PPL 5FTUT EPDLFSCVJME EPDLFSQVTI LVCFDUMTFUJNBHF
Slide 8
Slide 8 text
©2018 Wantedly, Inc. Deploy flow Typical one in Wantedly .BOBHFE$*TFSWJDFT 0QFOQVMMSFR )PPL 5FTUT EPDLFSCVJME EPDLFSQVTI LVCFDUMTFUJNBHF env: # encrypted credentials here - secure: "..." install: # install `kube` - bash <(curl -sL https://...) script: - kube build deploy: - skip_cleanup: true provider: script script: kube prod deploy $TRAVIS_COMMIT on: branch: master
Slide 9
Slide 9 text
©2018 Wantedly, Inc. Deploy flow Typical one in Wantedly .BOBHFE$*TFSWJDFT 0QFOQVMMSFR )PPL 5FTUT EPDLFSCVJME EPDLFSQVTI LVCFDUMTFUJNBHF env: # encrypted credentials here - secure: "..." install: # install `kube` - bash <(curl -sL https://...) script: - kube build deploy: - skip_cleanup: true provider: script script: kube prod deploy $TRAVIS_COMMIT on: branch: master LVCFJOIPVTFCVJMEEFQMPZUPPM
Slide 10
Slide 10 text
©2018 Wantedly, Inc. Deploy flow From laptops .BOBHFE$*TFSWJDFT
Slide 11
Slide 11 text
©2018 Wantedly, Inc. Deploy flow From laptops .BOBHFE$*TFSWJDFT kubectl set image
Slide 12
Slide 12 text
©2018 Wantedly, Inc. Deploy flow From laptops .BOBHFE$*TFSWJDFT kubectl set image - kube deploy qa - kube prod rollback
Slide 13
Slide 13 text
©2018 Wantedly, Inc. Deploy flow From laptops .BOBHFE$*TFSWJDFT kubectl set image - kube deploy qa - kube prod rollback Prod cluster QA cluster ... ...
Slide 14
Slide 14 text
©2018 Wantedly, Inc. Deploy flow All services on k8s in Wantedly .BOBHFE$*TFSWJDFT 0QFOQVMMSFR )PPL 5FTUT EPDLFSCVJME EPDLFSQVTI LVCFDUMTFUJNBHF All services on k8s ‣ 70 various sizes of microsevices ‣ Engineers operate services through `kube` command - deploy, rollback, tail logs, ... ‣ We have a cluster for each environment - Production, QA, ...
Slide 15
Slide 15 text
©2018 Wantedly, Inc. Deploy flow All services on k8s in Wantedly .BOBHFE$*TFSWJDFT 0QFOQVMMSFR )PPL 5FTUT EPDLFSCVJME EPDLFSQVTI LVCFDUMTFUJNBHF All services on k8s ‣ 70 various sizes of microsevices ‣ Engineers operate services through `kube` command - deploy, rollback, tail logs, ... ‣ We have a cluster for each environment - Production, QA, ... Prod cluster QA cluster ... ...
Slide 16
Slide 16 text
©2018 Wantedly, Inc. Architecture /PEFKTXFCTFSWFS IUUQTQFPQMFXBOUFEMZDPN
Slide 17
Slide 17 text
©2018 Wantedly, Inc. Architecture /PEFKTXFCTFSWFS IUUQTQFPQMFXBOUFEMZDPN 3FRVFTU
Slide 18
Slide 18 text
©2018 Wantedly, Inc. Architecture /PEFKTXFCTFSWFS IUUQTQFPQMFXBOUFEMZDPN 3FRVFTU JOEFYIUNM
Slide 19
Slide 19 text
©2018 Wantedly, Inc. Architecture /PEFKTXFCTFSWFS IUUQTQFPQMFXBOUFEMZDPN 3FRVFTU JOEFYIUNM 3FRVFTUBTTFUT
Slide 20
Slide 20 text
©2018 Wantedly, Inc. Architecture /PEFKTXFCTFSWFS IUUQTQFPQMFXBOUFEMZDPN 3FRVFTU JOEFYIUNM 3FRVFTUBTTFUT
Slide 21
Slide 21 text
©2018 Wantedly, Inc. Architecture /PEFKTXFCTFSWFS IUUQTQFPQMFXBOUFEMZDPN 3FRVFTU JOEFYIUNM 3FRVFTUBTTFUT
Slide 22
Slide 22 text
©2018 Wantedly, Inc. Architecture /PEFKTXFCTFSWFS IUUQTQFPQMFXBOUFEMZDPN 3FRVFTU JOEFYIUNM 3FRVFTUBTTFUT
Slide 23
Slide 23 text
©2018 Wantedly, Inc. Architecture /PEFKTXFCTFSWFS IUUQTQFPQMFXBOUFEMZDPN 3FRVFTU JOEFYIUNM "TTFUT KT DTT KQH FUD &BDIGJMFOBNFIBTIBTI FHmain.bb4195e0.js 3FRVFTUBTTFUT ,4 /PEFKTTFSWFS EJTUSJCVUFTPOMZJOEFYIUNM
Slide 24
Slide 24 text
©2018 Wantedly, Inc. Architecture /PEFKTXFCTFSWFS IUUQTQFPQMFXBOUFEMZDPN 3FRVFTU JOEFYIUNM "TTFUT KT DTT KQH FUD &BDIGJMFOBNFIBTIBTI FHmain.bb4195e0.js 3FRVFTUBTTFUT ,4 /PEFKTTFSWFS EJTUSJCVUFTPOMZJOEFYIUNM Too much? ‣ ੩తϑΝΠϧͷ৴͚ͩͳΒ4$MPVEGSPOU͚ͩͰྑ͍ʁ ‣ ͋ͱͰϦονͳ͜ͱΛͨ͘͠ͳΔ͔ʁ FH4FSWFS4JEF3FOEFSJOH ‣ ͲΜͳߏͰɼσϓϩΠϑϩʔͷҰ؏ੑॏཁ ϓϩμΫτ։ൃͯ͠Δଆ͕༨ܭͳ͜ͱΛ Βͳ͍͍ͯ͘Πϯϑϥ ݸਓతͳҙݟͰ͢
Slide 25
Slide 25 text
©2018 Wantedly, Inc. ڥมͷಡΈग़͠ ‣ #BDLFOE ΞϓϦέʔγϣϯىಈ࣌ʹಡΈࠐ·ΕΔ %JGGFSFODFTCX#BDLFOE8FC'SPOUFOE
Slide 26
Slide 26 text
©2018 Wantedly, Inc. ڥมͷಡΈग़͠ ‣ #BDLFOE ΞϓϦέʔγϣϯىಈ࣌ʹಡΈࠐ·ΕΔ ‣ 8FC'SPOUFOE Ϗϧυ࣌ʹಡΈࠐ·ΕΔ ΞϓϦέʔγϣϯίʔυϢʔβ͔Βݟ͑Δ %JGGFSFODFTCX#BDLFOE8FC'SPOUFOE
Slide 27
Slide 27 text
©2018 Wantedly, Inc. ڥมͷಡΈग़͠ ‣ #BDLFOE ΞϓϦέʔγϣϯىಈ࣌ʹಡΈࠐ·ΕΔ ‣ 8FC'SPOUFOE Ϗϧυ࣌ʹಡΈࠐ·ΕΔ ΞϓϦέʔγϣϯίʔυϢʔβ͔Βݟ͑Δ %JGGFSFODFTCX#BDLFOE8FC'SPOUFOE ڥ͝ͱʹϏϧυΛ͚͍ͨ ‣ FHຊ൪༻KTʹ2"ͷ63-ೖΕͨ͘ͳ͍ ‣ ҰํͰɼϏϧυͷϙʔλϏϦςΟҡ͍࣋ͨ͠ ʢखݩͰALVCFCVJMEAͰຊ൪Πϝʔδ͕࡞ΕΔੈքʣ
Slide 28
Slide 28 text
No content
Slide 29
Slide 29 text
No content
Slide 30
Slide 30 text
©2018 Wantedly, Inc. TFD PG&OWT ੜޙϲ݄ͷϓϩδΣΫτ .BD#PPL1SP্ͰίϨͳͷͰɼ$*্ͩͱʜ
Slide 31
Slide 31 text
©2018 Wantedly, Inc. ฒྻʹϏϧυ͍ͨ͠ʜ ͦΕͧΕͷϏϧυґଘؔʹͳ͍ͣͳͷͰɼฒྻԽ͢Δͱ͘ͳΔ͔
Slide 32
Slide 32 text
©2018 Wantedly, Inc. #VJME,JU ͜͜·ͰͷൃදͰ͞ΕͯΔͣͳͷͰɼৄࡉׂѪ
Slide 33
Slide 33 text
©2018 Wantedly, Inc. Base Prod QA Server Setup stage Build stage(s) Server stage Install dependencies Build frontend app for each env Gather built apps from prev stages Build web server
Slide 34
Slide 34 text
# Build base #----------------------------------------------- FROM node:10.12.0-alpine as base RUN mkdir /app WORKDIR /app COPY ./package.json /app COPY ./yarn.lock /app RUN yarn COPY ./src /app/src COPY ./public /app/public COPY ./tsconfig*.json /app/ COPY ./tslint.json /app/ RUN rm ./.env* ‣ Setup stage ‣ ґଘؔͷΠϯετʔϧ͜͜Ͱͬͯɼ ޙΖͷεςʔδʹҾ͖ܧ͙
Slide 35
Slide 35 text
# Build for qa #----------------------------------------------- FROM node:10.12.0-alpine as qa ENV NODE_ENV qa COPY --from=base /app /app COPY ./.env.qa /app/.env WORKDIR /app RUN yarn build # Build for production #----------------------------------------------- FROM node:10.12.0-alpine as prod ENV NODE_ENV production COPY --from=base /app /app COPY ./.env.production /app/.env ‣ Build stage ‣ લεςʔδͰΠϯετʔϧͨͨ͠͠ґଘ ʢOPEF@NPEVMFTʣΛίϐʔͯ͘͠Δ ‣ ͕͜͜ίϐϖʹͳΓ͕ͪͳͷ͕ͭΒ͍ʜ
Slide 36
Slide 36 text
# Build for Node.js server #----------------------------------------------- FROM node:10.12.0-alpine as node # Timezone ENV TIMEZONE Asia/Tokyo RUN apk add --no-cache --update tzdata \ && ln -sf /usr/share/zoneinfo/$TIMEZONE /etc/localtime # Tini - to handle stop signal RUN apk add --no-cache --update tini # yarn RUN apk add --no-cache --update yarn WORKDIR /app COPY ./server/package.json /app/ COPY ./server/yarn.lock /app/ ‣ Final stage ‣ σϓϩΠ͞ΕΔΠϝʔδ ‣ αʔόΞϓϦέʔγϣϯΛಈ͔ͨ͢Ίͷ ґଘͷΠϯετʔϧ͕ඞཁ
Slide 37
Slide 37 text
RUN apk add --no-cache --update tini # yarn RUN apk add --no-cache --update yarn WORKDIR /app COPY ./server/package.json /app/ COPY ./server/yarn.lock /app/ RUN yarn --production COPY ./server /app/server COPY --from=qa /app/build/* /app/dist/qa/ COPY --from=prod /app/build/* /app/dist/production/ WORKDIR /app/server ENTRYPOINT ["/sbin/tini", "--"] CMD ["yarn", "start"] ‣ Final stage ‣ ϏϧυՌΛલεςʔδ͔Βίϐʔ ‣ ͋ͱී௨ͷʢʁʣ8FCαʔό
Slide 38
Slide 38 text
©2018 Wantedly, Inc. 1.4x faster
Slide 39
Slide 39 text
©2018 Wantedly, Inc. 1.4x faster ʢࢥͬͨΑΓߴʹͳΒͳ͔ͬͨʣ
Slide 40
Slide 40 text
©2018 Wantedly, Inc. 0.28x... slower
Slide 41
Slide 41 text
©2018 Wantedly, Inc. ‣ ૣ͘ͳͬͨͷAZBSOAʢґଘؔͷΠϯετʔϧʣ͕ฒྻԽͰ͖ͨͷ͕େ͖͍ʁ XFCGSPOUFOEͷAZBSOAͱOPEFKTTFSWFSͷAZBSOA͕ฒྻʹग़དྷͨ ϏϧυࣗମTྻ͕Tͷฒྻʹͳ͚ͬͨͩͳͷͰɼӨڹͳͦ͞͏ Discussion ܭଌͤͣਪଌͰݴͬͯΔͷͰɼશવӕ͔͠Εͳ͍
Slide 42
Slide 42 text
©2018 Wantedly, Inc. ‣ ૣ͘ͳͬͨͷAZBSOAʢґଘؔͷΠϯετʔϧʣ͕ฒྻԽͰ͖ͨͷ͕େ͖͍ʁ XFCGSPOUFOEͷAZBSOAͱOPEFKTTFSWFSͷAZBSOA͕ฒྻʹग़དྷͨ ϏϧυࣗମTྻ͕Tͷฒྻʹͳ͚ͬͨͩͳͷͰɼӨڹͳͦ͞͏ ‣ AXFCQBDLA*0ΑΓ$16PSNFNPSZCPVOEͳͣ Ϛγϯύϫʔ͕Γͳ͍ͷ͔ʁ Discussion ܭଌͤͣਪଌͰݴͬͯΔͷͰɼશવӕ͔͠Εͳ͍
Slide 43
Slide 43 text
©2018 Wantedly, Inc. ‣ ૣ͘ͳͬͨͷAZBSOAʢґଘؔͷΠϯετʔϧʣ͕ฒྻԽͰ͖ͨͷ͕େ͖͍ʁ XFCGSPOUFOEͷAZBSOAͱOPEFKTTFSWFSͷAZBSOA͕ฒྻʹग़དྷͨ ϏϧυࣗମTྻ͕Tͷฒྻʹͳ͚ͬͨͩͳͷͰɼӨڹͳͦ͞͏ ‣ AXFCQBDLA*0ΑΓ$16PSNFNPSZCPVOEͳͣ Ϛγϯύϫʔ͕Γͳ͍ͷ͔ʁ ‣ MBZFSDBDIJOH͕ޮ͔ͳ͍$*ͩͬͨ ͔ͤͬ͘Ωϟογϡޮ্͕͕ͬͨͷΛ׆͔͖͠Ε͍ͯͳ͍ Discussion ܭଌͤͣਪଌͰݴͬͯΔͷͰɼશવӕ͔͠Εͳ͍
Slide 44
Slide 44 text
©2018 Wantedly, Inc. ‣ ૣ͘ͳͬͨͷAZBSOAʢґଘؔͷΠϯετʔϧʣ͕ฒྻԽͰ͖ͨͷ͕େ͖͍ʁ XFCGSPOUFOEͷAZBSOAͱOPEFKTTFSWFSͷAZBSOA͕ฒྻʹग़དྷͨ ϏϧυࣗମTྻ͕Tͷฒྻʹͳ͚ͬͨͩͳͷͰɼӨڹͳͦ͞͏ ‣ AXFCQBDLA*0ΑΓ$16PSNFNPSZCPVOEͳͣ Ϛγϯύϫʔ͕Γͳ͍ͷ͔ʁ ‣ MBZFSDBDIJOH͕ޮ͔ͳ͍$*ͩͬͨ ͔ͤͬ͘Ωϟογϡޮ্͕͕ͬͨͷΛ׆͔͖͠Ε͍ͯͳ͍ ʮϚγϯύϫʔΛࢦఆͰ͖ΔʯʮMBZFSDBDIJOH͕༗ޮʯͳ$*ͩͱߋʹΑ͘ͳΔ͔ʢFH$JSDMF$*ʣ Discussion ܭଌͤͣਪଌͰݴͬͯΔͷͰɼશવӕ͔͠Εͳ͍