Supa Remix Stack

screenshot of Supa Remix Stack

Supa Remix Stack

A Remix Stack 100% Supabase

Overview:

Supa Remix Stack is a quick start for Remix apps with Supabase, providing a seamless integration with Supabase to kickstart development. It offers various features such as GitHub authentication, Supabase Remix Auth Helper, Supabase JS SDK, Vercel deploy target, styling with Tailwind, and more.

Features:

  • GitHub authentication: Allows users to authenticate using their GitHub credentials.
  • Supabase Remix Auth Helper: Provides helper functions for authentication and authorization using Supabase.
  • Supabase JS SDK: Integrates the Supabase JavaScript SDK for easy interaction with the Supabase backend.
  • Vercel deploy target: Simplifies the deployment process by offering Vercel as a deploy target.
  • Styling with Tailwind: Enables easy and efficient styling using the popular Tailwind CSS framework.
  • Raw unstyled components with HeadlessUI: Provides raw, unstyled components with HeadlessUI for customization.
  • Icons with Heroicons: Includes Heroicons for the integration of icons in the application.
  • Utility function to efficiently merge Tailwind CSS classes in JS without style conflicts with Tailwind Merge: Offers a utility function to merge Tailwind CSS classes in JavaScript without conflicts.

Installation:

To install the Supa Remix Stack theme, follow these steps:

  1. Start by cloning the repository to your local machine:
git clone [repository-url]
  1. Change into the project directory:
cd [project-directory]
  1. Install dependencies:
npm install
  1. Configure GitHub Auth by following the Supabase guide.

  2. Start the app in development mode:

npm run dev
  1. Build the app for production:
npm run build
  1. Run the app in production mode:
npm run start
  1. Choose a host to deploy the app to.

  2. Seed your Supabase database by running seed/script.sql in your Supabase project SQL editor.

  3. Optional: Generate types from your Supabase database by logging in to Supabase first with supabase login.

  4. Deploy the output of remix build/build/public/build.

Summary:

Supa Remix Stack is a powerful tool for developers looking to quickly start building Remix apps with Supabase integration. With features like GitHub authentication, Supabase Remix Auth Helper, and Tailwind styling, the stack provides a solid foundation for development. Its seamless deployment process and utility functions make it a convenient choice for developers.