close
더북(TheBook)
search
리액트 네이티브를 다루는 기술
더북(TheBook)
home
Home
1장 리액트 네이티브 첫걸음
1.1 리액트 네이티브란?
1.2 작업 환경 준비하기
1.2.1 Node.js와 npm 설치하기
1.2.2 yarn
1.2.3 Java Development Kit
1.2.4 Watchman 설치하기
1.2.5 안드로이드 스튜디오 설치하기
1.2.6 안드로이드 환경 변수 설정하기
1.2.7 VS Code 설치하기
1.2.8 Xcode와 CocoaPods 설치하기
1.3 새 리액트 네이티브 프로젝트 만들기
1.3.1 안드로이드 환경에서 리액트 네이티브 앱 구동하기
1.3.2 iOS 환경에서 리액트 네이티브 앱 구동하기
1.4 프로젝트 살펴보기
1.4.1 엔트리 파일
1.4.2 App 컴포넌트
1.4.3 네이티브 프로젝트
1.5 ESLint와 Prettier
1.6 정리
2장 컴포넌트
2.1 나만의 컴포넌트 만들기
2.2 Props
2.3 defaultProps
2.4 JSX 문법
2.4.1 태그를 열면 반드시 닫아주기
2.4.2 스스로 닫는 태그 사용하기
2.4.3 반환할 땐 꼭 하나의 태그로 감싸기
2.4.4 JSX 안에서 자바스크립트 표현식을 보여줄 땐 중괄호로 감싸기
2.4.5 주석 작성하기
2.5 StyleSheet로 컴포넌트에 스타일 입히기
2.5.1 Props로 컴포넌트 스타일을 커스터마이징하기
2.6 Props 객체 구조 분해 할당
2.7 useState Hook으로 상태 관리하기
2.7.1 useState 사용해보기
2.7.2 Hook의 규칙
2.7.3 Button 컴포넌트 사용하기
2.7.4 조건부 렌더링 구현하기
2.8 카운터 만들기
2.8.1 UI 준비하기
2.8.2 Counter 컴포넌트에 Props 설정하기
2.8.3 App에서 상태 관리하기
2.9 정리
3장 할일 목록 만들기 I
3.1 프로젝트 기반 다지기
3.1.1 프로젝트 생성하기
3.1.2 오늘 날짜를 알려주는 DateHead 컴포넌트 만들기
3.1.3 StatusBar 색상 바꾸기
3.1.4 레이아웃 준비하기
3.1.5 이미지 사용하기
3.2 TextInput으로 사용자 키보드 입력받기
3.2.1 KeyboardAvoidingView로 키보드가 화면을 가리지 않게 하기
3.2.2 useState로 텍스트 상태 값 관리하기
3.2.3 커스텀 버튼 만들기
3.2.4 TextInput에 onSubmitEditing 및 returnKeyType 설정하기
3.3 정리
4장 할일 목록 만들기 II
4.1 불변성을 지키면서 객체와 배열 업데이트하기
4.1.1 불변성을 지켜야 하는 이유
4.1.2 배열의 불변성을 지키는 방법
4.2 todos 상태 만들기 및 FlatList로 항목 화면에 나타내기
4.2.1 todos 상태 만들기
4.2.2 TodoList 컴포넌트 만들기
4.2.3 TodoItem 컴포넌트 만들기
4.2.4 항목 사이에 구분선 보여주기
4.2.5 완료한 항목에 다른 스타일 적용하기
4.3 새 항목 등록하기
4.4 할일 완료 상태 토글하기
4.5 항목 삭제하기
4.5.1 벡터 아이콘 사용하기
4.5.2 항목 삭제 함수 만들기
4.5.3 항목을 삭제하기 전에 한번 물어보기
4.6 AsyncStorage로 앱이 꺼져도 데이터 유지하기
4.6.1 Promise가 무엇인가요?
4.6.2 AsyncStorage 설치하기
4.6.3 AsyncStorage의 기본 사용법
4.6.4 AsyncStorage 적용하기
4.7 정리
5장 리액트 내비게이션으로 여러 화면 관리하기
5.1 설치 및 적용하기
5.1.1 의존 패키지 설치하기
5.1.2 라이브러리 적용하기
5.2 기본적인 사용법
5.2.1 네이티브 스택 내비게이터
5.2.2 스크린 이동하기
5.2.3 라우트 파라미터
5.2.4 뒤로가기
5.2.5 헤더 커스터마이징하기
5.3 다양한 내비게이터
5.3.1 드로어 내비게이터
5.3.2 하단 탭 내비게이터
5.3.3 머티리얼 상단 탭 내비게이터
5.3.4 머티리얼 하단 탭 내비게이터
5.3.5 머티리얼 하단 탭 내비게이터 헤더 타이틀 동기화하기
5.4 내비게이션 Hooks
5.4.1 useNavigation
5.4.2 useRoute
5.4.3 useFocusEffect
5.5 정리
6장 다이어리 앱 만들기 I
6.1 프로젝트 준비하기
6.1.1 react-native-vector-icons 적용하기
6.1.2 react-navigation 적용하기
6.2 Context API 사용하기
6.2.1 children Props
6.2.2 useContext Hook 함수
6.2.3 Context에서 유동적인 값 다루기
6.3 새 글 작성하기
6.3.1 FloatingWriteButton 만들기
6.3.2 WriteScreen UI 준비하기
6.3.3 useRef로 컴포넌트 레퍼런스 선택하기
6.3.4 KeyboardAvoidingView로 화면 감싸기
6.3.5 WriteScreen에서 텍스트 상태 관리하기
6.3.6 LogContext로 배열 상태 관리하기
6.3.7 Log 작성 기능 마무리하기
6.4 글 목록 보여주기
6.4.1 FeedListItem 컴포넌트 만들기
6.4.2 FeedList 컴포넌트 만들기
6.4.3 date-fns로 날짜 포맷팅하기
6.5 Animated로 애니메이션 적용하기
6.5.1 애니메이션 연습하기
6.5.2 스크롤을 내렸을때 글쓰기 버튼 숨기기
6.5.3 spring 사용하기
6.5.4 예외 처리하기
6.6 정리
7장 다이어리 앱 만들기 II
7.1 작성한 글을 WriteScreen으로 열기
7.1.1 FeedListItem 수정하기
7.1.2 WriteScreen에서 log 파라미터 인식하기
7.2 수정 기능 구현하기
7.2.1 LogContext에 onModify 함수 구현하기
7.2.2 WriteScreen에서 onModify 함수 사용하기
7.3 삭제 기능 구현하기
7.3.1 LogContext에 onRemove 함수 구현하기
7.3.2 WriteScreen에서 onRemove 함수 사용하기
7.3.3 WriteHeader 수정하기
7.4 검색 기능 구현하기
7.4.1 SearchHeader 컴포넌트 만들기
7.4.2 화면 크기 조회하기
7.4.3 SearchHeader 컴포넌트 UI 구성하기
7.4.4 SearchContext 만들기
7.4.5 검색어 필터링 후 FeedList 재사용하기
7.4.6 EmptySearchResult 만들기
7.5 달력 기능 구현하기
7.5.1 달력에 표시하기
7.5.2 데이터를 달력과 연동하기
7.5.3 달력 하단에 로그 목록 보여주기
7.5.4 useMemo Hook으로 최적화하기
7.6 날짜 및 시간 수정 기능 구현하기
7.6.1 WriteHeader에서 날짜 및 시간 보여주기
7.6.2 DateTimePickerModal 컴포넌트 사용하기
7.7 useReducer Hook 함수 사용하기
7.8 AsyncStorage로 데이터 유지하기
7.9 정리
8장 Firebase로 사진 공유 앱 만들기 I
8.1 프로젝트 준비하기
8.1.1 내비게이션과 아이콘 설정하기
8.1.2 Firebase 적용하기
8.1.3 화면 구성 이해하기
8.2 회원 인증 기능 구현하기
8.2.1 회원 인증을 위한 UI 준비하기
8.2.2 인풋 상태 관리하기
8.2.3 인풋에서 키보드 리턴 처리하기
8.2.4 컴포넌트 분리하기
8.2.5 Firebase로 회원 인증하기
8.2.6 오류 예외 처리하기
8.2.7 사용자 프로필 Firestore에 담기
8.3 Firebase에 회원 정보 등록하기
8.4 UserContext 만들고 로그인 사용자 분기 처리하기
8.5 이미지 업로드하기
8.5.1 이미지 선택 기능 구현하기
8.5.2 사용자 기본 이미지 설정하기
8.5.3 Firebase Storage로 이미지 업로드하기
8.6 정리
9장 Firebase로 사진 공유 앱 만들기 II
9.1 탭 화면 구현하기
9.2 로그인 상태 유지하기
9.3 포스트 작성 기능 구현하기
9.3.1 탭 중앙에 버튼 만들기
9.3.2 업로드할 사진 선택 또는 카메라 촬영하기
9.3.3 포스트 작성 화면 만들기
9.3.4 Firestore에 포스트 등록하기
9.4 포스트 목록 조회하기
9.4.1 PostCard 컴포넌트 만들기
9.4.2 Firestore로 포스트 목록 조회하기
9.4.3 FeedScreen에서 getPost 호출 후 FlatList로 보여주기
9.4.4 페이지네이션 및 시간순 정렬하기
9.5 사용자 프로필 화면 구현하기
9.5.1 Firestore 데이터 조회할 때 조건 추가하기
9.5.2 포스트 조회 함수 리팩토링하기
9.5.3 Firestore에서 색인 추가하기
9.5.4 Profile 컴포넌트 만들기
9.5.5 그리드 뷰 만들기
9.5.6 페이지네이션 구현하기
9.5.7 커스텀 Hook을 작성해 컴포넌트 리팩토링하기
9.5.8 포스트 열기
9.5.9 내 프로필 화면 구현하기
9.6 포스트 수정 및 삭제 기능 구현하기
9.6.1 재사용할 수 있는 모달 만들기
9.6.2 사용자에게 수정 및 삭제 물어보기
9.6.3 포스트 삭제 기능 구현하기
9.6.4 포스트 설명 수정 기능 구현하기
9.7 EventEmitter로 다른 화면 간 흐름 제어하기
9.7.1 EventEmitter3 설치 및 적용하기
9.7.2 포스트 작성 후 업데이트하기
9.7.3 포스트 삭제 후 목록에서 제거하기
9.7.4 리팩토링하기
9.7.5 포스트 수정 후 업데이트하기
9.8 설정 화면 만들기
9.9 Firestore 보안 설정하기
9.10 Splash 화면 만들기
9.11 정리
14장 Strapi로 REST API 서버 빠르게 구축하기
14.1 Strapi 살펴보기
14.1.1 strapi 프로젝트 생성하기
14.2 새 콘텐트 타입 만들기
14.3 일부 필드를 Private로 변경하기
14.4 데이터 권한 설정하기
14.5 Content API에 커스터마이징하기
14.5.1 게시글 작성하기
14.5.2 게시글 수정하기
14.5.3 게시글 삭제하기
14.6 Postman 설치하기
14.7 회원가입 및 로그인 API 사용하기
14.8 Article API 사용하기
14.9 Comment API 수정하기
14.9.1 댓글 작성하기
14.9.2 댓글 조회하기
14.9.3 댓글 수정하기
14.9.4 댓글 삭제하기
14.10 댓글 API 사용하기
14.11 정리
15장 리액트 쿼리를 사용한 API 상태 관리
15.1 프로젝트 생성 및 초기 설정하기
15.1.1 react-native-vector-icons 적용하기
15.1.2 리액트 내비게이션 적용하기
15.2 useQuery를 사용하여 데이터 조회하기
15.2.1 반환값
15.2.2 배열 타입의 캐시 키
15.2.3 useQuery의 options
15.2.4 staleTime과 cacheTime
15.3 API 요청할 준비하기
15.3.1 타입 선언하기
15.3.2 axios 인스턴스만들기
15.3.3 QueryClientProvider 사용하기
15.4 게시글 목록 조회 기능 구현하기
15.4.1 API 함수 작성하기
15.4.2 useQuery 사용하기
15.4.3 컴포넌트 만들기
15.5 게시글 조회 기능 구현하기
15.5.1 화면 준비하기
15.5.2 API 함수 작성하기
15.5.3 useQuery 사용하기
15.5.4 컴포넌트 만들기
15.6 회원 인증 기능 준비하기
15.6.1 화면 준비하기
15.6.2 사용자 메뉴 화면 만들기
15.6.3 회원 인증 API 함수 만들기
15.6.4 AuthForm 컴포넌트 만들기
15.7 useMutation로 조회 외 작업 처리하기
15.7.1 반환값
15.8 회원 인증 기능 구현하기
15.8.1 커스텀 Hook 만들기
15.8.2 사용자 인증 상태 관리하기
15.8.3 인증 토큰 설정하기
15.8.4 로그아웃 기능 구현하기
15.8.5 AsyncStorage로 인증 상태 유지하기
15.8.6 로그인/회원가입 오류 처리하기
15.9 게시글 작성 기능 구현하기
15.9.1 게시글 작성 버튼 준비하기
15.9.2 게시글 작성 화면 만들기
15.9.3 게시글 작성 API 함수 만들기
15.9.4 게시글 작성 버튼 만들기
15.9.5 useMutation으로 게시글 작성 API 호출하기
15.9.6 QueryClient로 데이터 새로고침하기
15.9.7 QueryClient로 캐시 데이터 직접 수정하기
15.10 게시글 페이지네이션 기능 구현하기
15.10.1 게시글 목록 조회 API 함수 변경하기
15.10.2 useInfiniteQuery 사용하기
15.10.3 게시글 작성 후 처리 로직 변경하기
15.10.4 화면을 아래로 당겨서 새로고침하기
15.11 게시글 수정/삭제 기능 구현하기
15.11.1 수정 기능 구현하기
15.11.2 삭제 기능 구현하기
15.12 댓글 작성/수정/삭제 기능 구현하기
15.12.1 API 함수 준비하기
15.12.2 댓글 작성 컴포넌트 만들기
15.12.3 댓글 삭제 기능 구현하기
15.12.4 댓글 수정 기능 구현하기
15.13 정리
16장 앱 스토어와 구글 플레이에 리액트 네이티브 앱 등록하기
16.1 프로젝트 준비하기
16.2 안드로이드 앱 등록하기
16.2.1 앱 서명하기
16.2.2 AAB 파일 생성하기
16.2.3 릴리스 빌드 실행해보기
16.2.4 구글 플레이에 앱 등록하기
16.3 iOS 앱 등록하기
16.3.1 App Transport Security 활성화하기
16.3.2 Build Configuration 변경하기
16.3.3 앱 빌드하기
16.3.4 애플 개발자 계정 생성하기
16.3.5 실제 디바이스에서 앱 실행하기
16.3.6 애플 개발자 프로그램 가입하기
16.3.7 인증서 발급받기
16.3.8 디바이스 추가하기
16.3.9 아이콘 설정하기
16.3.10 앱 빌드 후 앱 스토어에 업로드하기
16.4 정리
17장 마치면서
17.1 커뮤니티
17.2 책의 연장선
코드를 저장한 뒤, 화면에 다음과 같이 아이콘이 나타나고, 텍스트 스타일도 변경됐는지 확인해보세요.
▲ 그림 4-6
완료 항목 구분하기
Prev
BUY
Next
신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.
Email address
