Bird
Raised Fist0
Nginxdevops~5 mins

Web server vs application server in Nginx - CLI Comparison

Choose your learning style10 modes available
LearnWhyDeepVisualTryChallengeProjectRecallTime

Start learning this pattern below

Jump into concepts and practice - no test required

or
Recommended
Test this pattern10 questions across easy, medium, and hard to know if this pattern is strong
Introduction
A web server handles requests for web pages and static content like images or HTML files. An application server runs the code that creates dynamic content, like processing forms or accessing databases. Understanding the difference helps you set up your system correctly.
When you want to serve static files like images, CSS, or HTML quickly to users.
When you need to run backend code that creates web pages on the fly based on user input.
When you want to separate the part that handles web requests from the part that runs your application logic.
When you want to improve performance by letting the web server handle simple tasks and the application server handle complex ones.
When you want to secure your application by controlling access through the web server before requests reach the application server.
Config File - nginx.conf
nginx.conf
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    server {
        listen       8080;
        server_name  localhost;

        location / {
            root   /usr/share/nginx/html;
            index  index.html index.htm;
        }

        location /app/ {
            proxy_pass http://127.0.0.1:5000/;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;
        }
    }
}

This configuration sets up Nginx as a web server and a reverse proxy.

worker_processes and worker_connections control how many requests Nginx can handle.

The server block listens on port 8080.

The location / serves static files from /usr/share/nginx/html.

The location /app/ proxies requests to an application server running on localhost port 5000, forwarding headers for proper request handling.

Commands
Check the Nginx configuration file for syntax errors before starting the server.
Terminal
sudo nginx -t
Expected OutputExpected
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok nginx: configuration file /etc/nginx/nginx.conf test is successful
Restart Nginx to apply the new configuration so it can serve static files and proxy requests to the application server.
Terminal
sudo systemctl restart nginx
Expected OutputExpected
No output (command runs silently)
Request a static HTML file from the web server to verify it serves static content correctly.
Terminal
curl http://localhost:8080/index.html
Expected OutputExpected
<!DOCTYPE html> <html> <head><title>Welcome</title></head> <body> <h1>Hello from Nginx web server</h1> </body> </html>
Send a request to the application server through Nginx to verify dynamic content is served via proxy.
Terminal
curl http://localhost:8080/app/api/data
Expected OutputExpected
{"data":"This is dynamic content from the application server"}
Key Concept

If you remember nothing else from this pattern, remember: a web server handles static content and forwards dynamic requests to an application server.

Common Mistakes
Configuring Nginx to serve dynamic content directly without proxying to an application server.
Nginx cannot run backend code like Python or Node.js, so dynamic content won't work.
Use Nginx to proxy dynamic requests to a separate application server that runs your backend code.
Not forwarding necessary headers in the proxy configuration.
The application server may not receive correct client information, causing errors or wrong behavior.
Include proxy_set_header directives to forward host and client IP headers.
Serving dynamic URLs under the same location as static files without proxying.
Nginx will try to find static files for dynamic URLs and return 404 errors.
Use separate location blocks for static content and proxy dynamic requests.
Summary
Nginx serves static files directly to users for fast delivery.
Nginx proxies dynamic requests to an application server that runs backend code.
Proper proxy configuration ensures smooth communication between web and application servers.

Practice

(1/5)
1. What is the primary role of a web server like nginx?
easy
A. To deliver static files like images and HTML directly to users
B. To execute backend application logic and generate dynamic content
C. To store user data and manage databases
D. To compile source code into executable programs

Solution

  1. Step 1: Understand the role of a web server

    A web server mainly serves static content such as images, HTML, CSS, and JavaScript files directly to users.

  2. Step 2: Differentiate from application server

    An application server runs backend code to create dynamic content, which is different from a web server's role.

  3. Final Answer:

    To deliver static files like images and HTML directly to users -> Option A

  4. Quick Check:

    Web server = static file delivery [OK]
Hint: Web servers serve files; app servers run code [OK]
Common Mistakes:
  • Confusing web server with application server
  • Thinking web server runs backend logic
  • Assuming web server manages databases
