React

리액트 관련 자료 모음

링크로 이동 Ctrl + Click

React

• useState
• useEffect
• useRef
  • Referencing Values with Refs
  • Manipulating the DOM with Refs
  • ref callback - Avoiding useEffect with callback refs
• useCallback
• useMemo
  • When to useMemo and useCallback
  • How to useMemo and useCallback: you can remove most of them
  • The purpose of useCallback()
• reactive (derived) state
  • What is derived state in React, and why is it important?
• synthetic event
• Why you need keys for collections in React
• Applying Classes Conditionally in React
• controlled component
• uncontrolled component
• When to break up a component into multiple components
• lifting state up
  • 컴포넌트의 역할 분담이 불명확해지고, 결합도가 높아진다.
• props drilling
• Reusing Logic with Custom Hooks
• fetch data
• Optimistic Vs Pessimistic operations in REACT
• Extracting State Logic into a Reducer
• Passing Data Deeply with Context
• Scaling Up with Reducer and Context
• Context API 렌더링 이슈
• Context
  • createContext
  • useContext
• useReducer
• 상태 관리

Styled Component

• global styles
• adapting based on props
• attrs
• Best ways to style a React-JS application

Vite

• vite proxy
  • CORS

Recoil

• Handling global state in React in 2022
• Recoil - 또 다른 React 상태 관리 라이브러리?
• recoil(global state)

React Query

• 카카오페이 프론트엔드 개발자들이 React Query를 선택한 이유
• react query (server state)
  • Important Defaults
  • Queries
  • mutations
  • optimistic updates
    • react-query optimistic update시 데이터 꼬임 방지
• Suspense와 선언적으로 Data fetching처리
• React에서 선언적으로 비동기 다루기
• React Query와 함께 Concurrent UI Pattern을 도입하는 방법
• Catching rendering errors with an error boundary
• react-query
  • Suspense
  • react-error-boundary
  • QueryErrorResetBoundary useQueryErrorResetBoundary

ETC.

• 선언적인 코드 작성하기