Universal Skeleton: From Productivity to Paranormal

💡 Inspiration

For the "Skeleton Crew" category, I wanted to prove that a robust code foundation can handle polar opposites. I wanted to build something that makes life easy for developers—a "Universal Core" that lets you pivot from a serious SaaS product to a creative passion project in minutes, not days.

💀 What it does

This project is a dual-application showcase built on a single shared architecture:

1. The Skeleton Core: A robust boilerplate using Express, Prisma (SQLite), Zod, and React + Tailwind.
2. App 1: Tasks (The Control): A clean, minimalist productivity tool for managing daily work.
3. App 2: Grimoire (The Variant): A Halloween-themed spellbook that uses the exact same backend logic but re-skinned and re-flavored for a spooky user experience.(notes-web app)

🤖 How I built it (The Kiro Workflow)

I leaned heavily on Kiro's advanced features to ensure architectural consistency while allowing for creative flexibility.

• Spec-Driven Development (.kiro/specs): I defined the core "Service-Controller-Router" pattern in a markdown spec. Kiro used this blueprint to enforce the same high-quality code structure across both apps, preventing spaghetti code.
• Steering for Style (.kiro/steering): For the Grimoire app, I created a steering rule that forced Kiro to write comments using "Spooky" metaphors (e.g., "Summoning data" instead of "Fetching data"). This injected personality into the codebase automatically.
• Agent Hooks (.kiro/hooks): I automated my startup workflow using a pre-generate hook that validates my environment and prints a random ASCII ghost to the console.
• Vibe Coding: I used natural language to rapidly style the Grimoire's dark theme, asking Kiro to "make it look like a glowing spellbook," which it translated into complex Tailwind gradients instantly.

🏆 Challenges I ran into

Managing two separate database schemas (Tasks vs. Spells) in one repo was tricky. I had to ensure the Skeleton was generic enough to handle both Task states (Pending/Done) and Spell attributes (Power Level/Ingredients) without breaking the shared patterns.

✨ Accomplishments that I'm proud of

I'm proud that I didn't just build two apps; I built a system. The .kiro directory in my repo isn't just config; it's the brain of the project. I'm also really happy with the "Grimoire" UI—it proves that business software doesn't have to be boring.

🚀 What's next for Universal Skeleton

I plan to add an Auth module (Clerk) to the Skeleton so users can log in to save their Tasks or Spells. I also want to expand the Kiro Specs to include automated test generation.

Built With

• express.js
• kiro
• node.js
• prisma
• react
• sqlite
• tailwindcss
• typescript
• vite
• zod