A living museum of the web

25 YEARS OF
WEB DEV

From table layouts and FTP uploads
to AI copilots and edge deployments

Explore how web design, technologies, developer experience, and workflows evolved from 2000 to today. Scroll through history. Click, drag, and play.

Watch developer life evolve →
📡
⚡
🤖

Built as a single-file interactive exhibit.
100% vanilla + Tailwind + Chart.js

🌐 My First Homepage 2002
🖥️

Welcome to the Web!

Under Construction
✦✦✦

TABLE
MARQUEE
FTP
IE6 FLASH 5
✨ Now with AI copilots
↓
SCROLL TO BEGIN THE JOURNEY
2000 — 2005

Static & Table Layouts

The “Wild West” of the web

Key technologies

HTML 4.01 CSS 2 Tables for layout Macromedia Flash PHP 4 / ASP FTP uploads

Design style

Bright colors, tiled backgrounds, animated GIFs, marquees, “Under Construction” signs, and Comic Sans.

"It took three days to make a button look 3D using 1×1 GIFs and nested tables."

— Anonymous 2003 developer

<table width="100%">
  <tr>
    <td colspan="3"><img src="logo.gif"></td>
  </tr>
  <tr>
    <td onclick="alert('Hello!')">Click me</td>
  </tr>
</table>
2003: Inline JavaScript + tables
TODAY: <button onclick> is still possible… but we don’t
🪑
HTML + TablesFrontend
PHP / ColdFusionBackend
FTP + DreamweaverWorkflow
No build step. No Git. Just upload and pray.
2005 — 2010

AJAX & jQuery Boom

The web became dynamic

XMLHttpRequest jQuery 1.0 (2006) Web 2.0 gradients Rounded corners via images

Suddenly you could update a comment without reloading the page. Mind = blown.

$.get('/comments', function(data) {
  $('#comments').html(data);
});
✨ The first time a page felt alive
2010 — 2015

HTML5 & Mobile Shift

Responsive design changes everything

Key technologies

HTML5 CSS3 (transitions, animations) Responsive Web Design (Ethan Marcotte, 2010) Media Queries Canvas / SVG Bootstrap (2011)

Design style

Flat design begins, skeuomorphism fades, mobile-first thinking, big hero images, and touch-friendly interfaces.

"Finally, one codebase that works on phones, tablets, and desktops."

— The responsive design revolution

<video controls>
  <source src="movie.mp4" type="video/mp4">
</video>

@media (max-width: 600px) {
  body { font-size: 14px; }
}
2012: Semantic HTML5 + Media Queries
TODAY: Still the foundation, but with Tailwind utilities
📱
HTML5 + CSS3Frontend
Responsive grids (Bootstrap)Layout
jQuery + AJAX still dominantInteractivity
“It works on my iPhone!” became the new QA standard.
2015 — 2020

SPA & Framework Wars

React, Angular, Vue battle for dominance

Key technologies

React (2013, exploded 2015+) Angular (2.0 rewrite 2016) Vue.js (2014) Webpack, Babel, ES6+ Redux / Vuex state management TypeScript adoption

Design style

Minimalist SaaS interfaces, card-based layouts, micro-interactions, dark modes appear, component-driven design.

"Everything is a component now. Even the button has its own folder."

— 2017 frontend developer

function Counter() {
  const [count, setCount] = useState(0);
  return <button onClick={() => setCount(c => c+1)}>{count}</button>;
}
2016–2020: React Hooks / Vue Composition API
TODAY: Even simpler with signals or server components
⚔️
React / Vue / AngularUI Layer
Node + npm/yarnBuild
Webpack / ParcelBundling
Framework wars made us all better developers… and exhausted.
2020 — Present

Cloud, JAMstack, AI & Edge

The web becomes instant, intelligent, and serverless

Key technologies

JAMstack / Next.js Serverless & Edge Functions Tailwind CSS TypeScript everywhere AI copilots (GitHub Copilot 2021+) WebAssembly, PWAs

Design style

Ultra-clean, glassmorphism / neumorphism experiments, dark mode default, lightning-fast interactions, AI-generated elements.

"I described the feature in English. The AI wrote the code. I deployed to the edge in 4 seconds."

— 2025 developer reality

// Next.js App Router + Server Component
async function Page() {
  const data = await fetchData();
  return <Dashboard data={data} />;
}
2023+: Server Components & Edge Rendering
No more full JS bundles on initial load
☁️
Tailwind + React/Next/SvelteFrontend
Supabase / Firebase / Edge DBsBackend
Vercel / Cloudflare / NetlifyDeploy
“It works on my machine” is dead. Everything runs globally by default.

How Developer Life Changed

From lonely FTP nights to AI pair-programming in the cloud

2000

FTP + Notepad

No version control. One typo = live production bug for everyone. Pure terror.

📤
2010

Git + GitHub

Collaboration exploded. You could actually see who broke production. Revolutionary.

🐙
2015

npm & build tools

"node_modules" folder now bigger than your entire hard drive. But hot reload!

📦
2020

CI/CD + Docker

Your code deploys itself. Zero downtime. Docker made “it works on my machine” obsolete.

🚀
2025 NOW

AI Copilots & Edge

You describe a feature. AI writes 80% of it. Deployed globally in milliseconds.

🤖

Five Eras of Button Click Handlers

2000–2005
onclick="alert('Hello!')"

Global functions. Nightmare to maintain.

2008
$('#btn').click(function(){ … })

jQuery magic. Everyone loved it.

2015
btn.addEventListener('click', () => { … })

Vanilla ES6. Clean and modern.

2020+
const handleClick = () => { … }  <button onClick={handleClick}>
React / Svelte

Declarative. Hooks. Zero boilerplate.

Framework & Page Weight Trends

📈 Framework popularity

📦 Average page weight (KB)

Website Time Capsule Gallery

✦ Welcome to my homepage ✦
🌐 GEOCITIES

Table layouts • Blinking text • Counter GIFs

FLASH INTRO

Skip intro button required

2.0

Glossy buttons • Heavy shadows • Blue everywhere

SAAS
Bootstrap • Responsive • Card grids
🚀
Edge • AI • Instant

Tailwind + Next.js + Vercel

Before & After:
Same page, 20 years apart

⇆

Drag the handle → watch 20 years disappear

How the stack evolved

2000
HTML + Tables
PHP
FTP
2008
jQuery
LAMP
2015
React / Vue
Node + webpack
2025
AI + Tailwind
Edge + Serverless
🤖

Choose Your Era

Step into the shoes of a developer from a different time. What would you build?