A project built with Remix, Supabase, Tailwind CSS and Formula Ergast API
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
vercelIt is generally recommended to use a Git repository, because future commits will then automatically be deployed by Vercel, through its Git Integration.
To run your Remix app locally, make sure your project's local dependencies are installed:
npm installAfterwards, start the Remix development server like so:
npm run devOpen 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.
Create Profile table and rules for the profiles table
-- Create a table for Public Profiles
create table profiles (
id uuid references auth.users not null,
username text unique,
avatar_url text,
website text,
updated_at timestamp with time zone,
primary key (id),
unique(username),
constraint username_length check (char_length(username) >= 3)
);
alter table profiles enable row level security;
create policy "Public profiles are viewable by everyone."
on profiles for select
using ( true );
create policy "Users can insert their own profile."
on profiles for insert
with check ( auth.uid() = id );
create policy "Users can update own profile."
on profiles for update
using ( auth.uid() = id );
-- Set up Storage!
insert into storage.buckets (id, name)
values ('avatars', 'avatars');
create policy "Avatar images are publicly accessible."
on storage.objects for select
using ( bucket_id = 'avatars' );
create policy "Anyone can upload an avatar."
on storage.objects for insert
with check ( bucket_id = 'avatars' );
Insert user profile row on user sign up
-- inserts a row into public.users
create function public.handle_new_user()
returns trigger
language plpgsql
security definer set search_path = public
as $$
begin
insert into public.profiles (id)
values (new.id);
return new;
end;
$$;
-- trigger the function every time a user is created
create trigger on_auth_user_created
after insert on auth.users
for each row execute procedure public.handle_new_user();
Create API Cache Table
create table api_cache (
id serial,
data jsonb,
url text unique,
created_at timestamp with time zone default now(),
primary key (id, url)
);
Create an .env file based on the .env.example file and enter credentials
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent