๊ฐœ๋ฐœ ๊ณต๋ถ€/๋ฐ๋ธŒ์ฝ”์Šค TIL

[ํด๋ผ์šฐ๋”ฉ ์–ดํ”Œ๋ฆฌ์ผ€์ด์…˜ ์—”์ง€๋‹ˆ์–ด๋ง TIL] 240328 - SNS ์•ฑ ํด๋กœ๋‹ ํ”„๋กœ์ ํŠธ (1)

๊ฐ€์šค์ด 2024. 3. 29. 10:36

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 ํ”ผ๋“œ ์œ„์ฃผ ๊ตฌํ˜„์„ ๋ชฉํ‘œ๋กœ ํ•˜๊ณ  ์‹œ๊ฐ„์ด ๋œ๋‹ค๋ฉด ์ข€ ๋” ํด๋ผ์ด๋ฐ์„ ์œ„ํ•œ ์•ฑ์Šค๋Ÿฌ์šด ์•ฑ์„ ๋งŒ๋“ค์–ด๋ด์•ผ์ง€!