1. 수동 검사: 가장 간단한 방법은 package.json 파일을 열어서 각 라이브러리를 검토하는 것입니다. 프로젝트에서 해당 라이브러리를 사용하는지 여부를 수동으로 확인합니다. 이 방법은 시간이 많이 소요되며, 대규모 프로젝트에서는 비효율적일 수 있습니다. 2. 도구 사용: depcheck: depcheck는 노드 프로젝트에서 사용되지 않는 의존성을 찾아주는 도구입니다. 설치 후 프로젝트 디렉토리에서 depcheck를 실행하면 미사용 의존성 목록을 볼 수 있습니다. npm install -g depcheck depcheck Unused dependencies * @date-io/date-fns * @mui/x-data-grid * @types/googlemaps * apexcharts-clevisio..

서브셋 폰트(subset font) 글꼴(font)의 서브셋(subset)을 의미합니다. 즉, 문자 세트의 일부만을 포함하는 글꼴입니다. 웹에서 이를 사용하는 주된 이유는 성능 향상입니다. 전체 글꼴 대신 필요한 문자들만 포함한 서브셋을 사용함으로써, 파일 크기를 줄이고 페이지 로딩 시간을 단축시킬 수 있습니다. 예를 들어, 영문 웹사이트에서 한글 폰트를 사용할 필요가 없다면, 한글을 포함하지 않은 서브셋 글꼴을 사용하여 리소스를 절약할 수 있습니다. 마찬가지로, 한글 웹사이트에서도 필요한 한글 글자들만을 포함하는 서브셋을 만들어 사용할 수 있습니다. 서브셋 리스트 어떤 글자를 남기고 어떤 글자를 버리는 것이 좋을까? 자주 사용하는 것은 포함하고, 거의 사용하지 않는 글자를 삭제하는 게 바람직합니다. 일..

npm install 또는 yarn install을 실행하면 각각 package-lock.json 파일 또는 yarn.lock 파일이 생성됩니다. 이 파일들은 프로젝트의 의존성에 대한 구체적인 정보를 제공합니다. package-lock.json 또는 yarn.lock 파일에는 프로젝트의 모든 의존성에 대한 정확한 버전, 패키지의 해시 체크섬, 패키지의 의존성 등의 세부 정보가 포함되어 있습니다. 또한, 이러한 lock 파일은 의존성 트리(dependency tree)를 재현하기 위해 사용됩니다. 예를 들어, 패키지 A가 패키지 B를 필요로하고, 패키지 B가 패키지 C를 필요로하는 경우, 이러한 관계가 lock 파일에 기록됩니다. 따라서 다른 환경에서 동일한 의존성 트리를 생성할 수 있게 됩니다. 이를 통..

HTTP는 HyperText Transfer Protocol의 약자로, 웹에서 데이터를 주고 받는 프로토콜입니다. 즉, 클라이언트(일반적으로 웹 브라우저)와 서버 사이에 정보를 주고 받는 방식을 정의합니다. HTTP는 stateless protocol로, 각 요청이 독립적으로 처리되며, 이전 요청에 대한 정보는 저장되지 않습니다. HTTPS는 HTTP에 보안 기능이 추가된 것으로, Secure Socket Layer (SSL) 또는 Transport Layer Security (TLS) 프로토콜을 사용하여 전송되는 데이터를 암호화합니다. 이는 중간에서 데이터를 가로채도 원래의 내용을 알 수 없도록 하는 역할을 합니다. 따라서 민감한 정보(예: 신용 카드 정보, 로그인 정보 등)를 전송할 때 HTTPS를 ..

Hot Module Replacement (HMR) 웹 애플리케이션을 개발할 때 사용하는 모듈 교체 기술 이 기술은 웹 애플리케이션의 실행 중에 개별 모듈을 교체하거나 수정하면서 애플리케이션을 다시 로드하지 않고 변경 사항을 반영 이렇게 하면 개발자가 변경사항을 실시간으로 확인하면서 효율적으로 작업할 수 있다. HMR의 핵심 이점은 아래와 같다. 개발 속도 향상: 변경 사항을 반영하려면 전체 애플리케이션을 다시 로드할 필요가 없으므로 개발 시간을 절약할 수 있다. 상태 보존: HMR을 사용하면 수정된 모듈만 업데이트되고, 애플리케이션의 전체 상태는 유지된다. 따라서 매번 상태를 재설정하지 않아도 되므로 테스트와 디버깅이 쉬워집니다. 스타일 조정: CSS/SCSS와 같은 스타일 시트를 수정할 때, HMR은..

트레일링 슬래시는 URL 끝에 붙는 슬래시('/')를 말합니다. 예를 들면, https://www.example.com/ 에서 마지막에 붙는 슬래시가 바로 트레일링 슬래시입니다. 트레일링 슬래시의 사용은 웹사이트의 구조와 관련된 설정이며, 종종 SEO (검색 엔진 최적화) 문제와 연관이 있습니다. 일부 웹서버와 프레임워크는 URL 끝에 슬래시가 있는 페이지와 없는 페이지를 다르게 취급할 수 있습니다. 예를 들어, https://www.example.com/page -> 파일 https://www.example.com/page/ -> 디렉토리 위 두 도메인은 다른 페이지로 간주될 수 있습니다. 이런 경우 중복 콘텐츠 문제로 SEO에 영향을 미칠 수 있습니다. 따라서 일관된 URL 구조를 유지하는 것이 중요..