Web Development Terms — Simple & Detailed

The web is a system where a client (your browser or phone app) asks for something and a server replies. The rules they follow are called HTTP.

A server is a computer program or machine that waits for requests from clients (browsers, apps) and responds. Servers can run on a physical computer or in the cloud (like AWS, DigitalOcean).

• Example: When you open a website, your browser sends a request to a server; the server returns the HTML, images, and data.
• Technologies: Node.js, Apache, Nginx, Python (Django/Flask), Ruby on Rails.

The frontend is what users see and interact with: pages, buttons, forms, animations — everything that runs in the browser or mobile app.

• Tech: HTML, CSS, JavaScript, React, Vue, Angular.
• Role: Show data, handle user clicks, send requests to backend APIs.

The backend is the hidden part that runs on a server. It handles logic, talks to the database, and returns data to the frontend.

• It receives requests (e.g., "Get my user profile") and performs actions (check password, calculate totals).
• It connects to the database to save or read data.
• It enforces security (login, permissions) and business rules.

A database stores data persistently — users, orders, messages, files, etc. It answers questions like "get user with id 12" or "save this order".

• Relational DB: MySQL, PostgreSQL — store data in tables (rows & columns).
• NoSQL DB: MongoDB, Redis — store flexible documents, key-values, or caches.

A domain is the human-friendly name you type in a browser (for example zninfotech.com). DNS is like the internet's phonebook that translates that name into the server's numeric address (IP).

• Domain: Human name (example.com).
• DNS: Translates domain → IP address (e.g., 203.0.113.10).
• Where to buy: Domain registrars (Namecheap, GoDaddy) — they only provide the name; hosting is separate.

Servers are hosted on physical machines or cloud providers. Each service listens on a port (a number) — it helps the machine know which program should receive the request.

• Common ports: 80 (HTTP), 443 (HTTPS), 3000/5000/8000 (development servers).
• Hosting: Companies like AWS, Google Cloud, Vercel, Netlify, DigitalOcean host your server or static site.

HTTP is the set of rules (protocol) clients and servers use to talk. It's how browsers ask for pages and APIs exchange data.

HTTP methods tell the server what action you want to perform.

GET     /products        => Read data (safe, no change)
POST    /orders          => Create new resource (send data)
PUT     /users/12        => Replace/update full resource
PATCH   /users/12        => Update part of a resource
DELETE  /posts/5         => Remove a resource
OPTIONS /api             => Ask what methods are allowed
HEAD    /resource        => Like GET but without the response body
    

Every HTTP exchange has a request (sent by client) and a response (sent by server).

Request (from browser):
POST /api/login HTTP/1.1
Host: example.com
Content-Type: application/json

{ "email": "you@example.com", "password": "secret" }


Response (from server):
HTTP/1.1 200 OK
Content-Type: application/json

{ "token": "ey...jwt..." }
    

Status codes are short numbers the server uses to say what happened.

• 1xx — Informational
• 2xx — Success (e.g., 200 OK, 201 Created)
• 3xx — Redirect (e.g., 301 moved permanently)
• 4xx — Client error (e.g., 404 Not Found, 401 Unauthorized)
• 5xx — Server error (e.g., 500 Internal Server Error)

Middleware are small functions that run in the middle of a request. They can:

• Read or modify the request (req)
• Parse bodies (e.g., express.json())
• Check authentication
• Log requests
• Handle errors

app.use(express.json()); // parse JSON bodies
app.use((req, res, next) => {
  console.log(req.method, req.url);
  next(); // continue to next middleware or route
});
    

res.json() is a helper that converts JavaScript object → JSON string and sets header Content-Type: application/json automatically. It's convenient & correct for sending JSON responses.

• Authentication: Verify who the user is (passwords, tokens).
• Authorization: Check what user can do (roles/permissions).
• Encryption (HTTPS): Use TLS/SSL so data between client & server is private.
• Sanitize input: Prevent injections (SQL injection, XSS).

API (Application Programming Interface) is a set of endpoints the backend exposes so other programs (or the frontend) can use its features. REST is a style for designing APIs using HTTP methods and clean URLs.

GET  /api/products       => list products
GET  /api/products/10    => get product with id 10
POST /api/products       => create product
PUT  /api/products/10    => update product 10
DELETE /api/products/10  => delete product 10
    

• Client: Browser or app that makes requests.
• Server: Program/machine that answers requests.
• Frontend: UI in browser/mobile.
• Backend: Server logic & APIs.
• Database: Persistent data storage.
• Domain: Human-friendly website name.
• DNS: Service that maps domain → IP.
• HTTP: Protocol for client-server communication.
• Ports: Numbers on a machine used by different programs (80,443,3000).

User clicks a button → Frontend sends an HTTP request → Server runs backend code → Server queries DB → Server returns response → Frontend updates UI.

// Simple Express-like pseudo code
app.post('/login', (req, res) => {
  const user = db.findUser(req.body.email);
  if (!user) return res.status(404).json({error:"User not found"});
  if (!checkPassword(req.body.password, user.hash)) return res.status(401).json({error:"Invalid"});
  const token = createToken(user.id);
  res.json({ token }); // send token to frontend
});
    

1. HTML & CSS basics (frontend structure)
2. JavaScript basics (DOM & web requests)
3. Node.js + Express (backend fundamentals)
4. Databases: SQL (Postgres) or NoSQL (MongoDB)
5. Authentication (JWT, sessions) and HTTPS
6. Build a small fullstack project (todo, blog, shop)

Tip: Build a small app that stores data in a DB and exposes an API — this helps connect all concepts.