Introduction
feature101 is a collection of production-ready, full-stack primitives for Next.js. One command drops a complete feature into your project. You own every line.
Quick Start
npx feature101@latest add likeThat's it. 9 files, a Prisma model, optimistic updates, and a ready-to-import component — installed in ~30 seconds.
Full installation guideWhat is feature101?
Think of it like shadcn/ui — but instead of dropping a Button into your project, it drops an entire production-ready feature. Not just the UI. The hook, the store, the server action, the database model. All of it.
| shadcn/ui | feature101 | |
|---|---|---|
| What it drops | UI component | Full-stack feature |
| Covers | Styling + accessibility | UI → Hook → Store → API → DB |
| You own the code | ✓ Yes | ✓ Yes |
| Database layer | — | Prisma model + migration |
| State management | — | Zustand + optimistic updates |
| Server mutations | — | Server Actions included |
Philosophy
You own the code. When you run the CLI, files are copied directly into your project. There's no npm package to update, no breaking changes to absorb, no runtime you don't control. Every single line is yours to read, modify, and delete.
No magic, no black boxes. The patterns inside each primitive are the same ones you'd write yourself — React hooks, Zustand stores, Server Actions, Prisma models. The difference is you don't have to write them from scratch on every new project.
Inspired by shadcn/ui. The same copy-paste philosophy, applied one level up: full-stack feature slices instead of UI components. The two tools complement each other — shadcn/ui handles your design system, feature101 handles your features.
No package updates
Code is copied in, not installed as a dependency
Full transparency
Read every line of every generated file
Zero vendor lock-in
Delete it, fork it, rewrite it — it's your code
Tech Stack
All primitives are built for this stack. If your project uses these technologies, everything works out of the box.
Ready to add your first feature?