"웹 개발부터 배포, 운영까지 (7/8) — 프론트엔드와 백엔드 배포 구조: EC2, WAS, nginx를 한 번에 정리"

-

배포는 서버를 하나 사는 일이 아니라, 요청이 어디를 거쳐 어떤 프로세스에 도달하는지 구조를 만드는 일이다.

핵심 요약

  • EC2는 애플리케이션을 올릴 수 있는 가상 서버이고, nginx는 요청을 받아 정적 파일 제공과 프록시 역할을 수행하는 웹 서버다.
  • 브라우저 요청은 보통 도메인 -> nginx -> 애플리케이션 서버(WAS) -> 데이터 계층 순서로 흐른다.
  • 프론트엔드와 백엔드는 "코드 종류"보다 "어디서 실행되고 무엇을 반환하는가"로 구분하는 편이 운영에 유리하다.
  • 입문 단계에서는 한 대의 EC2에 올릴 수 있어도, 역할 분리를 이해해야 장애와 병목을 설명할 수 있다.

1. EC2는 무엇이고 왜 자주 등장할까

AWS EC2는 직접 서버를 관리하는 방식의 대표적인 출발점이다. AWS 문서 기준으로 사용자는 인스턴스를 생성하고, 리전을 선택하고, 네트워크와 접근 방식을 정해 애플리케이션을 올린다.

초보자 입장에서 EC2를 이해하는 가장 쉬운 방법은 "내가 실행 환경을 더 많이 책임지는 서버"라고 보는 것이다.

  • 어떤 운영체제를 쓸지 정해야 한다
  • 어떤 포트를 열지 정해야 한다
  • 어떤 프로세스를 띄울지 정해야 한다
  • 재시작, 로그, 업데이트를 직접 관리해야 한다

플랫폼형 배포보다 손이 더 가지만, 구조를 배울 때는 오히려 투명하다. 어떤 레이어가 실제로 존재하는지 잘 보이기 때문이다.

2. 웹 서버와 WAS는 어떻게 다를까

웹 개발 입문에서 자주 나오는 WS와 WAS 구분은 아직도 유효하다. 용어 자체보다 역할 분리를 이해하는 것이 중요하다.

웹 서버(nginx)

정적 파일을 전달하고, 외부 요청을 받아 적절한 내부 서비스로 넘기는 데 강하다. 리버스 프록시, 캐시, 압축, 라우팅 제어 같은 역할을 맡는다.

WAS 또는 애플리케이션 서버

실제 애플리케이션 코드를 실행한다. Node.js 서버, Python 앱 서버, Java 애플리케이션 서버처럼 요청을 받아 비즈니스 로직을 처리하고 응답을 만든다.

즉, nginx는 "문 앞 정리와 전달", 애플리케이션 서버는 "실제 처리"에 가깝다.

3. 왜 nginx를 앞에 두는가

입문자에게는 "그냥 앱 서버 포트를 바로 열면 되지 않나?"라는 질문이 자연스럽다. 작은 실험에서는 가능하다. 하지만 운영 구조에서는 nginx를 앞단에 두는 이유가 분명하다.

정적 파일 처리

이미지, CSS, JS 같은 파일은 애플리케이션 서버를 거치지 않고 더 효율적으로 응답할 수 있다.

리버스 프록시

외부에는 80, 443 포트만 노출하고, 내부에서는 애플리케이션이 3000, 8000 같은 포트에서 돌아가도록 숨길 수 있다.

요청 분기

/api는 백엔드로, 나머지는 프론트엔드 정적 자산이나 SSR 서버로 보내는 식의 경로 분리가 가능하다.

재시작과 격리

애플리케이션 프로세스가 재시작되더라도 프록시 계층은 분리되어 운영할 수 있다.

nginx 공식 문서는 마스터 프로세스와 워커 프로세스 구조, 시그널 기반 제어를 설명한다. 이런 점은 nginx가 단순 파일 서버가 아니라 운영 제어 지점이라는 것을 보여 준다.

4. 프론트엔드와 백엔드는 배포에서 어떻게 만날까

아키텍처를 아주 단순화하면 아래 흐름으로 볼 수 있다.

사용자 브라우저
  -> 도메인
  -> nginx
  -> 프론트엔드 정적 파일 또는 SSR 서버
  -> 백엔드 API 서버
  -> 데이터베이스/외부 서비스

여기서 중요한 것은 프론트엔드도 경우에 따라 단순 정적 파일일 수 있고, 서버 렌더링을 하면 별도 프로세스가 될 수도 있다는 점이다.

