리액트 네이티브

1 개요

React Native

리액트 네이티브

• 하이브리드 모바일 앱 개발 프레임워크
• 리액트 기반
• 웹킷 기반이 아님
• JSX 문법 이용 개발
• 동적 리로딩으로 개발시간 단축 ( 재컴파일 필요 없음 )
• 네이티브 코드 모듈화

import React, { Component } from 'react';
import { Image, ScrollView, Text } from 'react-native';

class AwkwardScrollingImageWithText extends Component {
  render() {
    return (
      <ScrollView>
        <Image source={{uri: 'https://i.chzbgr.com/full/7345954048/h7E2C65F9/'}} />
        <Text>
          On iOS, a React Native ScrollView uses a native UIScrollView.
          On Android, it uses a native ScrollView.

          On iOS, a React Native Image uses a native UIImageView.
          On Android, it uses a native ImageView.

          React Native wraps the fundamental native components, giving you
          the performance of a native app, plus the clean design of React.
        </Text>
      </ScrollView>
    );
  }
}

2 개발 도구

• ATOM
• 웹스톰
• 비주얼스튜디오 코드

3 같이 보기

• 리액트 네이티브 아키텍처
• 리액트 네이티브 브리지
• 리액트
• 아파치 코르도바
• 자마린
• 맥OS 리액트 네이티브 개발환경 구성

4 참고

• https://facebook.github.io/react-native/
• https://taegon.kim/archives/5745 인스타그램이 React Native로 앱을 만든 과정
• https://www.tutorialspoint.com/react_native/index.htm
• https://github.com/wix/react-native-navigation