[인프런] 따라하며 배우는 리액트 네이티브 기초

네이티브 컴포넌트에서 리액트가 기본으로 지원하는 컴포넌트를 코어 컴포넌트라고 한다.

1. Todo App 구조 생성 리액트 스니펫 확장프로그램 ES7+ React/Redux/React-Native snippets https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-sn

npm install @reduxjs/toolkit react-redux redux —savetodoSlice.js에서 3가지 액션의 리듀서를 작성해준다.splice(item, 1) : item 인덱스 하나만 삭제state.todos.push(state.todos.sp

expo랑 cli랑 다르니 반드시 공식문서를 확인한다공식문서expo는 아래 두가지 라이브러리를 설치한다npm install @react-navigation/native @react-navigation/native-stacknpx expo install react-nat

https://app.diagrams.net/위 링크 참고

!주의 : React Native CLI 개발환경을 세팅해야 가능!!터미널에서 프로젝트를 만들고 싶은 폴더로 이동 후, 다음과 같은 명령어 입력npx react-native init ReactNativeInstaApp(프로젝트이름)다음과같이 설치됌

SafeAreaView 태그를 넣어 상단바가 겹치지 않게 한다변경 전변경 후인라인으로 스타일코드를 작성하면 아래 노란 줄이 쳐진다.이 부분을 없애기 위해 코드를 추가한다페이지를 이동할 때 넣어준 부분 {name: data.name, image: data.image} 도

Animated 라이브러리 공식 문서 확인하기 애니메이트 라이브러리는 애니메이션을 쉽게 만들고 유지하기 위해 만들어짐 interpolation이 사용됌 interpolation 중간지점에서 함수를 추정하는 수단을 제공함 이용 방법 Animated.Value를 만듦 애

SafeAreaView 로 항상 감싸주고 스크롤뷰 넣기data의 id가 1인 것만 보여주고, id가 1인 데이터의 images를 map으로 돌려 뿌려줌

아래 코드 전체 넣기command + R (리프레시하기)

1. FriendProfile.js에 상단 UI 작성 2. ProfileBody.js 컴포넌트 작성 ProfileBody.js 컴포넌트 만들기 FriendProfile.js에 ProfileBody.js import 코드 작성 3. ProfileButton.js 코드 작성 ProfileButton.js import하기 ProfileButton.js...

id === 0 번일때 보여주는 코드를 추가한다

https://github.com/zo0r/react-native-push-notificationnpm install --save react-native-push-notification

npm i @react-native-community/push-notification-ios --savenpx pod-installhttps://github.com/react-native-push-notification/ioscommand + shift + P