Travis Luong

Full Stack TypeScript Scaffolding Inspired by Ruby on Rails

shadriz is a full stack automation tool for building TypeScript web applications using a curated selection of technologies.

Spend more time creating, less time on boilerplate.

Free. Open Source.

shadriz is inspired by the convention over configuration philosophy of Ruby on Rails, which allows anyone to rapidly prototype applications in minutes.

🍣 shadriz is an omakase of the author’s preferred TypeScript ingredients.

Nostalgia for Ruby on Rails style development is one motivation that led to the creation of shadriz.

shadriz generates Next.js and React code that uses latest techniques, such as server components and server actions.

Next.js provides many conveniences out of the box, such file system routing, server side rendering, code bundling, and more.

shadriz is inspired by the non-dependency and transparency of shadcn/ui, the tool that allows anyone to automatically copy and paste beautifully styled radix ui components into their projects.

shadriz essentially generates full stack components into your Next.js project. You have full control of the code that is generated instead of the code being hidden behind an external package.

Like shadcn/ui, shadriz is not a dependency that you add to your node project. Instead, it is a CLI tool that installs third party packages and generates code.

shadriz uses Drizzle ORM for the best-of-both world of sql-like and relational queres, as well as automatic schema generation and database migrations.

shadriz takes the automations one step further by generating the configuration files required to start using Drizzle ORM.

Like Drizzle ORM, shadriz supports 3 database dialects: postgresql, mysql, and sqlite.

shadriz is based on shadcn/ui which has it’s styling based on TailwindCSS, a CSS framework which provides reusable utility classes. TailwindCSS is chosen for it’s benefits on development speed and composability.

TailwindCSS simplifies and improves scalability of styling by coupling markup with style.

shadriz uses Auth.js for it’s authentication solution. However, running the Auth.js automation is totally optional, as some applications may not need authentication or a different auth solution is preferred.

With one command, you can have authentication mostly setup and configured. Just add the client ids and secrets to the .env.local file and you’re good to go.

shadriz also provides a script/create-user.ts script to create users. This is also provided as an example on how to leverage Drizzle ORM in backend scripting using TypeScript. Note: this script is only generated if credentials is chosen as a provider.

shadriz uses zod and drizzle-zod for data validations. Each server action that is generated by the scaffolding tool will also contain zod validations to check for the correctness of data being submitted.

drizzle-zod automatically creates a zod schema based on a drizzle table. This reduces boilerplate. However, if specific validations are needed, the generated zod schemas can be extended to have custom validation rules.

Built by travisluong. Source code available on github.

MIT