분류 전체보기139 [React] React query 사용해 보기 React query 리액트에서 상태 관리 라이브러리 중 하나로, 강력한 비동기 상태 관리를 지원한다. 리액트 쿼리의 기능은 다음과 같다. Backend agnostic: 백엔드에 종속되지 않음 Dedicated Devtools: 전용 개발 도구 Auto Caching: 자동 캐싱 Auto Refetching: 자동 재요청 Window Focus Refetching: 창 포커스 시 자동 재요청 Polling/Realtime Queries: 폴링/실시간 쿼리 Parallel Queries: 병렬 쿼리 Dependent Queries: 의존성 있는 쿼리 Mutations API: 뮤테이션 APIAutomatic Garbage Collection: 자동 쓰레기 수집 Paginated/Cursor Queries.. 2023. 5. 2. [TIL-020] Redux를 사용하여 상태 관리를 해야 하는 이유 Today목표 : 05/01일 React Lv4 과제(2)-Redux를 사용하여 상태관리를 해야 하는 이유 Redux를 사용하여 상태관리를 해야 하는 이유 ✅ 오늘 튜터님과의 면담이 있었다. Lv4 과제를 진행하기 위해 현재 컴포넌트 구조와 디자인은 다 마쳐 놓았지만, 아직 기능 구현은 못하고 있었다. 그 이유는 1. JSON서버와 리덕스를 사용하면서 어디까지 상태를 Redux에서 관리해 주어야 하는지, 2. JSON서버와 리덕스 상태를 동시에 계속해서 변경해 주어야 하는 번거로움을 해결할 수 있는 방법이 없는지에 대해 감이 안잡히고 있었기 때문이었다. 일단 JSON서버, Redux-toolkit, React-query를 사용하겠다는 것이 분명해졌으니 먼저 기능 구현을 위해 내가 모르고 있는 점들을 정리.. 2023. 5. 2. [TIL-019] React Lv4 과제(1) - 중복되는 컴포넌트를 App이 아닌 Router 컴포넌트에서 렌더링하는 이유 Today목표 : 4/30일 React Lv4 과제(1) 중복되는 컴포넌트를 App이 아닌 Router 컴포넌트에서 렌더링하는 이유✅ ❗중복되는 Layout, header, footer 등의 컴포넌트를 왜 App 컴포넌트에서 렌더링하지 않고, 하위의 Router 컴포넌트에서 렌더링 할까? function App() { return ( // 새 페이지 마다 렌더링 const Router = () => { return ( ); App 컴포넌트에서 모든 라우트를 처리하면, 모든 페이지에서 공통으로 사용되는 Header와 Footer를 중복으로 렌더링해야 합니다. 반면에 Router를 사용하면, 각각의 라우트마다 별도의 컴포넌트를 렌더링하며, 공통으로 사용되는 Header와 Footer를 중복으로 렌더링하지 않.. 2023. 5. 1. [TIL-018] redux-toolkit, axios - instance와 interceptor, custom Hook Today목표 : 4/29일 redux-toolkit , axios - instance와 interceptor 유용한 사이트, tools✅ 1. 가변성, 불변성 함수 확인 가능한 사이트 => no mutates 불변성 유지 Does it mutate? The lastIndexOf() method returns the last index at which a given element can be found in the array, or -1 if it is not present. The array is searched backwards, starting at fromIndex.Array.prototype.lastIndexOf ( searchElement [ , fromIndex ] ) doesitmutate.. 2023. 4. 29. [TIL-017] JSON-Server / fetch와 axios 차이 / 면접 스터디 3회차 Today목표 : 4/28일 면접 스터디 3회차 JSON - Server ✅ 아주 간단한 DB와 API 서버를 생성해주는 패키지다. 사용 목적 : 백엔드와 협업 시에 백엔드의 DB구축과 API Server가 완성될 때 까지 프론트에서 개발에 임시적으로 사용할 mock data를 생성하기 위함 => json-server를 통해서 임시 API를 구축하고, 서버의 data를 mocking(흉내,모의) 할 수 있으며 이것을 통해 선제적으로 FE 개발을 진행할 수 있다. 사용 방법 1. json-server 설치 => json-server는 보통 4000번 port를 이용한다. yarn add json-server yarn json-server --watch db.json --port 4000 2. db.json.. 2023. 4. 29. REST API란 무엇인가? 1. REST의 등장 배경 1. REST의 등장 REST는 인터넷과 같이 복잡한 네트워크 통신이 등장함에 따라, 이를 관리하기 위한 지침으로 만들어졌다. 대부분의 비즈니스 애플리케이션은 다양한 태스크를 수행하기 위해 다른 내부 애플리케이션 및 서드 파티 애플리케이션과 통신해야 한다. 어플리케이션의 통합, 멀티 플랫폼 최근의 서버 프로그램은 다양한 브라우저와 안드로이드폰, 아이폰과 같은 모바일 디바이스에서도 통신을 할 수 있어야한다. 이러한 멀티 플랫폼에 대한 지원을 위해 서비스 자원에 대한 아키텍처를 세우고 이용하는 방법을 모색한 결과, REST에 관심을 가지게 되었다. 이 때 REST 기반 아키텍처를 사용하여 대규모의 고성능 통신을 안정적으로 지원할 수 있다. 쉽게 구현하고 수정할 수 있어 모든 API.. 2023. 4. 28. 이전 1 ··· 5 6 7 8 9 10 11 ··· 24 다음
