react-dom/client API๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ํด๋ผ์ด์–ธํŠธ(๋ธŒ๋ผ์šฐ์ €)์—์„œ React ์ปดํฌ๋„ŒํŠธ๋ฅผ ๋ Œ๋”๋ง ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ์ด๋Ÿฌํ•œ API๋Š” ์ผ๋ฐ˜์ ์œผ๋กœ ์•ฑ์˜ ์ตœ์ƒ์œ„ ์ˆ˜์ค€์—์„œ React ํŠธ๋ฆฌ๋ฅผ ์ดˆ๊ธฐํ™”ํ•˜๊ธฐ ์œ„ํ•ด ์‚ฌ์šฉ๋ฉ๋‹ˆ๋‹ค. ํ”„๋ ˆ์ž„์›Œํฌ๊ฐ€ ๋Œ€์‹  ํ˜ธ์ถœํ•  ์ˆ˜๋„ ์žˆ์Šต๋‹ˆ๋‹ค. ๋Œ€๋ถ€๋ถ„์˜ ์ปดํฌ๋„ŒํŠธ๋Š” ์ด๋ฅผ ๊ฐ€์ ธ์˜ค๊ฑฐ๋‚˜ ์‚ฌ์šฉํ•  ํ•„์š”๊ฐ€ ์—†์Šต๋‹ˆ๋‹ค.


Client APIs

  • createRoot๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ๋ธŒ๋ผ์šฐ์ € DOM ๋…ธ๋“œ ์•ˆ์— React ์ปดํฌ๋„ŒํŠธ๋ฅผ ํ‘œ์‹œํ•˜๋Š” ๋ฃจํŠธ๋ฅผ ์ƒ์„ฑํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.
  • hydrateRoot๋ฅผ ์‚ฌ์šฉํ•˜๋ฉด ์ด์ „์— react-dom/server.์— ์˜ํ•ด ์ƒ์„ฑ๋œ HTML ์ฝ˜ํ…์ธ ๊ฐ€ ์žˆ๋Š” ๋ธŒ๋ผ์šฐ์ € DOM ๋…ธ๋“œ ์•ˆ์— React ์ปดํฌ๋„ŒํŠธ๋ฅผ ํ‘œ์‹œํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

์ง€์› ๋ธŒ๋ผ์šฐ์ €

React๋Š” Internet Explorer 9 ์ด์ƒ์„ ํฌํ•จํ•œ ๋ชจ๋“  ๋Œ€์ค‘์ ์ธ ๋ธŒ๋ผ์šฐ์ €๋ฅผ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. IE 9, IE 10 ์ดํ•˜ ๊ฐ™์€ ๊ตฌํ˜• ๋ธŒ๋ผ์šฐ์ €์—์„œ๋Š” ์ผ๋ถ€ ํด๋ฆฌํ•„์ด ํ•„์š”ํ•ฉ๋‹ˆ๋‹ค.