dev/react 1

[ react ] react-router-dom v6_v5์™€์˜ ์ฐจ์ด์™€ routing

SPA ์˜ ๊ฒฝ์šฐ ์„œ๋ฒ„์—์„œ ์‚ฌ์šฉ์ž์—๊ฒŒ ์ œ๊ณตํ•˜๋Š” ํŽ˜์ด์ง€๋Š” ํ•œ ์ข…๋ฅ˜์ด์ง€๋งŒ, ํ•ด๋‹น ํŽ˜์ด์ง€์—์„œ ๋กœ๋”ฉ๋œ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์™€ ํ˜„์žฌ ์‚ฌ์šฉ์ž ๋ธŒ๋ผ์šฐ์ €์˜ ์ฃผ์†Œ ์ƒํƒœ์— ๋”ฐ๋ผ ๋‹ค์–‘ํ•œ ํ™”๋ฉด์„ ๋ณด์—ฌ์ค„ ์ˆ˜ ์žˆ๋‹ค. ๋‹ค๋ฅธ ์ฃผ์†Œ์— ๋”ฐ๋ผ ๋‹ค๋ฅธ ํ™”๋ฉด์„ ๋ณด์—ฌ์ฃผ๋Š” ๊ฒƒ์„ ๋ผ์šฐํŒ…์ด๋ผ๊ณ  ํ•œ๋‹ค. ๋ฆฌ์•กํŠธ ์ž์ฒด์— ์ด ๊ธฐ๋Šฅ์ด ๋‚ด์žฅ๋˜์–ด ์žˆ์ง€๋Š” ์•Š์ง€๋งŒ, ๋ธŒ๋ผ์šฐ์ € API๋ฅผ ์ง์ ‘ ์‚ฌ์šฉํ•˜์—ฌ ์ด๋ฅผ ๊ด€๋ฆฌํ•˜๊ฑฐ๋‚˜, ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์‚ฌ์šฉํ•˜์—ฌ ์ด ์ž‘์—…์„ ๋”์šฑ ์‰ฝ๊ฒŒ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ๋‹ค. ๋ฆฌ์•กํŠธ ๋ผ์šฐํŒ… ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋Š” ๋ฆฌ์•กํŠธ ๋ผ์šฐํ„ฐ ( react-router ), ๋ฆฌ์น˜ ๋ผ์šฐํ„ฐ (reach-router), Next.js ๋“ฑ ์—ฌ๋Ÿฌ๊ฐ€์ง€๊ฐ€ ์žˆ๋‹ค. ๊ทธ ์ค‘ ์šฐ๋ฆฌ๋Š” ๋ฆฌ์•กํŠธ ๋ผ์šฐํ„ฐ์— ๋Œ€ํ•ด ๋‹ค๋ค„๋ณด์ž. ๋ฆฌ์•กํŠธ ๋ผ์šฐํ„ฐ๋Š” ํด๋ผ์ด์–ธํŠธ ์‚ฌ์ด๋“œ์—์„œ ์ด๋ฃจ์–ด์ง€๋Š” ๋ผ์šฐํŒ…์„ ์•„์ฃผ ๊ฐ„๋‹จํ•œ๊ฒŒ ๊ตฌํ˜„ํ•  ์ˆ˜ ์žˆ๋„๋ก ํ•œ๋‹ค. ๋” ๋‚˜์•„๊ฐ€ ๋‚˜..

dev/react 2022.04.08