이제 React Native 개발을 위해 Expo를 설치해 봅시다.
사이트(https://expo.io/learn)에 방문하여,
STEP02 항목의 [Download Node.js]버튼을 눌러
Node.js를 설치합니다(최신 버젼이던 범용버젼이던 관계없음).
Node.js는 JS기반의 프로그램을 개발할 수 있는 플랫폼인데, 상세한 사용법은 패스하고,
Expo 설치과정 설명 위주로 포스팅 하겠다.
|
Node.js는 JS기반으로 구성된 서버 사이트 서비스를 JS로 구현할 수 있게 만든 런타임이다. 정적 파일 서버, 웹 응용프로그램, 메시징 미들웨어, HTML5 멀티 플레이어 게임용 서버 등을 만들 수 있으며, 특히 실시간 웹 애플리케이션 개발하기 좋은 기술이다. |
Expo는 Node에 패키지 형태로 구성되어 구동되는 시스템인거 같다.
설치는 굉장히 오래 걸립니다(전 20분 이상 걸린 것 같네요).
도중에 Enter도 눌러줘야 하고, 멈춘것 같지만, 그냥 오래 걸리는 화면에서 딴일 하다보니
어느새 설치화면 창이 사라져 있더군요.
Node가 다 설치되었으면 Expo를 설치해 봅시다.
STEP03
CMD화면에 npm install expo-cli --global 를 입력해주면 Expo가 설치됩니다.
|
npm이라는 생소한 용어가 나오는데, Node Package Manager의 약어로, node.js기반으로 개발된 오픈 소스를 모듈화 하여 관리하는 모듈이다. npm을 이용하여 웹 개발에 필요한 jQuery, gulp, webpack 등의 모듈을 npm명령어를 통해 쉽게 다운받아 쓸 수 있다. npm에 대한 상세 설명은 여기로 > https://docs.npmjs.com/about-npm/ |
설치가 끝나면, 다음과 같이 표기되면서, 설치가 종료됩니다.
STEP 04
역시 CMD창에서 expo init my_project 를 입력하여 프로젝트를 생성해 줍니다.
그러면 아래와 같은 선택화면이 뜨는데, blank 선택 그대로 Enter를 누르면 됩니다.
잠시 시간이 소요된 후 프로젝트가 생성되었다고 뜹니다.
STEP 04의 나머지 문구를 입력하여 실행 가능하다는 안내도 해주는 군요.
cd my_project
npm start
를 입력하면, 개발환경 화면이 브라우져에 뜨게 됩니다.
개발환경에서 코딩 후, 여기서 "Run in web browser"를 누르면
웹 환경에서 실행 결과를 볼 수 있다(다음 포스팅에서 테스트).
또한 코딩한 결과를 폰에서 보기 위해서는 OS에 맞게 expo 앱을 설치합니다.
| 아이폰 설치: https://itunes.apple.com/app/apple-store/id982107779 안드로이드 설치: https://play.google.com/store/apps/details?id=host.exp.exponent |
설치 및 실행환경 구축편은 여기까지.
다음 글에서는 코딩환경 구축 및 실행을 해보도록 하겠습니다.
참고자료
*전반 컨텐츠 : https://expo.io/
*Node, npm관련 설명 : https://kdydesign.github.io/2017/07/15/nodejs-npm-tutorial/
'React Native공부' 카테고리의 다른 글
| 5.1_MAC에서 실행환경 구축 (맥북 세팅) (0) | 2020.04.10 |
|---|---|
| 6_Visual Studio Code로 코딩환경 구축하기 (0) | 2020.04.06 |
| 4_개발환경 설명(Expo CLI / React Native CLI) (0) | 2020.03.31 |
| 3_React Native 기초 - 기본 문법구조, props (0) | 2020.01.20 |
| 2_React에 대한 기본이해 - JavaScript (4) | 2020.01.18 |
