프론트엔드front-end와 백엔드back-end를 단어 그대로 해석하면 ‘앞단’과 ‘뒷단’이다. 개발에서 둘을 어떤 의미로 쓰는지 간단한 예를 들어 설명하겠다.

노트북에서 넷플릭스를 시청한다고 가정해 보자. 웹 브라우저 주소창에 netflix.com을 입력해 홈페이지에 접속하면 메인 화면에 시청할 수 있는 영화나 드라마 목록이 뜬다. 화면에는 제목과 썸네일만 보이니 작업이 매우 간단해 보인다.

하지만 내부에서는 ➊ 사용자가 보는 화면을 처리하는 클라이언트client가 영화나 드라마 목록을 서버server에 요청하고 ➋ 서버는 요청받은 데이터를 데이터베이스DB, DataBase에서 가져와 클라이언트에 전달한다.

▲ 그림 2-4 넷플릭스의 동작 구조