[React Native] Todo 앱 - Context & AsyncStorage_1편
·
React Native/TypeScript
0. Context API & AsyncStorage? Context API React에서 Props와 State는 부모 컴포넌트와 자식 컴포넌트 또는 컴포넌트 안에서 데이터를 다루기 위해 사용된다. 즉, 부모 컴포넌트에서 자식 컴포넌트로, 위에서 아래로 한 방향으로만 데이터가 흐르게 된다. 하지만 Context API는 부모 컴포넌트에서 자식 컴포넌트로 전달되는 데이터의 흐름과는 상관없이, 전역으로 사용되는 데이터를 다룬다. 전역 데이터를 저장한 후, 컴포넌트에서 필요한 데이터를 불어와 사용한다. AsyncStorage React에서 Props와 State, Context는 모두 휘발성으로 데이터가 메모리에만 존재하며, 물리적으로 데이터를 저장하지는 않는다. AsyncStorage는 앱 내에서 키 값 ..
[React Native] 카운터 앱 - Props & State
·
React Native/TypeScript
0. Props & State ? React Native는 React에서 파생되었기 때문에 대부분의 개념이 React와 동일하다. Props와 State 역시 리액트의 핵심 개념이다. Props 부모 컴포넌트로부터 자식 컴포넌트로 전달되는 데이터이다. 전달받은 데이터는 자식 컴포넌트에서 변경이 불가능하다. State 컴포넌트 안에서 유동적으로 데이터를 다룰 때 사용하며, 컴포넌트 안에서 데이터를 변경할 수 있다. 즉, State는 컴포넌트의 상태를 나타낸다. 1. 프로젝트 준비 react-native init Counter --template react-native-template-typescript React Native CLI를 사용해서 타입스크립트용 프로젝트를 생성하였다. npm install --..
[React Native] 첫 프로젝트
·
React Native/공통
0. 들어가며 들어가기에 앞서 개발환경 구성은 앞선 React Native 개발환경 구성 부분을 확인하시길 바랍니다. 1. 프로젝트 생성 React Native CLI를 사용해서 React Native 프로젝트를 생성한다. react-native init FirstApp 명령어를 사용하면 자동으로 최신 리액트 네이티브 버전으로 프로젝트가 생성된다. 하지만, 이번 버전을 사용하거나, 특정 프로젝트와 동일한 버전으로 프로젝트를 생성하고 싶은 경우에는 react-native init -version 0.59.10 FirstApp -version 옵션을 사용하면 지정할 수 있다. 프로젝트 구성이 다 된 경우에 IOS의 경우 yarn ios // or react-native run-ios 명령어를 통해서 프로젝트..
[React Native] AMD CPU에서 android emulator 설치 시 4294967201 오류
·
React Native/버그
0. 발단 평화로운 어느날... Android Emulator 설치를 하려고 하는데 4294967201 이라는 무시무시한 에러가 발생하였다 ... 1. 문제 원인 AMD CPU에서는 Emulator를 설치하기 위해서 추가 작업을 진행해야했다. 2. 해결 1. Window 가상화 옵션 끄기 제어판 => 프로그램 => Windows 기능 켜기/끄기에서 Hyper-V와 Windows 하이퍼 바이저 플랫폼 부분을 모두 체크 해제한다. 2. AMD Bios 가상화 설정 컴퓨터를 재부팅 시킬때 f2 혹은 f12를 눌러 Bios 설정화면으로 이동한다. Advanced Frequency Settings를 눌러 안으로 들어간다. CPU Core Settings를 눌른다. SVM Mode를 Enabled로 설정하고 부팅한다.