백엔드는 API 응답을 주고, 프론트엔드는 화면을 보여 준다고 흔히 설명하지만, 배포 관점에서는 더 정확히 이렇게 정리할 수 있다.

  • 프론트엔드: 브라우저에 보이는 자산과 UI 실행 레이어
  • 백엔드: 요청 처리, 인증, 데이터 접근, 비즈니스 규칙 레이어
  • nginx: 외부 요청을 받아 적절한 실행 지점으로 나누는 레이어

5. 한 대의 서버에 올릴 때 주의할 점

입문 단계에서는 한 대의 EC2에 프론트엔드, 백엔드, nginx를 모두 올리는 구성이 자주 쓰인다. 이해하기 쉽고 비용도 낮다. 다만 몇 가지 한계가 있다.

자원 경쟁

빌드, API 처리, 로그 적재가 한 서버 자원을 같이 쓰면 CPU와 메모리 병목이 금방 생긴다.

장애 전파

한 프로세스의 문제나 잘못된 배포가 전체 서비스에 동시에 영향을 준다.

운영 복잡도 증가

방화벽, 포트, 프로세스 매니저, 배포 스크립트, 로그 경로를 모두 한 머신에서 관리해야 한다.

그래서 한 대 배포는 나쁜 방식이라기보다, "구조를 배울 수 있지만 분리 필요성이 빨리 드러나는 단계"라고 보는 편이 정확하다.

6. 입문자가 기억하면 좋은 최소 구조

처음 서버 배포를 이해할 때는 아래 세 줄만 잡아도 충분하다.

  1. EC2는 실행 환경이다.
  2. nginx는 외부 요청을 받는 문지기다.
  3. 애플리케이션 서버는 실제 코드를 실행하는 처리기다.

이 세 역할이 머릿속에서 분리되면, 이후에 Docker, 로드 밸런서, 오토스케일링, 컨테이너 오케스트레이션을 배워도 훨씬 덜 헷갈린다.

참고 자료

  • AWS Docs, Get started with Amazon EC2 — https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/EC2_GetStarted.html
  • NGINX Docs, Beginner's Guide — https://nginx.org/en/docs/beginners_guide.html
  • Next.js Docs, Deploying — https://nextjs.org/docs/pages/building-your-application/deploying

이 글은 웹 개발부터 배포, 운영까지 시리즈의 7/8편이다.

댓글

댓글 쓰기

이 블로그의 인기 게시물

"LLM 핵심 학습 (1/6) — 기본: 토큰화·임베딩·어텐션·위치 인코딩"

-
이미지
(시리즈 시작) 📚 시리즈 목차 2/6 파인튜닝 → 트랜스포머 한 블록의 데이터 흐름을 문자열 → 토큰 → 임베딩 → 어텐션 → 출력 표현 까지 손으로 풀어 본다. 이번 편이 끝나면 "왜 \(\sqrt{d_k}\)로 나누는가", "RoPE는 무엇을 회전시키는가", "한국어가 영어보다 토큰이 많은 까닭은 무엇인가"가 한 줄로 설명될 수 있다. 0. 학습 목표 이 편을 마치면 다음을 직접 할 수 있다. BPE 토크나이저 가 어휘를 어떻게 학습하고 새 문자열을 어떻게 자르는지 종이 위에서 시뮬레이션한다. 임베딩 행렬 의 모양과 초기화, weight tying의 의미를 한 줄로 설명한다. Scaled Dot-Product Attention 의 식을 차원 단위로 추적하고 PyTorch 30줄로 재현한다. Multi-Head Attention 이 한 헤드와 비교해 무엇이 다른지, 헤드 수가 늘면 어디가 비싸지는지 답한다. Sinusoidal·RoPE·ALiBi 세 위치 인코딩의 식과 외삽 성질을 구분한다. 컨텍스트 확장이 왜 \(O(N^2)\)인지, "Lost in the Middle"이 왜 발생하는지 설명한다. 1. 핵심 요약 트랜스포머의 입력은 문자열 이 아니라 정수 ID 시퀀스 다. 토크나이저가 문자열 → ID로 자른다. 임베딩은 정수 ID를 \(d\)차원 벡터로 lookup하는 학습 가능한 테이블이다. Self-Attention은 \(\text{softmax}(QK^\top / \sqrt{d_k}) V\) 한 줄이 핵심이고, 멀티헤드는 같은 연산을 여러 부분 공간에서 병렬화한 것이다. 위치 정보는 임베딩에 직접 더하거나(Sinusoidal), Q·K에 회전을 가하거나(RoPE), 어텐션 스코어에 거리 패널티를 더해서(ALiBi) 주입한다. 컨텍스트 길이 \(N\)에 대해 표준 어텐션은 \(O(N^2)\) 비용을 갖고, 긴 컨텍스트에서는 중간 위...
Read more »

