I Resurrected 1980s Teletext to Cure My Doomscrolling (Built with Kiro)

Md. Rafi — Fri, 05 Dec 2025 19:57:22 +0000

The modern web is exhausted. It’s infinite, noisy, and designed to keep us scrolling forever. I missed the "finish line"—that feeling when you’ve read the news, checked the weather, and you are done.

So, for the Kiroween Hackathon, I decided to build Teletext Zero.

It’s a "Slow Web" browser that forces the chaotic internet into a strict 1980s TV format: 40 columns, 24 rows, 8 colors, and absolutely no scrolling.

Building a retro-constraint engine like this usually takes weeks of tedious CSS math and state management. I built it in a weekend using Kiro, an AI-native IDE.

Here is how I used Kiro’s "Hybrid Workflow" to switch between being a rigorous Architect and a creative Artist.

The Problem: Logic vs. Vibes

Every developer knows the struggle.

The Architect Brain wants strict rules, type safety, and robust architecture.
The Artist Brain wants to mess around with shaders, animations, and "feel."

Usually, you have to compromise. With Kiro, I didn't have to.

Phase 1: The Architect (Spec-to-Code)

To make Teletext Zero feel real, I couldn't fake the constraints. If the text wrapped wrong or the grid broke on a mobile screen, the illusion would die.

Instead of writing React components manually, I used Kiro's Spec mode. I wrote a requirements.md file that defined the laws of my universe:

The Grid: Must be exactly 40x24 characters.
The Input: Keyboard only (3-digit page dialing).
The Palette: Only the standard 8 Teletext colors.

Kiro took this spec and generated the entire engine. But here is the kicker: it didn't just write the code; it wrote Property-Based Tests (using fast-check). It mathematically proved that no matter what text I threw at the engine, the layout would never break or scroll.

I had a bulletproof foundation in minutes.

Phase 2: The Artist (Vibe Coding)

Once the logic was solid, I needed it to look like a haunted TV found in an attic.

I switched Kiro to Vibe mode (conversational coding). This is where the magic happened. I didn't write CSS classes; I just described the aesthetic:

"Make it look like a 1980s Trinitron. Add scanlines, a phosphor bloom on the text, chromatic aberration on the edges, and a subtle screen curvature vignette."

Kiro generated complex CSS shaders and keyframe animations instantly. It tweaked the text shadows to simulate that fuzzy, glowing look of old cathode ray tubes. It was like pair-programming with a retro-graphics expert.

Phase 3: The "Kiroween" Twist

Since this was for a Halloween hackathon, I added a ghost in the machine.

Using Vibe mode, I instructed Kiro to build Page 666.

The Logic: If the user dials 666, the system degrades.
The Visuals: Random character corruption and background red flashing.
The Audio: Kiro helped me wire up the Web Audio API to play static hiss that syncs with the visual glitches.

The Result

Teletext Zero isn't just a toy; it works.

Page 200 pulls live BBC News via RSS.
Page 300 pulls tech news from The Verge.
Page 400 uses the browser's Geolocation to fetch live weather from Open-Meteo.

And because of the Spec-driven foundation, the Kiro-generated "Word Wrap" logic takes those long web articles and perfectly truncates them into 40-character summaries. It respects the grid.

Conclusion

Kiro changed my mental model of development. I used Spec to enforce rigor where it mattered (the engine) and Vibe to embrace chaos where it was fun (the aesthetics).

I didn't just write code; I directed a vision.

🔗 Try Teletext Zero here: https://rafi.is-a.dev/Teletext-Zero/
💻 Check the Repo: https://github.com/MdRaf1/Teletext-Zero

Have you tried AI-native IDEs yet? Let me know in the comments!

Built with #kiro

I Taught an AI to Use Git So I Wouldn't Have to Fear It Anymore

Md. Rafi — Sun, 14 Sep 2025 11:35:53 +0000

We've all felt that spark of fear before running a git reset --hard. For the Kiro AI hackathon, I decided to build a tool to extinguish that fear for good.

I call it Git Sensei, an AI-powered guardian for your command line. It's a tool designed to make Git safe, simple, and smart. It acts as a safety net for dangerous commands, translates plain English into Git, and most importantly, it understands the context of your repository to give you the right command at the right time.

But building it presented a classic developer dilemma.

The Challenge: Building for Safety and Innovation

How do you build a tool that is both rock-solid reliable and creatively intelligent?

The safety features needed to be perfect. They required upfront planning, a clear architecture, and a rigorous, spec-driven approach.
The AI features needed to be experimental. They required rapid iteration, conversational prompting, and the freedom to innovate.

Trying to do both at once usually ends in a messy compromise. This is where using Kiro, the AI IDE, changed my entire workflow.

The Solution: A Hybrid Development Model

I didn't have to compromise. I got to be both an architect and an innovator.

1. For the Foundation: Spec-to-Code
I started by writing a complete blueprint for the application's core: the requirements, the design, and a full task list. I handed this spec to Kiro, and it generated the entire robust, testable foundation of the app. The safety net was built on a rock.

2. For the AI: Vibe Coding
With the foundation secure, I switched to a conversational flow. I used Vibe to explore AI models and used prompt engineering to teach the AI how to be context-aware. Kiro handled all the complex integration, allowing me to focus purely on the AI's logic.

The "Wow" Moment

The payoff was undeniable. In my demo, I created a new, untracked file and gave Git Sensei a simple command: "save my work".

A normal translator would fail. But the context-aware AI knew better.

It saw the untracked file and correctly suggested git add feature.txt. It didn't just translate my words; it understood my intent.

My Takeaway

My biggest lesson is that we no longer have to choose between rigid planning and chaotic innovation. With modern AI tools, we can apply the right methodology to the right part of the problem. It's a more strategic, flexible, and ultimately more powerful way to build.

If you want to see how it all works, check out the project below.

🔗 GitHub Repo
🎬 Video Demo

Thanks for reading

Forem: Md. Rafi