@@ -104,7 +104,7 @@ React ์ปดํ์ผ๋ฌ๋ ๋ค์๊ณผ ๊ฐ์ด ๊ฐ์ ํฉ๋๋ค.
1041042 . nullable/optional ๊ฐ๊ณผ ์์ฑ์ ์ ๊ทผํ๊ธฐ ์ ์ ๊ทธ ๊ฐ์ด ์ ์๋์ด ์๋์ง ํ
์คํธํฉ๋๋ค. TypeScript๋ฅผ ์ฌ์ฉํ๋ ๊ฒฝ์ฐ [ ` strictNullChecks ` ] ( https://www.typescriptlang.org/ko/tsconfig/#strictNullChecks ) ์ ํ์ฑํํ์ฌ ์ํํฉ๋๋ค. ์๋ฅผ ๋ค์ด ` if (object.nullableProperty) { object.nullableProperty.foo } ` ์ ๊ฐ์ด ์ฒ๋ฆฌํ๊ฑฐ๋, ์ต์
๋ ์ฒด์ด๋์ ์ฌ์ฉํ์ฌ ` object.nullableProperty?.foo ` ์ ๊ฐ์ด ์ฒ๋ฆฌํฉ๋๋ค.
1051053 . [ React์ ๊ท์น] ( https://ko.react.dev/reference/rules ) ์ ๋ฐ๋ฆ
๋๋ค.
106106
107- React ์ปดํ์ผ๋ฌ๋ React์ ๋ง์ ๊ท์น์ ์ ์ ์ผ๋ก ๊ฒ์ฆํ ์ ์์ผ๋ฉฐ, ์๋ฌ๊ฐ ๊ฐ์ง๋๋ฉด ์์ ํ๊ฒ ์ปดํ์ผ์ ๊ฑด๋๋๋๋ค. ์๋ฌ๋ฅผ ํ์ธํ๋ ค๋ฉด [ eslint-plugin-react-compiler] ( https://www.npmjs.com/package/eslint-plugin-react-compiler ) ์ ์ค์น๋ฅผ ๊ถ์ฅํฉ๋๋ค.
107+ React ์ปดํ์ผ๋ฌ๋ React์ ๋ง์ ๊ท์น์ ์ ์ ์ผ๋ก ๊ฒ์ฆํ ์ ์์ผ๋ฉฐ, ์๋ฌ๊ฐ ๊ฐ์ง๋๋ฉด ์์ ํ๊ฒ ์ปดํ์ผ์ ๊ฑด๋๋๋๋ค. ์๋ฌ๋ฅผ ํ์ธํ๋ ค๋ฉด [ ` eslint-plugin-react-compiler ` ] ( https://www.npmjs.com/package/eslint-plugin-react-compiler ) ์ ์ค์น๋ฅผ ๊ถ์ฅํฉ๋๋ค.
108108
109109### ์ปดํ์ผ๋ฌ๋ฅผ ์๋ํด ๋ด์ผ ํ๋์? {/* should-i-try-out-the-compiler* /}
110110
@@ -138,7 +138,7 @@ StrictMode usage not found.
138138Found no usage of incompatible libraries.
139139</TerminalBlock >
140140
141- ### eslint-plugin-react-compiler ์ค์น {/* installing-eslint-plugin-react-compiler* /}
141+ ### ` eslint-plugin-react-compiler ` ์ค์น {/* installing-eslint-plugin-react-compiler* /}
142142
143143React ์ปดํ์ผ๋ฌ๋ eslint ํ๋ฌ๊ทธ์ธ๋ ์ง์ํฉ๋๋ค. eslint ํ๋ฌ๊ทธ์ธ์ ์ปดํ์ผ๋ฌ์ ** ๋
๋ฆฝ์ ์ผ๋ก** ์ฌ์ฉํ ์ ์์ต๋๋ค. ์ฆ ์ปดํ์ผ๋ฌ๋ฅผ ์ฌ์ฉํ์ง ์๋๋ผ๋ eslint ํ๋ฌ๊ทธ์ธ์ ์ฌ์ฉํ ์ ์์ต๋๋ค.
144144
@@ -228,7 +228,7 @@ module.exports = function () {
228228
229229### Vite {/* usage-with-vite* /}
230230
231- Vite๋ฅผ ์ฌ์ฉํ๊ณ ์๋ค๋ฉด, vite-plugin-react์ ํ๋ฌ๊ทธ์ธ์ ์ถ๊ฐํ ์ ์์ต๋๋ค.
231+ Vite๋ฅผ ์ฌ์ฉํ๊ณ ์๋ค๋ฉด, ` vite-plugin-react ` ์ ํ๋ฌ๊ทธ์ธ์ ์ถ๊ฐํ ์ ์์ต๋๋ค.
232232
233233``` js {10}
234234// vite.config.js
@@ -382,7 +382,7 @@ React 19๋ก ์
๊ทธ๋ ์ด๋ํ ์ ์๋ ๊ฒฝ์ฐ, [์ํน ๊ทธ๋ฃน](https://github
382382[ React Devtools] ( /learn/react-developer-tools ) (v5.0+)์๋ React ์ปดํ์ผ๋ฌ๋ฅผ ๋ด์ฅ ์ง์ํ๋ฉฐ, ์ปดํ์ผ๋ฌ์ ์ํด ์ต์ ํ๋ ์ปดํฌ๋ํธ ์์ "Memo โจ" ๋ฐฐ์ง๋ฅผ ํ์ํฉ๋๋ค.
383383
384384### ์ปดํ์ผ ํ ์๋ํ์ง ์๋ ๋ฌธ์ {/* something-is-not-working-after-compilation* /}
385- eslint-plugin-react-compiler์ ์ค์นํ ๊ฒฝ์ฐ, ์ปดํ์ผ๋ฌ๋ ์๋ํฐ์์ React ๊ท์น ์๋ฐ ์ฌํญ์ ํ์ํฉ๋๋ค. ์ด ๊ฒฝ์ฐ ์ปดํ์ผ๋ฌ๊ฐ ํด๋น ์ปดํฌ๋ํธ๋ Hook์ ์ต์ ํ๋ฅผ ๊ฑด๋๋ฐ์์์ ์๋ฏธํฉ๋๋ค. ์ด๊ฒ์ ์์ ํ ์ ์์ ์ธ ๋์์ด๋ฉฐ, ์ปดํ์ผ๋ฌ๋ ์ด๋ฅผ ๋ณต๊ตฌํ๊ณ ์ฝ๋๋ฒ ์ด์ค์ ๋ค๋ฅธ ์ปดํฌ๋ํธ๋ฅผ ๊ณ์ํด์ ์ต์ ํํ ์ ์์ต๋๋ค. ** ๋ชจ๋ eslint ์๋ฐ ์ฌํญ์ ์ฆ์ ์์ ํ ํ์๋ ์์ต๋๋ค.** ์์ ์ ์๋์ ๋ง์ถฐ ํด๊ฒฐํ๋ฉด์ ์ต์ ํ๋๋ ์ปดํฌ๋ํธ์ Hooks์ ์๋ฅผ ์ ์ง์ ์ผ๋ก ๋๋ฆด ์ ์์ต๋๋ค.
385+ ` eslint-plugin-react-compiler ` ์ ์ค์นํ ๊ฒฝ์ฐ, ์ปดํ์ผ๋ฌ๋ ์๋ํฐ์์ React ๊ท์น ์๋ฐ ์ฌํญ์ ํ์ํฉ๋๋ค. ์ด ๊ฒฝ์ฐ ์ปดํ์ผ๋ฌ๊ฐ ํด๋น ์ปดํฌ๋ํธ๋ Hook์ ์ต์ ํ๋ฅผ ๊ฑด๋๋ฐ์์์ ์๋ฏธํฉ๋๋ค. ์ด๊ฒ์ ์์ ํ ์ ์์ ์ธ ๋์์ด๋ฉฐ, ์ปดํ์ผ๋ฌ๋ ์ด๋ฅผ ๋ณต๊ตฌํ๊ณ ์ฝ๋๋ฒ ์ด์ค์ ๋ค๋ฅธ ์ปดํฌ๋ํธ๋ฅผ ๊ณ์ํด์ ์ต์ ํํ ์ ์์ต๋๋ค. ** ๋ชจ๋ eslint ์๋ฐ ์ฌํญ์ ์ฆ์ ์์ ํ ํ์๋ ์์ต๋๋ค.** ์์ ์ ์๋์ ๋ง์ถฐ ํด๊ฒฐํ๋ฉด์ ์ต์ ํ๋๋ ์ปดํฌ๋ํธ์ Hooks์ ์๋ฅผ ์ ์ง์ ์ผ๋ก ๋๋ฆด ์ ์์ต๋๋ค.
386386
387387๊ทธ๋ฌ๋ JavaScript์ ์ ์ฐํ๊ณ ๋์ ์ธ ํน์ฑ ๋๋ฌธ์ ๋ชจ๋ ๊ฒฝ์ฐ๋ฅผ ์ฒ ์ ํ๊ฒ ๊ฐ์งํ๋ ๊ฒ์ ๋ถ๊ฐ๋ฅํฉ๋๋ค. ์ด๋ฌ๋ฉด ๋ฒ๊ทธ๋ ๋ฌดํ ๋ฃจํ์ ๊ฐ์ ์ ์๋์ง ์์ ๋์์ด ๋ฐ์ํ ์ ์์ต๋๋ค.
388388
0 commit comments