๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

IT-Engineering/JavaScript1

Next.js์—์„œ ์ž๊พธ use client๋ฅผ ์จ๋„ ๋˜๋Š”๊ฐ€(feat. SSR, CSR) Next.js์—์„œ Three.js๋‚˜ vtkjs์™€ ๊ฐ™์€ ๊ทธ๋ž˜ํ”ฝ ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋“ค์„ ํ™œ์šฉํ•˜๋‹ค ๋ณด๋ฉด, ์–ด์ฉ” ์ˆ˜ ์—†์ด ๊ณ„์†ํ•ด์„œ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ ๋˜๋Š” ํƒ€์ž…์Šคํฌ๋ฆฝํŠธ ํŒŒ์ผ ์ตœ์ƒ๋‹จ์— use client๋ฅผ ์ž…๋ ฅํ•˜๊ฒŒ ๋˜๋Š” ๊ฒฝ์šฐ๊ฐ€ ์™•์™• ๋ฐœ์ƒํ•œ๋‹ค. Next.js๋Š” ์•„๋ฌด๋ž˜๋„ ์„œ๋ฒ„ ์‚ฌ์ด๋“œ ๋ Œ๋”๋ง(Server-Side Rendering, SSR)์ด ์žฅ์ ์ธ ํ”„๋ ˆ์ž„์›Œํฌ์ด๋‹ค ๋ณด๋‹ˆ, use client๋ฅผ ์“ฐ๋ฉด ๊ทธ ์žฅ์ ์„ ํ‡ด์ƒ‰์‹œํ‚ค๋Š” ๊ฒƒ ๊ฐ™์€ ์ฃ„์ฑ…๊ฐ์ด ๋“ ๋‹ค. ๊ฒฐ๋ก ๋ถ€ํ„ฐ ๋งํ•˜์ž๋ฉด ์ฃ„์ฑ…๊ฐ์„ ๋Š๋‚„ ํ•„์š”๋Š” ์—†๋‹ค. "use client"์˜ ์‚ฌ์šฉ์€ ์„ฑ๋Šฅ ์ธก๋ฉด์—์„œ ๋Š๋ ค์ง€๋Š” ์š”์ธ์ด ์•„๋‹ˆ๋ผ, ์˜คํžˆ๋ ค ์„ฑ๋Šฅ์„ ์ตœ์ ํ™”ํ•˜๊ธฐ ์œ„ํ•œ ๋ชฉ์ ์œผ๋กœ ๋„์ž…๋œ ๊ธฐ๋Šฅ์ด๋‹ค. ์ด๋ฅผ ํ†ตํ•ด ๊ฐœ๋ฐœ์ž๋Š” ์• ํ”Œ๋ฆฌ์ผ€์ด์…˜์˜ ์„ฑ๋Šฅ์„ ๋” ์„ธ๋ฐ€ํ•˜๊ฒŒ ์กฐ์ •ํ•˜๊ณ , ์‚ฌ์šฉ์ž ๊ฒฝํ—˜์„ ๊ฐœ์„ ํ•  ์ˆ˜ ์žˆ๋‹ค. Next.js์—์„œ "us.. 2024. 1. 14.