Skip to content

Latest commit

 

History

History
106 lines (72 loc) · 2.58 KB

README.md

File metadata and controls

106 lines (72 loc) · 2.58 KB
Raw

React Router v7 with Remix Auth.

A production-ready authentication template featuring React Router v7 and Remix Auth, demonstrating multiple authentication strategies:

  • OAuth2 Authentication: Supports GitHub and Google login
  • TOTP Verification: Implements secure email verification with Time-based One-Time Password
    • Rate limiting and cooldown periods
    • Configurable attempt limits
    • Auto-expiring verification codes
    • Protection against brute force attacks

Built with Drizzle ORM and D1, optimized for Cloudflare Workers deployment.

Features

  • 🚀 Server-side rendering
  • ⚡️ Hot Module Replacement (HMR)
  • 📦 Asset bundling and optimization
  • 🔄 Data loading and mutations
  • 🔒 TypeScript by default
  • 🎉 TailwindCSS and Shadcn for UI styling
  • 🔑 Remix Auth for authentication
  • 🌧️ Drizzle ORM for database
  • 🛢️ Cloudflare D1 for database
  • 📁 Cloudflare KV for caching
  • 📖 React Router docs

Links

React Router v7 Authentication Demo Series:

Getting Started

Installation

Git clone the repository:

git clone https://github.com/foxlau/react-router-v7-remix-auth.git

Install the dependencies:

npm install

Development

Run an initial database migration:

npm run db:apply

If you modify the Drizzle ORM schema, please run npm run db:generate first. If you need to delete the generated SQL migrations, execute npm run db:drop and select the SQL migration you wish to remove.

Start the development server with HMR:

npm run dev

Your application will be available at http://localhost:5173.

Building for Production

Create a production build:

npm run build

Deployment

Deployment is done using the Wrangler CLI.

npx wrangler d1 create rr7-remix-auth
npx wrangler kv namespace create AUTH_VERIFICATION_KV

To deploy directly to production:

npm run db:apply-prod
npm run deploy

To deploy a preview URL:

npm run deploy:version

You can then promote a version to production after verification or roll it out progressively.

npm run deploy:promote

Questions

If you have any questions, please open an issue.