정리와 실습
핵심 요약
- 웹은 끝없이 반복되는 하나의 단순한 춤입니다: 클라이언트(보통 브라우저)가 요청을 보내고, 서버가 응답을 돌려줍니다. 나머지는 전부 그 위에 얹힌 세부일 뿐입니다.
- 은 이어 붙인 이름표가 달린 부분들입니다 — scheme, host, path, query. 메서드는 동사입니다: GET은 읽고, POST는 만들고, PUT은 갱신하고, DELETE는 지웁니다.
- 상태 코드는 서버의 한눈 판정입니다. 4xx/5xx 구분이 어디를 봐야 할지 알려줍니다: 4xx는 요청이 잘못된 것(잘못된 URL), 5xx는 서버 자신의 코드가 깨진 것입니다.
- (자물쇠)는 대화를 봉인해 중간의 누구도 읽지 못하게 합니다 — 진짜 앱은 항상 씁니다. 쿠키는 여러 요청에 걸쳐 사이트가 로그인 상태를 기억하는 방법입니다.
- 프런트엔드는 클라이언트(브라우저에서 실행)이고, 백엔드는 서버(로직을 실행하고 데이터베이스와 대화)입니다. 여러분이 만드는 모든 기능은 이 춤의 한쪽 편에 있습니다.
직접 해보기
아무 웹사이트나 열고, 브라우저 개발자 도구를 여세요(우클릭 → "검사", 그다음 "Network" 탭). 페이지를 새로고침하세요. 요청 목록이 채워지는 걸 보세요 — 페이지 요청 하나에 이어 이미지, 폰트, 스타일을 위한 수십 개의 요청이 더 나오는 게, 설명한 그대로입니다. 하나를 클릭해 메서드(GET), 상태 코드(잘하면 200), 헤더를 보세요. 이제 요청/응답 춤이 실시간으로 일어나는 걸, 그것을 읽을 어휘와 함께 보고 있는 것입니다.
이 장의 프롬프트
저는 초보자로서 웹이 어떻게 작동하는지 배우고 있습니다. 제 앱을 예시로 사용해서:
<당신의 앱을 설명하거나, URL이나 지금 보고 있는 오류를 붙여넣으세요>
- 하나의 구체적인 동작(페이지 불러오기나 폼 제출 같은)에 대해
요청/응답 순환을 단계별로 차근차근 설명해 주세요.
- 어느 부분이 클라이언트(프론트엔드)이고 어느 부분이 서버(백엔드)인지 알려주세요.
- 제가 상태 코드나 오류를 보고 있다면, 그것이 4xx(제 요청이 잘못됨)인지
5xx(서버가 깨짐)인지, 그리고 어디를 봐야 하는지 설명해 주세요.
- 구체적이고 초보자 친화적으로 — 가정된 지식 없이 설명해 주세요.