Dev/MobileApp

[React Native] React Native cli 로 시작하기

隣席の開発者群 2023. 6. 8. 16:38
반응형

 

자꾸 같은 내용으로 글 뻥튀기 하는 것 같아서 조금 그렇긴 한데, 처음이라고 겁먹어서 Expo로 세팅했다가 그냥 react 자체를 모르는 것도 아니고 react-native 로 세팅하는걸 겁내는 내가 너무 애송이 같아 시도해보고 왔다. 

 

1. react-native-cli / react-native 설치

$ npm install -g react-native-cli
$ npm install -g react-native

내가 처음에 어지러웠던 이유가 제대로 된 절차를 알려주지 않는 포스팅을 보고 따라하다가 아니 똑같이 했는데 왜 안돼?! 라는 상황이 와서 어지러웠던건데 스택오버플로우 들어갔더니 걍 해결됐다. 진짜 개발하는 사람들 공부용 포스트 보고 따라하지말고 그냥 스택오버플로우 보고 따라하자. 거기가 그냥 최고다. 

 

원래 제대로 된 절차는 저 위에 두개를 모두 설치해줘야하는데, 내가 봤던 포스팅은 cli만 설치하고 있었다. 그래서 실행시켜보면 자꾸 

init is not a function 에러가 나는거였음. 둘 다 설치해주면 아주 속시원할만큼 

이렇게 이쁘게 준비가 되었다는 메세지가 뜬다.

 

그리고 프로젝트 IDE로 열어보면 (일단 난 인텔리제이 기준임.)

뭐 프레임워크를 감지했다느니 하는 알림이 뜨면서 설정해줄거냐고 묻는데 그거 설정안하면 Android SDK 어딨냠서 빌드에러 

미친듯이 뱉어내니까 꼭 설정해주면 된다. 그냥 config든 뭐 add 든 메세지에 같이 떠있는 하이퍼링크 클릭 해주면 뜨는 팝업에서 Apply든 Ok 든 눌러주기만 하면 된다. 

그리고 자연스럽게 에뮬 켜주고 yarn android든 yarn ios든 해주기만 하면 알아서 빌드하고 알아서 결과물을 에뮬에 띄워주는데 

이런 화면이 뜨면 정상적으로 빌드되고 실행까지 됐다고 보면 되겠다. 

이제 여기서 부터는 리액트랑 크게 다르지 않으리라고 스스로 정신승리하면서 간단한 앱 클론 코딩을 하거나 할 것 같은데,

관련해서 생기는 이슈나 썰은 새로운 앱개발 카테고리에서 풀도록 하겠다.

LIST

'Dev > MobileApp' 카테고리의 다른 글

[PWA] Vite + React App PWA 배포하기  (1) 2024.09.05
[APP] 앱 개발을 시작하기 전에  (0) 2023.06.09
[Flutter] Template 실행시켜보기  (0) 2023.06.08
[React Native] EnvSet  (0) 2023.06.08
[Flutter] EnvSet  (0) 2023.06.07