개인작업 / zenoBlog 2026.06.05 · 조회 2 · 좋아요 0

[웹 기본 원리] Part 1. 웹사이트가 열리는 전체 흐름

브라우저 주소창에 URL을 입력했을 때부터 화면에 웹페이지가 렌더링되기까지의 5단계 과정을 쉽고 명확하게 정리한 글입니다.

[CHAPTER 0] Part 1. 웹사이트가 열리는 전체 흐름

1. 정의

웹사이트가 열리는 전체 흐름이란, 방문자가 브라우저 주소창에 블로그 주소(URL)를 입력한 순간부터, 원격 클라우드 서버(Railway)에 올라간 코드(Laravel)가 실행되어 최종적으로 브라우저 화면에 블로그 글이 나타나기(렌더링)까지의 전체 동작 과정을 뜻합니다.

2. 필요한 이유

제휴 광고 · 일부 링크는 수수료를 받을 수 있습니다

[젤리 찰칵]

₩4,900

₩9,800

마리오케이스

[젤리 짜부짜부]

₩4,900

₩9,800

마리오케이스

해운대 블루라인파크 스카이캡슐 / 해변열차 탑승권

₩8,000

KKday

코드를 깊이 모르고(바이브 코딩) 블로그를 무작정 배포했더라도, 이 전체 흐름을 알면 오류 해결의 기준점이 생깁니다. 접속이 안 될 때 도메인 설정(DNS) 문제인지, Railway 서버가 꺼진 것인지, 내 라라벨(Laravel) 코드의 문제인지 구역을 나누어 파악할 수 있습니다.

3. 핵심 개념

클라이언트 (Client): 내 블로그에 접속하는 방문자의 크롬, 사파리, 스마트폰 브라우저 등 서비스를 '요청'하는 프로그램입니다.
서버 (Server): 블로그의 소스 코드와 데이터베이스(MySQL)가 저장되어 있는 고성능 컴퓨터입니다. (현재 ZenoBlog 프로젝트에서는 Railway라는 클라우드 서비스를 서버로 사용 중입니다.)
요청(Request)과 응답(Response): 클라이언트가 "블로그 메인 화면 줘"라고 요구하는 것이 요청, 서버가 "여기 만들어진 HTML 화면이야"라고 보내주는 것이 응답입니다.

4. 주변 기초 개념

URL (Uniform Resource Locator): 인터넷 상에 있는 내 블로그의 고유 주소입니다. (예: https://blog.zeno.it.kr)
IP 주소 (IP Address): 컴퓨터끼리 통신하기 위해 사용하는 고유한 숫자로 된 주소입니다. (예: 142.250.190.46) 컴퓨터는 영어 도메인을 모르기 때문에 반드시 IP 주소가 필요합니다.
DNS (Domain Name System): 영문 도메인(blog.zeno.it.kr)을 Railway 서버의 실제 숫자 IP 주소로 변환해 주는 '인터넷 전화번호부'입니다.

5. 실제 흐름

제휴 광고 · 일부 링크는 수수료를 받을 수 있습니다

옆커폰

방문자가 내 블로그에 접속할 때 일어나는 6단계 과정입니다.

URL 입력: 방문자가 브라우저 주소창에 blog.zeno.it.kr을 입력합니다.
캐시(Cache) 확인: 브라우저는 예전에 이 블로그에 접속한 적이 있는지 임시 저장소(캐시)를 확인하여, 저장된 데이터가 있으면 바로 띄웁니다.
DNS 조회: 캐시에 없다면, 인터넷 전화번호부(DNS)에 blog.zeno.it.kr의 IP 주소를 물어보고 Railway 서버의 숫자 IP를 얻어냅니다.
서버에 HTTP 요청 (Request): 알아낸 IP 주소를 통해 Railway 서버에 접속한 뒤, 블로그 메인 페이지 데이터를 달라고 요청합니다.
서버의 처리 및 응답 (Response): Railway 서버 내부에서 구동 중인 Laravel(PHP) 코드가 작동합니다. 데이터베이스(MySQL)에서 블로그 글 목록을 꺼내고, Blade 파일을 이용해 HTML 문서로 예쁘게 조립한 뒤 브라우저에게 응답으로 보냅니다.
브라우저 렌더링 (Rendering): 방문자의 브라우저가 서버에서 받은 HTML(뼈대), CSS(Tailwind 디자인), JavaScript(동작) 파일들을 위에서부터 해석하여 눈에 보이는 블로그 화면으로 그려냅니다.

6. 예시

내 블로그 서버로 들어오는 실제 HTTP 요청(Request) 메시지의 형태는 다음과 같습니다.

GET /posts HTTP/1.1
Host: blog.zeno.it.kr
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) Chrome/120.0.0.0

GET /posts: "서버에 있는 전체 글 목록(/posts)을 보여줘(GET)"라는 명령어입니다.
HTTP/1.1: 통신 규약의 버전입니다.
Host: blog.zeno.it.kr: 수많은 웹사이트 중 내가 접속하려는 정확한 목적지 도메인입니다.
User-Agent: 접속한 방문자의 운영체제와 브라우저 정보입니다.

7. 주의점

DNS 전파 시간: 가비아나 호스팅케이알에서 도메인을 구입하고 Railway 서버 IP를 연결(DNS 설정)했을 때, 이 전화번호부가 전 세계에 업데이트되려면 몇 분에서 최대 24시간이 걸릴 수 있습니다. 바로 접속이 안 된다고 코드를 수정하면 안 됩니다.
서버 자원(비용): 내 블로그(Railway 서버)는 방문자가 없어도 언제 올지 모르는 요청을 기다리기 위해 항상 켜져 있어야 하므로 유지 비용이 발생합니다.

8. 요약

방문자가 블로그 주소를 입력하면 DNS를 통해 Railway 서버의 IP를 찾고, 해당 서버에 블로그 화면을 요청(Request)합니다. 라라벨 코드가 DB에서 글을 가져와 조립한 후 HTML을 응답(Response)하면, 브라우저가 이를 화면에 렌더링(Rendering)하여 우리가 보는 블로그가 완성됩니다.