퓨쳐드릴 웹사이트 만들기

React vs. React Native

React

React는 웹 개발을 위한 JavaScript 라이브러리입니다. React는 가상 DOM을 사용하여 성능을 최적화하고, 컴포넌트 기반 아키텍처를 통해 재사용성을 높입니다.

import React from 'react';
import ReactDOM from 'react-dom';

function App() {
    return (
        <div>
            <h1>Hello, React!</h1>
        </div>
    );
}

ReactDOM.render(<App />, document.getElementById('root'));

React Native

React Native는 React 기반의 모바일 애플리케이션 개발 프레임워크로, 네이티브 앱을 개발할 수 있습니다. React Native는 웹 기술(JavaScript)을 사용하여 iOS 및 Android 플랫폼에 네이티브 앱을 개발하는 것이 가능합니다.

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

function App() {
    return (
        <View>
            <Text>Hello, React Native!</Text>
        </View>
    );
}

export default App;

React Native는 React와 유사한 문법을 사용하지만, 네이티브 모바일 앱을 개발하는 데에 특화되어 있습니다.

React Native 시작하기

1. Node.js 및 npm 설치

먼저 Node.js와 npm을 설치해야 합니다. Node.js 공식 웹사이트에서 Node.js를 다운로드 받아 설치할 수 있습니다.

2. React Native CLI 설치

React Native 프로젝트를 생성하고 관리하기 위해 React Native 명령줄 도구(CLI)를 설치해야 합니다. npm을 이용해서 React Native CLI를 설치하세요.

npm install -g react-native-cli

3. 프로젝트 생성

React Native CLI를 이용해 새로운 React Native 프로젝트를 생성합니다.

react-native init MyProject

4. 에뮬레이터 설정

안드로이드 스튜디오(Android Studio)나 Xcode를 이용하여 에뮬레이터를 설정합니다. 해당 에뮬레이터를 실행합니다.

5. 프로젝트 실행

프로젝트 폴더로 이동하여 React Native 앱을 시작합니다.

cd MyProject
react-native run-android
// 또는
react-native run-ios

위 과정을 따라하면 React Native 프로젝트를 시작할 수 있습니다. 필요한 패키지를 추가하거나 컴포넌트를 작성하기 위해 React Native 문서를 참고하시면 됩니다.