Category: React-Preview

2020
0
TILReact-Preview

Immer를 사용한 더 쉬운 불변성 관리

React with Velopert - 21 - Immer 불변성의 예 Immer 미사용의 경우, Immer 사용의 경우, Immer 기본 사용법 리듀서에서 Immer 사용하기 Immer 와 함수형 업데이트 Chap 21. Immer를 사용한 더 쉬운 불변성 관리Immer 리액트에서는 배열이나 객체를 업데이트 해야 할 때에는 직접 수정하면

0
TILReact-Preview

Context API를 사용한 전역 값 관리

React with Velopert - 20 - Context API를 사용한 전역 값 관리 Context API 만들어보기 App.js UserList.js 수정하기 CreateUser.js 수정하기 Chap 20. Context API를 사용한 전역 값 관리Context API를 사용한 전역 값 관리 현재 프로젝트들은 App 컴포넌트에서

0
TILReact-Preview

커스텀 Hooks 만들기

React with Velopert - 19 - 커스텀 Hooks 만들기 폴더 및 파일 생성 커스텀 Hook 만들기 - useInputs.js useCallback 복습 커스텀 Hook 불러오기 - App.js 커스텀 Hook에서 Reducer 사용하기 - useInputs.js Chap 19. 커스텀 Hooks 만들기커스텀 Hooks 만

0
TILReact-Preview

React.memo 를 사용한 컴포넌트 리렌더링 방지

React with Velopert - 17 - React.memo 를 사용한 컴포넌트 리렌더링 방지 CreateUser.js UserList.js 함수형 업데이트 기본 파라미터 방식 함수형 업데이트 방식 App.js Chap 17. React.memo 를 사용한 컴포넌트 리렌더링 방지 컴포넌트의 props 가 바뀌지 않았다면, 리렌더링을

0
TILReact-Preview

useCallback 을 사용하여 함수 재사용하기

React with Velopert - 16 - useCallback 을 사용하여 함수 재사용하기 useCallback 사용 규칙 주의 할 점 App.js Chap 16. useCallback 을 사용하여 함수 재사용하기useCallback 을 사용하여 함수 재사용하기 useMemo 는 특정 결과 값을 재사용 할 때 사용하는 반면, use

0
TILReact-Preview

useMemo 연산한 값 재사용하기

React with Velopert - 15 - useMemo 연산한 값 재사용하기 useMemo 사용 규칙 App.js useMemo 사용하기 App.js 전체 코드 Chap 15. useMemo 연산한 값 재사용하기useMemo 연산한 값 재사용하기 성능 최적화를 위하여 연산된 값을 useMemo라는 Hook 을 사용하여 재사용하는

0
TILReact-Preview

배열에 항목 수정하기

React with Velopert - 13 - 배열에 항목 수정하기 예제 : User 컴포넌트에 계정명을 클릭했을 때 색상 바꾸기 App.js UserList.js Chap 13. 배열에 항목 수정하기배열에 항목 수정하기 예제 : User 컴포넌트에 계정명을 클릭했을 때 색상 바꾸기 App.jsonToggle 함수를 만들어서 p

0
TILReact-Preview

배열에 항목 제거하기

React with Velopert - 12 - 배열에 항목 제거하기 예제 : 배열 항목 삭제하기 삭제 버튼 렌더링 : UserList.js 삭제 함수 onRemove 구현 및 전달 : App.js Chap 12. 배열에 항목 제거하기배열에 항목 제거하기 UserList 에서 각 User 컴포넌트를 보여줄 때, 삭제 버튼을 렌더링해주자