React-Native 프로젝트 실행

 

 

 환경설정을 마쳤으니,

이제 안드로이드 스튜디오를 실행시켜,

안드로이드 에뮬레이터를 만들고,

실제 리액트 네이티브 프로젝트를 띄워보자ㅏㅏㅏ

 

안드로이드 에뮬레이터란?

안드로이드 스튜디오에서 제공하는 가상장치(AVD)로 앱을 실행시켜볼 수 있다

 만드는 방법

1. 안드로이드 스튜디오를 연다
   
   
2. Configure 항목에서 AVD Manager 를 선택한다
   
   
3. 만약, 처음 AVD를 만든다면, 2번이후에 나오는 화면에서
   Create Virtual Device를 누른다
   
   
4. 하드웨어 선택에서 Phone과 Pixel 3a 을 선택하고, ( 하드웨어 선택은 본인이 개발하고자 하는 기계를 따르자ㅏㅏ )
   Next를 누른다
   
   
5.  Recommended 탭 옆의 x86 Images 탭을 클릭하고,
   API가 29이고,
   ABI는 x86_64,
   Target은 Android 10.0(Google APIs)
   항목을 찾은 뒤 Download 링크를 눌러 시스템 이미지를 설치하고 Next를 누른다
   
   
6. Graphics에서 Software를 선택한다
   화면 아래의 Device Frame 항목의 Enable Device Frame 선택을 해제한 후, Finish 버튼을 누른다
   
   
7. 마지막으로, Actions 항목에서 실행 아이콘>을 누르면 AVD가 실행된다ㅏㅏ!!
   
   
   

에뮬레이터를 완성했으니,

이제 리액트 네이티브 프로젝트를 생성해보자ㅏㅏ!!

 

먼저, 터미널을 열어주자ㅏㅏ

( 나는 VScode를 들어가 터미널을 열어줬다ㅏㅏ )

그리고, 프로젝트를 생성해주자ㅏㅏ

npx react-native init [프로젝트 명]

이후, 생성된 프로젝트 경로로 이동해주자

cd [프로젝트 명]

// 이후, 안드로이드면,
react-native run-android

// ios면,
react-native run-ios

 

이렇게 해주면,

우리가 위에서 만들어 준 에물레이터에 리액트 네이티브 프로젝트가 실행된다ㅏㅏㅏ!!!

++
참고로 내가 만든 리액트 네이티브 플젝의 버전은 아래와 같다!!
21.08.02 기준

"react-native": "0.64.2"

에뮬레이터에 실행된 리액트 네이티브 화면

 

 

참고 : 

https://academy.realm.io/kr/posts/react-native/

리액트 네이티브로 시작하는 앱 개발 #1

 

https://dev-pengun.tistory.com/entry/%EB%94%94%EB%8D%B0%EC%9D%B4-%EC%95%B1-%EB%94%B0%EB%9D%BC-%EB%A7%8C%EB%93%A4%EB%A9%B0-%EB%B0%B0%EC%9A%B0%EB%8A%94-React-Native-1-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EB%84%A4%EC%9D%B4%ED%8B%B0%EB%B8%8C-%EB%A7%9B%EB%B3%B4%EA%B8%B0

[#1 리액트 네이티브 맛보기] 환경 구축부터 스토어 출시까지 디데이 앱 따라 만들며 배우는 React