AWS Amplify Serverless Framework Next.js Deploy

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

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/serverless-component@1.18.0" ࢲߡܻझ ೐ۨ੔ਕ௼۽ ߓನ మ೒݁ ࢤࢿ 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. хࢎ೤פ׮