FE · 프론트엔드
프론트엔드는 사용자가 보는 화면과 클릭 결과를 담당합니다. 대시보드에서 연도를 선택하면 KPI와 차트가 함께 바뀌는 일이 대표적인 예입니다. 메모 저장처럼 컴퓨터 밖의 데이터가 필요한 경우에는 백엔드에 요청하고, 성공·실패를 화면에 표시합니다.
| 화면에서 보이는 일 | 프론트엔드가 하는 일 |
|---|---|
| 연도 메뉴와 숫자 카드가 보임 | HTML로 구조를 만들고 CSS로 배치 |
| 연도를 바꾸면 차트도 바뀜 | JavaScript가 선택값을 읽고 화면을 갱신 |
| 저장 버튼을 누름 | API 요청을 보내고 응답에 따라 안내 문구 표시 |
| 서버 연결이 끊김 | 저장 성공으로 표시하지 않고 오류·재시도 안내 |
- WEB-FE-01 · 브라우저와 화면의 구조
- WEB-FE-02 · 사용자 동작과 화면 상태
- WEB-FE-03 · HTTP·API로 백엔드 연결하기
- WEB-FE-04 · 개발자 도구로 화면 오류 찾기
처음이라면 01 · 화면의 세 역할부터 읽습니다. 화면·서버의 전체 연결은 웹 개발 기초에 있습니다.