examples/user-management/angular-user-management/README.md
This example demonstrates how to build a user management app with Angular and Supabase.
Create a new project in the Supabase Dashboard.
Run the following SQL in your Supabase SQL Editor to create the profiles table:
-- Create a table for public profiles
create table profiles (
id uuid references auth.users on delete cascade not null primary key,
updated_at timestamp with time zone,
username text unique,
avatar_url text,
website text,
constraint username_length check (char_length(username) >= 3)
);
-- Set up Row Level Security (RLS)
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 ((select auth.uid()) = id);
create policy "Users can update own profile." on profiles
for update using ((select auth.uid()) = id);
-- Set up Storage
insert into storage.buckets (id, name)
values ('avatars', 'avatars');
-- Set up access controls for storage
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');
Update the src/environments/environment.ts file with your Supabase project URL and anon key:
export const environment = {
production: false,
supabaseUrl: 'YOUR_SUPABASE_URL',
supabaseKey: 'YOUR_SUPABASE_ANON_KEY',
}
You can find these values in your Supabase project settings under API.
npm install
npm start
Navigate to http://localhost:4200/. The application will automatically reload if you change any of the source files.