리액트 네이티브 설치 - Expo 버전

https://velog.io/@holidenty/React-Native-React-Native-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%EC%8B%9C%EC%9E%91%ED%95%98%EA%B8%B0

[React Native] React Native 프로젝트 시작하기

 

https://velog.io/@jisoolee11/Expo-%EA%B0%84%EB%8B%A8%ED%95%9C-%EC%95%B1-%ED%8E%98%EC%9D%B4%EC%A7%80-%EB%A7%8C%EB%93%A4%EC%96%B4%EB%B3%B4%EA%B8%B0

[Expo] 간단한 앱 페이지 만들어보기

 

실물 휴대폰에서 테스트하려면 로컬 PC와 모바일폰이 같은 네트워크(같은 IP주소)여야 한다. 예를 들어 휴대폰의 Wifi IP 주소가 192.168.1.101 이고, 로컬 PC의 IP주소가 192.168.1.100 이면 연결에 성공한다. 

 

 

* 안드로이드 에뮬레이터 사용하기

https://docs.expo.dev/workflow/android-studio-emulator/

Android Studio Emulator

Expo에서 안드로이드 에뮬레이터를 사용하려면 안드로이드 스튜디오가 설치되어 있어야 한다. 

 

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

Introduction · React Native

 

* 테스트 코드 작성하기

import { StatusBar } from 'expo-status-bar';
import { StyleSheet, Text, View } from 'react-native';

export default function App() {
  return (
    <View style={styles.container}>
      <Text style={styles.title}>Hello world!</Text>
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'orange',
    alignItems: 'center',
    justifyContent: 'center',
  },
  title: {
    color: '#fff',
    fontSize: 50
  }
});

App.js 파일에 위와 같이 작성한다.