실습할 프로젝트의 폴더와 파일을 살펴보겠습니다. NPM과 ESLint 등 최신 프런트엔드 개발 환경에 익숙하다면 어렵지 않게 프로젝트의 구성 요소들을 파악할 수 있을 텐데요. 지금부터 하나씩 차근하게 살펴보겠습니다.

현재 quiz 폴더 아래에 있는 1_todo 폴더에 첫 번째 실습 코드가 들어 있습니다. 1_todo 폴더 아래에는 다음과 같이 폴더 2개와 파일 4개가 있습니다.

▲ 그림 4-5 프로젝트 탐색기에서 1_todo 폴더를 펼쳤을 때 표시되는 폴더 구조

우선 각 폴더와 파일이 어떤 역할을 하는지 알아보겠습니다.