ReactNative
페이스북이 만든 오픈소스 모바일 애플리케이션 프레임워크
Javascript로 iOS와 Android를 동시에 개발할 수 있다.
-
보통은 OS에 맞는 언어로 개발- iOS는 Swift
와 Objective-C
, Android는 Kotlin
, Java
-
하나의 서비스를 위해 iOS와 Android를 따로 개발하면 유지보수 비용과 시간이 많이 필요하다. 이를 해결하기 위해 하이브리드 웹앱, RN, 하이브리드 앱 등 등장
ios/android 소스가 다르면 양쪽이 다 잘 돌아가는지 점검해야함 - 한쪽만 되는 경우 왕왕
양쪽을 다 할 수 있는 언어를 만들자! → React Native
!
React Native · Learn once, write anywhere
오픈소스 - 신뢰성, 상용화 가능? / 오픈소스의 라이선스가 무엇인지 확인해야함
ReactNative의 장점
- 컴포넌트 기반으로 재사용성이 뛰어나다
- 리액트 기반이기 때문에 러닝커브가 적다.
- 크로스플랫폼으로 개발하기 때문에 생산성이 좋다.
- 모바일 앱 디버깅이 아닌 자바스크립트 디버깅을 사용한다.
- 따라서, Hot Reloading을 사용할 수 있기 때문에 소스코드 수정 후 다시 빌드해서 확인하는 네이티브 앱 방식과 다르게 실시간으로 확인이 가능하다.
ReactNative의 단점
- 아무래도 네이티브 앱보다는 성능이 떨어질 수밖에 없다.
- 네이티브 브릿지를 통해 자바스크립트 스레드와 연결해서 동작하더라도, 네이티브 방식보다는 성능이 떨어진다.
- 자바스크립트 스레드와 네이티브 스레드는 5ms주기로 네이티브 브릿지를 통해 통신한다.
- 5ms이상 시간이 걸리는 처리를 할 떄는 성능 저하를 경험할 수 있다.
Expo
리액트 네이티브를 베이스로 ios, aos, 웹 등을 개발하고 쉽게 빌드, 배포할 수 있게 도와주는 프레임워크!
Expo Documentation
Expo의 장점
- xcode나 안드로이드 스튜디오를 따로 배우지 않고 expo만으로도 앱 개발이 가능. expo가 이 두가지보다 상위버전 이기에, 내부적으로 두가지의 작업을 해낼 수 있다.
- 양쪽 소프트웨어(안드로이드/ios)를 오픈할 필요도, 각기 다른 플랫폼들에서 테스트를 거칠 필요도 없다.
- 윈도우에서 ios 앱을 빌드하는 것이 가능
-> 이는 서버로 데이터를 보내고, 서버에서 파일을 가지고 응답할 수 있다는 것@!
앱 하나로 양쪽 소프트웨어를 사용하는 디바이스에서 실행이 가능
- ' over the air updates ' : 앱을 자바스크립트로 작업하고, 내용을 변경할 때 따로 앱스토어에 승인을 요청할 필요가 없음
-> 보통 앱 개발 시에는 new버젼을 만들어 앱스토어에 퍼블리쉬 한 후, 인증을 받는 과정을 거쳐야 하지만 expo를 사용할 경우엔 생략됨.
- 또한 자바스크립트로 작업되어 내부적으로 자동 업데이트가 이뤄지기 때문에 직접 수정하고 에러를 고치는 시간을 단축할 수 있음!
Expo 시작하기
- nodejs.org → 들어가서 설치
- create a snack → expo go 에서 qr로 확인
- expo 설치
$ npm install expo-cli --global
뭔가 설치가 안돼서 애먹었는데 앞에 $ sudo
붙여서 실행하니까 해결됐음
- 프로젝트 생성
expo init 프로젝트이름
blank 선택하고 enter
- expo 실행
해당 폴더 안에 들어가서 expo start --tunnel
- tunnel : 외부 네트워크에서도 캐스트 가능 (와이파이, 5G 등)
expo start --web
: 웹에서도 변동사항 확인 가능
vscode에서 react ES7 설치
폴더 선택
터미널 명령어
ls
- 폴더 촤라락 보여줌
cd 폴더명
→ 해당 폴더로 이동 / cd..
상위 폴더로 이동 / cd 폴더명 앞글자 + Tab
pwd
현재 폴더 위치
mkdir
shift + 오른쪽 마우스 열기 → 터미널 열기