React
1. React환경에서 useParams를 활용하여 Dynamic Routes 구현하기
\*여러 방법이 있었지만, 시간 관계상 빠른 결과물을 구현하는 것이 목적이여서 야매 방법을 차용함. https://velog.io/@mjhyp88/ReactTypescript-Layout-Componentwith.-react-router-dom-v6 https
2.[tailwindCSS + react] 환경에서 반응형 Navbar 만들기
!codepenminislively/embed/WNaJvMW?default-tab=html%2Cresult가급적 애니메이션들의 요소들을 추가하려면 tailwind보다 일반 css가 훨씬 용이하다.빠르고 편리하게 개발하거나, margin, padding, 반응형의 요소들
3.react-hook-form defaultValue 초기값 설정 에러사항
가끔, react-hook-form을 사용할 때 defaultValue를 설정하더라도, 렌더링이 되는 부분에서, 오류가 생깁니다.useMemo를 사용하여, 다국어 처리를 진행함. 이 함수는 useForm에 defaultValue의 한 요소와 관련이 있음. 현지화 함수(
4.모달 창에서 백그라운드 스크롤 비활성화하기
React의 useEffect 훅을 사용하여 컴포넌트가 마운트될 때 특정 동작을 수행하고, 언마운트될 때 정리(cleanup) 작업을 수행하는 예제입니다. 이 코드는 특히 모달 창을 여는 상황에서 백그라운드 스크롤을 비활성화하고, 모달 창이 닫힐 때 스크롤 위치를 복원
5.[ useMemo ] 복잡한 React 로직을 쉽게 관리하는 방법
코드에서 useMemo와 관련된 로직이 많아 복잡성이 증가한다면, 코드 분할을 통해 관리성과 가독성을 개선할 수 있습니다. 코드 분할은 반복되는 로직을 별도의 모듈이나 유틸리티 함수로 분리하는 것입니다. 이를 통해 코드의 재사용성을 높이고, 유지보수 작업을 더 쉽게 할
6.[ React ] useMemo 너는 언제 사용하는가?
useMemo는 React Hook 중 하나로, 계산된 값을 메모이제이션(Memoization)하여 성능을 최적화하는 데 사용됩니다. 주로 컴포넌트가 렌더링될 때 불필요한 재계산을 방지하고자 할 때 사용됩니다.비싼 계산을 수행할 때: 계산이 복잡하고 시간이 많이 걸리는