TIL

React는 Javascript 기반의 도구로, JS를 더 쉽고 효율적으로 사용할 수 있게 해준다.

React를 배워야 하는 이유, React component, class형 component와 함수형 component, React-hooks, state

HTTP 통신, 요청과 응답, HTTP 상태코드

API란, rest-API와 graphql-API, JSON, API CRUD

동기 방식과 비동기 방식, async / await

Static Routing vs Dynamic Routing

조건부 렌더링: 삼항연산자, && 연산자, optional-chaining

try ~ catch

폴더 구조 체계화(container / presenter), props, export와 export default

props, setState 원리

Map & Filter: 배열의 원소를 한번에 컨트롤하고, 원하는 원소만 고르는 방법!

공통 component 재사용하기

defaultValue

typescript와 typescript의 사용방법

typescript 유틸리티 타입, api 타입 지정

이벤트 버블링, 코드린터(eslint)와 코드 포멧터(prettier)

라이브러리: 바퀴를 재발명하지 마라!

State와 Prev

레이아웃, global style, font

Pagination

state 끌어올리기(state lifting)

데이터 복사, 스프레드 연산자

class형 컴포넌트, 컴포넌트의 생명주기, useEffect, open-API

CORS, 데이터베이스 기초, SQL & NoSQL, Node.js, typeORM, DBeaver

이미지 프로세스 이해, Storage, 이미지 업로드, useRef, label & htmlFor, 이미지 용량 및 확장자 제한

검색 프로세스(Elasticsearch, Redis 등), 디바운싱 & 쓰로틀링, lodash

컴포넌트와 props, el, prev, graphql의 실체

global state, Recoil

로그인의 역사, JWT 토큰, Session Storage & Local Storage, Cookie, 로그인 기능 만들기

localStorage에 토큰 저장하기, Next.js 렌더링 원리, 권한분기, HOF & HOC

react-hook-form, 제어 컴포넌트 & 비제어 컴포넌트, yup

구조분해할당, rest 파라미터, custom hooks, 타입스크립트 Generic

카카오맵 API, SPA & MPA, cache 직접 수정하기(update 사용)

웹 에디터(react-quill), dynamic import, XSS, dompurify, OWASP

결제 프로세스, 포트원, webhook notification

시간관련 이벤트, event loop, 스레드

Callback 함수, callback-promise-async/await, 매크로 태스크 큐 & 마이크로 태스크 큐, await와 마이크로 큐의 관계

RefreshToken, observable & flatMap

성능최적화: memoization, useCallback(), useMemo(), React memo, CRP, Reflow & Repaint, prefetch & preload

이미지 성능 개선: 임시 URL, Promise.all(), LazyLoad vs PreLoad, Prefetch, Webp

Optimistic-UI(옵티미스틱 UI)