reactnative(12)
-
[React Native] 로그인 화면 구현 (프론트엔드) - 1. 화면 준비 및 재사용 컴포넌트 작성
1. 로그인 화면 작성 위한 파일 및 로고 준비 auth 파일 안에 authForm.js, authLogo.js 파일을 만들자. authLogo.js 에서 로고 이미지를 가져와 쓸 건데 로고 이미지를 보관하기 위해 /app 안에 assets 라는 폴더를 만들고 그 안에 imgs라는 폴더를 만들자. 이 안에 다운받은 로고 파일을 넣으면 된다. 변화된 디렉토리 구조 ├─ app │ ├─ assets │ │ └─ imgs │ │ ├─ winthiary_login_logo.png │ │ └─ winthiary_login_logo@2x.png │ ├─ components │ │ ├─ auth │ │ │ ├─ authForm.js │ │ │ ├─ authLogo.js │ │ │ └─ index.js │ │ ├─ d..
2022.05.21 -
[React Native] 신규 프로젝트 생성 및 셋업
1. 새 프로젝트 생성 및 라이브러리 설치 react-native init [project-name] npm install --save axios@0.18.0 react-redux@6.0.1 redux@4.0.1 redux-promise@0.6.0 axio - promise API 를 활용하는 http 비동기 통신 라이브러리, 백엔드를 다룰 예정으로 필요 react-redux - react, redux UI binding redux - 사용 redux-promise - 미들웨어 사용 위해 필요 npm install @react-navigation/native navigation 설치 npm install react-native-gesture-handler navigation 관련 dependency 설치..
2022.05.20 -
[React Native] Redux
1. Redux란 Redux - 애플리케이션 상태(state)를 용이하게 관리하기 위한 프레임워크(오픈소스 JavaScript 라이브러리) react나 react native에서 제공해주는 내부 기술이 아니라 html, angular JS, jQuery 등 과도 사용할 수 있지만 컴포넌트를 많이 다뤄야 하는 React Native와 상호성이 가장 좋다. 또한 시너지 효과를 낼 수 있어 React, React Native 개발자들은 Redux와 함께 개발하고 있다. state의 까다로운 관리, state 접근, 프로젝트 규모에 따른 컴포넌트 구조의 복잡성 등의 문제가 있는 걸 basic 강의에서 이미 많이 느꼈을 ㅓ것이다. 이럴 때 모든 컴포넌트들이 state를 쉽게 공유하고 관리도 쉽게 만들어주고 상태 ..
2022.05.20 -
[React Native] Intro
1. Intro basic 설명 생략하고 진행 서버와 연동하는 하나의 완벽한 앱 개발 목표 1. Redux 사용법 2. React Native 심화 내용 3. 회원가입 & 로그인 4. Data의 CRUD 5.공공API 활용법 참고 자료 https://www.inflearn.com/course/%EB%A6%AC%EC%95%A1%ED%8A%B8-%EB%84%A4%EC%9D%B4%ED%8B%B0%EB%B8%8C-%EC%A4%91%EA%B8%89/dashboard iOS/Android 앱 개발을 위한 실전 React Native - Intermediate - 인프런 | 강의 React Native 기반 모바일 앱 개발을 위한 중급 강의입니다. 프론트엔드의 심화내용 학습 뿐만 아니라 Firebase 기반의 백엔드..
2022.05.20 -
[React Native] error/solution
1. react-native init [project_name] RuntimeError: abort(Error: Failed to install CocoaPods dependencies for iOS project, which is required by this template. Please try again manually: "cd .//Users/byein/rn/rn1/ios && pod install". CocoaPods documentation: https://cocoapods.org/). Build with -s ASSERTIONS=1 for more info. at process.abort (/Users/byein/rn/rn1/node_modules/metro-hermes-compiler/sr..
2022.01.05 -
[React Native] React Native 소개 및 개발 환경 구축
1. React Native 기본 원리 RN - 모바일 웹/앱, 하이브리드 앱이 아닌 native 앱을 제작하기 위한 오픈소스 프레임워크 ios 네이티브 앱은 object c, swift를 ios에 타겟팅해주는 컴파일러 존재. android의 경우 java, kotlin을 안드로이드에 타겟팅해주는 컴파일러 존재. High Level 측면 크로스 플랫폼인 RN은 단지 javascript 개발 코드를 각 os 플랫폼에 타겟팅해줌. Low Level 측면 RN에서는 앱을 빌드할 때 앱의 전체 로직을 가지는 js bundle을 만들고 이 번들을 각 플랫폼에 심어주게 됨. JS 번들은 JS Thread에 의해 실행되는데 각 플랫폼에서 앱을 실행하기 위한 Native Thread는 JS Thread와 직접 커뮤니케..
2021.12.29