내배캠 TIL 2022.01.04

라이브 코딩

owner의 허용이 필요할 경우 대처

 

npx expo start --offline

 

app.json에서 owner을 지우면 작성자가 누구이던지간에 들어갈 수 있다.

 

같은 단어 수정하기 

원하는 단어 더블 클릭 = ctrl + shift + L 

 

화면에서 우클릭 서식변경?

 

얕은복사를 한 다음에 필터링 하는 방식

setCard안에서 콜백함수를 사용해준다.

 

setCard(prevCard => […prevCard].filter((card)=> card.id !== id))

 

navigation을 쓸 경우 프롭스로 state를 전달해주면 부모 자식 관계가 아니라, 자매관계가 되어서 그런지 state를 변경해주는 내용이 적용되지 않았다.

context API를 쓰던지 redux를 쓰던지 해야되겠다. 

 

리액트 네이티브 강의

 

alert창 띄우려고 참고

https://devbksheen.tistory.com/entry/React-Native%EC%97%90%EC%84%9C-%EC%95%8C%EB%A6%BC%EC%B0%BDAlert-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0
 

React Native에서 알림창(Alert) 사용하기

 

다른 태그들과 같이

import {Alert} from "react-native" 해주어야한다.

 

 

항상 디버거가 브라우저에 떠서 왜 그런가 했더니 expo app을 흔들면 나오는 Debug remote JS 저걸 눌러서 그런것이었다.

 

 

immutable 

filter는 얕은 복사 안하고 써줘도 된다. 원래 배열에 영향을 미치지 않아서

 

onSubmitEditing과 onChangeText는 같은 태그 안에서 같이 쓸 수 있다.

 

 

 

후발대 수업

 

비동기 통신

의존적배열

비동기 axios 통신하는 것이 여러군데 흩어져있으면 유지보수가 힘들어서 store에 다 모아뒀다.

 

 

Thunk는 미들웨어  = 가운데에 있는 거

react(dispatch 하는 곳)와 redux(data를 보관)를 중간에서 thunk middleware가 뭔가를 한다.

 

thunk 미들웨어 설정은 configStore에 원래 설정해주어야하는데, 그럴 필요가 없어졌다.

toolkit 안에 들어있고 설정도 되어있기 때문이다. 

원래 있던 것

액션 아이템

액션 크리에이터

리듀서

 

toolkit 이용하면 있게 되는 것

 

thunk

slice 

 

dispatch 할 때 두가지 행동한다

1. db에 넣기 (thunk가 필요한 이유)

2. state에 갱신하기

 

createAsyncthunk(함수: 매개변수가 있고 리턴값이 있다)의 첫번째 인자는 

ADD_TODO는 액션 타입에 대한 prefix (미리 정해둔것) 

두번째 인자는 async 콜백함수가 들어간다(db를 입력하는 과정이 들어가는 로직) (payload를 생성해주는 놈이라서 payload creator라고 부른다)

thunkAPI는 콜백함수의 인자다.

 

왜 thunk가 필요한가? 

loading 중에 skeleton ui를 넣어주면 UX를 좋게 만들어 줄 수 있다. (youtube 예시)

네이버 예시를 보면 컴포넌트들이 비동기적으로 각자 다른 데이터들을 가져온다는 것을 볼 수있다.

html

 

모던 자바스크립트

 

getElement*, querySelector*로 요소 검색하기

https://ko.javascript.info/searching-elements-dom

 

주요 노드 프로퍼티

https://ko.javascript.info/basic-dom-node-properties