spa

    [ReactJS] SPA & Routing

    SPA & Routing SPA (Single Page Application) ์˜ ๊ฐœ๋… SPA๋Š” ํŽ˜์ด์ง€๊ฐ€ ํ•˜๋‚˜์ธ ์›น ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜์„ ์˜๋ฏธํ•œ๋‹ค. ์—ฌ๊ธฐ์„œ ํŽ˜์ด์ง€๋ž€ html ํŒŒ์ผ์„ ๋œปํ•˜๊ธฐ ๋•Œ๋ฌธ์—, SPA๋Š” ์›น ์‚ฌ์ดํŠธ ์ „์ฒด์— HTML ํŒŒ์ผ์ด ํ•˜๋‚˜์ธ ์›น ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜์ด๋‹ค. MPA์™€ ๋‹ฌ๋ฆฌ, SPA๋Š” html์ด ํ•˜๋‚˜ ๋ฟ์ด๋ฏ€๋กœ ์—ฌ๋Ÿฌ ํŽ˜์ด์ง€(UI)๋ฅผ ํ•˜๋‚˜์˜ ํŽ˜์ด์ง€์—์„œ ๋ณด์—ฌ์ฃผ๊ธฐ ์œ„ํ•ด Routing ๊ธฐ๋Šฅ์ด ํ•„์š”ํ•˜๋‹ค. Routing์˜ ๊ฐœ๋… SPA์—์„œ ๊ฒฝ๋กœ์— ๋”ฐ๋ผ ๋‹ค๋ฅธ ํŽ˜์ด์ง€๋ฅผ ๋ธŒ๋ผ์šฐ์ € ํ™”๋ฉด์— ๋ณด์—ฌ์ฃผ๋Š” ๊ฒƒ์„ Routing์ด๋ผ ํ•œ๋‹ค. React ์ž์ฒด์—๋Š” Routing ๊ธฐ๋Šฅ์ด ์—†๊ธฐ ๋•Œ๋ฌธ์—, React-Router์ด๋ผ๋Š” ๋ผ์ด๋ธŒ๋Ÿฌ๋ฆฌ๋ฅผ ์„ค์น˜ํ•ด ์‚ฌ์šฉํ•ด์•ผ ํ•œ๋‹ค. React-Router ์„ค์น˜ ๋ช…๋ น์–ด : npm install react-route..