react-native-viva-ui
v0.0.18
Published
이 프로젝트는 react-native-cli를 바탕으로 만들었습니다.
Downloads
22
Readme
viva-ui
이 프로젝트는 react-native-cli를 바탕으로 만들었습니다.
Getting Started
우선 개발을 위해서는 Homebrew, Nodejs, Watchman, Xcode, react-native-cli를 설치해야 합니다.
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
brew install node
brew install watchman
npm install -g react-native-cli
ios
Xcode를 설치해줍니다 Xcode 다운로드 링크:https://apps.apple.com/us/app/xcode/id497799835?mt=12
Xcode 설치가 완료되면, Command Line Tools를 설정할 필요가 있습니다. Xcode를 실행하고 상단 메뉴에서 Xcode > Preferences... > Locations로 이동하여 Command Line Tools가 잘 설정되었는지 확인합니다. ex) Xcode 13.1 (13A1030d). 만약 설정되어있지 않다면 dropdown 메뉴를 선택하여 가장 최신의 Command Line Tool을 선택해 줍니다.
Cocoapods을 설치해줍니다. ios 개발에 사용되는 의존성 관리자입니다.
Cocoapods:https://cocoapods.org/
sudo gem install cocoapods
비쥬얼스튜디오코드로 프로젝트 파일을 오픈합니다. 그 후 아래의 실행어를 입력합니다
npm install
pod install 실행합니다.
cd ios && pod install && cd ..
터미널에 react-native start를 실행 후 다른 터미널에 react-native run-ios를 실행합니다.
npx react-native start
npx react-native run-ios
android
react-native 공식문서에서 Homebrew를 통해 JDK를 설치하는걸 권장하고 있습니다.
brew install --cask adoptopenjdk/openjdk/adoptopenjdk8
JDK를 통해 자바가 잘 설치되었다면 아래와 같은 버전을 확인 할 수 있습니다.
java -version
openjdk version "1.8.0_292"
OpenJDK Runtime Environment (AdoptOpenJDK)(build 1.8.0_292-b10)
OpenJDK 64-Bit Server VM (AdoptOpenJDK)(build 25.292-b10, mixed mode)
안드로이드 에뮬레이터 실행을 위해서는 안드로이드스튜디오 설치가 필요합니다. Android Studio Download
안드로이드 설치를 진행하면서 해당 항목을 체크해줍니다.
- Android SDK
- Android SDK Platform
- Android Virtual Device
- Performance (Intel ® HAXM)
안드로이드 SDK 설치가 필요합니다. 안드로이드 스튜디오에서 Appearance & Behavior → System Settings → Android SDK 이동합니다. 또는 최초 실행시 우하단에 있는 configure → SDK Manager로 이동합니다.
SDK Platforms 탭의 오른쪽 하단에 있는 Show Packges Details 체크박스를 체크합니다.
Android 10 (Q)에서 해당 항목을 체크합니다.
- Android SDK Platform 29
- Intel x86 Atom_64 System Image
- Google APIs Intel x86 Atom System Image
- Google APIs Intel x86 Atom_64 System Image
터미널을 실행해서 프로젝트 경로에서 .bash_profile 또는 .zshrc 파일이 있는지 확인 해줍니다. 없으면 아래의 명령어로 생성해줍니다.
touch .bash_profile
ANDROID_HOME 환경설정이 필요합니다. ~/.bash_profile 또는 ~/.zshrc 설정파일을 열어서 아래 경로들을 추가합니다.
안드로이드 SDK 위치는 SDK Manager 창의 상단에 Android SDK Location에 써있습니다.
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/emulator
export PATH=$PATH:$ANDROID_HOME/tools
export PATH=$PATH:$ANDROID_HOME/tools/bin
export PATH=$PATH:$ANDROID_HOME/platform-tools
만약 .bash_profile을 사용하는 경우 아래의 명령어를 실행해주세요
source ~/.bash_profile
또는
source ~/.zshrc
환경변수에 설정이 완료 된 후 터미널에 다음의 실행어를 입력합니다.
adb
설정이 완료되었다면 아래의 결과로 나옵니다.
Android Debug Bridge version 1.0.41
Version 31.0.3-7562133
Installed as /안드로이드 SDK 위치/platform-tools/adb
비쥬얼스튜디오코드로 프로젝트 파일을 오픈합니다. 그 후 아래의 실행어를 입력합니다
npm install
터미널에 react-native start를 실행 후 다른 터미널에 react-native run-android를 실행합니다.
npx react-native start
npx react-native run-android
터미널에서
Error type 3
Error : Activity class {com.component/com.component.MainActivty} does not exist.
해당 오류가 나온다면 실행된 에뮬레이터에서 앱을 다시 실행시키면 실행이 됩니다.