๋งํ, ๋ฑ ํฌ์๋ฌ๋ ๊ฑฐ์ณ ํ์ฌ๋ ๋น๊ทผ์์ ํ๋ก ํธ์๋ ์์ง๋์ด๋ก ์ผํ๊ณ ์์ต๋๋ค.
"๋ ๋ค๊ฐ ํ์ํด", "๋์ ์กด์ฌ๊ฐ ๋์๊ฒ ํ์ด ๋ผ"๋ผ๋ ๋ง์ ์ข์ํฉ๋๋ค. ์ด์์ ํ์๋ฅผ ์ฑ์์ฃผ๊ณ ํ์ด ๋์ด ์ฃผ๋ ๊ฒ, ๊ทธ๊ฒ ์ฌ๋์ด๋ผ๊ณ ๋ฏฟ์ต๋๋ค. ์ข์ ๊ฐ์๋ก ์ฌ๋ฌ๋ถ์ ํ์๋ฅผ ์ฑ์ฐ๊ณ ํ์ด ๋์ด๋๋ฆด ์ ์๋๋ก ๋ ธ๋ ฅํ๊ฒ ์ต๋๋ค.
Courses
Reviews
ํฌ๊ทผํฌ๊ทผํ ๊ฑฐ๋ถ์ด
ยท
Getting Started with Next.js - A Quick Look at the Official DocumentationGetting Started with Next.js - A Quick Look at the Official Documentation- Next.js in your hands - Creating a blog
- Next.js in your hands - Creating a blog
- Next.js in your hands - Creating a blog
- Getting Familiar with Next.js - Migrating
Posts
Q&A
PPR ์ ์ฉ ํ ์ฌ์ ํ SSG๋ก ๋ฐฐํฌ๋๋ ์ด์
๋ค์ฐ๋, ์๋ ํ์ธ์. ๋ฉ์ผ ๋ณด๋ด์ฃผ์ ์ ๋ต๋ณ ๋๋ฆด ์ ์๊ฒ ๋์ด์! ๊ฐ์ฌํฉ๋๋ค. next.config.js ํ์ผ์ ์์ ํด์ฃผ์ ์ผ ํ ๊ฒ ๊ฐ์์. ๋ค์๊ณผ ๊ฐ์ด ์์ ํด๋ณด์๋ฉด PartialPrerendering์ด ์ ์ ๋์ํ๋ ๊ฒ์ ํ์ธํ์ค ์ ์์ด์.const createMDX = require("@next/mdx"); // module.default = { // experimental: { // ppr: true, // }, // }; const withMDX = createMDX({ extension: /\.mdx?$/, }); module.exports = withMDX({ pageExtensions: ["js", "jsx", "ts", "tsx", "md", "mdx"], experimental: { // ์ฌ๊ธฐ๋ก ์ค์ ์ ์ฎ๊ฒผ์ด์! ppr: true, }, }); ์๋ง๋ MDX ์ค์ ์ ์ถ๊ฐํ์๋ ๊ณผ์ ์์ ํ์ผ์ด ๋ณ๊ฒฝ๋๋ฉด์ ์ค์ ์ถฉ๋์ด ๋ ๊ฒ ๊ฐ์์. ์ ์ฉ ํด๋ณด์๊ณ ๋ ๋ฌธ์ ๊ฐ ์์ผ๋ฉด ๋ค์ ์ง๋ฌธ ๋จ๊ฒจ์ฃผ์ธ์! ๋ฉ์ผ ๋ณด๋ด์ฃผ์ ์ ๊ฐ์ฌํฉ๋๋ค. ๊ถ๊ธํ ์ ์ด ์๋ค๋ฉด ์ธ์ ๋ ๋ ์ง๋ฌธ ์ฃผ์ธ์!
- 0
- 3
- 90
Q&A
PPR ์ ์ฉ ํ ์ฌ์ ํ SSG๋ก ๋ฐฐํฌ๋๋ ์ด์
Dayeon๋! ๋ต๋ณ์ด ๋ฆ์ด์ ์ ๋ง ์ฃ์กํด์. ๋จ๊ฒจ์ฃผ์ ์ํฉ์ ๋ณด๋ ์ ๋ ์ ๊ทธ๋ฐ์ง ์๊ธฐ ์ด๋ ต๋ค์! ์บก์ณํด์ฃผ์ ๋ถ๋ถ์ ๋ชจ๋ ์ํด์ฃผ์ ๊ฒ์ผ๋ก ๋ณด์ฌ์. ํน์ ๊ฐ๋ฅํ๋ค๋ฉด ์์ ์ค์ด์ ์ฝ๋ ์ ์ฅ์ ๋งํฌ๋ฅผ ๊ณต์ ํด์ฃผ์ค ์ ์์๊น์? ์ฌ๊ธฐ์ ๋งํฌ ์ฌ๋ฆฌ์๊ธฐ ์ด๋ ต๋ค๋ฉด ์ ๊ณ์ (imjoeunha@gmail.com, https://github.com/hajoeun)์ ๊ณต์ ํด์ฃผ์๋ฉด ๋ ๊ฑฐ ๊ฐ์์. ๊ณต์ ํด์ฃผ์๋ฉด ์ ๋ ํ ์คํธ ํด๋ณด๊ณ ๋ฐ๋ก ๋ต๋ณ ๋๋ฆด๊ฒ์!์ง๋ฌธ ๋จ๊ฒจ์ฃผ์ ์ ์ ๋ง ๊ฐ์ฌํด์!
- 0
- 3
- 90
Q&A
์๋ ํ์ธ์! ์๋น์ค ๋ฐฐํฌ๋ฅผ ํ๋๋ฐ ์๋ฌ๊ฐ ์๊ฒจ์ ๋ฌธ์๋๋ฆฝ๋๋ค!
์๋ ํ์ธ์! ๋ฉ๋ฆฌํฌ๋ฆฌ์ค๋ง์ค ์ ๋๋ค!๋ฐฐํฌ ๋จ๊ณ๊น์ง ์ค์ จ๋ค๋ ๊ณ ์ ๋ง์ผ์ จ์ด์. ํน์ ์ค์น๋ Next.js์ ๋ฒ์ ์ ํ์ธํด์ฃผ์ค ์ ์์๊น์? ๊ฐ์์์๋ 13.4.19 ๋ฒ์ ์ ์ฐ๊ณ ์์ต๋๋ค. ๊ทธ ์ด์ ๋ฒ์ ์ด ์ค์น๋ ํ๊ฒฝ์ด๋ผ๋ฉด ์ต์ ๋ฌธ์ ๊ฐ์ด๋๋ฅผ ์ฐธ๊ณ ํ์ ์ Props์ params๋ฅผ Promise๋ก ๊ฐ์ธ๋ณด์๋ฉด ํด๊ฒฐ๋ ๊ฒ ๊ฐ์์! ์๋ํด๋ณด์๊ณ ๋ค์ ๋ต๋ณ ๋จ๊ฒจ์ฃผ์ธ์.
- 1
- 1
- 196
Q&A
๋ฐฐํฌ ํ, ์กฐํ์ ์ฆ๊ฐ ์ด์
์ค, ์ด์ฌ๋! ์๋ ํ์ธ์! Vercel Postgres๋ฅผ ๋์ฒดํ๋ Neon Marketplace ํตํฉ๋์๋์ง ๋ชฐ๋๋ค์... ๋ณํ๊ฐ ์ ๋ง ๋น ๋ฅธ ๊ฑฐ ๊ฐ์ต๋๋ค ๐ ์๋ ค์ฃผ์ ๊ฒ์ผ๋ก ์๋ํด๋ดค๋๋ฐ... ์ ๋ ๋์ผํ ์ฆ์์ด ๋ฐ์ํ๋๋ผ๊ณ ์. ๋ญ๊ฐ ์ด์ํด์ ์๋ ์์ ๋ก๋ ํ ์คํธ๋ฅผ ํด๋ดค์ด์. ๊ทธ๋ฌ๋๋ ์ญ์ ๋์ผํ๊ฒ ์นด์ดํธ๊ฐ 2ํ ์ด์ ์ค๋ฅด๋ ๋ฌธ์ ๊ฐ ์๊ธฐ๋ ๊ฑธ ๋ฐ๊ฒฌํ ์ ์์์ด์. (์ ์์ ์ ์๋ ๋ฒ๊ทธ๋ฅผ ๋ฐ๊ฒฌํด์ฃผ์ จ์ด์. ๊ฐ์ฌํด์!) ๋ค์ ์์๋ณด๋ ์๋ฒ ์ปดํฌ๋ํธ์ ์ค๋ณต ํธ์ถ ๋ฌธ์ ๋ก ๋ณด์ฌ์. ์์ ์์์ฒ๋ผ ์๋ก๊ณ ์นจ ๋ง๋ค ๋ณ๊ฒฝ๋์ด์ผ ํ๋ ๊ฒฝ์ฐ๋ผ๋ฉด incrementView์ ํด๋นํ๋ ๋ก์ง์ Route Handlers๋ก ๊ตฌํํ๋ ๋ฐฉ์์ด ๊ฐ์ฅ ์ฌ์ด ์ ๊ทผ์ผ ๊ฒ ๊ฐ์์.์์ ๋ฅผ ๋ณ๋์ ๋ธ๋์น์ ๋ง๋ค์ด๋์ผ๋ ํ์ธ ํด์ฃผ์ธ์.https://github.com/hajoeun/next-js-blog/blob/fix/view-count/app/api/view-count/route.ts ๋ ์์๋ณด๊ณ ์ข์ ๋ฐฉ๋ฒ์ด ์๋ค๋ฉด ๊ฐ์ ์์์ ๋จ๊ฒจ๋๊ฒ์!๋ฌธ์ ๋ฅผ ๋ฐ๊ฒฌํด์ฃผ์ ์ ๋๋ฌด ๊ฐ์ฌ๋๋ฆฝ๋๋ค! ์๋ํด๋ณด์๊ณ ๊ฒฐ๊ณผ ์๋ ค์ฃผ์ธ์. ๋ฌธ์ ๊ฐ ์๋ค๋ฉด ๋ ์ง๋ฌธ ๋จ๊ฒจ์ฃผ์ธ์! ๊ฐ์ฌํฉ๋๋ค.
- 1
- 1
- 159
Q&A
์ถ๊ฐ๋ก Head tag์์ ์์ฑ๋ script ์ฝ๋ ๊ด๋ จํ์ฌ ์ง๋ฌธ๋๋ฆฌ๊ณ ์ถ์ต๋๋ค. (feat. ์ฆ์ ์คํ ํจ์, dangerouslySetInnerHTML)
์๋ ํ์ธ์. ์ฐ์ฑ๋! 1, 2๋ฒ ์ง๋ฌธ์ ์ด์ด์ ๋ต๋ณ ๋๋ฆด๊ฒ์. 4๋ฒ - 3๋ฒ ์์๋ก ๋ต๋ณ๋๋ฆฌ๊ฒ ์ต๋๋ค. A4. dangerouslySetInnerHTML๋ฅผ ์ฌ์ฉํ๋ ์ด์ dangerouslySetInnerHTML๋ฅผ ์ฐ์ง ์๊ณ script ํ๊ทธ์ themeEffect์ ๋ก์ง์ ๋ฃ์ด๋ณด๋ฉด ๋ต์ ์ ์ ์์ต๋๋ค. ์๋ฒ์์ ๋ ๋๋งํ๋ ์์ ์ HTML๊ณผ์ ์ฐจ์ด๊ฐ ๋ฐ์ํด Error: Text content does not match server-rendered HTML. ์๋ฌ๋ฅผ ๋ง๋๊ฒ ๋ฉ๋๋ค. Next.js ์๋ฒ์์๋ ํ๊ทธ ์์ ์ปจํ ์ธ ๋ฅผ ํน์ ๋ฌธ์๋ฅผ ์ํฐํฐ๋ก ์ด์ค์ผ์ดํ ์ฒ๋ฆฌํฉ๋๋ค. ์๋ฅผ ๋ค๋ฉด ๋ฐ์ดํ(')๋ฅผ ' ์ด๋ ๊ฒ ๋ฐ๊พธ๋๊ฑฐ์ฃ . ๊ทธ ๊ฒฐ๊ณผ ๋ธ๋ผ์ฐ์ ์์ ํด์ํ๋ ๊ฒฐ๊ณผ์ ์ฐจ์ด๊ฐ ์๊ธฐ๋ ๊ฒ์ด์ฃ . ๋ฐ๋ฉด dangerouslySetInnerHTML์ ์ฌ์ฉํ๋ฉด ๋ด์ฉ์ ๊ทธ๋๋ก ์ฌ์ฉํด ์๋ฒ์ ๋ธ๋ผ์ฐ์ ๊ฐ ๋์ผํ ๊ฒฐ๊ณผ๋ฅผ ๋ฐํํฉ๋๋ค.๋๋ฌธ์ dangerouslySetInnerHTML์ ์ฌ์ฉํ์ต๋๋ค. A3. ์ฆ์ ์คํ ํจ์๋ฅผ ์ฌ์ฉํ ์ด์ dangerouslySetInnerHTML๋ฅผ ์ฌ์ฉํ ์ ๋ฐ์ ์๋ ์ํฉ์ด๋ผ๋ ์ ์ ๊ฐ์ํ์ ๋ ๊ฒฐ๊ตญ __html์์ ํ ๋ง ์ค์ ์ ๋ฐ๊ฟ์ผ ํฉ๋๋ค. ์ด๋ ์ ํ์ง๋ ๋๊ฐ๊ฐ ์์ต๋๋ค. themeEffect ์ ๊ฐ์ ํจ์๋ฅผ ์ฆ์ ์คํ๋ฌธ์์ด๋ก ๋ชจ๋ themeEffect ํจ์ ๋ด์ ๋ก์ง์ ์ ๊ธฐ์ ๋ ๋จ๊ฒจ์ฃผ์ ์ค์ฝํ ์ ํ์ ์ด์ ์ธ์๋ ์๋ํฐ์์ ์ง์ํ๋ ํ์ด๋ผ์ดํธ ๊ธฐ๋ฅ์ ์ฌ์ฉ ํธ์๋ ์ฝ๋์ ๊ฐ๋ ์ฑ ์ธก๋ฉด์์ ์ฆ์ ์คํ ํจ์๊ฐ ์ ๋ฆฌํ๋ค๊ณ ํ๋จํ์ต๋๋ค. ์ฆ์ ์คํ ํจ์๋ฅผ ์ฐ๋ ์ผ์ด ์ฆ์ ํธ์ ์๋๋๋ค. ์์ ์๋ useEffect ๋ด์์ ๋น๋๊ธฐ ํจ์๋ฅผ ํธ์ถํ ๋ async/await ๋ฌธ๋ฒ์ ์ฐ๊ธฐ ์ํด async๋ก ์ ์ธํ ์ฆ์ ์คํ ํจ์๋ฅผ ์ฐ๊ณค ํ๋๋ฐ TanStackQuery์ ๊ฐ์ ์ข์ ๋๊ตฌ๊ฐ ๋์ค๋ฉด์ ์ด๋ฐ ๋ฐฉ๋ฒ์ ์ ์ฐ์ง ์์ต๋๋ค. ํ ๋ง ๋ณ๊ฒฝ ๊ธฐ๋ฅ์ ์ฐ์ธ๊ฒ ํน์ดํ ์ฌ๋ก๋ผ๊ณ ๋ณด์ ๋ ๊ด์ฐฎ์ ๊ฑฐ ๊ฐ์์! ๋ต๋ณ์ด ๋์ จ์ผ๋ฉด ์ข๊ฒ ๋ค์. ๋ ๋ค๋ฅธ ์ง๋ฌธ ์๋ค๋ฉด ์ผ๋ง๋ ํธํ๊ฒ ๋จ๊ฒจ์ฃผ์ธ์! ์ด์ฌํ ํ์๋ ๋ชจ์ต ๋ณด๊ธฐ ์ข์ต๋๋ค! ์์ํ ๊ฒ์!
- 1
- 2
- 176
Q&A
Head tag์์ script๋ฅผ ์์ฑํ๋ ์ด์ ์ ๋ํด์ ์ฌ์ญค๋ณด๊ณ ์ถ์ต๋๋ค! (+ NextJS์ Head tag์ Script tag)
์ฐ์ฑ๋, ์๋ ํ์ธ์! ๋๋ฌด ์ข์ ์ง๋ฌธ๋ค ๋จ๊ฒจ์ฃผ์ จ๋ค์. ํ๋์ฉ ๋ต๋ณ๋๋ ค ๋ณผ๊ฒ์. A1. ๋คํฌ๋ชจ๋ ์ค์ ์ localStorage์์ ๊ฐ์ ธ์ค๋ ๋ถ๋ถ์์ head์์ script๋ฅผ ์ฌ์ฉํ๋ ์ด์ fouc ํ์์ ๋ฐฉ์งํ๊ธฐ ์ํจ์ด๋ผ๊ณ ๋ณด์๋ ๊ฒ ๋ง์ต๋๋ค! A2. NextJS์์ ์ ๊ณตํ๋ Head tag์ Script tag๋ฅผ ์ฌ์ฉํ์ง ์๊ณ ์์ HTML๋ก ์์ฑํ์ ์ด์ Head ํ๊ทธ์ ๊ฒฝ์ฐ Pages router์์ ์ ๊ณตํ๋ ์ปดํฌ๋ํธ๋ก ์๊ณ ์์ด์. App router๋ฅผ ์ฌ์ฉํ๋ ์ ํฌ ์์ ์์ ์ฌ์ฉํ๊ธฐ์ ์ ์ ํ์ง ์์ ์ปดํฌ๋ํธ ์์ต๋๋ค. Head ์ปดํฌ๋ํธ๋ ๋ณดํต ๋ฉํ๋ฐ์ดํฐ ์ค์ ์ ์ํด ๋ง์ด ์ฌ์ฉํฉ๋๋ค. ์ ํฌ๊ฐ ๋ธ๋ก๊ทธ๋ฅผ Page router๋ก ๋ง๋ค์๋๋ผ๋ Head ์ปดํฌ๋ํธ๋ฅผ ์ฌ์ฉํ์ง ์๋ ์ ํ์ ํ์ ๊ฒ ๊ฐ์์.Script ํ๊ทธ๋ App Router์์๋ ์ ๊ณตํ๋ ์ปดํฌ๋ํธ์ ๋๋ค. ํ์ง๋ง Script ์ปดํฌ๋ํธ๋ ๋ง์น Image ์ปดํฌ๋ํธ์ ๊ฐ์ ์ญํ ์ ํ๋ ์ฉ๋๋ก ์ฐ์ ๋๋ค. ์คํฌ๋ฆฝํธ๋ฅผ ๋ก๋ํ ๋ ์ต์ ํ๋ฅผ ํ๊ธฐ ์ํด ์ฐ์ด์ฃ . ์ ํฌ๊ฐ ๊ตฌํํ HTML ์์ ๊ธฐ๋ฅ์ธ script ํ๊ทธ๋ ๋ด๋ถ์์ ์๋ฐ์คํฌ๋ฆฝํธ ์ฝ๋๋ฅผ ์คํ์ํค๊ธฐ ์ํด ์ด ๊ฒฝ์ฐ๋ผ ์ํฉ์ด ์กฐ๊ธ ๋ค๋ฅด๋ค๊ณ ๋ณผ ์ ์์ ๊ฒ ๊ฐ์ต๋๋ค. ์ข์ ์ง๋ฌธ ๋จ๊ฒจ์ฃผ์ ๊ฑธ ๋ณด๋ ์ด์ฌํ ๊ณต๋ถํ๊ณ ๊ณ์ ๊ฒ ๊ฐ์ ๋๋ฌด ๋ฟ๋ฏํฉ๋๋ค! ๋ค๋ฅธ ์ง๋ฌธ์ด ์๋ค๋ฉด ๋ ํธํ ๋จ๊ฒจ์ฃผ์ธ์. 3, 4๋ฒ ์ง๋ฌธ๋ ๋ฐ๋ก ๋ต๋ณ ๋๋ฆด๊ฒ์! ๊ฐ์ฌํฉ๋๋ค.
- 1
- 1
- 105
Q&A
์๊ฐํ๊ณ ์ง๋ฌธ ๋๋ฆฝ๋๋ค
์๋ ํ์ธ์! ๊ฐ์ ๋ด์ฃผ์ ์ ์ง์ฌ์ผ๋ก ๊ฐ์ฌ๋๋ฆฝ๋๋ค. ๋ ๋๋ง ๊ธฐ๋ฒ์ ๊ฒฝ์ฐ ์ค๋ฌด์์ ํ์์ ๋ฐ๋ผ ์ ํํด์ ์ฌ์ฉํฉ๋๋ค.SSR, CSR์ ๋ณดํต ํผ์ฉํด์ ์ฌ์ฉํฉ๋๋ค. ์ฒซ ๋ ๋๋ง์ SSR์ ํ์ฉํ๊ณ ์ดํ ํ์ด์ง ์ ํ์ CSR์ ์ ์ฉํ๋ ํจํด์ด ํํ ๋ณด์ ๋๋ค.SSG, ISR์ ๊ฒฝ์ฐ ๋ธ๋ก๊ทธ๋ ํ์ฌ ํํ์ด์ง ๊ฐ์ ์ ์ ์ธ ์ปจํ ์ธ ๋ฅผ ์ ๊ณตํ ๋ ๋ง์ด ์ฌ์ฉํฉ๋๋ค.PPR์ ๊ฒฝ์ฐ ์์ง์ ์ค๋ฌด์์ ๋๋ฆฌ ์ฌ์ฉ๋๋ ๊ธฐ๋ฒ์ ์๋๋๋ค.๊ฐ์ธ์ ์ธ ๊ด์ฐฐ์ ๋ฐ๋ฅด๋ฉด CRUD๊น์ง ์ง์ ๊ตฌํํ ๋ธ๋ก๊ทธ๋ ์ ์ ํธ์ด๋ผ๊ณ ๋ณด์ ๋๋ค.ํฐ์คํ ๋ฆฌ๋, ๋ฒจ๋ก๊ทธ, ๋ค์ด๋ฒ ๋ธ๋ก๊ทธ ๋ฑ์ ๋ธ๋ก๊ทธ ์๋น์ค๋ฅผ ์ด์ฉํ๋ ๊ฒฝ์ฐ๊ฐ ์๋๋ผ ์ง์ ๊ตฌํ์ ์ ํํ๋ ๊ฒฝ์ฐ์๋ ์ ๊ฐ์์ ๊ฐ์ ๋งํฌ๋ค์ด ํ์ผ์ ํ์ฉํด์ ๊ตฌํํ๋ ์ฌ๋ก๊ฐ ์ผ๋ฐ์ ์ ๋๋ค.์์ฆ์ ์ต์๋์ธ, ๋ ธ์ ๊ณผ ๊ฐ์ ๋ฉ๋ชจ ๋๊ตฌ๊ฐ ๊ธ์ ํผ๋ธ๋ฆฌ์ํ ์ ์๋ ๊ธฐ๋ฅ์ ์ ๊ณตํฉ๋๋ค. ์ด๋ฅผ ํ์ฉํด์ ๋ธ๋ก๊ทธ๋ฅผ ์ด์ํ๋ ์ฌ๋ก๋ ์ข ์ข ์์ต๋๋ค. (์ผ๋ถ ์ ๋ฃ๋ก ์๊ณ ์์ด์)md ํ์ผ์ ์ง์ ์์ฑํ์ง ์๊ณ ๊ธ์ ๋ธ๋ผ์ฐ์ ์์ ์์ฑ/์์ ํ๋ ค๋ฉด ์ถ๊ฐ์ ์ธ ๊ธฐ๋ฅ์ ๋ถ์ฌ์ผ ํฉ๋๋ค. CMS(Content Management System)๋ฅผ ์ฐ๊ณํด์ ๊ฐ๋ฐํ๋ ๋ฐฉ๋ฒ์ ๋๋ค. ์๋ฌด๋๋ ์๋ํฐ๋ฅผ ์ง์ ๋ถ์ด๊ฑฐ๋ ์ธ๋ถ ์๋น์ค๋ฅผ ์ฐ๋ํ๋ ์์ ์ด๋ค๋ณด๋ ์ง์ ๋งํฌ๋ค์ด์ ์์ฑํ๋ ๊ฒ์ ๋นํด ๊ฐ๋ฐ์ ํ์ ๋ ์์์ผ ํ๋ค๋ ๋จ์ ์ด ์์ต๋๋ค. ๋น ๋ฅด๊ฒ ๋ต๋ณ ๋๋ฆฌ๊ณ ์ถ์ด์ ์กฐ๊ธ ๊ฑด์กฐํ๊ฒ ๋ต๋ณ๋๋ ธ๋๋ฐ, ๋ ์์ธํ ์ด์ผ๊ธฐ๊ฐ ๋๋๊ณ ์ถ์ผ์๋ค๋ฉด ์ถ๊ฐ๋ก ์ง๋ฌธ ๋จ๊ฒจ์ฃผ์ธ์! ๋์๋ ๋๊น์ง ๋ต๋ณ ๋๋ฆฌ๊ฒ ์ต๋๋ค. ๊ฐ์ฌํฉ๋๋ค. ํ์กฐ์ ๋๋ฆผ
- 1
- 2
- 106
Q&A
์๋ ํ์ธ์ generateStaticParams ๊ดํด์ ์ง๋ฌธ
์๋ ํ์ธ์! ํ์ ์ด ๋ฆ์์ต๋๋ค. ๊ณ ๋ฏผ ๋ง์ด ํ๊ณ ๊ณ์คํ ๋ฐ ๋ต๋ณ์ด ๋ฆ์ด์ ์ฃ์กํฉ๋๋ค. ๊ฐ๋ฅํ๋ค๋ฉด ์ ์ฒด ์ฝ๋๋ฅผ ์๋ ค์ฃผ์๋ฉด ํ์ธ์ด ์กฐ๊ธ ๋ ์ฌ์ธ ๊ฒ ๊ฐ์ต๋๋ค. ์ง์ํด๋ณด๊ฑด๋ฐ ๋น๋ ์์ ์ prefetchQuery๊ฐ ๋์ํ๋ฉด์ ๋ก๊ทธ๋ฅผ ๋จ๊ธฐ๊ณ ์๋ ๊ฒ ์๋๊น ์ถ์ด์. ๋ง์์ฃผ์ ๊ฒ์ฒ๋ผ Next.js์ ์บ์ ์์ด์ ์ค๋ณต ์์ฒญ์ ์ ๊ฑฐํฉ๋๋ค. ์ด๋ fetch ํจ์๋ฅผ ์ด์ฉํ API ํธ์ถ์ธ ๊ฒฝ์ฐ์ ๋๋ค. fetch ์ด์ ์ fetchBanner ๋ด๋ถ์์ ์ฝ์์ ๋จ๊ธฐ๊ณ ์๋ ๊ฒ์ด๋ผ๋ฉด prefetchQuery ๋ ๋งค๋ฒ ํธ์ถ๋ ์ ์์ ๊ฒ ๊ฐ์ต๋๋ค. ๊ธฐ๋ค๋ ค์ฃผ์ จ๋๋ฐ ๋ช ์พํ ๋ต๋ณ์ ๋๋ฆฌ์ง ๋ชปํ ์ ์ํด ๋ถํ๋๋ฆฝ๋๋ค! ์ฝ๋ ์ ์ฅ์๋ฅผ ์๋ ค์ฃผ์๋ฉด ์ดํด๋ณด๊ณ ๋น ๋ฅด๊ฒ ๋ต๋ณ ๋๋ฆด๊ฒ์!
- 0
- 2
- 235
Q&A
๋คํฌ๋ชจ๋ ์ ์ฉ
์๋ ํ์ธ์! ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ฌ์ฉํ์ง ์์ ์ด์ ์ ๋ํด ์ง๋ฌธ ์ฃผ์ จ๋ค์ ๐ ํฌ๊ฒ ๋๊ฐ์ง ์ด์ ๊ฐ ์์์ต๋๋ค. ๊ฐ๊ธ์ ์ด๋ฉด TailwindCSS ์ธ์ ์ถ๊ฐ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ์ฌ์ฉํ์ง ์๊ณ ๊ตฌํํ๊ณ ์ถ์์ต๋๋ค. ์๋ฌต์ง๋ฅผ ์ต๋ํ ์ค์ด๊ณ ์ถ์์ด์. ์ ๊ฐ ํด๋น ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ์กด์ฌ๋ฅผ ๋ชฐ๋์ต๋๋ค. ์์๋ค๊ณ ํ๋๋ผ๋ 1๋ฒ์ ์ด์ ๋ก ์ง๊ธ์ฒ๋ผ ๊ตฌํํ์ ๊ฑฐ ๊ฐ์์. ๋ต๋ณ์ด ๋์ จ์ผ๋ฉด ์ข๊ฒ ๋ค์!๋ค๋ฅธ ์ง๋ฌธ ์์ผ์๋ฉด ์ธ์ ๋ ํธํ๊ฒ ๋จ๊ฒจ์ฃผ์ธ์!
- 1
- 2
- 228
Q&A
PPR ์ ์ฉ ํ ํ ์๋ฌ๊ฐ ๋ฌ์ต๋๋ค.
์๋ ํ์ธ์!PPR ์ ์ฉ๊น์ง ์ค์ จ๊ตฐ์! ๊ณ ์ ๋ง์ผ์ จ์ต๋๋ค. ์ค์น๋ Next.js ๋ฒ์ ์ ๋ดค์ ๋ Canary ๋ฒ์ ์ด ์๋ ๊ฒ ๊ฐ์์. PPR์ ํ์ฌ Preview ๊ธฐ๋ฅ์ผ๋ก Canary ๋ฒ์ ์ ์ค์นํ์ ์ผ ํ์ฉํด๋ณด์ค ์ ์์ด์. Next.js ๊ณต์ ๋ฌธ์๋ฅผ ์ฐธ๊ณ ํ์ ์ Canary ๋ฒ์ ์ผ๋ก Next.js๋ฅผ ์ค์นํด๋ณด์๊ณ ๋ค์ ์๋ํด๋ด์ฃผ์ธ์! https://nextjs.org/docs/messages/ppr-preview ์ดํ์๋ ๋ฌธ์ ๊ฐ ์๋ค๋ฉด ์ธ์ ๋ ์ง๋ฌธ ๋จ๊ฒจ์ฃผ์ธ์. ๊ฐ์ฌํฉ๋๋ค.
- 1
- 2
- 202