기본적인 웹 환경의 아키텍처 설명하기 (이것만 알아도 아키텍처는 끝!!)

Q. 다양한 클라이언트 디바이스에서 서버를 호출할 때 일반적인 3 tier 환경에서
동작하는 전반적인 프로세스에 대해서 설명해주세요.

 

일단 이 질문에 답을 하기 위해선 기본적으로 알아야할 용어들이 있는데요! 

1. 구성 요소 (3-Tier)

3-Tier 아키텍처는 현대 웹 애플리케이션에서 가장 기본적인 구조로, 크게 3가지 계층으로 나눠집니다.

Presentation Tier (프론트엔드)	사용자 인터페이스, 화면	React, Vue, 브라우저
Application Tier (WAS)	비즈니스 로직 처리	Express.js, Spring, Django
Data Tier (DB)	데이터 저장 및 조회	MySQL, MongoDB

2. DNS(Domain Name System)의 역할

사용자가 브라우저에 example.com과 같은 도메인을 입력하면, 브라우저는 도메인을 숫자로 된 IP 주소로 변환해야 합니다.

이 역할을 하는 것이 DNS입니다!

• DNS: 도메인 이름 → IP 주소 변환
• 예시: example.com → 13.124.100.50

사용자는 도메인을 기억하지만 실제로는 IP 주소로 서버에 접속합니다. 

이 때문에 우리가 서버에 배포하고 도메인을 구입하고, DNS를 설정해야하는 것이죠!

---

3. L7 로드밸런서란?

L7은 OSI 7계층 중 ‘애플리케이션 계층’을 뜻합니다. L7 로드밸런서는 HTTP 요청 메시지의 내용(예: URL, 헤더, 쿠키 등)을 분석해 요청을 적절한 서버로 분배하거나 필터링하는 장치 혹은 소프트웨어입니다.

L7 로드밸런서의 주요 기능

• URL 경로 기반 라우팅 (예: /api/* → API 서버, /admin/* → 관리자 서버)
• 간단한 인증/필터링 (예: 특정 쿠키 또는 헤더가 없으면 차단)
• SSL 종료 (HTTPS 처리)
• 트래픽 분산 및 부하 관리

이정도면 알면 될 것 같고, HTTP 호출한 뒤 어떻게 애플리케이션 서버를 거쳐 DB에 엑세스 하는지 확인해보겠습니다!

3. HTTP 요청 흐름 (예시)

사용자가 브라우저에서 https://example.com/를 호출하는 과정을 단계별로 살펴보겠습니다!

1	브라우저	도메인 example.com 입력	사용자
2	DNS	도메인 → IP 주소 변환	example.com → 13.124.100.50
3	L7 로드밸런서	요청 URL 분석 후 /api/ 요청을 요청을 어느 서버로 보낼지 분배하여 라우팅	nginx location /api/ { proxy_pass http://app_servers; }
4	L7 로드밸런서	IP 제한, 헤더 또는 쿠키 유무 확인 후 간단 필터링	nginx if ($http_x_api_key = "") { return 403; }
5	Application 서버 (WAS)	JWT 토큰 검사 등 복잡한 인증/인가 수행, 비즈니스 로직 처리	Express.js JWT 미들웨어 예시 (아래 참고)
6	데이터베이스	데이터 조회 후 결과 반환	MySQL 쿼리 실행
7	Application 서버	결과 JSON 생성하여 응답	res.json(products);
8	L7 로드밸런서	응답 클라이언트로 전달	프록시 역할 수행
9	브라우저	응답 수신 후 화면 렌더링	React 컴포넌트 업데이트

클라이언트 ↔ DNS → IP → Nginx(리버스 프록시) → WAS 순서로 요청이 흐르는 구조라고 이해하시면 됩니다!

 

5. 예시 코드

5-1. Nginx L7 로드밸런서 간단 필터링 예시

server {
    listen 80;
    server_name example.com;

    location /api/ {
        # x-api-key 헤더 없으면 차단
        if ($http_x_api_key = "") {
            return 403;
        }

        proxy_pass http://backend_api;
    }
}

5-2. Express.js JWT 인증 미들웨어 예시

const jwt = require("jsonwebtoken");

function authMiddleware(req, res, next) {
  const token = req.headers.authorization?.split(" ")[1]; // Bearer 토큰 추출

  if (!token) {
    return res.status(401).json({ message: "토큰이 없습니다." });
  }

  try {
    const decoded = jwt.verify(token, process.env.JWT_SECRET);
    req.user = decoded;
    next();
  } catch (err) {
    return res.status(401).json({ message: "유효하지 않은 토큰입니다." });
  }
}

module.exports = authMiddleware;

마무리

이번 글에서는 3-Tier 아키텍처와 함께 DNS, L7 로드밸런서가 어떻게 작동하는지
그리고 각각의 역할을 이해할 수 있도록 실제 설정 예시도 함께 살펴보았는데요!

실무에서 일하면서 조각조각 알고 있던 부분들을 퇴근하고 정리하며 퍼즐을 맞춰나가는데 나름 재밌네요 ㅎㅎ

다음에는 방화벽이랑 CDN, DB의 리플리케이션 정도를 추가해서 더 딥하게 공부해서 올려보겠습니다.

다들 화이팅 :)