omergulcicek

ViraStack

Headless, type-safe tools and agent rules for building modern React apps.

virastack.comGitHub

The problem

AI made writing code faster, but speed has a cost. Without a solid foundation every agent goes its own way, and technical debt, performance losses and accessibility gaps pile up quietly.

ViraStack lays that foundation on day one: a set architecture, rules that explain it to your agents, and ready-made hooks for the parts of a form you keep rewriting.

Learn

You can't build on a foundation you don't know. Academy teaches frontend in order, and Guide shows how a modern web app is built in three minutes.

  • Academy

    15GitHub stars

    An up-to-date roadmap for becoming a React frontend developer, with free guides from the basics to AI, architecture and testing.

  • Guide

    An interactive guide that shows, step by step in 3 minutes, how a modern web app is built, from raw HTML to an AI-native interface.

Start

One command to a type-safe Next.js or TanStack Start project, with architecture rules already written for your agents.

  • Start

    103GitHub stars1,698downloads · last 3 months

    Production-ready Next.js and TanStack Start projects from npx virastack. Feature-based architecture, strict TypeScript and AI rules included.

  • AI

    24GitHub stars4,650downloads · last 3 months

    One set of architecture rules for Claude Code, Cursor and any agent that reads AGENTS.md, so agents write code that fits the rest of the project.

Build

Headless, type-safe form hooks that render nothing. Install each on its own, use them together in one React Hook Form, and run the same rules on the server.

  • Mask

    1,468downloads · last 3 months

    Zero-dependency input masks for React Hook Form. Phone, card, IBAN, Turkish ID and TRY come ready, and the same schema validates on the server.

  • Password

    1,076downloads · last 3 months

    An accessible password hook for React: show and hide, NIST-style strength, confirmation and the same rules on the server.

  • Address

    515downloads · last 3 months

    A headless React hook for Turkish addresses. Province, district and neighborhood chain together, the postal code comes from the neighborhood, and the server validates the address.

Principles

Headless
Mask, Password and Address draw no UI. Inputs, components and styles stay yours; the hook only brings the behavior.
Type-safe
Start ships with strict TypeScript and Zod, and every package carries its own types. Mask and Address check field names against your form's type, so a typo fails at compile time.
Built for agents
The same architecture rules are written for Claude Code, Cursor and any agent that reads AGENTS.md, each in its tool's own format. Agents write code that fits your project.
Independent
MIT licensed, free, with no paid tiers. Each package is versioned on its own, and using one never pulls in the others.

Powered by

ViraStack doesn't replace these tools; it sets them up to work together.

  • TypeScript
  • React
  • Next.js
  • TanStack
  • Tailwind CSS
  • shadcn/ui
  • React Hook Form
  • Zod

Why I build it

For years I've turned what I learn into projects; the first was Turkuaz, which I wrote to understand CSS in depth. Today that curiosity lives on in ViraStack: Start sets up the project architecture, AI writes the agent rules, and Mask, Password and Address handle the forms, all to one shared standard.

I like getting into the kitchen of a craft and owning its quality end to end; ViraStack is my attempt to turn that into something anyone can use for free. I tell the whole story in ViraStack: Frontend Ecosystem (in Turkish).

Where it stands

products
7
npm downloads · all time
13,548
GitHub stars
142

Each product is versioned on its own and grows with feedback from the community. Reporting a bug, suggesting an idea or leaving a star on GitHub helps the most.

Posts