1. 커스텀 훅 사용 장점 재사용성 같은 로직을 여러 컴포넌트에서 재사용할 수 있습니다. 분리된 관심사 로딩 로직을 컴포넌트로부터 분리하여 관리할 수 있습니다. 코드의 중복 최소화 중복되는 코드를 줄일 수 있습니다. 단점 학습 곡선 커스텀 훅을 제대로 이해하고 사용하기 위해선 React 훅에 대한 이해가 필요합니다. 2. 전역 상태 관리 (예: Redux, Context API) 장점 애플리케이션 전반에서 상태 공유 JS 라이브러리의 로드 상태를 앱의 모든 컴포넌트와 공유할 수 있습니다. 중앙 집중식 관리 상태를 한 곳에서 관리하여 일관성을 유지할 수 있습니다. 단점 복잡성 상태 관리 라이브러리의 추가적인 복잡성과 설정이 필요합니다. 오버헤드 작은 애플리케이션의 경우, 전역 상태 관리가 과도하게 느껴질 ..
Frontend/React
React 공식 문서를 통한 학습 중, use-immer에 대해 접하게 되었다. 반복적인 코드를 줄이기 위해 use-state 대신 use-immer를 사용할 수 있다는 내용이었다. 그렇다면, 모든 경우에 use-state 대신 use-immer를 사용할 수 있을까? 결론부터 말하자면, use-state와 use-immer를 적절히 혼용해야한다고 판단했다. 이유를 말하기에 앞서, use-immer에 대해 간단히 설명하겠다. use-immer 란? use-immer는 immer 라이브러리를 리액트의 상태 관리와 결합하는 훅을 제공한다. immer는 불변성을 유지하면서 상태를 업데이트하는 것을 간편하게 만들어 주는 도구이며, 복잡한 상태 구조를 가진 애플리케이션에서 특히 유용하다. use-immer의 장점 ..
목차 crypto-js crypto-js 설치 crypto-js 사용 예시 crypto-js crypto-js는 해쉬 함수를 통해 양방향으로 암호화 할 수 있도록 해주는 Node.js 기반 패키지이다. crypto-js 설치 npm i crypto-js crypto-js 사용 예시 내 경우, React 앱 내 src/util/ 경로에 EncryptService.js 파일을 생성해 활용했다. 나는 AES 암호화 방식을 선택했으며, 여기를 참고해 원하는 암호화 방식을 사용해도 상관없다. // EncryptService.js import CryptoJS from "crypto-js"; import { secrets } from "../../secret"; const encryptionKey = secrets...
