/sunlo-remix-vercel

Primary LanguageTypeScript

Sunlo

App based on one-aalam/remix-starter-kit.

Remix Starter Kit is an opinionated boilerplate based off of Remix, with all the bells and whistles you would want ready, up and running when starting a Remix project with Supabase.

Out of the box you get all the essentials

  • Typescript as the language choice
  • Tailwind CSS for quick styling without getting out of your HTML
  • Daisy UI for pre-made TailwindCSS component classes
  • Tailwind UI + React Hot Toast for robust headless logic you can use for components like Dialog/Modal, Dropdown, List, etc.
  • Icons through React-icons for on-demand, tree-shakeable icons
  • ESLint for static code analysis
  • Prettier for code formatting

with Supabase

  • Authentication System with Supabase GoTrue
  • User Profiles available on /profile as an example for Supabase PostgREST (CRUD API)
  • User Avatar with Supbase Storage(AWS S3 backed effortless uploads) available on /images/[bucket-name]/[image-name] resource routes (retreival-only for now)

and a bunch of pre-made, hand-rolled(easily replace-able) components, that you almost always end up installing/using for any non-trivial project

Note: Refer the basic branch for a bare minimum starter structure with all the essentials.

Deployment

After having run the create-remix command and selected "Vercel" as a deployment target, you only need to import your Git repository into Vercel, and it will be deployed.

If you'd like to avoid using a Git repository, you can also deploy the directory by running Vercel CLI:

npm i -g vercel
vercel

It is generally recommended to use a Git repository, because future commits will then automatically be deployed by Vercel, through its Git Integration.

Development

To run your Remix app locally, make sure your project's local dependencies are installed:

npm install

Afterwards, start the Remix development server like so:

npm run dev

Open up http://localhost:3000 and you should be ready to go!

If you're used to using the vercel dev command provided by Vercel CLI instead, you can also use that, but it's not needed.

Check package.json for the full list of commands available at your disposal.

For Database Permissions

Use this RLS policy

CREATE POLICY "User data only for this user"
ON public.user_deck
FOR ALL USING (
  auth.uid() = auth_user_id
) WITH CHECK (
  auth.uid() = auth_user_id
);

License

MIT