리액트 네이티브 개발 환경 시작 세팅

React-Native CLI 설치 • 터미널/명령프롬프트에서 • npm install –g react-native-cli • react-native --version 2. React-Native 프로젝트 생성 • 터미널/명령프롬프트 경로설정 후 • npx react-native init {project_name} • 현재 0.69 이상 버전에서 global 옵션으로 설정할 경우 • cli.init is not a function 오류 발생 Þ Init에서 –version 0.68.2 명령어를 추가 Þ 설치 시 –g 제외 혹은 –version 0.68.2

 

여기까지 왔다면 50퍼센트 성공

Expo와는 다르게 index.js가 시작 파일이 된다 App.js가 없다고 당황하지 않는다.

src 폴더와 New_App.js 파일을 생성한다.

import React from 'react';
import {View, StyleSheet, Text} from 'react-native';

const App = () => {
  return (
    <View style={styles.container}>
      <Text style={styles.title}> My First React Native</Text>
    </View>
  );
};

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

export default App;

 

코드작성

index.js 파일을 열어 다음과 같이 수정

import {AppRegistry} from 'react-native';
import App from './src/New_App';
import {name as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);

 

최종확인

완료