90s Website Generator

Create personal websites of the goold old days.

Comment

Inspiration

The 1990s web was a magical time. GeoCities, Angelfire, and Tripod gave everyone a voice—personal homepages filled with Comic Sans, animated GIFs, MIDI music, visitor counters, and guestbooks. It was chaotic, creative, and deeply personal. Today's web is polished but homogeneous. We wanted to resurrect that era's authentic self-expression and let anyone experience the joy of building their own 90s homepage—no coding required.

When Kiroween announced the "Resurrection" category, we knew exactly what dead technology deserved to live again.

What it does

The 90s Website Generator creates fully-functional 1990s-style personal homepages with:

  • 6 authentic themes: Neon, Space, Rainbow, Matrix, GeoCities, Angelfire
  • 6 template presets: One-click personas like "90s Gamer Kid" and "Elite Hacker"
  • Real-time preview: See your site update as you type
  • Audio support: Background music and sound effects
  • Working guestbook: Visitors can leave messages
  • Visitor tracking: Real view counters for each site
  • Download as HTML: Export standalone, self-contained websites
  • Private gallery: Save and manage your creations
  • Edit mode: Modify saved sites anytime
  • Guest mode: Try it without signing in

How we built it

Tech Stack:

  • Frontend: Next.js 16, React 19, TypeScript, Tailwind CSS, shadcn/ui, Zustand
  • Backend: Convex (real-time database), Clerk (authentication)
  • Testing: Vitest, fast-check (property-based testing)
  • Deployment: Vercel, Convex Cloud

Development Methodology: We used Kiro's spec-driven development workflow throughout:

  1. Requirements: 24 user stories with EARS-formatted acceptance criteria following INCOSE quality rules
  2. Design: Architecture diagrams, data models, and 16 correctness properties
  3. Implementation: 22 tasks executed incrementally, each with property-based tests
  4. Testing: 35 tests across 5 files, including 13 property tests running 100+ iterations each

Kiro's steering docs kept the AI focused on our coding standards, project structure, and testing philosophy. The spec-driven approach meant we always knew exactly what to build next.

Challenges we ran into

  • Iframe popup suppression: Generated sites with alert() and confirm() dialogs broke the live preview. We solved this by detecting iframe context and suppressing popups only in preview mode.

  • Next.js 15+ Suspense requirements: useSearchParams() required wrapping in Suspense boundaries, causing build failures until we restructured components.

  • Convex patch handling: The ctx.db.patch() function doesn't handle undefined values well. We had to filter out undefined fields before patching.

  • Property test design: Writing meaningful correctness properties that actually catch bugs (not just pass trivially) required careful thought about what invariants should hold.

Accomplishments that we're proud of

  • 100% test pass rate: 35 tests passing, including 13 property-based tests
  • Production deployment: Live and functional at https://kiroween-mu.vercel.app
  • Comprehensive spec: 24 requirements, 16 correctness properties, 22 implementation tasks—all documented in .kiro/specs
  • Real-time features: Guestbook entries and view counts update instantly via Convex reactive queries
  • Authentic 90s aesthetic: The generated sites genuinely look and feel like 1997

What we learned

  • Spec-driven development works: Having formal requirements and correctness properties before coding eliminated ambiguity and caught bugs early
  • Property-based testing finds edge cases: Random input generation discovered issues we never would have thought to test manually
  • Steering docs are powerful: Consistent coding standards and project context made Kiro's suggestions much more relevant
  • The 90s web was harder than it looks: Recreating authentic marquee text, blinking elements, and browser detection took more research than expected

What's next for 90s Website Generator

  • Visual drag-and-drop editor: Let users arrange elements visually
  • More themes and presets: Y2K aesthetic, Geocities neighborhoods, Angelfire templates
  • Custom domain support: Host your 90s site on your own domain
  • Image upload: Add your own GIFs and photos
  • Community gallery: Browse and remix other users' creations
  • AI-powered content suggestions: Generate authentic 90s-style "About Me" text

demo available at https://kiroween-mu.vercel.app/ with Email: test@example.com and Password: Kiroween2025!

Built With

Share this project:

Updates