Generate a fullstack project from a config with react, vite, hono, drizzle and turborepo
npm install ts-stackThis project came into existence because I got tired of looking for template repositories, creating and configuring
projects from scratch, setting up directory structures and monorepos and configuring linting and code style each time I
started a new project.
It is a strongly opinionated generator, which uses technologies that I would typically use when working on a fullstack
TypeScript project. Hopefully that's a good thing. Some of these technologies are already strongly established in the
web ecosystem like react, react-query,vite and tailwind. Some of them are relatively new and fresh but are
already gaining popularity and seem promising like shadcn, hono, drizzle and turborepo.
This project is aimed at developers who, like me, want to be able to quickly scaffold a new project and get to work.
It can also be used by less technical people, who want to get a fully working web app without much coding.
> Disclaimer
>
> The project is under development so you can expect new features and changes to its core.
Both the generator and the generated projects use TypeScript end to end. The generator uses zod to validate the yaml
configs. The generated projects include runtime validation with zod, which ensures predictability and correctness.
You can extend and modify the generated projects however you want. You can setup your own build and deployment pipelines
and choose your infrastructure.
Converting the yaml config into files happens at generation time, so there is no runtime overhead compared to regular
TypeScript projects.
As mentioned before, the generated projects use established tools and methodologies. They also follow best practices for
project and directory structure, code and components reuse, caching, API and database modeling and more.
Check out the configuration guide here to create your yaml config or pick an example from
here.
Then run the following command:
``shell`
npx ts-stack example.yaml my-generated-project
After that you can go into the generated project's directory and start the project with npm run dev`
- React 19 + Vite frontend with shadcn UI components and Tailwind
- Hono server with Drizzle ORM for Postgres or SQLite
- Zod schemas for validation, used across client and server
- React Query hooks generated automatically for your data sources
- Turborepo monorepo structure with shared ESLint and TypeScript configs
- CLI built with Commander, ts-morph, and fs-extra
- More types inside schemas
- Form generation inferred from schemas
- Relations in schemas