본문 바로가기
STUDY

노마드 코더 REACT NATIVE 강의 정리 1

by 3급우사기 2024. 8. 27.

https://nomadcoders.co/react-native-for-beginners

 

왕초보를 위한 React Native 101 – 노마드 코더 Nomad Coders

React Native로 2개의 앱 만들기

nomadcoders.co

 

노마드 코더 React Native강의를 보고 요약 정리하는 글

 

실제로 제대로 코딩하기 위해서는 안드로이드 스튜디오, JAVA, 안드로이드 SDK등을 설치해야함

대신 강의에서는 EXPO를 사용해서 간단하게 실습

리액트 네이티브 소개

 

react native 앱의 구조

 

React Native 앱은 JavaScript뿐만 아니라 운영체제와 통신할 수 있는 인프라(Bridge 등)를 포함하고 있어 Java와 Xcode 설치가 필요하다. 그러나 Expo를 사용하면 복잡한 설치 과정 없이 React Native 코드를 즉시 테스트할 수 있다.

 

- EXPO설치

npm install --global expo-cli

 

+ 핸드폰에 EXPO 어플 설치 (IOS는 EXPO GO)

 

 

React Native는 실제 네이티브 애플리케이션을 만드는 도구로, 브라우저를 사용하지 않고 iOS와 Android 운영체제와 직접 소통하여 화면을 그린다.


React Native는 개발자가 작성한 코드를 iOS 코드 또는 Android 코드로 변환하는 "브리지" 역할을 하며, 버튼 같은 UI 요소를 시스템이 직접 그리도록 요청한다. 이벤트(예: 버튼 클릭)가 발생하면, iOS와 Android가 이를 감지하고 React Native가 이를 처리하여 JavaScript 코드로 전달한다.

JavaScript 코드는 받은 이벤트에 따라 동작(예: 배경색 변경)을 수행하고, 이를 운영체제에 전달하여 실제 변화를 일으킨다. 

 

리액트 네이티브 앱 생성

 

- 앱 생성

npx create-expo-app 이름

 

- 로그인

npx expo login