"Web Development to Deployment and Operations (7/8) — Frontend and backend deployment architecture: EC2, app servers, and nginx"

Deployment is not just buying a server. It is designing how requests travel through boundaries until they reach the code that should handle them.

Key Takeaways

  • EC2 is a virtual server environment, while nginx is commonly the web-facing layer that serves files and proxies requests to application processes.
  • A common request path is domain -> nginx -> application server -> database or external services.
  • In deployment, the frontend/backend distinction becomes clearer when framed as execution responsibility, not only as file type.
  • A single EC2 machine can host multiple layers, but understanding their separation is what makes scaling and debugging possible later.

1. Why EC2 appears so often in deployment discussions

Amazon EC2 is one of the classic entry points for learning server-based deployment. The official AWS docs describe it as a way to launch and manage virtual server instances.

For beginners, the easiest mental model is this: EC2 gives more direct control, which also means more direct responsibility.

That responsibility includes decisions such as:

  • which operating system to use
  • which ports to open
  • which processes should keep running
  • how restarts, updates, and logs should be handled

Managed platforms hide much of this. EC2 makes the layers more visible, which is exactly why it is useful for learning.

2. How web servers and application servers differ

The terms WS and WAS can sound old-fashioned, but the role separation still matters.

Web server

A web server such as nginx is strong at handling static files, receiving public traffic, and deciding where requests should go next. It commonly handles reverse proxying, compression, and routing.

Application server

The application server runs the actual business logic. That might be a Node.js process, a Python server, or another runtime that receives requests and produces responses.

So the clean distinction is this: the web server manages the front door and traffic direction, while the application server performs the real application work.

3. Why put nginx in front

Beginners often ask a reasonable question: why not expose the application port directly?

That can work for a small experiment, but production architecture usually benefits from a front proxy layer.

Static asset delivery

CSS, JavaScript, images, and other static files can often be served more efficiently without pushing every request through the application runtime.

Reverse proxy boundaries

Public traffic can come in through ports 80 and 443, while internal application processes stay on ports such as 3000 or 8000. That keeps public exposure and internal execution better separated.

Request routing

Different paths can go to different destinations. For example, /api may go to a backend service, while other traffic goes to a frontend app or static output.

Operational isolation

Application processes may restart independently while the proxy layer continues to define the stable traffic boundary.

The nginx beginner documentation is useful here because it shows that nginx is not only a file server. It is also a controllable traffic-management layer.

4. Where frontend and backend meet in deployment

A simplified architecture often looks like this:

browser
  -> domain
  -> nginx
  -> frontend static assets or SSR server
  -> backend API server
  -> database or external services

The important point is that frontend deployment is not always only file hosting. If the frontend uses server-side rendering, it may also require its own runtime process.

That makes the deployment view more precise:

  • frontend: user-facing assets and UI execution layer
  • backend: business logic, auth, data access, and policy layer
  • nginx: public entrypoint and request-routing layer

This framing is much more useful operationally than thinking only in terms of "screen code" versus "server code."

5. What to watch when everything lives on one server

It is common for a beginner project to place nginx, frontend, and backend on one EC2 machine. That is a reasonable learning setup, but it has limits.

Resource contention

Builds, API traffic, log writing, and application rendering may compete for the same CPU and memory.

Shared failure domain

One misconfigured deploy or one unhealthy process can affect the entire service.

Operational complexity

Even on one machine, ports, firewall rules, process management, log locations, and deployment scripts all need clear ownership.

So the lesson is not "one-server deployment is wrong." The lesson is that even one-server deployment already contains multiple architectural layers.

6. A minimum structure worth remembering

For beginners, three lines are enough to hold the picture together:

  1. EC2 is the execution environment.
  2. nginx is the public-facing traffic gate.
  3. The application server is the process that runs the product logic.

If these roles stay separate in your mind, later topics such as Docker, load balancers, auto scaling, and orchestration become much easier to place.

