A Slack clone built on Nextjs 14, Supabase and Tailwind
-
You'll first need a Supabase project which can be made via the Supabase dashboard
-
Create a Next.js app using the Supabase Starter template npx command
git clone git@github.com:ticua07/slack-clone.git
-
Use
cd
to change into the app's directorycd slack-clone
-
Install dependencies
# pnpm install # yarn install npm install
-
Rename
.env.example
to.env
and update the following:NEXT_PUBLIC_SUPABASE_URL=[INSERT SUPABASE PROJECT URL] NEXT_PUBLIC_SUPABASE_ANON_KEY=[INSERT SUPABASE PROJECT API ANON KEY]
Both
NEXT_PUBLIC_SUPABASE_URL
andNEXT_PUBLIC_SUPABASE_ANON_KEY
can be found in your Supabase project's API settings -
You can now run the Next.js local development server:
npm run dev
The app should now be running on localhost:3000.
-
/utils/
: contains mostly server-side utilities, like the supabase cached and non-cached client, as well as some error handling for form server actions. -
/types/
: contains types for almost all the application. -
/app/api/
: contains API that user interacts with, All of the API is done for easier fetching, updating/sending data is handled by supabase client.
Check out the docs for Local Development to run Supabase locally.