내일배움캠프(TIL-61 리엑트 네이티브)

그냥차차·2022년 12월 30일
0

내일배움캠프

목록 보기
65/111
post-thumbnail

1. 오늘배운거

ㄱ. 맥북에 안드로이폰 미러링 하는방법

  • brew설치 : /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
  • brew 추가설치 1: $ echo '# Set PATH, MANPATH, etc., for Homebrew.' >> /Users/{사용자명}/.zprofile
  • brew 추가설치 2:$ echo 'eval "$(/opt/homebrew/bin/brew shellenv)"' >> /Users/{사용자명}/.zprofile
  • brew 추가설치 3:$ eval "$(/opt/homebrew/bin/brew shellenv)"
  • brew 안드로이드 설치 1. brew install scrcpy 2.brew install android-platform-tools
  • 안드로이드 설정 개발자옵션키기(빌드번호 연타하면뜸)
  • 개발자옵션에서 usb 디버깅 켜기
  • 터미널에 adb devices 입력하고 연결이 되면 디바이스 기기가 인식됨.
  • 연결이 잘되었다면 scrcpy을 터미널에 치면 맥북화면에 안드로이드폰이 잘뜸

ㄴ.TodoList(addTodo)

  • addTodo 하기
  • 1. 데이터 구조만들기

  • 2. state 만들기

  • 3.addTodo 핸들러 만들기

  • 4.Input안에 onChangeText, onSubmitEditing, value 를 넣어주기

  • 5. todos를 map으로 돌리고

  • Text 태그안에 추가된 text보여주기

ㄷ.TodoList(Category마다 다른todo가 보이게)

  • 1. 카테고리 토글 만들기

  • 2. setCategory로 색변경

  • onpress ={setCategory()}로 카테고리값 변경해주고
  • 삼항연산자를 사용해서 변경한 카테고리가 맞으면 색 변경해주기
  • 3. if문 이용해서 카테고리탭 토글하기

  • 현재누른 카테고리가 todos의 카테고리랑 같으면 보여주고 아니면 안보여주기

ㄹ.TodoList(setDone 아이콘)

  • 1. 아이콘 클릭시 isDone 토글 과 style값 주기

  • 2. setDone 핸들러

  • 3. onClick이 아닌 onPress

  • 4. Text에 삼항연산자로 스타일값조정해주기

ㅁ. 네이티브안에서의 Alert

  • 1. alert 사용법

  • 2. alert 사용법2

  • 위에서부터 제목 내용 왼쪽버튼 오른쪽버튼으로 구성되어있음. 웹에비해 복잡한

ㅂ. TodoList(deleteTodo)

  • 1. 아이콘 클릭시 todo 삭제하기

  • 2. deleteTodo 함수만들기

  • 3.deleteTodo 함수 onpress에 넣기

  • 4. 삭제 아이콘 클릭시 alert창 실행과 todo 삭제하기

ㅅ. 수정 아이콘 클릭시 Todo 수정하기

  • 1. editTodo 하기

  • 2. 바뀐값이 저장될 함수를 만들어줌

  • 3. TextInput에 값을 넣어줌

  • 4. 값이 바뀌는 함수를 만들어줌

ㅇ. Async Storage로 새로고침해도 유지되게

  • 1. 설치 및 import Async Storage 홈페이지

  • 2. 설치하기 = npm install @react-native-async-storage/async-storage --save

  • 3. import 하기 = import AsyncStorage from '@react-native-async-storage/async-storage';

  • 4. useEffect를 사용해서 최신 todos를 Async Storage에저장

  • 5. 첫 렌더링(마운트), 새로고침가 될때 Async Storage 값 불러오기

    -## 6. 카테고리도 새로고침하면 내가보던 카테고리가 나오게하기
  • 7. null 병합 연산자

ㅈ.전체코드

2. 아쉬운점

  • 이번 아쉬운점은 실시간강의가 필요한가!? 강의를 하면서 오류를 찾아내고 그걸 고치고 그렇다고 다할대까지 기다려주지않는데..녹화된 강의보다 퀄리티는 낮고 설명은 부족한 느낌!

3. 회고

  • 리엑트 네이티브를 시작했는데 재밌는데 어렵다!! 그래도 할만하다 아직까진
profile
개발작

0개의 댓글