React Native 메모

React Native는 React 문법을 활용하여 네이티브 앱을 만들 수 있게 해준다.

React를 알고 있으면 React Native 공부가 수월하지만, 차이점을 기억해둘 필요가 있어 메모를 해둔다.

 

React Native는 React와 달리 웹이 아니라 앱이기 때문에, 화면을 구성할 때 HTML태그와 같은 방식으로 작성하지 않는다.

기본적으로 리액트 네이티브에서 제공해주는 컴포넌트를 사용하여 화면을 구성한다.

 

import { Text, View } from "react-native";

export default function App() {
    return (
        <View>
            <Text>텍스트입니다</Text>
        </View>
    )
}

 

 

- React native에서 스타일을 작성할 때에는 StyleSheet.create를 통해 스타일을 작성하고 사용한다.

- display 속성에 flex를 제외한 나머지 레이아웃 스타일은 지원하지 않는다.

-안드로이드에서는 지원하고 아이폰에서는 지원하지 않는 것과 같은 스타일이 있어 둘이 공통적으로 작동할 수 있게끔 스타일을 작성해야 한다.

- 스크롤이 자동으로 구현되지 않고, 스크롤 전용 컴포넌트를 통해 명시적으로 구현해야 한다. (ScrollView, FlatList)

 

 

React Native Documantation

https://reactnative.dev/docs/components-and-apis

Core Components and APIs · React Native

 

Expo Documentation

https://docs.expo.dev/

Expo Documentation