프론트엔드 개발/React Native

프론트엔드 개발/React Native

[React Native] React Navigation

React Navigation setup 리액트 네이티브 공식 문서를 살펴보면, Pagination 또는 Navigation을 원한다면 React Navigation 모듈을 사용하길 권장하고 있다. 다음 과정을 거쳐 나의 프로젝트에 React Navigation을 다운로드 해주었다. 먼저 프로젝트에 npm install 해주었다. > npm install @react-navigation/native 그다음 나 같은 경우는 Expo CLI를 사용하는 것이 아닌, ReactNative CLI를 사용하고 있기 때문에, npm install로 새로운 dependencies를 설치해 주었다. > npm install react-native-screens react-native-safe-area-context 리액..

프론트엔드 개발/React Native

[React Native] Components(1)

리액트 네이티브는 리액트와는 다른 내장 Component 체계를 가지고 있다. Component 모두를 react-native에서 import 해와 사용 할 수 있다. Component란? 재사용이 가능한 조립 가능한 블록으로 화면에 나타나는 UI 요소를 뜻한다. 이번 포스팅에선 RN에 내장 되어 있는 Component들을 이야기 해볼까 한다. View와 Text import React, { Component } from 'react'; import {View, Text} from 'react-native'; class App extends Component{ render(){ return( hello world ) } } export default App; View와 Text 모두 RN의 패키지 내에서..

프론트엔드 개발/React Native

[React Native] Expo CLI vs. React Native CLI

이번 DND 7기 활동을 시작하고 1주차를 지나고 있다. 원래 React도 제대로 학습 한 적이 없어 학습중이였는데, 프로젝트 기획 단계에서 웹이 아닌 앱으로 만들어보자는 이야기가 나왔다. 나 같은 경우 CrossFlatform Application 개발은 Flutter가 편하지만, 아무래도 팀 빌딩 단계에서 웹 프론트엔드로 맞춰졌기 때문에 테크 스택 자체가 JS나 TS에 초점이 맞춰져 있을 수 밖에 없었다. 따라서 이번에 RN을 배워보고 RN을 사이드 프로젝트에 실제로 사용 해보고자 한다. Flutter와 RN이 비슷한 부분이 생각보다 많기 때문에 React와 Flutter를 섞은 느낌이라고 생각하고 개발하면 편할 거 같았다. 물론 실제로 프로젝트 셋팅을 해본 결과 Flutter보다 약 10배는 어려운..

Jongung
'프론트엔드 개발/React Native' 카테고리의 글 목록