How I built “Why Should I Care” in 3 weeks with Kiro
Intro
In an age where information is everywhere but meaning is hard to find, WSIC (Why Should I Care) aims to be more than just another content platform. It’s a learning engine: one that can turn any topic — no matter how obscure — into a polished, interactive educational experience.
In just three weeks, using Kiro, Amazon’s new IDE, I built a working version of WSIC. Along the way, I discovered how Kiro’s unique features — like Spec Driven Development, Agent Steering, MCP, Agent Hooks, and Vibe Mode — can fundamentally change the way developers build.
Link to app - WSIC - Why Should I Care
Link to Github repo - Repo
What is WSIC
WSIC is a modern web app with the goal of helping people explore new topics and expand their understanding through engaging, accessible content.
Core Features
- Smart Search: Intelligently combines text search with semantic vector search.
- Brew New Content: Generates new modules through a multi-agent AI pipeline developed using Google ADK.
- Interactive Learning Modules: Quizzes, Reorder, flashcards, real-world impact and applications.
- Modern UI/UX: Responsive, polished, and built for an engaging experience.
- Personal Dashboard: Track saved topics and other metrics (Views, Likes, Shares).
How Kiro Helped Me Ship in 3 Weeks
Kiro isn’t just an IDE — it’s a developer co-pilot with powerful features that fit perfectly into WSIC’s build process.
Spec Driven Development
When I had the initial idea for WSIC, I used Kiro’s Spec Driven Development to lay out the complete plan. This helped me:
- Define the architecture up front.
- Generate boilerplate code aligned with the spec.
- Ensure consistency in API design and frontend structure from the start.
This upfront clarity saved me countless hours later.
Agent Steering
As I expanded the codebase, Agent Steering ensured that:
- UI consistency was maintained.
- Coding style didn’t deviate when new agents generated code.
- Refactors didn’t spiral into stylistic mismatches.
This feature was especially valuable for maintaining polish across the app in a short timeframe.
MCP (Model Context Protocol)
I used MCP to connect Kiro directly with Convex DB for testing.
This allowed me to:
- Experiment with real data flows early.
- Validate search and user sessions in a staging environment.
- Avoid messy local hacks during prototyping.
Agent Hooks
Kiro’s Agent Hooks turned into my documentation engine. By setting hooks during development, I automatically generated:
- Comprehensive technical docs.
- Explanations of key flows (like the content generation pipeline).
- Onboarding guides for contributors.
Vibe Mode
Out of all Kiro features, the one I used the most was Vibe Mode.
- I used it so heavily that I even hit overages on the Pro plan.
- But it was worth it: vibe mode paired with Claude 4 generated the cleanest, most reliable code I’ve ever seen in an IDE.
- On average, I was able to ship mid-complex features in just 7–8 iterations.
The most impressive moment?
I developed the Search Page — the main part of the app — in just 10–11 iterations on the very last day of the hackathon. It worked beautifully.
What I Liked About Kiro
- Unique Features: The combination of agent steering, hooks, spec-driven dev, and MCP provided use cases no other IDE currently offers. It wasn’t just about code generation — it was about orchestrating the entire build lifecycle.
- Code Quality: Compared to other AI IDEs, Kiro’s output was consistently better. I could get solid, mid-complex features ready in under 10 iterations, which drastically reduced dev time.
- Developer Flow: The IDE felt like it understood how I wanted to build, not just what I wanted to code.
What Kiro Could Improve
-
Multi-Model Architecture: Supporting multiple models for different stages would be a game-changer.
- Example: Gemini for requirement gathering, Claude for coding, OpenAI models for docs/tests.
-
Code Understanding: Sometimes the model would generate unnecessary code for features that already existed elsewhere in the project.
- A higher-level understanding of the codebase could reduce duplication and make the agent even smarter.
Architecture & Features of WSIC
| Component | Description | Status |
|---|---|---|
| Search System | Text + semantic vector search. | ✅ Live |
| Content Pipeline | Multi-agent: research → generate → fact-check → assemble. | ✅ MVP done |
| Interactive Modules | Quizzes, flashcards, real-world relevance. | ✅ Functional |
| Dashboard | Google OAuth, Metrics tracking, saved topics. | ✅ Basic version |
| Frontend & UX | Next.js + Tailwind, glassmorphism, responsive. | ✅ Polished |
| Backend | Postgres, Convex DB, job queue (QStash), workers (Render), hosting (Google Cloud Run and Vercel). | ✅ Deployed |
The 3-Week Timeline
| Week | Focus | Deliverables |
|---|---|---|
| Week 1 | Foundations | Spec-driven setup, Next.js boilerplate, auth + DB |
| Week 2 | AI Pipeline | Agents, embeddings, quizzes, fact-check integration |
| Week 3 | Polish & Deploy | Dashboard, search page, UX polish, deployment |
Closing Thoughts
Building WSIC in three weeks was ambitious — but Kiro made it possible.
Its spec-driven foundation, agent steering for consistency, MCP for DB testing, agent hooks for documentation, and above all vibe mode with Claude 4 gave me the tools to go from an idea to a working MVP in record time.
The result wasn’t just another hackathon project — it was a glimpse into how the future of development might look: collaborative, spec-driven, multi-agent, and powered by the best AI models.
Try out WSIC - Why Should I Care today and let me know what you think about it in the comments!
Top comments (0)