프론트앤드 개발자가 Github에 프론트앤드 소스를 공유한 파일을 분석하는 과정에 대해서 살펴보겠습니다. 먼저, 프론트엔드 소스 파일을 다운로드 받습니다.

파일을 다운받았으면 구조를 봅니다.

가장 먼저 css, data, imgs, js 폴더가 보입니다. 폴더들 안에는 각각 CSS 파일, data 파일, 이미지 파일, 자바스크립트 파일들이 모여 있습니다.

HTML 파일은 폴더 없이 있는 것을 볼 수 있습니다.

index.html 을 열어서 HTML, CSS, JS가 각각 어떻게 작동하는지 살펴봅시다.

제일 먼저 버튼과 같이 사용자가 상호작용할 수 있는 부분을 살펴봅니다.