React Router Auth
Reference repo for authentication in react-router v7 with middleware, prisma, shadcn and zod v4
Overview
Forge 42's base-stack is a comprehensive starting point designed for developers looking to kick off their projects with a well-structured, modern framework. Built on ESM Vite with Remix.run and React Router v7, it equips developers with a robust foundation that includes a rich set of features and tools. This stack is particularly appealing for those who want to embrace the latest technologies within the React ecosystem while maintaining a focus on best practices for internationalization and efficient development workflows.
By leveraging functionalities like TypeScript and TailwindCSS, this setup aims to streamline both development and styling processes. The inclusion of essential tools such as Vitest for testing and a suite of middleware options makes it an attractive package for building scalable applications. Whether you're launching a new project or enhancing an existing one, Forge 42’s base-stack promises to provide both flexibility and a high-quality development experience.
Features
-
ESM Vite Integration: Utilize the state-of-the-art Vite bundler to enable fast builds and hot module replacement, enhancing the overall development experience.
-
Comprehensive Router Support: Built-in support for react-router v7 allows for elegant routing solutions, making it easy to manage navigation in your application.
-
Internationalization with i18next: This stack is equipped for seamless multi-language support, allowing for client and server-side translations that enhance user accessibility.
-
Preconfigured Hono Server: The inclusion of Hono as your server framework, along with react-router-hono-server, simplifies setup and boosts performance with caching and middleware capabilities.
-
TypeScript and TailwindCSS: Ensures robust type safety and efficient styling methodologies, allowing developers to maintain high code quality and responsive designs.
-
Automated Testing with Vitest: Streamline your development with built-in unit testing capabilities that help ensure code reliability before production.
-
SEO Enhancements: Automatically generated robots.txt and sitemap features facilitate better search engine indexing, driving organic traffic to your application.
-
Environment Variable Handling: Simplified .env parsing and context injection for both client and server environments ensure smooth configuration management throughout development.
- Hono
Hono is an ultrafast web framework designed for edge computing environments. It's lightweight, supports multiple runtimes including Cloudflare Workers, Deno, and Bun, and provides a familiar Express-like API with excellent TypeScript support.
- React
React is a widely used JavaScript library for building user interfaces and single-page applications. It follows a component-based architecture and uses a virtual DOM to efficiently update and render UI components
- TanStack
TanStack is a collection of high-quality, framework-agnostic libraries including TanStack Query for data fetching, TanStack Router for routing, TanStack Table for tables, and more. These tools provide powerful, type-safe solutions for common web development challenges.
- Vite
Vite is a build tool that aims to provide a faster and leaner development experience for modern web projects
- Tailwind
Tailwind CSS is a utility-first CSS framework that provides pre-defined classes for building responsive and customizable user interfaces.
- Prisma
Prisma is a server-side library that helps developers read and write data to the database in an intuitive, efficient and safe way.
- Fullstack
A fullstack boilerplate provides a starter application that includes both frontend and backend. It should include database, auth, payments, user roles and other backend services to build a fully featured saas or webapps.
- React Hook Form
React Hook Form is a performant, flexible, and extensible form library for React with easy validation. It reduces re-renders and improves performance by using uncontrolled components and native HTML validation, making form handling simple and efficient.
- Recharts
Recharts is a powerful and easy-to-use React library for building customizable and interactive charts. Built on D3.js, it offers a wide range of pre-built chart types, such as line, bar, pie, and scatter charts, all of which can be composed with a declarative syntax.
- Typescript
TypeScript is a superset of JavaScript, providing optional static typing, classes, interfaces, and other features that help developers write more maintainable and scalable code. TypeScript's static typing system can catch errors at compile-time, making it easier to build and maintain large applications.
- Zod
Zod is a TypeScript-first schema declaration and validation library. It allows you to define schemas that can validate data at runtime while providing excellent TypeScript inference, making it perfect for API validation, form validation, and type-safe data handling.