# react-helmet-async

seumomo

React react-helmet-async 사용법 Zustand State와 Action(동작 함수)을 함께 관리한다. 사용법 커스텀훅을 사용할 때 인수로 콜백함수를 전달해 성능 저하를 방지한다. > persist를 사용하면 localstorage에 저장하여 새로고침해도 유지된다. TanStack Query 한번 불러온 데이터를 캐싱하여 사용자의 경험을 높이기 위해 사용한다. 사용법 Next.js index.html ➡️ layout.js (index.html은 Build 시 생성된다.) 공식 문서의 File Convention을 지켜야 한다. Client인지 Server인지 구분하는 것이 핵심이다. ➡️ Client File은 use client를 선언해야 한다.

seumomo

React Hook useCallback useMemo와 동일하게 Rendering 간에 값을 기억하기 위해 사용한다. > useCallback은 함수 값만 기억하고, useMemo는 함수를 포함한 모든 값을 기억한다. react-helmet-async Page별 title을 설정하거나, Open Graph를 만들어준다. 👉 검색엔진 최적화에 도움이 된다.

seumomo

(2023/08/30) React > ReactDOM => Web App 개발에 사용한다. React Native => Mobile App 개발에 사용한다. > Strict Mode는 각 Component의 기능을 2번 호출하여, 순수 함수의 규칙을 위반하는 Component를 찾는 데 도움을 준다. 👉 Root Component에 ``로 감싸서 사용한다. 👉 Strict Mode는 배포에 영향을 미치지 않는다. 실행 흐름 Rendering Trigger 👉 Component가 최초 실행될 때 Rendering을 지시한다. 👉 상태 또는 속성이 변경되면 Rendering을 지시한다. Components Rendering 👉 Component가 정의된 Function이 (다시) 실행된다. DOM Commit 👉 ReactDOM의 JSX가 실

jinyinshu

1. 들어가기 -apollo graphql prism등으로 만든 insta-backend server와 연동할 web-frontend를 reactJS로 만듬. 공식문서 https://www.apollographql.com/docs/react/get-started https://fontawesome.com/docs/web/use-with/react/ https://reactrouter.com/docs/en/v6/getting-started/installation https://reactrouter.com/docs/en/v6/api https://www.apollographql.com/docs/react/local-state/reactive-variables/ 2. setUp list npm i styled-components npm i react-hook-form npm i react-router-dom npm i @apollo/client