"LLM 핵심 학습 (2/6) — 파인튜닝: LoRA·QLoRA·증류·Adapter"

-
이미지
← 1/6 기본 📚 시리즈 목차 3/6 디코딩과 생성 → 사전학습된 LLM을 내 데이터 에 적응시키는 방법을 비용·메모리·일반화 관점에서 정리한다. Full FT의 한계 → Adapter → LoRA → QLoRA → Distillation 순으로 같은 그림을 점점 확대해 본다. 0. 학습 목표 Full fine-tuning의 메모리 병목을 옵티마이저 상태·그래디언트·가중치·활성화 의 4분할로 설명한다. Adapter(Houlsby 2019)와 LoRA(Hu 2021)의 식 차이를 한 줄로 적는다. LoRA의 \(A, B\) 행렬이 왜 저랭크 이고, rank \(r\) 선택이 무엇을 결정하는지 답한다. QLoRA(Dettmers 2023)의 NF4·double-quant·paged optimizer를 분리해서 설명한다. Catastrophic Forgetting을 분포 시프트 관점에서 정의하고 완화 기법을 두 개 이상 든다. Hinton 2015의 Knowledge Distillation 식을 손으로 유도한다. 1. 핵심 요약 Full FT는 메모리/디스크/시간 모두 비싸다. 7B 모델 full FT는 V100 8장 + A100 1장으로도 큰 부담이다. PEFT(파라미터 효율 파인튜닝) 일가족은 극히 일부 파라미터만 학습 해 같은 효과를 얻는다. LoRA: \(\Delta W = BA\) (rank \(r \ll \min(d_{\text{in}}, d_{\text{out}})\))로 가중치 업데이트를 저랭크 분해. QLoRA: 베이스 모델을 4-bit(NF4)로 양자화한 채 LoRA만 풀-정밀(BF16)으로 학습. Catastrophic Forgetting: 새 분포에 적응하느라 이전 능력이 무너지는 현상. PEFT 자체가 부분 완화책. Distillation: 큰 교사 모델의 soft target 을 학습 신호로 써서 작은 학생 모델 을 만든다. 2. 직관: 왜 사전학습만으로는 부족한가 사전학습은 일반...
Read more »

"ML 기초 학습 (1/9) — 머신러닝과 sklearn: 학습의 좌표계"

-
이미지
(시리즈 시작) 📚 시리즈 목차 2/9 이웃 알고리즘 → 이 시리즈는 신경망과 로컬 LLM으로 가기 전에 손에 익혀 둬야 할 머신러닝 기초 9편이다. 1편은 모든 ML 코드가 공유하는 공통 문법 을 잡는 데 쓴다. sklearn은 그 문법을 가장 일관되게 보여주는 도구다. 이번 편이 끝나면 어떤 모델을 만나도 fit → predict → score → 평가 흐름이 같다는 것이 손에 잡힌다. 0. 학습 목표 이 편을 마치면 다음을 할 수 있어야 한다. 지도학습·비지도학습·강화학습을 한 문장씩 구분해 설명한다. sklearn의 estimator 인터페이스 ( fit , predict , score , transform )를 코드 한 화면 안에서 쓸 수 있다. train/validation/test 분할을 왜 하는지, 어디서 데이터 누수가 생기는지 식과 그림으로 설명한다. 분류·회귀의 핵심 평가 지표(accuracy, precision, recall, F1, MSE, R²)를 정의에서 직접 계산할 수 있다. k-fold 교차검증 을 코드 한 줄로 돌리고, 결과의 평균과 표준편차를 함께 보고할 수 있다. Pipeline 으로 전처리와 모델을 묶어 데이터 누수를 구조적으로 막는 방법을 설명한다. 1. 핵심 요약 머신러닝은 데이터에서 함수 \(f: X \to Y\)를 찾는 작업 이다. 어떤 모델이든 이 본질은 같다. sklearn은 모든 모델을 같은 인터페이스( fit , predict , score )로 통일해, 모델을 바꿀 때 한 줄만 바꾸면 되게 한다. train/val/test 세 분할이 표준이다. 검증으로 하이퍼파라미터를 고르고, 테스트는 마지막에 한 번만 본다. 데이터 누수 (test 정보가 train에 새는 현상)는 ML 입문자가 가장 자주 만드는 실수이며, Pipeline + cross_val_score 조합으로 구조적으로 막을 수 있다. 평가 지표는 문제 유형 (분류/회귀) 과 클래스 불균형...
Read more »