주섬주섬 코딩, 소소하지만 꾸준히 쌓아가는 개발 기록...

인프런 타입스크립트 기초를 통해 공부중이며 제로초님의 유료강좌입니다. 코드를 통으로 가져오지는 않겠습니다.(내가 글을 쓰면서 복습하는게 목적이기때문에 필요한 부분만) 타입스크립트 (Typescript) 타입스크립트는 자바스크립트의 superset(상위집합)이다. 자바스크립트가 언어고 타입스크립트가 라이브러리라서 반대로 생각하는데, 타입스크립트는 자바스크립트의 모든 기능에 타입이라는 시스템이 추가된 것이므로 더 큰 존재이다. 따라서 기본적으로 타입스크립트를 사용하기 위해서는 자바스크립트를 알아야한다. 제로초님은 자바스크립트 강좌 (유튜브에 업로드하신 무료 es2020 / 자바스크립트강좌를 보고 오면 도움이 된다고했다) 제로초님은 실무에서 클라이언트가 요청하는 것을 제외하고는 보통 타입스크립트로 쓴다고 한다..

강의 유튜브 주소 : https://www.youtube.com/watch?v=V3QsSrldHqI&list=PLcqDmjxt30RtqbStQqk-eYMK8N-1SYIFn 성능최적화 구글확장플러그인 devtools로 확인하여 테스트한 후에 최적화가 필요하면 진행한다. 최적화작업은 작업의 마지막에 한다. useEffect와 useRef로 재렌더링이 되는 이유를 디버깅할 수 있는 방법이 있다. ref를 만들어서 props나 state들을 넣고 비교하면서 검사하면된다, import React, {useCallback, useEffect, useRef}from 'react'; const Test = () => { const Ref = uesRef([]); useEffect(() =>{ // 콘솔에 찍어보자 co..

강의 유튜브 주소 : https://www.youtube.com/watch?v=V3QsSrldHqI&list=PLcqDmjxt30RtqbStQqk-eYMK8N-1SYIFn state나 props가 늘어나면 관리가 힘들어진다. 그리고 props를 넘기게될때 자식에 자식에 자식의 컴포넌트가 있다면 복잡해진다. 이떄 useReducer를 써서 관리할 수 있다. useReducer를 배우면 redux랑 비슷한 효과를 낼 수 있다. contextAPI + useReducer를 쓸 경우 redux를 사용안해도 되지않나?라고 하는경우들이 있는데 대체하기는 어렵다고 한다. 거창한 redux가 필요없을 경우 (작은 프로젝트)에는 대체하는 형식으로 쓸수는 있다고 한다. 왜냐면 contextAPI와 useReducer를 쓰..

강의 유튜브 주소 : https://www.youtube.com/watch?v=V3QsSrldHqI&list=PLcqDmjxt30RtqbStQqk-eYMK8N-1SYIFn Hooks에 관한 자잘한 팁들 use 시리즈들은 순서가 매우매우 중요해서 중간에 바뀌면 안된다. const Test = () => { const [number, setNumber] = useState(); // 1 const [string, useString] = useState(); // 2 조건문을 통해 생성의 여부를 결정하면 매우 위험하다. const Test = () => { const [number, setNumber] = useState(); // 1 const [string, useString] = useState(); /..