[설치 및 설정] - 안드로이드, IOS 로만들기

2025. 11. 9. 09:08프로젝트/달력 프로젝트

알게된점 : WEB개발이랑 IOS는 똑같다.

 

----- 설치 목록 -----

[ 프론트 앤드]

- Homebrew

- npm

- node

- xcode(IOS 개발 환경을 위함... 아이폰 버전에 맞추어 화면을 보여줌)

- watchman(파일 변경 감지)

[백앤드]

 

- VSCODE

 

여러가지 앱 개발 방식 중...

크로스플랫폼 모바일 앱 (React Native)

  • React 경험을 활용
  • iOS + Android 동시 개발 가능

선택한 이유 : react로 프로젝트 한 경험이 있어서, 하지만 typescript는 현업에서 잠깐 써보아서 아쉬운이 남았다. 그래서 Type에 대한 관리가 쉽다고 생각해서 선택했습니다.(특히, 런타임(실행도중 발생) 에러 방지)

 

환경 : 맥북 m2 pro 13인치

 

 

-- 설치 유무 확인하는 코드

echo "=== React Native 환경 체크 ==="
echo ""

echo "1. Homebrew:"
if command -v brew &> /dev/null; then
    echo "   ✅ 설치됨 ($(brew --version | head -n1))"
else
    echo "   ❌ 설치 필요"
fi

echo "2. Node.js:"
if command -v node &> /dev/null; then
    echo "   ✅ 설치됨 ($(node --version))"
else
    echo "   ❌ 설치 필요"
fi

echo "3. npm:"
if command -v npm &> /dev/null; then
    echo "   ✅ 설치됨 ($(npm --version))"
else
    echo "   ❌ 설치 필요"
fi

echo "4. Watchman:"
if command -v watchman &> /dev/null; then
    echo "   ✅ 설치됨 ($(watchman --version))"
else
    echo "   ❌ 설치 필요"
fi

echo "5. Xcode Command Line Tools:"
if xcode-select -p &> /dev/null; then
    echo "   ✅ 설치됨 ($(xcode-select -p))"
else
    echo "   ❌ 설치 필요"
fi

echo "6. CocoaPods:"
if command -v pod &> /dev/null; then
    echo "   ✅ 설치됨 ($(pod --version))"
else
    echo "   ❌ 설치 필요"
fi

echo "7. Android SDK:"
if [ -d "$ANDROID_HOME" ]; then
    echo "   ✅ 설치됨 ($ANDROID_HOME)"
else
    echo "   ❌ 설치 필요 (Android 개발시)"
fi

echo ""
echo "=== 체크 완료 ==="

 

설치 명령어
brew install cocoapods


특정 아이폰 버전 실행 명령어

npm run ios -- --simulator="iPhone 15 Pro"

프로젝트 생성 명령어
npx @react-native-community/cli@latest init DalityApp --template react-native-template-typescript

expo로 프로젝트 생성
npx create-expo-app MyFirstApp --template blank-typescript

 

vs code

# Homebrew로 설치
brew install --cask visual-studio-code

# 또는 https://code.visualstudio.com 에서 다운로드
```

---

## VS Code 필수 확장 프로그램

설치 후 이것들을 꼭 설치하세요:
```
1. React Native Tools (Microsoft)
   - 디버깅, IntelliSense 지원

2. ES7+ React/Redux/React-Native snippets
   - 코드 자동완성 (rfc, rafce 등)

3. Prettier - Code formatter
   - 코드 자동 정리

4. ESLint
   - 코드 품질 검사

5. Auto Rename Tag
   - JSX 태그 자동 수정

6. Path Intellisense
   - 파일 경로 자동완성

 

xcode 설정 및 설치

# Xcode 처음 실행 (라이센스 동의 필요)
sudo xcodebuild -license accept

# Command Line Tools 설정
sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer

# 시뮬레이터 확인
xcrun simctl list devices

 

 

 

격은 문제

- React Native 버전과 Node 버전 호환 충돌