Web Development Guide
Understanding Web Categories
Web architecture generally falls into a few primary categories
based on how content is generated, structured, and delivered to the
browser. Below is a breakdown of the different types of modern
websites and web applications.
Static Site Generation (SSG) / Jamstack
How it works: Developers write code using
component-based frameworks, but a build process pre-renders all
routes into static HTML, CSS, and JS files before deployment.
These static assets are then served globally via a CDN or
standard static hosting. This website is a practical example
of static deployment, built efficiently and hosted directly on
GitHub Pages.
Best for: High-traffic landing pages, portfolios, marketing sites, and documentation that require extreme load speed and top-tier security.
Single-Page Applications (SPAs)
How it works: The browser loads a single HTML shell, and client-side JavaScript takes over all routing and state management. The application fetches data in the background and dynamically updates the screen without ever triggering a full page reload.
Best for: Highly interactive platforms, SaaS tools, and complex dashboards where a seamless, app-like experience is critical.
Dynamic Websites (Server-Side Rendered)
How it works: A backend server constructs the HTML on the fly for every single user request. It queries a database, injects the data into a template, and sends the fully formed HTML to the client.
Best for: Platforms where content changes constantly and SEO is paramount, such as news sites, forums, and traditional MVC web applications.
Content Management Systems (CMS)
How it works: A software layer that separates content from code. It provides an admin dashboard for non-technical users to write content, which is saved to a database. The CMS engine handles assembling and rendering the final pages.
Best for: Business websites, traditional blogs, and standard e-commerce stores (e.g., WordPress, Shopify) where content needs constant updating without developer intervention.
Progressive Web Apps (PWAs)
How it works: Standard web applications enhanced with modern web APIs like Service Workers and a Web App Manifest. They can cache resources to run offline, install directly to a user's device, and receive push notifications.
Best for: Mobile-first experiences and tools meant to function reliably in areas with poor network connectivity, blurring the line between websites and native mobile apps.