Learning Hub
๐ŸŒ

Web Development

Frontend and backend fundamentals, frameworks, and best practices.

Getting Started with Next.js

Set up a Next.js project from scratch and understand the App Router.

6 min readnext.jsreactbeginner

Web Development Roadmap: From Browser to Deployment

A beginner-friendly map of how websites work, what to learn first, and how to practise by building one small product.

12 min readweb-foundationsfrontendbackendapisroadmap

How a website works: browser, server, DNS, and HTTPS

A browser resolves a domain through DNS, opens a protected connection with HTTPS, sends an HTTP request, receives resources from a server or CDN, and renders them while JavaScript may request more data.

6 min readweb-foundationspracticebeginner-friendly

Web terminology without jargon

Web vocabulary becomes manageable when grouped by journey: a client resolves a domain through DNS, opens a network connection, sends an HTTP request, receives a response, and renders resources identified by URLs.

6 min readweb-foundationspracticebeginner-friendly

HTML: structure a useful page

HTML describes meaning and structure: headings form an outline, landmarks divide regions, links navigate, buttons perform actions, and labels connect controls to instructions. Semantic markup gives browsers and assistive technology useful information before CSS.

6 min readweb-foundationspracticebeginner-friendly

CSS: make the page readable and responsive

Readable CSS establishes a clear type scale, comfortable line length, sufficient contrast, consistent spacing, and layouts that adapt from narrow to wide screens. Responsive design follows content needs, not a list of device names.

6 min readweb-foundationspracticebeginner-friendly

JavaScript: add behavior and state

JavaScript responds to events, transforms data, updates state, and reflects state back into the interface. Keeping a single source of truth prevents the screen and underlying data from disagreeing.

6 min readweb-foundationspracticebeginner-friendly

What a backend does

A backend enforces business rules, coordinates data and external services, authenticates requests, and returns results through an interface such as an API. It protects invariants that cannot be trusted to browser code.

6 min readbackendpracticebeginner-friendly

Choose a server-side language

Choose a server-side language from constraints: team skill, ecosystem, runtime needs, libraries, operations, and hiringโ€”not from benchmark headlines alone. Several mainstream choices can solve the same product problem well.

6 min readbackendpracticebeginner-friendly

Build a small HTTP server

An HTTP server listens on a port, parses requests, routes method-plus-path pairs, runs application logic, and returns a status, headers, and body. Start with one health route before adding frameworks or databases.

6 min readbackendpracticebeginner-friendly

Authentication and sessions

Authentication proves who a user is; a session remembers that proof across requests. A secure session uses an unpredictable identifier, server-side expiry, protected cookies, and explicit logout or revocation.

6 min readbackendpracticebeginner-friendly

APIs explained with a restaurant analogy

An API is a contract for asking another system to do something or return data. In the restaurant analogy, the menu defines allowed requests, the waiter carries them, and the kitchen performs hidden implementation work.

6 min readapispracticebeginner-friendly

JSON and XML

JSON represents objects and arrays with a small syntax optimized for common application data; XML represents nested elements and attributes with namespaces and richer document-oriented tooling. Choose from the receiving contract, not personal taste.

6 min readapispracticebeginner-friendly

Build and call a REST API

A REST-style API models resources with stable URLs, uses HTTP methods for intent, returns meaningful status codes, and keeps requests self-contained. Consistency is more valuable than chasing architectural purity.

6 min readapispracticebeginner-friendly

Handle errors, pagination, and rate limits

Robust API clients classify errors, bound retries, paginate until a documented stopping signal, and respect rate-limit headers. Retrying everything blindly can amplify an outage.

6 min readapispracticebeginner-friendly

Git and GitHub for a small web project

Git records snapshots and branches locally; GitHub hosts the repository and adds collaboration, review, automation, and access controls. A small project needs a simple history more than an elaborate branching model.

6 min readweb-deliverypracticebeginner-friendly

Deploy a website from a repository

Git-based deployment connects a reviewed commit to a reproducible build and an environment. The host checks out the commit, installs locked dependencies, runs validation, publishes artifacts, and preserves logs for rollback.

6 min readweb-deliverypracticebeginner-friendly

Canvas vs SVG

Canvas paints pixels into one bitmap-like surface; SVG keeps shapes as DOM elements. Canvas suits dense, frequently redrawn scenes, while SVG suits scalable diagrams and individually interactive objects.

6 min readweb-deliverypracticebeginner-friendly