References

  • 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

This is Part 7 of the Web Development to Deployment and Operations series.

Series overview: Series index

๋Œ“๊ธ€

๋Œ“๊ธ€ ์“ฐ๊ธฐ

์ด ๋ธ”๋กœ๊ทธ์˜ ์ธ๊ธฐ ๊ฒŒ์‹œ๋ฌผ

Agent Memory Engine (2/10) — Building an AI Agent Memory System with SQLite Alone

← 1/10 SQLite Memory Engine f… ๐Ÿ“š Series Index 3/10 memcore Completed → A memory engine that runs without daemons, without dependencies, anywhere ํ•ต์‹ฌ ์š”์•ฝ This post covers how to design an AI agent memory engine (memcore) on a single-file SQLite backend. - Structure: 25 modules, ~6,464 lines, 22 DB tables - Principles: no daemon, single-file portability, no required external dependencies, host-agnostic - Core techniques: 4-layer hybrid search (topic · vector · FTS5 · LIKE), U-tag dialectic-based confidence evolution, ingestion-layer bias rejection rules What This Post Covers One approach to building AI agent memory without a server or cloud vector DB. Specifically: (1) the limitations of text-file-based memory, (2) vector DB alternatives compared and selection criteria, (3) how to layer search tiers, (4) how to evolve confidence scores over time, and (5) how to block biased memory accumulation at the ingestion stage. Design Principles: Why Single-File SQLite Text-file-based ...
Read more »

"ML Foundations (9/9) — PyTorch vs TensorFlow, and the Road to Local LLMs"

์ด๋ฏธ์ง€
← 8/9 Deep Learning Architec… ๐Ÿ“š Series Index (series end) The final part. So far we've focused on models. Now we focus on the tools that actually run them . We'll lay out the philosophical difference between PyTorch and TensorFlow, and trace how Hugging Face transformers , llama.cpp , MLX , and Ollama built the bridge to running large language models on your own machine. By the end you should have the full mental model of "download a pretrained LLM and serve it locally." 0. Learning Objectives Explain the eager-vs-graph difference between PyTorch and TensorFlow. Explain, in graph terms, how autograd automates the backward pass. Use Hugging Face transformers ' AutoModel , AutoTokenizer , and pipeline abstractions. Describe llama.cpp's GGUF quantization, INT4 inference, and CPU-first flow. Describe Apple MLX's use of unified memory and how it differs from PyTorch. Run a local LLM with Ollama and call it through an OpenAI-compatible API. ...
Read more »

"RAG Core Study (14/26) — Evaluation Sets with RAGAS & DeepEval"

์ด๋ฏธ์ง€
Series overview: Series index ๐Ÿ“š Series Index Without an evaluation set, every RAG improvement is a story, not evidence. RAG systems fail in more than one place: retrieval, context selection, answer generation, and grounding. That means "looks better" is not a metric. Part 14 explains how to build a golden dataset , how RAGAS and DeepEval fit into the workflow, and why teams must separate retrieval quality from answer quality if they want tuning decisions to hold up. 0. Prerequisites Part 13 reranking — system quality now depends on multi-stage ranking. Part 1 grounding — a correct-looking answer is not enough. Part 12 Hybrid — multiple retrieval settings need comparison on fixed data. 1. Learning Objectives Build a small but useful golden dataset for RAG. Distinguish retrieval metrics from answer metrics . Use RAGAS and DeepEval in the right roles. Avoid the common traps in judge-model-based evaluation. 2. ํ•ต์‹ฌ ์š”์•ฝ An evaluation set for RAG is ...
Read more »

"ML Foundations (8/9) — Deep Learning Architectures: CNN, RNN, Attention"

