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
OSS開発者という働き方
Avatar for ANDPAD inc andpad
5
1.7k
Azure SRE Agentで運用は楽になるのか？
Avatar for KAMEGAWA Kazushi kkamegawa
0
2.5k
私の後悔をAWS DMSで解決した話
Avatar for 平目 hiramax
4
210
Platformに“ちょうどいい”責務ってどこ？ 関心の熱さにあわせて考える、責務分担のプラクティス
Avatar for estie | エスティ estie
1
140
旅行プランAIエージェント開発の裏側
Avatar for Ippo Matsui / 令和トラベル ippo012
2
930
奥深くて厄介な「改行」と仲良くなる20分
Avatar for おぐえもん oguemon
1
570
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
420
AI Coding Agentのセキュリティリスク：PRの自己承認とメルカリの対策
Avatar for さうす s3h
0
240
請來的 AI Agent 同事們在寫程式時，怎麼用 pytest 去除各種幻想與盲點
Avatar for Keith Yang keitheis
0
130
Amazon RDS 向けに提供されている MCP Server と仕組みを調べてみた/jawsug-okayama-2025-aurora-mcp
Avatar for Takahashi Ikki takahashiikki
1
120
MCPとデザインシステムに立脚したデザインと実装の融合
Avatar for Yuku Kotani yukukotani
4
1.5k
ファインディ株式会社におけるMCP活用とサービス開発
Avatar for starfish719 starfish719
0
2.1k

Featured

See All Featured
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
5.8k
Why You Should Never Use an ORM
Avatar for John Nunemaker jnunemaker
PRO
59
9.5k
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
49
14k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
70k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
48
9.7k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
Avatar for soudai sone soudai
PRO
188
55k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
8
930
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
7
850
Writing Fast Ruby
Avatar for Erik Berlin sferik
628
62k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
55
6.5k

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. хࢎ೤פ׮