어플개발/어플을 만들어보자!

[어플개발] 2. 그래서 뭐해야하지? 개발환경 세팅

aguuu 2021. 7. 8. 21:32
반응형

일단 언어는 react-native로 하기로 선택했고... 막막하다.

먼저 개발환경을 세팅하고 hello world라도 찍어보기로 했다.

아무래도 공식문서를 읽어보는게 제일 도움이 될거 같아 공식문서 페이지에 들어갔다.

https://reactnative.dev/docs/getting-started

 

Introduction · React Native

This helpful guide lays out the prerequisites for learning React Native, using these docs, and setting up your environment.

reactnative.dev

일단 The Basics 부분을 대충 쭉 훑었다. (영어는 못하는 관계로 구글 페이지 번역을 해가면서...)

react-native에서 사용하는 태그가 있는 것 같았다.

일반적으로 사용하는 div태그는 없고 대신 View라는 태그가 그 역할을 대신했다. 그 외에도 Text, ScrollView, TextInput 등 이런게 있구나 하고 넘어갔다.

다음으로 Environment setup 부분을 하나하나 따라갔다. 그렇게 어렵게 쓰여지지 않은 영어라 번역기 돌려가며 읽으며 따라했다.

나는 일단 android용 어플을 만들 예정이라 Expo를 사용안하고 React Native CLI Quickstart 부분을 참고해서 환경세팅을 했다. (나중에 ios에도 배포하려면 다시 expo를 사용하면 되겠지?)

1. Android Studio를 설치했다.
2. Android Studio 실행 후 Android SDK를 설치했다.
3. 환경변수를 세팅했다.
4. 개발을 할 경로에 npx react-native init houseProject 를 입력하여 초기 세팅을 완료했다.

vscode를 열고 방금 만든 houseProject 프로젝트를 불러왔다.

터미널에서 npm run android 를 입력하면 모바일 창이 뜨고 샘플 어플리케이션이 실행됐다.

신기하다. App.js에 글을 수정하고 저장하니 바로바로 변경사항이 적용되어 보여졌다.

일단 helloworld는 띄웠고....(제대로 가고 있는건지는 모르겠다)

반응형