[Next.js+TS] Jest, RTL(React Testing Library) 빠르게 초기 설정해보자
1. 종속성 설치yarn add --dev jest @testing-library/react @testing-library/jest-dom @testing-library/user-event @types/jest ts-jest jest-environment-jsdom Jest, React Testing Library를 사용하기 위해 필요한 종속성을 설치해 줍시다.2. jset.config.js & jset.setup.js설정jest.config.js | tsimport nextJest from "next/jest";const createJestConfig = nextJest({ dir: "./",});const customJestConfig = { setupFilesAfterEnv: ["/jest.se..
Next.js란? Next.js란 서버 사이드 렌더링(SSR), 정적 웹 페이지 생성(SSG), 리액트 기반 웹 애플리케이션 기능(CSR)을 입맛대로 사용할 수 있는 React기반 프레임 워크입니다. 각 페이지 상황에 알맞은 렌더링 방식을 사용하여 최적의 사용자 경험 및 효율을 챙겨갈 수 있습니다. 즉 각 렌더링 방식의 좋은 것들만 빼와서 적용시킬 수 있는 것이죠. CSR(Client-side rendering) 클라이언트 단에서 페이지 렌더링을 처리하는 방식으로 데이터를 제외한 코드들은 JS파일에 한 번에 번들되어서 옵니다. 이로 인해서 초기 진입 속도가 느려(빈 화면을 보여주는 상황) 사용자의 경험이 안 좋을 수 있습니다. 해당 부분은 code spltting을 통해 어느 정도 해결이 가능합니다. H..