🌝Coding/🌟React-Native

[React Native] INTRODUCTION & Setting

뿌야._. 2021. 7. 12. 14:20
nomadcoders 강의: React Native로 날씨 앱 만들기 (무료)
https://nomadcoders.co/react-native-fundamentals 
 

React Native로 날씨앱 만들기 - 노마드 코더 Nomad Coders

React Native Fundamentals

nomadcoders.co

 

🙄 react-native)

 

자바스크립트를 이용해서 ios, android의 네이티브 엔진에게 메세지를 보냄

자바스크립트와 폰이 bridge 역할

 

 

🙄 expo)

 

create-react-app과 비슷한 것

react Native를 위한 설정 파일 같은 것들이 없는 방식

native files들을 숨기고 모든걸 관리해줌

핸드폰에서 앱 실행하며 확인 가능

ios와 안드로이드 위한 앱 빌드

but native files들을 크게 제어 불가

 

 

🙄 React Native CLI)

 

native를 수동으로 작업

native files들을 더 많이 컨트롤하고 싶을 때 사용


🙄 cmd)

 

* 처음 expo 설치할때: npm install -g expo-cli

(ERR 발생으로 구글링구글링을 거쳐 npm install -g expo-cli --legacy-peer-deps 로 실행해주었더니 설치 완료)

ⓛ expo init 파일명 

② blank 선택

③ 폴더로 이동 후 code. 실행


🙄 npm start)

 

① 페이지의 qr 코드: 안드로이드 폰이 qr코드 스캔 -> 폰에서 테스트 가능

 

② emulator 실행: 안드로이드) Tunnel로 바꿔준 후 안드로이드 폰 연결해주면 실행 ok

                        ios) 다음에 해볼게용 😎

 

 

🙄 Base & Rule)

 

① app.json: configuration 파일 -> expo가 읽음

② App.js: 기본적인 리엑트 컴포넌트

 

<view>: <div> 와 비슷

<Text>:  모든 text

css _ StyleSheet API: 자바스크립트 오브젝트처럼 사용


'🌝Coding > 🌟React-Native' 카테고리의 다른 글

[React Native] Bottom Bar & Transfer page_ navigation v5  (0) 2021.07.21
[React Native] icon 사용  (0) 2021.07.20
[React Native] props  (0) 2021.07.16
[React Native] LOGIC & API  (0) 2021.07.13