2. Which nginx configuration snippet correctly forwards requests to an application server on port 3000?
easy
A. location / { root http://localhost:3000; }
B. location / { fastcgi_pass http://localhost:3000; }
C. location / { proxy_pass http://localhost:3000; }
D. location / { redirect http://localhost:3000; }

Solution

  1. Step 1: Identify correct directive for forwarding

    The proxy_pass directive is used in nginx to forward requests to an application server.

  2. Step 2: Check other options for correctness

    root serves static files, fastcgi_pass is for FastCGI servers, and redirect sends HTTP redirects, not proxying.

  3. Final Answer:

    location / { proxy_pass http://localhost:3000; } -> Option C

  4. Quick Check:

    Use proxy_pass to forward requests [OK]
Hint: proxy_pass forwards; root serves static files [OK]
Common Mistakes:
  • Using root instead of proxy_pass for forwarding
  • Confusing fastcgi_pass with proxy_pass
  • Using redirect which changes URL instead of proxying
3. Given this nginx config snippet, what happens when a user requests /app? 
location /app {
  proxy_pass http://127.0.0.1:8080;
}
medium
A. nginx serves static files from /app directory
B. nginx forwards the request to the application server at 127.0.0.1:8080
C. nginx returns a 404 error
D. nginx redirects the user to http://127.0.0.1:8080/app

Solution

  1. Step 1: Analyze the proxy_pass directive

    The proxy_pass directive tells nginx to forward matching requests to the specified backend server.

  2. Step 2: Understand request handling

    Requests to /app are sent to the application server at 127.0.0.1:8080, not served as static files or redirected.

  3. Final Answer:

    nginx forwards the request to the application server at 127.0.0.1:8080 -> Option B

  4. Quick Check:

    proxy_pass forwards requests to backend [OK]
Hint: proxy_pass means forward, not serve or redirect [OK]
Common Mistakes:
  • Thinking nginx serves static files here
  • Confusing proxy_pass with redirect
  • Assuming 404 error without backend
4. You configured nginx to forward requests to an application server using: 
location /api {
  proxy_pass http://localhost:5000/api;
}
But requests to /api/users fail. What is the likely problem?
medium
A. nginx cannot forward requests to localhost
B. The location block should be location /api/ with trailing slash
C. proxy_pass must use HTTPS instead of HTTP
D. proxy_pass should be http://localhost:5000/ without /api

Solution

  1. Step 1: Understand proxy_pass URI behavior

    When proxy_pass includes a URI (like /api), nginx replaces the matching part of the request URI with that URI, causing duplication.

  2. Step 2: Correct proxy_pass to avoid URI duplication

    Removing /api from proxy_pass (using http://localhost:5000/) forwards the full original URI correctly.

  3. Final Answer:

    proxy_pass should be http://localhost:5000/ without /api -> Option D

  4. Quick Check:

    proxy_pass URI affects request path [OK]
Hint: Avoid URI in proxy_pass to prevent path duplication [OK]
Common Mistakes:
  • Including URI in proxy_pass causing double paths
  • Thinking HTTPS is required for localhost
  • Believing nginx can't proxy localhost
5. You want nginx to serve static files from /var/www/html and forward API requests to an application server on port 4000. Which configuration correctly achieves this?
hard
A. location / { root /var/www/html; } location /api/ { proxy_pass http://localhost:4000/; }
B. location / { proxy_pass http://localhost:4000/; } location /api/ { root /var/www/html; }
C. location /api/ { root /var/www/html; } location / { proxy_pass http://localhost:4000/; }
D. location /api/ { proxy_pass http://localhost:4000/api/; } location / { root /var/www/html; }

Solution

  1. Step 1: Assign root for static files

    The root directive in location / serves static files from /var/www/html.

  2. Step 2: Forward API requests correctly

    The location /api/ block uses proxy_pass to forward API calls to the application server on port 4000.

  3. Step 3: Verify order and correctness

    Static files served at root, API forwarded properly. Other options mix these roles incorrectly.

  4. Final Answer:

    location / { root /var/www/html; } location /api/ { proxy_pass http://localhost:4000/; } -> Option A

  5. Quick Check:

    Static files root + API proxy_pass = correct setup [OK]
Hint: Serve static at / root, proxy API at /api/ [OK]
Common Mistakes:
  • Swapping root and proxy_pass locations
  • Adding URI in proxy_pass causing path issues
  • Not using trailing slash in location /api/