1. react-native cli 설치 npm install -g react-native-cli 2. react-nativce 프로젝트 만들기 react-native init projectname 3. 프로젝트 실행 ios를 실행시키고 싶으면 아래의 Run instructions for ios를 실행시킨다. android는 Run instructions fo Android를 실행시킨다. * 처음 설정 할 때 만났던 오류들 * error Error: Failed to install CocoaPods dependencies for iOS project, which is required by this template. 위 오류를 해결하기 위해서 ios 폴더로 이동하여 아래의 명령어를 입력하면 된다. sudo..

expo cli Vs react-native cli 이전에 expo cli와 react-native cli를 통해 개발 해본적이 있다. 둘을 서로 비교해보려고 한다. expo 장점 ㅇ 일단 배포하기에 너무 편하다. - 매번 배포할 때 마다 검사받아야 하는 것이 아니다. - expo서버에 위치하는 코드만 바꾸어 주면 되 기 때문이다. - update와 배포하는데 훨씬 편하다. ㅇ ios 없이도 expo client와 통해 iphone test 가능 (mac os에서만 가능) ㅇ android studio x-code 없이도 자기가 사용하는 툴을 갖고 개발 가능 ㅇ 빠르고 간단하게 프로젝트 설치 가능 단점 ㅇ java, kotlin, object-c, swift로 추가 작성못하고 이 것으로 작성된 원시 모듈..

AsyncStorage 사용하기 react-native내부에서 사용할 데이터베이스를 고민하다가 리액트 네이티브에서 제공해주는 간단한 AsyncStorage는 앱 전체적으로 사용할 수 있으며 비동기적이고 지속성있고 암호화 되어 있지 않는 모듈입니다. ios에서는 네이티브 코드 뒤에서 위치하며 작은 크기는 연속적으로 저장하며 큰 데이터는 분산하여 저장합니다. 안드로이드에서는 락스디비 혹은 sqllite를 기반으로 하여 사용할 수 있습니다. error가 있으면 error를 반환하고 또는 Promise를 반환하기도 합니다. 호출하기 import { AsyncStorage } from "react-native" 저장되어 있는 데이터의 키값 가져오기 AsyncStorage.getAllKeys(); array형태로 ..

react-navigation 안드로이드에서는 주로 Intent를 통해서 페이지를 이동하면서 다녔습니다. 리액트 네이티브에서는 리액트와 달리 Router가 아닌 react-navigation을 사용하여야 합니다. 하지만 이게 좀 사용하기에 까다롭다고 하는 사람이 많아서 다양한 회사에서 오픈소스로 만들었습니다. 1. facebook https://reactnavigation.org/docs/en/getting-started.html 2. Wix https://wix.github.io/react-native-navigation/#/ 몇개가 더 있긴 하지만 대표적인 두개를 소개했다. 이글에서는 facebook에서 만든 react-navigation을 사용하겠습니다. App.js App.js에서 기본적으로 있던..

react-native 개발 환경 설정하기 react native를 시작하기 위한 개발환경을 만들어 보겠습니다. 우선 expo를 사용하여 만들 것 입니다. https://expo.io/ expo의 장점 1. 소스코드가 바뀔때마다 자동으로 업로드 해줍니다. 예전 안드로이드 스튜디오로 코딩을 해줄 때는 귀찮게 코드 바꾸고 다시 run하고 기다리고를 반복했던 기억은 이제 안녕!!! 2. 업데이트할 때 편합니다. 안드로이드 어플을 배포해본적은 없지만 업데이트를 해줄 때마다 서버에 있는 소스 코드를 바꾸는 것이기 때문에 검사나 시간이 오래걸리지는 않습니다. 빠르게 업데이트가 가능합니다. expo 단점 1. 추가적인 java와 object-c코드 작성 못함 원래 react-native에서 추가적으로 object-c..