Upgrade to Pro — share decks privately, control downloads, hide ads and more …

AWS Amplify Serverless Framework Next.js Deploy

Avatar for leebyonghun leebyonghun
November 18, 2020
Programming
1
1.4k

AWS Amplify Serverless Framework Next.js Deploy

Deploy Next.js for making serverless application by AWS Amplify and Serverless Framework

Avatar for leebyonghun

leebyonghun

November 18, 2020
Tweet

More Decks by leebyonghun

See All by leebyonghun
Amplify CI/CD
Avatar for leebyonghun leebyonghun
1
1.9k

Other Decks in Programming

See All in Programming
オープンソースソフトウェアへの解像度🔬
Avatar for うたもく utam0k
17
3.2k
登壇は dynamic! な営みである / speech is dynamic
Avatar for Daichi KUDO da1chi
0
360
bootcamp2025_バックエンド研修_WebAPIサーバ作成.pdf
Avatar for GENIEE ,Inc geniee_inc
0
140
コードとあなたと私の距離 / The Distance Between Code, You, and I
Avatar for YAMAOKA Hiroyuki hiro_y
0
200
Google Opalで使える37のライブラリ
Avatar for MIKIO KUBO mickey_kubo
3
150
NixOS + Kubernetesで構築する自宅サーバーのすべて
Avatar for ichi-h ichi_h3
0
1.2k
Domain-centric? Why Hexagonal, Onion, and Clean Architecture Are Answers to the Wrong Question
Avatar for Oliver Drotbohm olivergierke
3
980
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
300
iOSでSVG画像を扱う
Avatar for Kishikawa Katsumi kishikawakatsumi
0
170
alien-signals と自作 OSS で実現する フレームワーク非依存な ロジック共通化の探求 / Exploring Framework-Agnostic Logic Sharing with alien-signals and Custom OSS
Avatar for aose aoseyuu
2
720
CSC305 Lecture 09
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
310
CSC509 Lecture 06
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
270

Featured

See All Featured
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
272
21k
How to train your dragon (web standard)
Avatar for Monica Dinculescu notwaldorf
97
6.3k
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
180
10k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
463
33k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
173
15k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.9k
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
44
7.8k
4 Signs Your Business is Dying
Avatar for Josh Pigford shpigford
185
22k
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
369
20k
Side Projects
Avatar for Sacha Greif sachag
455
43k
The Art of Delivering Value - GDevCon NA Keynote
Avatar for David Neal reverentgeek
16
1.7k

Transcript

  1. ੗ӝࣗѐ 2020֙ 4ਘ Classmethod ੑࢎ ೠҴীࢲ Ӕޖ ઺ ઱۽ ೐ۿ౟ূ٘,

    ࢲߡܻझ ଃী ҙब

  2. ݾର - SPAীࢲ੄ SSR - SEO - Rendering - Next.js

    - Demo - ࢲߡܻझ ߓನ - AWS Amplify - Serverless Framework

  3. SPAীࢲ SSRਸ ৵?

  4. SEO

  5. Googlebot Rendering on the Web: Performance Implications of Application Architecture

    (Google I/O ’19) ୭न JSܳ ૑ਗೞৈࢲ CSRਸ ࢎਊೞח SPAب оמ

  6. Google Search Console https://search.google.com/search-console/welcome URL Inspection Toolਸ ࢎਊ೧ࢲ पઁ ੜ

    ੘زغҊ ੓ח૑ ഛੋ

  7. ఋ Ѩ࢝ূ૓੄ SEO https://searchadvisor.naver.com/guide/seo-advanced-javascript ఋ Ѩ࢝ূ૓ٜ਷ ই૒ SPAܳ ৮੹൤ ૑ਗೞҊ

    ੓૑ח ঋ਺

  8. Ҵղ Ѩ࢝ূ૓ ࠺ਯ https://gs.statcounter.com/search-engine-market-share/all/south-korea http://www.internettrend.co.kr/trendForward.tsp Ҵղীࢲ੄ ݽٚ ࢲ࠺झী ؀ೠ Ѩ࢝ূ૓

    ࠺ਯ Ҵղীࢲ੄ Ҵղ ࢲ࠺झী ؀ೠ Ѩ࢝ূ૓ ࠺ਯ

  9. Googleীࢲ੄ ֢୹݅ ೙ਃೞ׮ݶ CSRੋ SPAܳ ࢎਊ೧ب оמ ׮ܲ Ѩ࢝ূ૓ীࢲ੄ ֢୹ب

    Ҋ۰ೠ׮ݶ SSRਸ ࢎਊೞৈ SEO ೱ࢚

  10. Rendering

  11. Rendering on the Web: Performance Implications of Application Architecture (Google

    I/O ’19) ੉࢚੸ੋ ۪؊݂ SSR, CSR݅ ࢎਊೞח Ѫ੉ ইפۄ ಕ੉૑ী য਎ܻח ۪؊݂੉ ೙ਃ

  12. ۪؊݂ ߹ ର੉ https://developers.google.com/web/updates/2019/02/rendering-on-the-web

  13. ۪؊݂ ߹ ର੉ https://developers.google.com/web/updates/2019/02/rendering-on-the-web

  14. Next.js React ੗୓੸ਵ۽ب SSR੉ оמೞ૑݅ SSR, Hydration, Pre-renderingਸ ખ ؊

    औѱೞӝ ਤ೧ Next.jsܳ ࢎਊ

  15. Demo

  16. AWSীࢲ SPA੄ SSRਸ ࢲߡܻझ۽ যڌѱ?

  17. AWS Amplify৬ Serverless Framework

  18. যڃ ഋక۽ ߓನ غ঻ਸөਃ?

  19. ইఃఫ୊

  20. Next.js জ ࢤࢿ ߂ Amplify ࢤࢿ Next.js ೐۽ં౟ ࢤࢿ Next.js

    ೐۽ં౟ী Amplify ୶о npm install aws-amplify @aws-amplify/ui-react ೐۽ં౟ী was-amplify ୶о

  21. API ୶о Amplify cli۽ API ୶о झః݃ ੘ࢿ

  22. Amplifyী ݅ٚ APIܳ AWSী ಹए, ੘ࢿೠ झః݃۽ ௏٘о ੗زࢤࢿ ؽ

    src/graphql/

  23. nextjsaws: component: “@sls-next/[email protected]" ࢲߡܻझ ೐ۨ੔ਕ௼۽ ߓನ మ೒݁ ࢤࢿ serverless.yml ౵ੌ੄

    ղਊਸ ׮ ૑਍ റ ਤ ௏٘ ੘ࢿ ߓನ ઺

  24. Ѿҗ ഛੋ

  25. ੉റ Gtihub Actions ١ਸ ࢎਊೞৈ CI/CD ө૑ ࢸ੿೧فݶ ݒ਋ рಞ

  26. ଵҊ https://youtu.be/k-A2VfuUROg AWS Amplify Next.js ౚషܻ঴ https://docs.amplify.aws/start/getting-started/data-model/q/integration/next#api-with-server-side-rendering-ssr https://tinyurl.com/y43q9rjx

  27. хࢎ೤פ׮