정리14 [React] useLocation, useParams와 props 개인 공부 후 자료를 남겨놓기 위한 목적이므로, 생략되거나 오류가 있을 수 있음을 알립니다. 설명에 대한 지적은 언제나 환영입니다. :) react가 사용하는 외부 패키지 중 react-router-dom이 있다. react-router-dom이 V6로 업데이트 되면서, 그전에 사용되었던 match, RouteComponentProps를 사용하지 못하게 되었는데, 그 대신 생긴 새로운 기능을 알아보도록 하자. 1. UseParams 우리가 라우터를 구성한 뒤, navigate나 Link를 이용하여 보내는 값인 to 값을 사용하고 싶으면 useParams()를 사용한다. 이 처럼 받는 라우터에서 useParams를 이용하여 주소값에서 해당 값을 빼내 사용할 수 있다. 2. UseLocation을 이용하는 .. 2022. 8. 22. [React] 리액트의 유용한 기능 3가지 (automatic batching , useTransition, useDeferredValue) 개인 공부 후 자료를 남겨놓기 위한 목적이므로, 생략되거나 오류가 있을 수 있음을 알립니다. 설명에 대한 지적은 언제나 환영입니다. :) 최신 리액트인 React 18에서 추가된 여러 기능 중 유용하게 사용할 수 있는 기능 3가지를 알아보도록 하자. 1. automatic batching automatic batching에 대해서 알아보기 전 batch가 무엇인지 먼저 알아보자. 리액트에서의 batching은 리액트가 더 좋은 성능을 내기 위해 여러개의 state 업데이트를 하나의 재렌더링이 일어나도록 그룹화 하는 것을 의미한다. 쉽게 설명하자면 다음과 같다. automatic batching의 경우 다행이도, 이름에 걸맞게 자동적용 되므로, 다른 코드를 삽입하여 실행하거나 하지 않아도 된다. (최근의 .. 2022. 7. 9. [React 기본] 9. Delete (CRUD) 개인 공부 후 자료를 남겨놓기 위한 목적이므로, 생략되거나 오류가 있을 수 있음을 알립니다. 설명에 대한 지적은 언제나 환영입니다. :) 이 포스팅은 이전의 포스팅과 이어집니다. 2022.07.08 - [Develop/react] - [React 기본] 8. Update (CRUD) [React 기본] 8. Update (CRUD) 개인 공부 후 자료를 남겨놓기 위한 목적이므로, 생략되거나 오류가 있을 수 있음을 알립니다. 설명에 대한 지적은 언제나 환영입니다. :) 이 포스팅은 이전의 포스팅과 이어집니다. 2022.07.08 - [De tarra.tistory.com + 생활코딩의 react 강의를 기본 베이스로 이것저것 추가 작성 필기입니다. 영상을 보고싶다면 다음의 링크를 접속해 보시는 것을 추천합.. 2022. 7. 8. [React 기본] 3. 컴포넌트 만들기 개인 공부 후 자료를 남겨놓기 위한 목적이므로, 생략되거나 오류가 있을 수 있음을 알립니다. 설명에 대한 지적은 언제나 환영입니다. :) 이 포스팅부터는 리액트의 여러 기능과 구현에 대해서, 이해하기 쉽도록 파트별로 설명을 해볼 생각이다. 그 중에서 우리가 페이지를 만드는 부품인 컴포넌트에 대해 먼저 알아보도록 하자. component (컴포넌트) 앞선 포스팅에서 리액트의 본질은 "사용자 정의 태그를 만들어 활용하는 것" 이라고 했다. 이 사용자 정의 태그를 의미하는 것이 컴포넌트이며, 다음의 코드를 봐보자. html의 시멘틱 태그인 header, nav, article이 있다. 만약 이 태그들이 몇백, 몇천의 코드를 가지고 있다고 생각하면 우리가 지금 작성하고 있는 App이라는 function이 관리하.. 2022. 7. 7. 이전 1 2 3 4 다음
