๐ React-Native ์ฅ๋จ์
๐ ์ฅ์
๐ ์์ฐ์ฑ
JS๋ก ์๋๋ก์ด๋์ IOS ์ดํ์ ๋์์ ์ ์ํ ์ ์์ต๋๋ค.
๐ CodePush๋ฅผ ํตํ ๋ฐฐํฌ
์ํ๋ ๊ธฐ๋ฅ์ ๋ฐฐํฌ๋ฅผ ์๋ฌด ๋๋ ์คํ ์ด๋ฅผ ๊ฑฐ์น์ง ์๊ณ ํ ์ ์์ต๋๋ค.
๋ค์ดํฐ๋ธ ์ฝ๋์ ๋ณ๋์ด ์์ ๋ CodePush๋ฅผ ์ฌ์ฉํ์ง ๋ชปํ๊ณ ์คํ ์ด ์
๋ฐ์ดํธ๋ฅผ ์ด์ฉํด์ผ ํฉ๋๋ค.
๐ ์ฝ๊ณ ๋น ๋ฅธ UI ์์ฑ
JavaScript์ ๋ฆฌ์กํธ๋ง ์ ์๊ณ ์๋ค๋ฉด ๋ชจ๋ฐ์ผ UI๋ฅผ ์ฝ๊ณ ๋น ๋ฅด๊ฒ ์์ฑํ ์ ์์ต๋๋ค
๐ ๋จ์
๐ ์์ฃผ ์คํจํ๋ ์ฑ ๊ตฌ๋, ๋๋ฌด ์ค๋ ๊ฑธ๋ฆฌ๋ Build Time
๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ ํ๋ก์ ํธ ๊ฐ๋ฐ ํ, ์๋ฎฌ๋ ์ดํฐ ๋๋ ๊ฐ๋ฐ์ฉ ๊ธฐ๊ธฐ๋ก ๊ฐ๋ฐ ๋ชจ๋๋ฅผ ๊ตฌ๋์ ํ ๋ ๋๋ถ๋ถ์ ๊ฒฝ์ฐ์ ๋ฌธ์ ์์ด ์ ์๋ํ์ง๋ง ๋ธ๋์น๋ฅผ ๋ณ๊ฒฝํ์ฌ ๋ค์ดํฐ๋ธ ์ฝ๋์ ๋ณ๋ ์ฌํญ์ด ๋ฐ์ํ๊ฑฐ๋ ํ๋ฉด, ๊ฐํน๊ฐ๋ค๊ฐ ์ฑ ๊ตฌ๋์ด ์ ๋๋ก ์๋๋ ํ์์ด ๋ฐ์ํฉ๋๋ค.
๐ ๊ฐ๋์ฉ ์ผ๊ด์ฑ ์๋ UI
๋๋ถ๋ถ์ ๊ฒฝ์ฐ์ ๊ด์ฐฎ์ง๋ง, ๊ฐ๋์ฉ์ Android์์ ๋ณด์ด๋ UI์ iOS์์ ๋ณด์ด๋ UI๊ฐ ์ผ๊ด์ฑ์ด ์๊ฒ ๋ํ๋ ๋๊ฐ ์์ต๋๋ค. ์๋ฅผ ๋ค์ด์ iOS์์๋ ๊ด์ฐฎ๊ฒ ๋ณด์ด๋๋ฐ Android์์๋ ์คํ์ผ์ด ๋ฌธ์ ๊ฐ ์์ด์ ์ด๋ฅผ ๊ณ ์น๊ธฐ ์ํ ์คํ์ผ ์ฝ๋๋ฅผ ๋ ์ถ๊ฐํด์ผ ๋ ๋๊ฐ ์์ต๋๋ค.
์ ๋๋ฉ์ด์ ์ ๊ฒฝ์ฐ๋ ๋ง์ฐฌ๊ฐ์ง๋ก ํ ์ชฝ์์ ์ ์๋ํ๋ค๊ณ ํด์ ๋ค๋ฅธ ์ชฝ์์๋ ์ ์๋ํ ๊ฒ์ด๋ผ๋ ๊ฒ์ ๋ณด์ฅํ ์ ์๊ธฐ ๋๋ฌธ์ ์ ๋๋ฉ์ด์ ๊ฐ๋ฐ ์ดํ์๋ ๊ฐ ๊ธฐ๊ธฐ์์ ์ ์๋ํ๋์ง ํ์ธํ๋ ์์ ์ ํ์์ ์ ๋๋ค.
๐ ์ฑ๋ฅ ๋ฌธ์
๋ค์ดํฐ๋ธ ๋ธ๋ฆฟ์ง๋ฅผ ์ฌ์ฉํด JS ์ค๋ ๋์ ๋ค์ดํฐ๋ธ ์ค๋ ๋๋ฅผ ์ฐ๊ฒฐ์์ผ ๋์ํ๊ธฐ ๋๋ฌธ์ ๋ค์ดํฐ๋ธ ์ฑ๋ณด๋ค ์ฑ๋ฅ์ด ๋จ์ด์ง๋๋ค.
๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ ๊ฐ๋ฐ์ ํ ๋์๋ ์ต์ ํ์ ๋ํด์ ์ ๊ฒฝ์ ์จ๊ฐ๋ฉด์ ๋ญ๋น๋๋ ๋ ๋๋ง์ ์ค์ฌ๊ฐ๋ฉด์ ๊ฐ๋ฐ์ ํด์ผ ์ฑ์์ ๋์ ์ฑ๋ฅ์ ๋ณด์ ๋๋ค.
๐ ์ ์ ์ ๋ณด
React Native์ ๋ํ ํ์ต ์๋ฃ์ ์ ๋ณด๋ค์ด ์ ๊ธฐ ๋๋ฌธ์ ๋ฌธ์ ๊ฐ ์๊ฒผ์ ๋ ์ง์ ํด๊ฒฐํด์ผ ํ๋ ๊ฒฝ์ฐ๊ฐ ๋ง์ต๋๋ค.
๐ React-Native ํ๋ก์ ํธ ์์ฑ ๋ฐฉ๋ฒ
๐ React Native CLI
๐ ์ฅ์
- ์ง์ ๋ค์ดํฐ๋ธ๋ก ์ดํ๋ฆฌ์ผ์ด์ ์ ๊ฐ๋ฐ ๊ฐ๋ฅ
- ํ์ํ ๊ธฐ๋ฅ์ด ์๋ ๊ฒฝ์ฐ, ๋ชจ๋์ ์ง์ ๋ง๋ค์ด ์ฌ์ฉ ๊ฐ๋ฅ
- ๋ค์ํ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ฌ์ฉ ๊ฐ๋ฅ
- ๋ค์ดํฐ๋ธ ๋ชจ๋ ์ฌ์ฉ ๊ฐ๋ฅ
๐ ๋จ์
- ๊ธฐ๋ณธ์ ์ผ๋ก Android, IOS์ ๋ํ ๋ค์ดํฐ๋ธ ์ง์์ด ํ์์ (๋์ ๋ฌ๋์ปค๋ธ)
- ๊ธฐ๋ณธ์ ์ธ ์ค์ ์ด ๋์ด ์์ง ์์ ์ด๊ธฐ ์ค์ ์ด ๊น๋ค๋ก์
- ๋น๋์ ํ๋ซํผ๋ง๋ค Android Studio, Xcode์ ์ด์ฉํ ๋ณ๋์ ๊ณผ์ ๊ณผ ์ฅ๋น๊ฐ ํ์ (๋งฅ๋ถ, ์์ดํฐ)
๐ Expo CLI
๐ ์ฅ์
- ์ด๊ธฐ ๊ตฌ์ฑ์ด ์ฌ์ด์ ๋น ๋ฅด๊ณ ๊ฐํธํ๊ฒ ์ค์น๊ฐ ๊ฐ๋ฅ
- React Natvie๋ฅผ ์ํ ๊ธฐ๋ณธ ์ค์ ์ ๋ฏธ๋ฆฌ ๊ตฌ์ฑ
- ์ง์ ๊ฐ๋ฐํ๊ธฐ ์ด๋ ค์ด ๊ธฐ๋ฅ๋ค ๊ธฐ๋ณธ ํ์ฌ (์ฑํธ์, ์ ํ๋ก๊ทธ์ธ ๋ฑ)
- ๋ค์ดํฐ๋ธ ํ์ผ๋ค์ ๊ฐ๋ฐ์์๊ฒ ์จ๊ฒจ๋๊ณ Expo๊ฐ ์๋์ผ๋ก ๊ด๋ฆฌ
- Android / Xcode๋ฅผ ์ค์นํ์ง ์์๋ QR์ฝ๋๋ฅผ ํตํด์ ํด๋น ํ๋ก์ ํธ๋ฅผ ์คํ
- Apple / Google Store์ ๋ฐฐํฌ์ ์
๋ฐ์ดํธ๋ฅผ ํ๊ธฐ์ ๊ฐํธํ๋ค.
- ๋ฐฐํฌ๋ง๋ค ๊ฒ์ฌ๋ฅผ ๋ฐ์ง ์๋๋ค.
- Expo Wrapper๋ฅผ ํฌํจํ Standalone ์ฑ ๋ฐฐํฌ๊ฐ ๊ฐ๋ฅํ๋ค.
๐ ๋จ์
- ์จ๊ฒจ์ ธ ์๋ ๋ค์ดํฐ๋ธ ํ์ผ์ ์์ ํ๊ธฐ๊ฐ ๋ถ๊ฐ๋ฅ์ ๊ฐ๊น๋ค.
- expo์์ ์ง์ํ์ง ์๋ ๋ค์ดํฐ๋ธ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ ์ธ ์ ์๋ค.
- ๋ค์ดํฐ๋ธ ์์ญ์ ์์ ํ ์ ์์ด ์ผ์ ์์ค ์ด์์ผ๋ก ๊ฐ๋ฉด ๋ช ํํ ํ๊ณ๊ฐ ์๋ค.
- Expo ์๋ฒ๋ก ๋น๋ํ ๊ฒฝ์ฐ ๋ฌด๋ฃ ์ฌ์ฉ์๋ค์ ์จ์ดํ ํ๋ฏ ์์ ์ ์ฑ ๋น๋๋ฅผ ์ฐจ๋ก๊ฐ ์ฌ ๋๊น์ง ๊ธฐ๋ค๋ ค์ผ ํ๋ค.
๐ ํ๊ธฐ
์ฒซ ๋ฆฌ์กํธ ๋ค์ดํฐ๋ธ ํ๋ก์ ํธ ์์ฑ์ ์์ ์ด๋ฐ ์ ๋ฐ ๊ธ๋ค์ ์ฐพ์๋ดค์์ต๋๋ค.
๊ฑฐ์ ๋ชจ๋ ๊ธ๋ค์ ์ ๋ ํ์ง๋ง ๋ค๋ค ํ๋ ๋ง๋ค์ "๊ฒฐ๊ตญ ejectํ๋ค"๋ก ๋ชจ์์ก์ต๋๋ค.
๊ทธ๋๋ ์ฑ๊ฐ๋ฐ์ ๋ํ ์ง์์ด ์ ๋ฌดํ ์ํฉ์์ ๋์ปฅ CLI๋ก ๊ฐ๋ฐํ๊ธฐ์ ๊ฒ๋ Expo๋ก ํ๋ก์ ํธ๋ฅผ ์์ฑํ์ต๋๋ค.
ํ๋ก์ ํธ๋ฅผ ์์ฑํ๊ณ ์ฑ์ ์คํ์ํค๋๋ฐ๊น์ง๋ ๋๋ฌด๋ ์ฝ๊ฒ ์งํํด ๋ณ๊ฑฐ ์๋ค๊ณ ์๊ฐ์ ํ์ง๋ง
์ผ๋ง ๊ฐ์ง๋ ์์ ๊ณ ๋น๋ฅผ ๋ง๋๊ฒ ๋ฉ๋๋ค.
์ฑ ๊ธฐํ์ ์๋ ๊ธฐ๋ฅ๋ค์ ๊ฐ๋ฐํ๊ธฐ ์ํด์ ๋ช๋ช๊ฐ์ ํน์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๊ฐ ํ์๋๋ ์ํฉ์ด์๋๋ฐ
Expo ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ๋ค์ ธ๋ณด๋ ์ง์์ ์ํ๊ณ , ์ผ๋ง ์๋ ๋ธ๋ก๊ทธ ๊ธ์ ์ฐพ์๋ด๋ CLI ๊ด๋ จ ๋ด์ฉ๋ค๋ง ์๋๋ฃฉํ์ต๋๋ค.
๊ทธ๋ ๊ฒ ํ๋ฌ๋ฆฌ๋ ๋ง์์ผ๋ก eject๋ฅผ ํ ํ ์ด๋์ ๋ ๊ธฐ๋ฅ์ ์ธ ๋ชจ์ต์ ๊ฐ์ถ๊ฒ ๋ง๋ ์ง๊ธ,
๋์ด์ผ๋ณด๋ฉด CLI์ ๊ทธ๋ ๊ฒ ๊ฒ๋จน์ง ์์์ด๋ ๋ ๊ฒ ๊ฐ์์ต๋๋ค.
์๊ฐ๋ณด๋ค Expo์ ๋นํด ๊ทธ๋ ๊ฒ ์ด๋ ต์ง ์์ผ๋ฉฐ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ ํ์ ํญ์ด ๋ ๋์ด์ ธ์ ์คํ๋ ค eject๋ฅผ ์ผ์ฐ ํ๊ธธ ์ํ๋ค๊ณ ๋๋๋๋ค.
๋ํ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ์ค์น์ ๊ฒฝ์ฐ expo๋ ์๋๋ก์ด๋, IOS ๋ ๋ค ์ค์น๋ฅผ ์๋์ ์ผ๋ก ํด์ฃผ์ง๋ง CLI์ ๊ฒฝ์ฐ ์ด๋์ ๋ ์๋์ผ๋ก ์ค์ ํด์ค์ผ ํ๋ ๊ณผ์ ์ด ์๋๋ฐ ์ด ๊ฒ ๋ํ ๋ผ์ด๋ธ๋ฌ๋ฆฌ ๊ณต์๋ฌธ์๋ ๋ธ๋ก๊ทธ ๊ธ์ ๋ณด๋ฉด ์ค์น ๊ณผ์ ์ ์น์ ํ๊ฒ ์๋ ค์ค ํฌ๊ฒ ์ด๋ ค์ด ๋ถ๋ถ๋ ์์์ต๋๋ค.
์ด๋์ ๋ ์ฌ์ฉํด๋ณธ ์ง๊ธ ๊ฒฐ๋ก ์ ๋ด๋ฆฌ์๋ฉด ํธ๋ํฐ ์์ฒด ๊ธฐ๋ฅ์ ์ฌ์ฉํ ๊ธฐ๋ฅ์ด ๋ง์ ์ดํ์ ๊ฒฝ์ฐ CLI๋ฅผ ์ฌ์ฉํ๊ณ ,
JS์ ๋น์ค์ด ๋์ ๊ฐ๋จํ ์ดํ์ ๋ง๋ค ๊ฒฝ์ฐ Expo๋ฅผ ์ถ์ฒํฉ๋๋ค.
๊ทธ๋๋ ํ๋ฒ CLI ๋์ ํด๋ณด์ธ์.
๐ 2025๋ "React Native CLI" vs "Expo" ๊ทผํฉ
2025.01.15 - [React-Native] - 2025๋ React Native ํํฉ๊ณผ CLI vs Expo ๋น๊ต๋ถ์
2025๋ .
์ด ๊ธ์ ์์ฑํ์ง ์ผ๋ง ์ง๋์ง ์์๋๋ฐ RN ์ํ๊ณ์๋ ์์ฒญ๋ ๋ณํ๊ฐ ์์์ต๋๋ค.
RN CLI์ Expo ๊ทผํฉ์ด ๊ถ๊ธํ์๋ค๋ฉด ์ ๊ธ์ ์ถ์ฒ๋๋ฆฝ๋๋ค.
๋๊ธ