TezCLI

The Problem

Every AI tool tutorial is the same: a blog post with screenshots, a YouTube video with a talking head, or a documentation page that reads like a legal contract. None of them match how developers actually learn — by typing commands, seeing output, and iterating. The gap between "I read about Claude Code" and "I'm productive with Claude Code" is weeks of fumbling, not because the tools are hard, but because the learning format is wrong.

What I Built

TezCLI is a Next.js app that renders an interactive terminal in the browser. Users type real commands, get simulated output, and progress through structured lessons on AI tools like Claude Code, Cursor, and MCP servers. The terminal component handles input parsing, command history (up/down arrows), tab completion, and colored output — all the muscle memory developers already have.

Each lesson is a sequence of commands with validation logic. Type the right command, see the output, understand the concept, move on. Type the wrong command, get a contextual hint. No video pausing, no tab switching, no "let me try to replicate what I just saw."

The content is MDX-driven: each lesson is a markdown file with embedded command definitions and expected outputs. Adding a new lesson means writing markdown, not React components.

What You Can Steal From This

• Match the learning format to the audience: Developers live in terminals. A terminal UI for developer education isn't a gimmick — it's removing friction. Whatever your audience's native environment is, build the learning experience there.
• MDX as a content CMS: Frontmatter for metadata, markdown for prose, custom components for interactivity. One file per lesson, no database, git-versioned. This pattern scales to hundreds of pieces of content with zero infrastructure cost.
• Progressive disclosure in CLI form: Each command teaches one concept. Users can't skip ahead (the next command depends on understanding the current output). This forces comprehension in a way that scrollable articles never do.