์ด๋ฏธ์ง€
← 7/9 Deep Learning Training ๐Ÿ“š Series Index 9/9 PyTorch vs TensorFlow → What did we keep adding on top of an MLP? Vision went CNN, sequences went RNN/LSTM, and eventually both converged on Attention and the Transformer. Each architecture is easier to remember if you read it as what it gave up to gain something else . This part is the one-line summary of the decisive inflection points: LeNet → AlexNet → ResNet → LSTM → Attention → Transformer. 0. Learning Objectives Explain why CNN's convolution, pooling, and weight sharing match images so well. Trace what got unblocked from LeNet → AlexNet → VGG → ResNet as depth grew. State BPTT for RNNs and the vanishing/exploding gradient problem. Write the LSTM gate equations (forget, input, output) with intuition. Write the attention formula in query/key/value form and the scaled dot-product variant. State the precise reasons Transformers replaced RNNs (parallelism + long-range dependencies). 1. ํ•ต์‹ฌ ์š”์•ฝ CNN : weight sharin...
Read more »

"ML Foundations (7/9) — Deep Learning Training: Optimizers, Regularization, Initialization"

← 6/9 Neural Networks ๐Ÿ“š Series Index 8/9 Deep Learning Architec… → Building an MLP, as we did in Part 6, is not the same as getting it to train well . The right optimizer, regularization, initialization, and learning rate — when these line up, deep networks converge. When they don't, the network refuses to learn at all. This part is the catalog of those crafts, with formulas, paper citations, and code in one place. 0. Learning Objectives Compare and write the update rules for SGD, Momentum, Nesterov, and Adam. Explain how Dropout, BatchNorm, and LayerNorm work and where they belong in a model. Derive the variance formulas for Xavier and He initialization and match them to activations. Implement step, cosine, and warmup learning-rate schedules in PyTorch. Explain why gradient clipping is effectively required for RNNs and Transformers. Diagnose the most common training failures (NaN, plateau, overfitting) and apply first-line fixes. 1. ํ•ต์‹ฌ ์š”์•ฝ SGD : \(w \leftarro...
Read more »

OpenClaw to Hermes Migration (2/13) — What to Preserve, Partially Port, or Discard

← 1/13 Current Structure Inve… ๐Ÿ“š Series Index 3/13 What Moves to Hermes → A code review record classifying operational scripts into three tiers: preserve, partial-preserve, and discard. What This Post Covers An asset classification framework (preserve / partial-preserve / discard) for migrating a legacy agent system to a successor A concrete case applying the Strangler Fig + Subset Migration strategy to a memory pipeline Classification results evaluated across LOC, external dependencies, and replaceability axes A method for slimming down a bloated single file (1,310 LOC) using the migration as a natural entry point Problem Definition: Port Everything or Cut Deep? The OpenClaw inventory comprises multiple agents, multiple scheduler/daemon processes, and multiple operational scripts. When moving to the successor system, Hermes, the choice is not binary. A full port carries accumulated technical debt along with it; a minimal port discards hard-won domain logic. Code-revie...
Read more »

AI Agents I Built (5/7) — Building an Automated Blogger API Publishing System

← 4/7 My Life Organizer Agent ๐Ÿ“š Series Index 6/7 Dual → Designing a Markdown-Based Auto-Publish Pipeline with Blogger API v3 + OAuth 2.0 Key Summary Blogger API v3 + OAuth 2.0 enables a pipeline that converts Markdown files into publishable HTML posts blogger_publish.py handles the full flow — frontmatter parsing → body cleanup → HTML conversion → CSS injection → API post — in a single script For bulk publishing, quota management (delay, retry, TOC suppression) is the critical design concern Platform Selection Criteria API access is mandatory for AI agent-driven content publishing. A comparison of platforms: Platform API Cost AdSense Decision WordPress.com REST API Paid plan required Paid only Cost overhead Ghost REST API Self-hosted or paid Manual setup Ops overhead Blogger v3 API Free Native integration Adopted Blogger is free, exposes a REST API, and integrates natively with AdSense. For personal blog automation, this combination i...
Read more »