abhay-rana

abhay-rana

Create-modern-react — production-ready React 19 + TypeScript + Tailwind + shadcn in 15 seconds

Bit of a personal itch-scratch post — curious if anyone else runs into the same thing.

Every time I kick off a new React project I end up doing the same hour of setup: wire TypeScript strict mode, add Tailwind, pick a UI library, set up routing, build an API layer, configure ESLint, add path aliases… It’s not hard, just boring. And I kept making slightly different decisions each time, so projects never felt consistent.

So I spent some weekends building a CLI that does all of that for me: create-modern-react

npx create-modern-react my-app
cd my-app
yarn dev

The defaults I landed on after a few real projects:

  • React 19 + TypeScript 5.9 strict
  • Vite with SWC (noticeably faster than Babel for larger codebases)
  • Tailwind CSS 4
  • shadcn/ui for components (Button, Input, Card, Skeleton already wired)
  • Wouter for routing — it’s 2KB vs React Router’s much larger bundle, and I’ve found it covers 95% of what I need
  • Axios with a typed wrapper so API calls look like getApi<User[]>('/users') instead of raw fetch wrangling
  • React Hot Toast, Error Boundary, and ~/ path aliases included

A few hooks I kept copy-pasting between projects are baked in too: useLoader, useDebounce, useCancelToken.

During setup the CLI asks if you want Redux Toolkit, React Hook Form + Zod, Ant Design instead of shadcn, or Husky for git hooks. Nothing gets added unless you ask for it.


I’ve used it as the base for a couple of my own projects now (a resume builder and an e-commerce frontend) and it’s held up well. But I’m aware my defaults are just my defaults — other people’s setups will differ.

Curious what you all think:

  • Is Wouter a dealbreaker for you, or do you default to React Router anyway?
  • Any obvious gaps in that stack that you always end up adding yourself?
  • Would you swap anything out?

GitHub if you want to poke around:

Happy to answer questions or take suggestions — it’s MIT and still pretty early.

Where Next?

Popular Frontend topics Top

AstonJ
Another WebAssembly Frontend Framework for Rust :nerd_face: Seed is a frontend Rust framework for creating fast and reliable web apps w...
New
AstonJ
Anyone have any thoughts about Preact? They’re saying it’s a “Fast 3kB alternative to React with the same modern API”… A different kin...
New
First poster: bot
Open source CSS framework for data visualization. Contribute to ChartsCSS/charts.css development by creating an account on GitHub. ...
New
First poster: bot
This thread was posted by one of our members via one of our news source trackers.
/js
New
First poster: bot
Flame is a fast & simple framework inspired by the Elm architecture for building web applications in PureScript
New
First poster: bot
Assembler CSS. Assembler CSS is a highly performant utility-first framework that allows you to quickly prototype and build modern websit...
New
First poster: bot
Pablo is a small, open-source JavaScript library for SVG, the web standard for vector graphics. It can be used for vector-based art, game...
New
abhay-rana
Bit of a personal itch-scratch post — curious if anyone else runs into the same thing. Every time I kick off a new React project I end u...
New
MartinDelophy
Hi everyone, I’ve been building Timeline Studio, an open-source video editor that runs directly in a modern browser. It combines a multi...
New
nosworkspace
I’m on the NOS Workspace team. We built a workspace for HTML pages and ordinary documents. If you already have an HTML proposal, report ...
New

Other popular topics Top

Rainer
My first contact with Erlang was about 2 years ago when I used RabbitMQ, which is written in Erlang, for my job. This made me curious and...
New
New
PragmaticBookshelf
Build highly interactive applications without ever leaving Elixir, the way the experts do. Let LiveView take care of performance, scalabi...
New
Margaret
Hello everyone! This thread is to tell you about what authors from The Pragmatic Bookshelf are writing on Medium.
1147 29994 760
New
mafinar
This is going to be a long an frequently posted thread. While talking to a friend of mine who has taken data structure and algorithm cou...
New
AstonJ
Was just curious to see if any were around, found this one: I got 51/100: Not sure if it was meant to buy I am sure at times the b...
New
AstonJ
If you want a quick and easy way to block any website on your Mac using Little Snitch simply… File &gt; New Rule: And select Deny, O...
New
husaindevelop
Inside our android webview app, we are trying to paste the copied content from another app eg (notes) using navigator.clipboard.readtext ...
New
PragmaticBookshelf
Leverage Elixir and the Nx ecosystem to build intelligent applications that solve real-world problems in computer vision, natural languag...
New
New