Project/웹 프론트엔드10 [Next.js] Next.js 14 기초 기본 용어 메타데이터(metadata) Next.js는 메타데이터(metadata)로 HTML에서 사용하던 `head` 엘리먼트를 대신합니다. Next.js에서 폴더와 파일의 역할 폴더는 경로를 정의하는 데 사용됩니다. 경로는 루트 폴더(root folder)부터, `page.js` 파일이 포함된 최종 리프 폴더(leaf folder)까지 파일 시스템 계층 구조를 따라가는 중첩된 폴더(nested folder)의 단일 경로입니다. 파일은 경로 세그먼트에 표시되는 UI를 만드는 데 사용됩니다. Next.js에서 서버 컴포넌트를 먼저 렌더링(pre rendering)하여 HTML로 클라이언트에 전송합니다. SPA를 하기 위해 필요한 코드는 따로 js파일을 생성하여 브라우저에 전송합니다.(ex. Link 컴포.. 2024. 1. 4. [React] 프론트엔드 테스트와 의존성 분리 프론트엔드와 테스트 대부분 웹 프론트엔드 개발자들은 테스트 코드의 중요성에 대해서 어렴풋이 알고는 있다고 생각합니다. 다만, 아래와 같은 이야기들로 테스트 코드 관련 담론을 무마하는 경향이 있는 것 같습니다. 프론트엔드는 코드 변경이 빈번하다던데, 웹 프론트엔드에서 굳이 테스트 코드를 짜야하나? (반박) 테스트 코드를 작성하면 변경사항이 기존 기능에 영향을 미치는지 빠르게 확인할 수 있다. (반박) 코드 변경에 따른 예상치 못한 버그를 사전에 방지할 수 있다. 프론트엔드 개발자가 직접 UI를 확인하면서 개발할텐데 테스트 코드를 굳이 작성할 필요는 없지 않나? (반박) 프론트엔드 개발자의 수동 테스트도 중요하지만, 테스트 코드는 자동화된 테스트를 통해 일관된 품질을 유지하는 데 도움이 된다. (반박) 수동.. 2023. 11. 29. 이전 1 2 3 다음