앱 개발을 하면서 렌더링 되기 직전 이나 새로 변경된 후 특정 작업을 수행해야 한다면 life cycle 은 확실히 잡고 넘어가는 것이 좋을 것이다.React 의 component Life Cycle 은 크게 3단계로 분류가 가능하다.Mount → Update → un
console.log 를 찍었을 때 2번씩 찍힌다.강의를 진행하면서 실습을 할 때 매우 거슬린다!!!범인은 StrictMode.strictmode 란 app 내의 잠재적 문제를 발견하기 위한 도구이다.react.StrictMode 의 안쪽 영역만 그 자식까지 검사를 진
const state, setState = useState(initialState);const App = () => { const todolist, setTodoList = useState(\[]); const title, setTitle = useState("")
useEffect란 component가 렌더링 될때 마다 특정 작업을 실행할 수 있도록 하는 Hook이다.useEffect에 있는 의존성 배열안의 값의 변화가 있을 경우에만 useEffect가 실행된다.\[] 안에 인자가 없다면 첫 렌더링 때만 실행되고 실행되지 않음!
uuid 는 고유아이디 값을 랜덤하게 생성해준다.key 값을 줄 때 유용하다.
src 폴더 : App.js, index.js 빼고 삭제index.js : strictMode 삭제package.json : dependencies @test, webkit 삭제node_modules : 통째로 삭제 후 package.json 정리 후 재 다운ex)co
React 와 다르게 사용하면 됨.!
export default function MyReview({// 1. setIsOpenMenuModal, isOpenMenuModal, from,}) { ... const openMenuHandler = (item) => { setReviewId(ite
const title, setTitle = useState("");const contents, setContents = useState("");useEffect(() => { onChangeTitle("가져올데이터".title); setNewContents(
useQuery 사용시 data를 가져왔을 때data.culturalEventInfo.row 이렇게 데이터 속을 들어가야 할 때data 로만 가지고 온다면 getEventListsData.culturalEventInfo.row 로 길게 늘여 써야한다.이 때, selec
react-query 사용시 App.ts 를 감싸주어야한다.QueryClientProvider 로 감싸주지 않아서 생겼던 오류!
이걸 왜 모르지?? 왜 모르겠지?? 라고 느꼈다.역시나 엄청 간단하였다.questions.json 파일이 있다면받아올 변수명은 자유롭게 가능하다.
google cloud platform 접속새 프로젝트 생성사용자 인증정보에서 API KEY 발급.Youtube DataAPI 접속공식문서를 참고하여 API 생성.링크에 발급받은 key 만 교체하여 json 파일을 받아보면typescript 를 검색하여 나온 인기 순위
Json 파일에서 text 를 get 하여 데이터를 받아올 때줄바꿈 처리를 위해 추가한 \\n 이 먹히질 않는다!방법은 2가지이다.아주 잘 먹힌다.
lottiefile회원가입만 하면 무료로 여러 애니메이션 이미지를 찾아 사용할 수 있는 웹사이트원하는 애니메이션 검색 후 json 파일 다운받기.public폴더에 넣기https://github.com/mifi/react-lottie-player
데이터를 임의로 지우지 않으면 영구 보존됨.windows 전역 객체의 localStorage라는 컬렉션을 통해 사용됨ex) ID 저장하기, token 저장, 유저의 접속시간 저장SessionStorage는 브라우저의 탭을 닫으면 삭제됨.windows 전역 객체의 ses