React Native 0] React Native 설치와 Expo설치

React Native 공부는 노마드 코더의 'React Native로 날씨앱 만들기'를 보면서 실습을 따라할 것이다.
https://nomadcoders.co/react-native-fundamentals/lectures/1569

Introduction

-이 강의에서는, 크로스 플랫폼 ios와 안드로이드 앱을 만들 것
-리액트와 결합된 자바스크립트 + 엑스포의 파워를 이용할 것
- 리액트와 자바스크립트는 알아야 함

Requirements

1. node js의 10버전 이상과 npm이 필요

다행히 나는 12버전인 node js와 npm이 설치되어있다.

2. expo 설치

mac으로 작업 -> Xcode가 있어야한다. 그래야 강의에 필요한 시뮬레이터도 가질 수 있다.
윈도우나 리눅스 -> 시뮬레이터가 포함된 안드로이드 스튜디오가 설치되어있어야 한다.
(어플리케이션을 실행시키기 위해서)

하지만 Xcode나 안드로이드 스튜디오로 작업하기 싫다면, 그냥 폰만 있으면 된다.
expo를 이용해 할 수 있기때문!!
(expo가 있으면 프로젝트를 핸드폰에서 실행시켜 볼 수 있고, 포트폴리오처럼 클라이언트들에게 실행시켜보도록 할 수 있기때문에 계정이 있으면 매우 좋음)

그러므로 난!! expo를 설치할 것이다...ㅎㅎ

아이폰 -> app store에서 expo를 설치
안드로이드 -> play store에서 expo를 설치

나의 경우는 아이폰!!
핸드폰의 app store에서 expo를 검색하여 설치하였다.

이렇게 앱을 설치해주고, 실행시키면 아래와 같은 화면이 뜬다.

3. expo cli 설치

아래 링크에서 코드를 복사해 온 뒤, expo cli를 설치한다.
https://reactnative.dev/docs/environment-setup

저 동그라미 친 코드를 복사해 온 뒤에, 설치를 기다린다.
엄청 오래걸려서 짜증났다....ㅎㅎ 하지만 그럴 수 있지 냠냐

우리는 global로 설치할 것이기에 홈페이지에 적힌 코드 중 -g옵션을 그대로 사용할 것이다.

....어쨋든.....설치 완료.....

Expo vs React Native CLI

expo?
기본적으로 creact react app 같은 것이다.
리액트 네이티브를 위한 설정 파일같은 것들이 따로 없는 방식으로, 모든 것이 셋업이 되어있다.
모든 native files들을 숨기고, 모든 것을 알아서 관리해준다.
expo의 가장 큰 장점은 휴대폰에서 앱을 테스트할 수 있다는 것!!
유일한 단점은 native files들을 크게 제어할 수 없다는 것이다.
만약 리액트 네이티브를 수동으로 작업하고 싶으면 React Native CLI를 클릭하면 된다.

expo는 더 나은 개발자 경험을 제공하고, 앱을 만드는 방식을 알아서 처리해준다.
- simulation 처리
- react native 업데이트 처리
- 잘 정리된 문서
- 더 많은 모듈들 (API)
(ex. payments, printing, sensors, SQLithe, Crypto 등등.....하지만 이건 React Native에서 지원 X)

React Native CLI?
커맨드라인 인터페이스이며,
node, watchman, react-native-cli를 설치해야 한다.
그 다음으로는 사이트에 나온대로 따라하면 된다.
React Native CLI방식은 native files들을 더 많이 컨트롤 하고 싶을 때를 위한 것이다.
앱을 테스트 하려면 여러가지에 계정을 가져야하며, 로그인 해야 한다. (성가심 ㅎㅎ)
또한 많은 모듈들을 수동으로 하나하나 설치해야한다.

expo에서는 native file에 접근할 수 없지만, 대부분의 경우엔 필요없다.
엄청엄청 대기어이 아니라면!!
선생늼도 expo로 인스타그램 앱을 만들었으니....나도 그냥 expo로 할래