ReactNative

React Native 란? React Native를 이용하는 앱 React Native 동작 원리 Bridge React Native 장점 React Native 단점

Expo CLI, CLI 개념 및 비교설명

Expo Go 어플 설치 Expo 실행을 위한 필수 2가지 Git 설치하기 추천하는 Tool Expo CLI 사용하기 Expo Project 생성Something went wrong 오류 해결

React Native 주요 개념 - Core Components

ReactNative - Expo, Android Studio 에뮬레이터 연결

React Native 주요 개념 - 컴포넌트와 prop 이론

클래스 컴포넌트와 함수형 컴포넌트의 차이점, useState의 사용법에 대해 학습하였습니다.

[ReactNative] React Hooks - useEffect

React Hooks - custom Hooks

카카오톡 친구목록 클론코딩 [연습]

ReactNative Project 카카오톡 친구목록 클론코딩 [1] 프로젝트 생성, Header 컴포넌트 작성

ReactNative Project 카카오톡 친구목록 클론코딩 [2] MyProfile, Margin, Division, FriendSection, FriendList 컴포넌트 작성

카카오톡 친구목록 클론코딩 [3] 친구리스트 toggle 기능 TabBar 컴포넌트 추가 ScrollView 대신 FlaList 사용 내 프로필과 친구 프로필 크기 조정 Inline, StyleSheet, Styled Component 차이 Detail

프로젝트 생성 state 세팅 UI 개발 Calculator refactoring logic 예외처리 Custom hook 으로 만들기

프로젝트생성 날짜다루기 day.js 설치 day.js 예제 달력 데이터만들기 달력 UI 그리기

현재 선택된 날짜 표시 일,월,년 별로 날짜 선택 월 별 이동 Refactoring useTodoList 제작 TodoList 로직 배경화면 설정 Todo UI Calendar 리팩토링

Todo 체크 로직 Todo 삭제 로직 Todo 추가 로직 return버튼으로도 Todo 저장하기 Todo 추가 후 Input 비워주기 Todo 추가 후 키보드 처리 선택된 날짜에 해당하는 투두만 불러오기 Todo가 있는 날짜 표시 AsyncStorage 이

ReactNative의 expo를 이용한 간단한 프로젝트로 TodoList 일정관리 어플을 만들었습니다.완성된 모습입니다. 세 개의 게시글로 정리하였습니다.

React Navigation 개념에 대하여 학습하였습니다. 구성요소 및 종류, 동작 들에 대해 알아보았고, 자주 사용되는 용어와 중요 개념에 대해서 정리하였습니다.

실제 코드를 작성하면서 화면이 이동되는 모습을 확인하였습니다. **Stack Navigator**와 **BottomTab Navigator**를 사용해보고 중첩까지 해 보았습니다.

Atomic design patten을 지향하기 위해 ATOM Component를 작성하였고, 이를 이용해 MOLCULE Component를 작성하였습니다. Compound Component Pattern 도 적용해보았습니다.

react hook에 대해 알아보고 hook 사용의 규칙, 실무에서 자주 사용하는 library hook 을 학습하였습니다.

기존의 클래스 컴포넌트를 함수형 컴포넌트로 변환해주었고, Memoization 를 사용하여 최적화 하는 방법을 학습하였습니다.

[React Native] 전역 상태관리 - Redux 알아보기

간단한 expo 프로젝트를 통해 Redux를 적용해보았습니다.

[React Native] 전역 변수 관리 - Context API 알아보기

[React Native] Context API 적용해보기

[React Native] 전역 상태관리 - Recoil 알아보기

핸드폰 배경화면 앱을 만들어보았습니다. 이미지 목록을 만들고, 하트를 누른 이미지 목록만 표시하는 부분을 네비게이션, Redux 등을 이용하여 구현해보았습니다.

ReactNative Project - 로또 번호 생성기 앱

[React Native] 데이터 저장소 - AsyncStorage, redux-persist

ReactNative Project - 웹페이지 스크랩 앱

[뉴스 스크랩 앱] UI를 구성 Fetch API 사용 Redux에 저장 webView 사용 스크랩 기능 추가 AsyncStorage 에 저장

RN 프로젝트를 진행하면서 Firebase를 연동하여 Vscode 에서 npm rum android 명령어 실행 build 오류를 해결하였습니다.

Firebase에 대해서 알아보고, RN 에서 사용해보았습니다.

RN 에서 Firebase를 연동하여 Storage 기능을 사용해보았습니다. 파일을 업로드하고 저장하는 동작을 학습하였습니다.

기존에 사용하고 있던 Functional Component 를 TypeScript 로 변환해보았습니다.