[ํด๋ผ์ฐ๋ฉ ์ดํ๋ฆฌ์ผ์ด์ ์์ง๋์ด๋ง TIL] 240328 - SNS ์ฑ ํด๋ก๋ ํ๋ก์ ํธ (1)
Intro
์ง๋ React Native ๊ฐ์๋ฅผ ํ ๋๋ก ์ค๋๋ถํฐ ๋ ๋ค๋ฅธ ๊ฐ์ธ ํ๋ก์ ํธ๊ฐ ์์๋๋ค.
SNS์ ๋น์ทํ ์ค์ด์ ํผ๋ ์ฑ์ ์ ์ํ๋ ๊ฒ์ด๋ค.
ํ๋ก์ ํธ ์งํ ์ฌํญ
ํ๋ก์ ํธ ํ์ ๊ธฐ๋ฅ
- ํผ๋ ๋ฆฌ์คํธ
- ํผ๋ ๊ฒ์
- ํผ๋ ์ ๋ก๋
- ์ฝ๋ฉํธ ๋ฆฌ์คํธ/์ฝ๋ฉํธ ์์ฑ
- DM ๋ฆฌ์คํธ
- DM ์์ธํ๋ฉด
๊ทธ ์ธ ์ ํ์ผ๋ก ๊ตฌํ ๊ฐ๋ฅํ ๊ธฐ๋ฅ์ ์๋์ ๊ฐ๋ค.
- ๋ก๊ทธ์ธ/ํ์๊ฐ์
- ํ๋กํ/ํ๋กํ ์์
- ์๋ฆผํจ
- ํ๋ก์ฐ/ํ๋ก์
- ์ฑ ์ค์
ํ๋ก์ ํธ ๊ธฐํ/๋์์ธ
"์ค์ด์"์ด๋ ๋จ์ด๋ฅผ ๋ค์ผ๋ ์์ฆ ๋น ์ ธ์๋ ํด๋ผ์ด๋ฐ์ด ์๊ฐ๋ฌ๋ค.
ํด๋ผ์ด๋ฐ์ ์ข์ํ๋ ์ฌ๋๋ค๋ง์ SNS๋ฅผ ๋ง๋ค๋ฉด ์ข์ ๊ฒ ๊ฐ์ ํด๋ผ์ด๋ฐ์ ์ฃผ์ ๋ก ์ก๊ณ ๋์์ธํด ๋ณด์๋ค.
ํ์ ๊ธฐ๋ฅ์ ํฌํจํ๋ ์ฑ์ ์๊ฐ ๋ด์ ๋ง๋ค๊ธฐ ์ํด์ ๋ง์ ๊ธฐ๋ฅ์ ์ถ๊ฐํ์ง ๋ชปํ๋ค.
ํ๋ก์ ํธ ์ธํ
์ด๋ฒ ํ๋ก์ ํธ์์ JS๊ฐ ์๋ TS๋ฅผ ์ฌ์ฉํ์ฌ ๊ฐ๋ฐํด๋ณด๊ธฐ๋ก ํ๋ค.
- ํ๋ก์ ํธ ์ธํ
npx react-native@latest init ProjectName
- ios bundle install
cd ProjectName
cd ios
bundle install
bundle exec pod install
ํ๋ก์ ํธ์ React-Native๋ฅผ ์ค์นํ๋ฉด ํ์ ์คํฌ๋ฆฝํธ๋ฅผ ์ฌ์ฉํ ์ ์๋ ํ๊ฒฝ์ด ์๋์ผ๋ก ์ธํ ๋์ด ์๋ค.
tsconfig ํ์ผ๋ง ์์ ํด์ฃผ์๋ค.
- tsconfig.json
{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": ["src/*", "src/**/*"],
"exclude": ["node_modules"]
}
๋ง๋ฌด๋ฆฌ
ํ๋ก์ ํธ ๊ธฐ๊ฐ์ด ์งง๋ค๋ณด๋ ๊ธฐํ/๋์์ธ์ ๋ง์ ์๊ฐ์ ์ธ ์ ์์๋ค.
์ฐ์ ์ SNS ํผ๋ ์์ฃผ ๊ตฌํ์ ๋ชฉํ๋ก ํ๊ณ ์๊ฐ์ด ๋๋ค๋ฉด ์ข ๋ ํด๋ผ์ด๋ฐ์ ์ํ ์ฑ์ค๋ฌ์ด ์ฑ์ ๋ง๋ค์ด๋ด์ผ์ง!