diff --git a/01-start-a-new-supabase-project/README.md b/01-start-a-new-supabase-project/README.md index c539348..271b07c 100644 --- a/01-start-a-new-supabase-project/README.md +++ b/01-start-a-new-supabase-project/README.md @@ -25,19 +25,36 @@ **[📹 Video](TODO)** -TODO +[Supabase](https://supabase.com/) is a collection of open source tools that wrap around a PostgreSQL database - Hosting, Auth, Realtime, File Storage, Edge Functions etc. In this lesson, we go to [database.new](https://database.new) to create a free Supabase project. + +Additionally, we create a `tweets` table and populate it with some seed data. ## Code Snippets -**TODO** +**Create a `tweets` table** + +```sql +create table if not exists tweets ( + id uuid default gen_random_uuid() primary key, + created_at timestamp with time zone default timezone('utc'::text, now()) not null, + title text not null +); +``` + +**Insert tweets** -```js -TODO +```sql +insert into tweets(title) +values + ('first tweet'), + ('second tweet'), + ('third tweet'); ``` ## Resources -- [TODO](TODO) +- [Supabase docs](https://supabase.com/docs) +- [Supabase SQL Editor](https://app.supabase.com/project/_/sql) --- diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/.eslintrc.json b/02-create-a-next.js-app-with-the-create-next-app-cli/.eslintrc.json similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/.eslintrc.json rename to 02-create-a-next.js-app-with-the-create-next-app-cli/.eslintrc.json diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/.gitignore b/02-create-a-next.js-app-with-the-create-next-app-cli/.gitignore similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/.gitignore rename to 02-create-a-next.js-app-with-the-create-next-app-cli/.gitignore diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/README.md b/02-create-a-next.js-app-with-the-create-next-app-cli/README.md index 6dfb0e1..8ea457d 100644 --- a/02-create-a-next.js-app-with-the-create-next-app-cli/README.md +++ b/02-create-a-next.js-app-with-the-create-next-app-cli/README.md @@ -25,19 +25,25 @@ **[📹 Video](TODO)** -TODO +[Next.js](https://nextjs.org/) is a full-stack React framework that provides the client and server building blocks to create powerful web applications. In this lesson we run the `create-next-app` CLI command to create a new Next.js application, configured with: + +- [App Router](https://nextjs.org/docs) +- [TypeScript](https://www.typescriptlang.org/) +- [Tailwind CSS](https://tailwindcss.com/) ## Code Snippets -**TODO** +**Create Next.js app** -```js -TODO +```bash +npx create-next-app blue-bird ``` ## Resources -- [TODO](TODO) +- [Next.js App Router docs](https://nextjs.org/docs) +- [TypeScript docs](https://www.typescriptlang.org/) +- [Tailwind CSS docs](https://tailwindcss.com/) --- diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/app/favicon.ico b/02-create-a-next.js-app-with-the-create-next-app-cli/app/favicon.ico similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/app/favicon.ico rename to 02-create-a-next.js-app-with-the-create-next-app-cli/app/favicon.ico diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/app/globals.css b/02-create-a-next.js-app-with-the-create-next-app-cli/app/globals.css similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/app/globals.css rename to 02-create-a-next.js-app-with-the-create-next-app-cli/app/globals.css diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/app/layout.tsx b/02-create-a-next.js-app-with-the-create-next-app-cli/app/layout.tsx similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/app/layout.tsx rename to 02-create-a-next.js-app-with-the-create-next-app-cli/app/layout.tsx diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/app/page.tsx b/02-create-a-next.js-app-with-the-create-next-app-cli/app/page.tsx similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/app/page.tsx rename to 02-create-a-next.js-app-with-the-create-next-app-cli/app/page.tsx diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/README.md b/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/next.config.js b/02-create-a-next.js-app-with-the-create-next-app-cli/next.config.js similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/next.config.js rename to 02-create-a-next.js-app-with-the-create-next-app-cli/next.config.js diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/package-lock.json b/02-create-a-next.js-app-with-the-create-next-app-cli/package-lock.json similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/package-lock.json rename to 02-create-a-next.js-app-with-the-create-next-app-cli/package-lock.json diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/package.json b/02-create-a-next.js-app-with-the-create-next-app-cli/package.json similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/package.json rename to 02-create-a-next.js-app-with-the-create-next-app-cli/package.json diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/postcss.config.js b/02-create-a-next.js-app-with-the-create-next-app-cli/postcss.config.js similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/postcss.config.js rename to 02-create-a-next.js-app-with-the-create-next-app-cli/postcss.config.js diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/public/next.svg b/02-create-a-next.js-app-with-the-create-next-app-cli/public/next.svg similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/public/next.svg rename to 02-create-a-next.js-app-with-the-create-next-app-cli/public/next.svg diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/public/vercel.svg b/02-create-a-next.js-app-with-the-create-next-app-cli/public/vercel.svg similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/public/vercel.svg rename to 02-create-a-next.js-app-with-the-create-next-app-cli/public/vercel.svg diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/tailwind.config.js b/02-create-a-next.js-app-with-the-create-next-app-cli/tailwind.config.js similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/tailwind.config.js rename to 02-create-a-next.js-app-with-the-create-next-app-cli/tailwind.config.js diff --git a/02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/tsconfig.json b/02-create-a-next.js-app-with-the-create-next-app-cli/tsconfig.json similarity index 100% rename from 02-create-a-next.js-app-with-the-create-next-app-cli/blue-bird/tsconfig.json rename to 02-create-a-next.js-app-with-the-create-next-app-cli/tsconfig.json diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/.eslintrc.json b/03-query-supabase-data-from-next.js-server-components/.eslintrc.json similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/.eslintrc.json rename to 03-query-supabase-data-from-next.js-server-components/.eslintrc.json diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/.gitignore b/03-query-supabase-data-from-next.js-server-components/.gitignore similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/.gitignore rename to 03-query-supabase-data-from-next.js-server-components/.gitignore diff --git a/03-query-supabase-data-from-next.js-server-components/README.md b/03-query-supabase-data-from-next.js-server-components/README.md index 922efc3..5580408 100644 --- a/03-query-supabase-data-from-next.js-server-components/README.md +++ b/03-query-supabase-data-from-next.js-server-components/README.md @@ -25,19 +25,66 @@ **[📹 Video](TODO)** -TODO +Our [Supabase](https://supabase.com) project is a hosted PostgreSQL database. In this lesson, we install the [Supabase Auth Helpers](https://www.npmjs.com/package/@supabase/auth-helpers-nextjs) and [Supabase.js](https://www.npmjs.com/package/@supabase/supabase-js) npm packages, and configure environment variables to query data from Supabase: + +``` +NEXT_PUBLIC_SUPABASE_URL=your-supabase-url +NEXT_PUBLIC_SUPABASE_ANON_KEY=your-supabase-anon-key +``` + +These values can be found in [your Supabase project's API Settings](https://app.supabase.com/project/_/settings/api). + +Additionally, we create a new Supabase instance using the `createServerComponentClient` function, then make our Server Component Async and suspend its rendering until our request for Supabase data resolves. + +Lastly, we implement a Row Level Security (RLS) policy to enable read access for the `tweets` table. ## Code Snippets -**TODO** +**Install Supabase packages** + +```bash +npm i @supabase/auth-helpers-nextjs @supabase/supabase-js +``` + +**Import createServerComponentClient function** + +```tsx +import { createServerComponentClient } from "@supabase/auth-helpers-nextjs"; +import { cookies } from "next/headers"; +``` + +**Create Supabase client in Server Component** + +```tsx +const supabase = createServerComponentClient({ cookies }); +``` + +**Fetch data from Supabase** + +```tsx +const { data: tweets } = await supabase.from("tweets").select(); +``` + +**Pretty print data with JSON.stringify** + +```tsx +
{JSON.stringify(tweets, null, 2)}
+``` + +**Enable read access with RLS policy** -```js -TODO +```sql +create policy "anyone can select tweets" ON "public"."tweets" +as permissive for select +to public +using (true); ``` ## Resources -- [TODO](TODO) +- [Supabase Auth Helpers for Next.js](https://supabase.com/docs/guides/auth/auth-helpers/nextjs) +- [Supabase.js docs](https://supabase.com/docs/reference/javascript/installing) +- [Row Level Security](https://supabase.com/docs/guides/auth/row-level-security) --- diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/app/favicon.ico b/03-query-supabase-data-from-next.js-server-components/app/favicon.ico similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/app/favicon.ico rename to 03-query-supabase-data-from-next.js-server-components/app/favicon.ico diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/app/globals.css b/03-query-supabase-data-from-next.js-server-components/app/globals.css similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/app/globals.css rename to 03-query-supabase-data-from-next.js-server-components/app/globals.css diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/app/layout.tsx b/03-query-supabase-data-from-next.js-server-components/app/layout.tsx similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/app/layout.tsx rename to 03-query-supabase-data-from-next.js-server-components/app/layout.tsx diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/app/page.tsx b/03-query-supabase-data-from-next.js-server-components/app/page.tsx similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/app/page.tsx rename to 03-query-supabase-data-from-next.js-server-components/app/page.tsx diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/README.md b/03-query-supabase-data-from-next.js-server-components/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/03-query-supabase-data-from-next.js-server-components/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/next.config.js b/03-query-supabase-data-from-next.js-server-components/next.config.js similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/next.config.js rename to 03-query-supabase-data-from-next.js-server-components/next.config.js diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/package-lock.json b/03-query-supabase-data-from-next.js-server-components/package-lock.json similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/package-lock.json rename to 03-query-supabase-data-from-next.js-server-components/package-lock.json diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/package.json b/03-query-supabase-data-from-next.js-server-components/package.json similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/package.json rename to 03-query-supabase-data-from-next.js-server-components/package.json diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/postcss.config.js b/03-query-supabase-data-from-next.js-server-components/postcss.config.js similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/postcss.config.js rename to 03-query-supabase-data-from-next.js-server-components/postcss.config.js diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/public/next.svg b/03-query-supabase-data-from-next.js-server-components/public/next.svg similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/public/next.svg rename to 03-query-supabase-data-from-next.js-server-components/public/next.svg diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/public/vercel.svg b/03-query-supabase-data-from-next.js-server-components/public/vercel.svg similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/public/vercel.svg rename to 03-query-supabase-data-from-next.js-server-components/public/vercel.svg diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/tailwind.config.js b/03-query-supabase-data-from-next.js-server-components/tailwind.config.js similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/tailwind.config.js rename to 03-query-supabase-data-from-next.js-server-components/tailwind.config.js diff --git a/03-query-supabase-data-from-next.js-server-components/blue-bird/tsconfig.json b/03-query-supabase-data-from-next.js-server-components/tsconfig.json similarity index 100% rename from 03-query-supabase-data-from-next.js-server-components/blue-bird/tsconfig.json rename to 03-query-supabase-data-from-next.js-server-components/tsconfig.json diff --git a/04-create-an-oauth-app-with-github/blue-bird/.eslintrc.json b/04-create-an-oauth-app-with-github/.eslintrc.json similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/.eslintrc.json rename to 04-create-an-oauth-app-with-github/.eslintrc.json diff --git a/04-create-an-oauth-app-with-github/blue-bird/.gitignore b/04-create-an-oauth-app-with-github/.gitignore similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/.gitignore rename to 04-create-an-oauth-app-with-github/.gitignore diff --git a/04-create-an-oauth-app-with-github/README.md b/04-create-an-oauth-app-with-github/README.md index 1dc611e..250c64b 100644 --- a/04-create-an-oauth-app-with-github/README.md +++ b/04-create-an-oauth-app-with-github/README.md @@ -25,19 +25,11 @@ **[📹 Video](TODO)** -TODO - -## Code Snippets - -**TODO** - -```js -TODO -``` +[Supabase](https://supabase.com/) includes many ways to authenticate users - Email and password, magic link, mobile OTP etc. In this lesson we implement social login with GitHub by registering a new OAuth Application and providing Supabase with the Client ID and Secret. ## Resources -- [TODO](TODO) +- [Supabase guide to Login with GitHub](https://supabase.com/docs/guides/auth/social-login/auth-github) --- diff --git a/04-create-an-oauth-app-with-github/blue-bird/app/favicon.ico b/04-create-an-oauth-app-with-github/app/favicon.ico similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/app/favicon.ico rename to 04-create-an-oauth-app-with-github/app/favicon.ico diff --git a/04-create-an-oauth-app-with-github/blue-bird/app/globals.css b/04-create-an-oauth-app-with-github/app/globals.css similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/app/globals.css rename to 04-create-an-oauth-app-with-github/app/globals.css diff --git a/04-create-an-oauth-app-with-github/blue-bird/app/layout.tsx b/04-create-an-oauth-app-with-github/app/layout.tsx similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/app/layout.tsx rename to 04-create-an-oauth-app-with-github/app/layout.tsx diff --git a/04-create-an-oauth-app-with-github/blue-bird/app/page.tsx b/04-create-an-oauth-app-with-github/app/page.tsx similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/app/page.tsx rename to 04-create-an-oauth-app-with-github/app/page.tsx diff --git a/04-create-an-oauth-app-with-github/blue-bird/README.md b/04-create-an-oauth-app-with-github/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/04-create-an-oauth-app-with-github/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/04-create-an-oauth-app-with-github/blue-bird/next.config.js b/04-create-an-oauth-app-with-github/next.config.js similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/next.config.js rename to 04-create-an-oauth-app-with-github/next.config.js diff --git a/04-create-an-oauth-app-with-github/blue-bird/package-lock.json b/04-create-an-oauth-app-with-github/package-lock.json similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/package-lock.json rename to 04-create-an-oauth-app-with-github/package-lock.json diff --git a/04-create-an-oauth-app-with-github/blue-bird/package.json b/04-create-an-oauth-app-with-github/package.json similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/package.json rename to 04-create-an-oauth-app-with-github/package.json diff --git a/04-create-an-oauth-app-with-github/blue-bird/postcss.config.js b/04-create-an-oauth-app-with-github/postcss.config.js similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/postcss.config.js rename to 04-create-an-oauth-app-with-github/postcss.config.js diff --git a/04-create-an-oauth-app-with-github/blue-bird/public/next.svg b/04-create-an-oauth-app-with-github/public/next.svg similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/public/next.svg rename to 04-create-an-oauth-app-with-github/public/next.svg diff --git a/04-create-an-oauth-app-with-github/blue-bird/public/vercel.svg b/04-create-an-oauth-app-with-github/public/vercel.svg similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/public/vercel.svg rename to 04-create-an-oauth-app-with-github/public/vercel.svg diff --git a/04-create-an-oauth-app-with-github/blue-bird/tailwind.config.js b/04-create-an-oauth-app-with-github/tailwind.config.js similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/tailwind.config.js rename to 04-create-an-oauth-app-with-github/tailwind.config.js diff --git a/04-create-an-oauth-app-with-github/blue-bird/tsconfig.json b/04-create-an-oauth-app-with-github/tsconfig.json similarity index 100% rename from 04-create-an-oauth-app-with-github/blue-bird/tsconfig.json rename to 04-create-an-oauth-app-with-github/tsconfig.json diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.DS_Store b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.DS_Store index b57a7af..5008ddf 100644 Binary files a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.DS_Store and b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.DS_Store differ diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/.eslintrc.json b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.eslintrc.json similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/.eslintrc.json rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.eslintrc.json diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/.gitignore b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.gitignore similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/.gitignore rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.gitignore diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/.vscode/settings.json b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.vscode/settings.json similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/.vscode/settings.json rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/.vscode/settings.json diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/README.md b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/README.md index d32a225..ccc437b 100644 --- a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/README.md +++ b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/README.md @@ -25,19 +25,38 @@ **[📹 Video](TODO)** -TODO +[Supabase](https://supabase.com) includes multiple authentication strategies. In this lesson, we create a Supabase client to trigger the OAuth authentication flow with GitHub. + +Additionally, we discuss the differences between Client and Server Components in the [Next.js App Router](https://nextjs.org/docs/app): + +- Client Components: user interactivity +- Server Components: data fetching + +Lastly, we create a Route Handler to exchange an authentication code from GitHub for their Supabase session. ## Code Snippets -**TODO** +**Authenticate with GitHub OAuth** + +```tsx +await supabase.auth.signInWithOAuth({ + provider: "github", + options: { + redirectTo: "http://localhost:3000/auth/callback", + }, +}); +``` + +**Exchange code for Supabase session** -```js -TODO +```tsx +await supabase.auth.exchangeCodeForSession(code); ``` ## Resources -- [TODO](TODO) +- [Supabase Auth Helper docs](https://supabase.com/docs/guides/auth/auth-helpers/nextjs) +- [Next.js App Router docs](https://nextjs.org/docs/app) --- diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/auth-button.tsx b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/auth-button.tsx similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/auth-button.tsx rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/auth-button.tsx diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/auth/callback/route.ts b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/auth/callback/route.ts similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/auth/callback/route.ts rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/auth/callback/route.ts diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/favicon.ico b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/favicon.ico similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/favicon.ico rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/favicon.ico diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/globals.css b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/globals.css similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/globals.css rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/globals.css diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/layout.tsx b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/layout.tsx similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/layout.tsx rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/layout.tsx diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/page.tsx b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/page.tsx similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/app/page.tsx rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/app/page.tsx diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/README.md b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/next.config.js b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/next.config.js similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/next.config.js rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/next.config.js diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/package-lock.json b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/package-lock.json similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/package-lock.json rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/package-lock.json diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/package.json b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/package.json similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/package.json rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/package.json diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/postcss.config.js b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/postcss.config.js similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/postcss.config.js rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/postcss.config.js diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/public/next.svg b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/public/next.svg similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/public/next.svg rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/public/next.svg diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/public/vercel.svg b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/public/vercel.svg similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/public/vercel.svg rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/public/vercel.svg diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/tailwind.config.js b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/tailwind.config.js similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/tailwind.config.js rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/tailwind.config.js diff --git a/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/tsconfig.json b/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/tsconfig.json similarity index 100% rename from 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/blue-bird/tsconfig.json rename to 05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/tsconfig.json diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/.eslintrc.json b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/.eslintrc.json similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/.eslintrc.json rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/.eslintrc.json diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/.gitignore b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/.gitignore similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/.gitignore rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/.gitignore diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/.vscode/settings.json b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/.vscode/settings.json similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/.vscode/settings.json rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/.vscode/settings.json diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/README.md b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/README.md index dbaeaef..7dccfd5 100644 --- a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/README.md +++ b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/README.md @@ -25,19 +25,23 @@ **[📹 Video](TODO)** -TODO +Server Components cannot set cookies in the [Next.js App Router](https://nextjs.org/docs/app). In this lesson, we implement middleware to refresh expired [Supabase](https://supabase.com/) sessions. + +[Middleware](https://nextjs.org/docs/app/building-your-application/routing/middleware) runs immediately before the route is loaded. By using it to refresh our user's session, we ensure it is valid by the time it loads the Server Component and attempts to fetch data from Supabase. ## Code Snippets -**TODO** +**Refresh expired sessions** -```js -TODO +```tsx +supabase.auth.getSession(); ``` ## Resources -- [TODO](TODO) +- [Supabase Auth Helper docs](https://supabase.com/docs/guides/auth/auth-helpers/nextjs) +- [Next.js App Router docs](https://nextjs.org/docs/app) +- [Next.js Middleware](https://nextjs.org/docs/app/building-your-application/routing/middleware) --- diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/auth-button.tsx b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/auth-button.tsx similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/auth-button.tsx rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/auth-button.tsx diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/auth/callback/route.ts b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/auth/callback/route.ts similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/auth/callback/route.ts rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/auth/callback/route.ts diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/favicon.ico b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/favicon.ico similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/favicon.ico rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/favicon.ico diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/globals.css b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/globals.css similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/globals.css rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/globals.css diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/layout.tsx b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/layout.tsx similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/layout.tsx rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/layout.tsx diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/page.tsx b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/page.tsx similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/app/page.tsx rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/app/page.tsx diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/README.md b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/middleware.ts b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/middleware.ts similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/middleware.ts rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/middleware.ts diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/next.config.js b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/next.config.js similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/next.config.js rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/next.config.js diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/package-lock.json b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/package-lock.json similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/package-lock.json rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/package-lock.json diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/package.json b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/package.json similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/package.json rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/package.json diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/postcss.config.js b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/postcss.config.js similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/postcss.config.js rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/postcss.config.js diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/public/next.svg b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/public/next.svg similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/public/next.svg rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/public/next.svg diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/public/vercel.svg b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/public/vercel.svg similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/public/vercel.svg rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/public/vercel.svg diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/tailwind.config.js b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/tailwind.config.js similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/tailwind.config.js rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/tailwind.config.js diff --git a/06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/tsconfig.json b/06-refresh-session-cookie-for-next.js-server-components-with-middleware/tsconfig.json similarity index 100% rename from 06-refresh-session-cookie-for-next.js-server-components-with-middleware/blue-bird/tsconfig.json rename to 06-refresh-session-cookie-for-next.js-server-components-with-middleware/tsconfig.json diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/.eslintrc.json b/07-restrict-access-to-authenticated-users-with-rls-policies/.eslintrc.json similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/.eslintrc.json rename to 07-restrict-access-to-authenticated-users-with-rls-policies/.eslintrc.json diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/.gitignore b/07-restrict-access-to-authenticated-users-with-rls-policies/.gitignore similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/.gitignore rename to 07-restrict-access-to-authenticated-users-with-rls-policies/.gitignore diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/.vscode/settings.json b/07-restrict-access-to-authenticated-users-with-rls-policies/.vscode/settings.json similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/.vscode/settings.json rename to 07-restrict-access-to-authenticated-users-with-rls-policies/.vscode/settings.json diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/README.md b/07-restrict-access-to-authenticated-users-with-rls-policies/README.md index 3a88d30..c6db64b 100644 --- a/07-restrict-access-to-authenticated-users-with-rls-policies/README.md +++ b/07-restrict-access-to-authenticated-users-with-rls-policies/README.md @@ -25,19 +25,27 @@ **[📹 Video](TODO)** -TODO +Since we're using [Supabase](https://supabase.com/) to authenticate our users, it knows who our user is throughout the rest of the Supabase environment. + +In this lesson, we modify our Row Level Security (RLS) policy to only apply to the `authenticated` role to ensure that only authenticated users can select tweets. + +Additionally, we use the `useRouter` hook and `router.refresh()` to run our Server Component again and fetch fresh data from Supabase, after the user signs in or out. ## Code Snippets -**TODO** +**Enable authenticated read access with RLS policy** -```js -TODO +```sql +create policy "anyone can select tweets" ON "public"."tweets" +as permissive for select +to authenticated +using (true); ``` ## Resources -- [TODO](TODO) +- [Row Level Security docs](https://supabase.com/docs/guides/auth/row-level-security) +- [useRouter hook](https://nextjs.org/docs/app/api-reference/functions/use-router#userouter) --- diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/auth-button.tsx b/07-restrict-access-to-authenticated-users-with-rls-policies/app/auth-button.tsx similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/auth-button.tsx rename to 07-restrict-access-to-authenticated-users-with-rls-policies/app/auth-button.tsx diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/auth/callback/route.ts b/07-restrict-access-to-authenticated-users-with-rls-policies/app/auth/callback/route.ts similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/auth/callback/route.ts rename to 07-restrict-access-to-authenticated-users-with-rls-policies/app/auth/callback/route.ts diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/favicon.ico b/07-restrict-access-to-authenticated-users-with-rls-policies/app/favicon.ico similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/favicon.ico rename to 07-restrict-access-to-authenticated-users-with-rls-policies/app/favicon.ico diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/globals.css b/07-restrict-access-to-authenticated-users-with-rls-policies/app/globals.css similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/globals.css rename to 07-restrict-access-to-authenticated-users-with-rls-policies/app/globals.css diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/layout.tsx b/07-restrict-access-to-authenticated-users-with-rls-policies/app/layout.tsx similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/layout.tsx rename to 07-restrict-access-to-authenticated-users-with-rls-policies/app/layout.tsx diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/page.tsx b/07-restrict-access-to-authenticated-users-with-rls-policies/app/page.tsx similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/app/page.tsx rename to 07-restrict-access-to-authenticated-users-with-rls-policies/app/page.tsx diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/README.md b/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/middleware.ts b/07-restrict-access-to-authenticated-users-with-rls-policies/middleware.ts similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/middleware.ts rename to 07-restrict-access-to-authenticated-users-with-rls-policies/middleware.ts diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/next.config.js b/07-restrict-access-to-authenticated-users-with-rls-policies/next.config.js similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/next.config.js rename to 07-restrict-access-to-authenticated-users-with-rls-policies/next.config.js diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/package-lock.json b/07-restrict-access-to-authenticated-users-with-rls-policies/package-lock.json similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/package-lock.json rename to 07-restrict-access-to-authenticated-users-with-rls-policies/package-lock.json diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/package.json b/07-restrict-access-to-authenticated-users-with-rls-policies/package.json similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/package.json rename to 07-restrict-access-to-authenticated-users-with-rls-policies/package.json diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/postcss.config.js b/07-restrict-access-to-authenticated-users-with-rls-policies/postcss.config.js similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/postcss.config.js rename to 07-restrict-access-to-authenticated-users-with-rls-policies/postcss.config.js diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/public/next.svg b/07-restrict-access-to-authenticated-users-with-rls-policies/public/next.svg similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/public/next.svg rename to 07-restrict-access-to-authenticated-users-with-rls-policies/public/next.svg diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/public/vercel.svg b/07-restrict-access-to-authenticated-users-with-rls-policies/public/vercel.svg similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/public/vercel.svg rename to 07-restrict-access-to-authenticated-users-with-rls-policies/public/vercel.svg diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/tailwind.config.js b/07-restrict-access-to-authenticated-users-with-rls-policies/tailwind.config.js similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/tailwind.config.js rename to 07-restrict-access-to-authenticated-users-with-rls-policies/tailwind.config.js diff --git a/07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/tsconfig.json b/07-restrict-access-to-authenticated-users-with-rls-policies/tsconfig.json similarity index 100% rename from 07-restrict-access-to-authenticated-users-with-rls-policies/blue-bird/tsconfig.json rename to 07-restrict-access-to-authenticated-users-with-rls-policies/tsconfig.json diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/.eslintrc.json b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/.eslintrc.json similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/.eslintrc.json rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/.eslintrc.json diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/.gitignore b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/.gitignore similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/.gitignore rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/.gitignore diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/.vscode/settings.json b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/.vscode/settings.json similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/.vscode/settings.json rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/.vscode/settings.json diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/README.md b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/README.md index adba7a4..ca0fe0a 100644 --- a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/README.md +++ b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/README.md @@ -25,19 +25,26 @@ **[📹 Video](TODO)** -TODO +The first render of a Client Component happens on the server. This is called Server-side rendering (SSR). However, Client Components are synchronous, so they cannot suspend rendering while fetching data - such as the user's session. This means we either need to display a loading spinner or render the logged out state, while fetching that async data, causing a flash of incorrect state for the user. + +In this lesson, we look at rendering a Client Component from a Server Component that can asynchronously fetch the user's [Supabase](https://supabase.com/) session, and pass it as a prop to the Client Component, making the user's session available on its first SSR render. ## Code Snippets -**TODO** +**Render Client Component from Server Component** + +```tsx +const { + data: { session }, +} = await supabase.auth.getSession(); -```js -TODO +return ; ``` ## Resources -- [TODO](TODO) +- [Client and Server Components docs](https://nextjs.org/docs/getting-started/react-essentials) +- [Supabase Auth Helpers for Next.js docs](https://supabase.com/docs/guides/auth/auth-helpers/nextjs) --- diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/auth-button-client.tsx b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/auth-button-client.tsx similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/auth-button-client.tsx rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/auth-button-client.tsx diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/auth-button-server.tsx b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/auth-button-server.tsx similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/auth-button-server.tsx rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/auth-button-server.tsx diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/auth/callback/route.ts b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/auth/callback/route.ts similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/auth/callback/route.ts rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/auth/callback/route.ts diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/favicon.ico b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/favicon.ico similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/favicon.ico rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/favicon.ico diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/globals.css b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/globals.css similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/globals.css rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/globals.css diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/layout.tsx b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/layout.tsx similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/layout.tsx rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/layout.tsx diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/page.tsx b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/page.tsx similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/app/page.tsx rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/app/page.tsx diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/README.md b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/middleware.ts b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/middleware.ts similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/middleware.ts rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/middleware.ts diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/next.config.js b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/next.config.js similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/next.config.js rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/next.config.js diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/package-lock.json b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/package-lock.json similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/package-lock.json rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/package-lock.json diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/package.json b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/package.json similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/package.json rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/package.json diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/postcss.config.js b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/postcss.config.js similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/postcss.config.js rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/postcss.config.js diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/public/next.svg b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/public/next.svg similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/public/next.svg rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/public/next.svg diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/public/vercel.svg b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/public/vercel.svg similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/public/vercel.svg rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/public/vercel.svg diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/tailwind.config.js b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/tailwind.config.js similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/tailwind.config.js rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/tailwind.config.js diff --git a/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/tsconfig.json b/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/tsconfig.json similarity index 100% rename from 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/blue-bird/tsconfig.json rename to 08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/tsconfig.json diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/.eslintrc.json b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/.eslintrc.json similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/.eslintrc.json rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/.eslintrc.json diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/.gitignore b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/.gitignore similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/.gitignore rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/.gitignore diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/.vscode/settings.json b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/.vscode/settings.json similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/.vscode/settings.json rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/.vscode/settings.json diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/README.md b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/README.md index b81ccf1..278fd39 100644 --- a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/README.md +++ b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/README.md @@ -25,19 +25,27 @@ **[📹 Video](TODO)** -TODO +Since [Supabase](https://supabase.com/) requires our user to be authenticated to fetch tweets, it doesn't make sense for an unauthenticated user to visit the landing page. In this lesson, we implement protected routes that are only accessible to authenticated users. + +Additionally, we create a `/login` route to redirect unauthenticated users, which allows them to sign in with GitHub. ## Code Snippets -**TODO** +**Redirect unauthenticated users** + +```tsx +const { + data: { session }, +} = await supabase.auth.getSession(); -```js -TODO +if (!session) { + redirect("/login"); +} ``` ## Resources -- [TODO](TODO) +- [Supabase Auth Helpers for Next.js docs](https://supabase.com/docs/guides/auth/auth-helpers/nextjs) --- diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/auth-button-client.tsx b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/auth-button-client.tsx similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/auth-button-client.tsx rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/auth-button-client.tsx diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/auth-button-server.tsx b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/auth-button-server.tsx similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/auth-button-server.tsx rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/auth-button-server.tsx diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/auth/callback/route.ts b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/auth/callback/route.ts similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/auth/callback/route.ts rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/auth/callback/route.ts diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/favicon.ico b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/favicon.ico similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/favicon.ico rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/favicon.ico diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/globals.css b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/globals.css similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/globals.css rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/globals.css diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/layout.tsx b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/layout.tsx similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/layout.tsx rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/layout.tsx diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/login/page.tsx b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/login/page.tsx similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/login/page.tsx rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/login/page.tsx diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/page.tsx b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/page.tsx similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/app/page.tsx rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/app/page.tsx diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/README.md b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/middleware.ts b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/middleware.ts similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/middleware.ts rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/middleware.ts diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/next.config.js b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/next.config.js similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/next.config.js rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/next.config.js diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/package-lock.json b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/package-lock.json similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/package-lock.json rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/package-lock.json diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/package.json b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/package.json similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/package.json rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/package.json diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/postcss.config.js b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/postcss.config.js similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/postcss.config.js rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/postcss.config.js diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/public/next.svg b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/public/next.svg similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/public/next.svg rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/public/next.svg diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/public/vercel.svg b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/public/vercel.svg similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/public/vercel.svg rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/public/vercel.svg diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/tailwind.config.js b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/tailwind.config.js similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/tailwind.config.js rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/tailwind.config.js diff --git a/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/tsconfig.json b/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/tsconfig.json similarity index 100% rename from 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/blue-bird/tsconfig.json rename to 09-implement-protected-routes-for-authenticated-users-with-supabase-auth/tsconfig.json diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/.eslintrc.json b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/.eslintrc.json similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/.eslintrc.json rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/.eslintrc.json diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/.gitignore b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/.gitignore similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/.gitignore rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/.gitignore diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/.vscode/settings.json b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/.vscode/settings.json similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/.vscode/settings.json rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/.vscode/settings.json diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/README.md b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/README.md index 7ec18fa..99d21fc 100644 --- a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/README.md +++ b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/README.md @@ -25,19 +25,32 @@ **[📹 Video](TODO)** -TODO +[Typescript](https://www.typescriptlang.org/) reduces runtime errors and makes our code more maintainable. [Supabase](https://supabase.com/) allows us to introspect our PostgreSQL schema and generate TypeScript definitions. + +In this lesson we generate an access token to use the [Supabase CLI](https://supabase.com/docs/guides/cli) and generate TypeScript definitions. Additionally, we write our types to a file, which can be passed to our Supabase client, giving our application full type-safety across client, server and database. + +Lastly, we make our Database types globally available so we don't need to import them every time we create a Supabase client. ## Code Snippets -**TODO** +**Login to Supabase CLI** + +```bash +npx supabase login +``` + +**Generate TS definitions file** -```js -TODO +```bash +npx supabase gen types typescript --project-id your-project-id > lib/database.types.ts ``` ## Resources -- [TODO](TODO) +- [Generate Supabase access token](https://app.supabase.com/account/tokens) +- [TypeScript docs](https://www.typescriptlang.org/) +- [Supabase CLI](https://supabase.com/docs/guides/cli) +- [Generating TypeScript definitions](https://supabase.com/docs/guides/api/rest/generating-types) --- diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/auth-button-client.tsx b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/auth-button-client.tsx similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/auth-button-client.tsx rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/auth-button-client.tsx diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/auth-button-server.tsx b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/auth-button-server.tsx similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/auth-button-server.tsx rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/auth-button-server.tsx diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/auth/callback/route.ts b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/auth/callback/route.ts similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/auth/callback/route.ts rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/auth/callback/route.ts diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/favicon.ico b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/favicon.ico similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/favicon.ico rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/favicon.ico diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/global.d.ts b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/global.d.ts similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/global.d.ts rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/global.d.ts diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/globals.css b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/globals.css similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/globals.css rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/globals.css diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/layout.tsx b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/layout.tsx similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/layout.tsx rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/layout.tsx diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/login/page.tsx b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/login/page.tsx similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/login/page.tsx rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/login/page.tsx diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/page.tsx b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/page.tsx similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/app/page.tsx rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/app/page.tsx diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/README.md b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/lib/database.types.ts b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/lib/database.types.ts similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/lib/database.types.ts rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/lib/database.types.ts diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/middleware.ts b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/middleware.ts similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/middleware.ts rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/middleware.ts diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/next.config.js b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/next.config.js similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/next.config.js rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/next.config.js diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/package-lock.json b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/package-lock.json similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/package-lock.json rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/package-lock.json diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/package.json b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/package.json similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/package.json rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/package.json diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/postcss.config.js b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/postcss.config.js similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/postcss.config.js rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/postcss.config.js diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/public/next.svg b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/public/next.svg similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/public/next.svg rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/public/next.svg diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/public/vercel.svg b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/public/vercel.svg similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/public/vercel.svg rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/public/vercel.svg diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/tailwind.config.js b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/tailwind.config.js similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/tailwind.config.js rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/tailwind.config.js diff --git a/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/tsconfig.json b/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/tsconfig.json similarity index 100% rename from 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/blue-bird/tsconfig.json rename to 10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/tsconfig.json diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/.eslintrc.json b/11-setup-a-foreign-key-relationship-between-postgresql-tables/.eslintrc.json similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/.eslintrc.json rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/.eslintrc.json diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/.gitignore b/11-setup-a-foreign-key-relationship-between-postgresql-tables/.gitignore similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/.gitignore rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/.gitignore diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/.vscode/settings.json b/11-setup-a-foreign-key-relationship-between-postgresql-tables/.vscode/settings.json similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/.vscode/settings.json rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/.vscode/settings.json diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/README.md b/11-setup-a-foreign-key-relationship-between-postgresql-tables/README.md index 6fbbca9..b329227 100644 --- a/11-setup-a-foreign-key-relationship-between-postgresql-tables/README.md +++ b/11-setup-a-foreign-key-relationship-between-postgresql-tables/README.md @@ -25,19 +25,32 @@ **[📹 Video](TODO)** -TODO +[Supabase](https://supabase.com/) uses the `auth.users` table to store information about our users and their sessions. In this lesson, we add a column to the `tweets` table to associate each tweet with one of our users. + +Additionally, we set up cascading deletes, so when a user is deleted from the `auth.users` table, their tweets are also deleted. + +Lastly, because our database schema has changed, our TypeScript definitions are now incorrect. Therefore, we use the Supabase CLI to introspect our PostgreSQL schema and create a new `database.types.ts` file. ## Code Snippets -**TODO** +**Add foreign key relationship to auth.users** + +```sql +alter table public.tweets +add user_id uuid references auth.users on delete cascade not null; +``` + +**Generate TypeScript definitions** -```js -TODO +```bash +npx supabase gen types typescript --project-id your-project-id > lib/database.types.ts ``` ## Resources -- [TODO](TODO) +- [Supabase Auth docs](https://supabase.com/docs/guides/auth) +- [Supabase CLI](https://supabase.com/docs/guides/cli) +- [Generating TypeScript definitions](https://supabase.com/docs/guides/api/rest/generating-types) --- diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/auth-button-client.tsx b/11-setup-a-foreign-key-relationship-between-postgresql-tables/app/auth-button-client.tsx similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/auth-button-client.tsx rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/app/auth-button-client.tsx diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/auth-button-server.tsx b/11-setup-a-foreign-key-relationship-between-postgresql-tables/app/auth-button-server.tsx similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/auth-button-server.tsx rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/app/auth-button-server.tsx diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/auth/callback/route.ts b/11-setup-a-foreign-key-relationship-between-postgresql-tables/app/auth/callback/route.ts similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/auth/callback/route.ts rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/app/auth/callback/route.ts diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/favicon.ico b/11-setup-a-foreign-key-relationship-between-postgresql-tables/app/favicon.ico similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/favicon.ico rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/app/favicon.ico diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/global.d.ts b/11-setup-a-foreign-key-relationship-between-postgresql-tables/app/global.d.ts similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/global.d.ts rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/app/global.d.ts diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/globals.css b/11-setup-a-foreign-key-relationship-between-postgresql-tables/app/globals.css similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/globals.css rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/app/globals.css diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/layout.tsx b/11-setup-a-foreign-key-relationship-between-postgresql-tables/app/layout.tsx similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/layout.tsx rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/app/layout.tsx diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/login/page.tsx b/11-setup-a-foreign-key-relationship-between-postgresql-tables/app/login/page.tsx similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/login/page.tsx rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/app/login/page.tsx diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/page.tsx b/11-setup-a-foreign-key-relationship-between-postgresql-tables/app/page.tsx similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/app/page.tsx rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/app/page.tsx diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/README.md b/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/lib/database.types.ts b/11-setup-a-foreign-key-relationship-between-postgresql-tables/lib/database.types.ts similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/lib/database.types.ts rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/lib/database.types.ts diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/middleware.ts b/11-setup-a-foreign-key-relationship-between-postgresql-tables/middleware.ts similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/middleware.ts rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/middleware.ts diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/next.config.js b/11-setup-a-foreign-key-relationship-between-postgresql-tables/next.config.js similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/next.config.js rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/next.config.js diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/package-lock.json b/11-setup-a-foreign-key-relationship-between-postgresql-tables/package-lock.json similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/package-lock.json rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/package-lock.json diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/package.json b/11-setup-a-foreign-key-relationship-between-postgresql-tables/package.json similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/package.json rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/package.json diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/postcss.config.js b/11-setup-a-foreign-key-relationship-between-postgresql-tables/postcss.config.js similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/postcss.config.js rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/postcss.config.js diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/public/next.svg b/11-setup-a-foreign-key-relationship-between-postgresql-tables/public/next.svg similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/public/next.svg rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/public/next.svg diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/public/vercel.svg b/11-setup-a-foreign-key-relationship-between-postgresql-tables/public/vercel.svg similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/public/vercel.svg rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/public/vercel.svg diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/tailwind.config.js b/11-setup-a-foreign-key-relationship-between-postgresql-tables/tailwind.config.js similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/tailwind.config.js rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/tailwind.config.js diff --git a/11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/tsconfig.json b/11-setup-a-foreign-key-relationship-between-postgresql-tables/tsconfig.json similarity index 100% rename from 11-setup-a-foreign-key-relationship-between-postgresql-tables/blue-bird/tsconfig.json rename to 11-setup-a-foreign-key-relationship-between-postgresql-tables/tsconfig.json diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/.eslintrc.json b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/.eslintrc.json similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/.eslintrc.json rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/.eslintrc.json diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/.gitignore b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/.gitignore similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/.gitignore rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/.gitignore diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/.vscode/settings.json b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/.vscode/settings.json similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/.vscode/settings.json rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/.vscode/settings.json diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/README.md b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/README.md index 7a7009e..3dfb868 100644 --- a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/README.md +++ b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/README.md @@ -25,19 +25,73 @@ **[📹 Video](TODO)** -TODO +[Supabase](https://supabase.com/) has an `auth.users` table that contains information about our user and their session. We want to display the user's name, username and avatar alongside their tweets, but the `auth.users` table cannot be publicly accessible, as it contains sensitive information. + +In this lesson, we create a new table called `profiles` and populate it with the data we want to display from the `auth.users` table. Additionally, we set up a PostgreSQL Function and Trigger to create a new profile for any user added to the `auth.users` table. + +Lastly, we create an RLS policy for the `profiles` table to enable read access, and re-generate our TypeScript definitions file to contain our new table. ## Code Snippets -**TODO** +**Create profiles table** + +```sql +create table public.profiles ( + id uuid not null references auth.users on delete cascade primary key, + name text not null, + username text not null, + avatar_url text not null +); +``` + +**Enable Row Level Security** + +```sql +alter table public.profiles enable row level security; +``` + +**Enable read access with RLS policy** + +```sql +create policy "anyone can select profiles" ON "public"."profiles" +as permissive for select +to public +using (true); +``` + +**Create PostgreSQL Function to create profile** + +```sql +create function public.create_profile_for_user() +returns trigger +language plpgsql +security definer set search_path = public +as $$ +begin + insert into public.profiles (id, name, username, avatar_url) + values ( + new.id, + new.raw_user_meta_data->'name', + new.raw_user_meta_data->'user_name', + new.raw_user_meta_data->'avatar_url' + ); + return new; +end; +$$; +``` + +**Create PostgreSQL Trigger to create profile** -```js -TODO +```sql +create trigger on_auth_user_created + after insert on auth.users + for each row execute procedure public.create_profile_for_user(); ``` ## Resources -- [TODO](TODO) +- [Managing user data docs](https://supabase.com/docs/guides/auth/managing-user-data) +- [Row Level Security docs](https://supabase.com/docs/guides/auth/row-level-security) --- diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/auth-button-client.tsx b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/auth-button-client.tsx similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/auth-button-client.tsx rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/auth-button-client.tsx diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/auth-button-server.tsx b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/auth-button-server.tsx similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/auth-button-server.tsx rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/auth-button-server.tsx diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/auth/callback/route.ts b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/auth/callback/route.ts similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/auth/callback/route.ts rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/auth/callback/route.ts diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/favicon.ico b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/favicon.ico similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/favicon.ico rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/favicon.ico diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/global.d.ts b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/global.d.ts similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/global.d.ts rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/global.d.ts diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/globals.css b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/globals.css similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/globals.css rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/globals.css diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/layout.tsx b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/layout.tsx similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/layout.tsx rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/layout.tsx diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/login/page.tsx b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/login/page.tsx similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/login/page.tsx rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/login/page.tsx diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/page.tsx b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/page.tsx similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/app/page.tsx rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/app/page.tsx diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/README.md b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/lib/database.types.ts b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/lib/database.types.ts similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/lib/database.types.ts rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/lib/database.types.ts diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/middleware.ts b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/middleware.ts similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/middleware.ts rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/middleware.ts diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/next.config.js b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/next.config.js similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/next.config.js rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/next.config.js diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/package-lock.json b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/package-lock.json similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/package-lock.json rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/package-lock.json diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/package.json b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/package.json similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/package.json rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/package.json diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/postcss.config.js b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/postcss.config.js similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/postcss.config.js rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/postcss.config.js diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/public/next.svg b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/public/next.svg similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/public/next.svg rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/public/next.svg diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/public/vercel.svg b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/public/vercel.svg similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/public/vercel.svg rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/public/vercel.svg diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/tailwind.config.js b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/tailwind.config.js similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/tailwind.config.js rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/tailwind.config.js diff --git a/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/tsconfig.json b/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/tsconfig.json similarity index 100% rename from 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/blue-bird/tsconfig.json rename to 12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/tsconfig.json diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/.eslintrc.json b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/.eslintrc.json similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/.eslintrc.json rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/.eslintrc.json diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/.gitignore b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/.gitignore similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/.gitignore rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/.gitignore diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/.vscode/settings.json b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/.vscode/settings.json similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/.vscode/settings.json rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/.vscode/settings.json diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/README.md b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/README.md index c135d39..d122e86 100644 --- a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/README.md +++ b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/README.md @@ -25,19 +25,51 @@ **[📹 Video](TODO)** -TODO +[Server Actions](https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions) are a way to perform server-side mutations in the [Next.js App Router](https://nextjs.org/docs/app). In this lesson, we create a `` component that renders a form for the user to enter a new tweet. This form is submitted to a Server Action, which writes this data to [Supabase](https://supabase.com/). + +Additionally, we create a Server Action Supabase client and call the `getUser` function to fetch the currently signed in user. + +Lastly, we write a Row Level Security (RLS) policy to enable the `insert` action for `authenticated` users. ## Code Snippets -**TODO** +**Posting form to Server Action** + +```tsx +export default function NewTweet() { + const addTweet = async () => { + "use server"; + }; + + return
...
; +} +``` + +**Create Supabase client in Server Action** + +```tsx +const supabase = createServerActionClient({ cookies }); +``` + +**Get user from Supabase client** + +```tsx +const { + data: { user }, +} = await supabase.auth.getUser(); +``` + +**Insert tweet with Supabase** -```js -TODO +```tsx +await supabase.from("tweets").insert({...}); ``` ## Resources -- [TODO](TODO) +- [Server Action docs](https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions) +- [Supabase Auth Helpers for Next.js](https://supabase.com/docs/guides/auth/auth-helpers/nextjs) +- [Inserting data with supabase-js](https://supabase.com/docs/reference/javascript/insert) --- diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/auth-button-client.tsx b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/auth-button-client.tsx similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/auth-button-client.tsx rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/auth-button-client.tsx diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/auth-button-server.tsx b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/auth-button-server.tsx similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/auth-button-server.tsx rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/auth-button-server.tsx diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/auth/callback/route.ts b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/auth/callback/route.ts similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/auth/callback/route.ts rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/auth/callback/route.ts diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/favicon.ico b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/favicon.ico similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/favicon.ico rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/favicon.ico diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/global.d.ts b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/global.d.ts similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/global.d.ts rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/global.d.ts diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/globals.css b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/globals.css similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/globals.css rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/globals.css diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/layout.tsx b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/layout.tsx similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/layout.tsx rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/layout.tsx diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/login/page.tsx b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/login/page.tsx similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/login/page.tsx rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/login/page.tsx diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/new-tweet.tsx b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/new-tweet.tsx similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/new-tweet.tsx rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/new-tweet.tsx diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/page.tsx b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/page.tsx similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/app/page.tsx rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/app/page.tsx diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/README.md b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/lib/database.types.ts b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/lib/database.types.ts similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/lib/database.types.ts rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/lib/database.types.ts diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/middleware.ts b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/middleware.ts similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/middleware.ts rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/middleware.ts diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/next.config.js b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/next.config.js similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/next.config.js rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/next.config.js diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/package-lock.json b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/package-lock.json similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/package-lock.json rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/package-lock.json diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/package.json b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/package.json similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/package.json rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/package.json diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/postcss.config.js b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/postcss.config.js similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/postcss.config.js rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/postcss.config.js diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/public/next.svg b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/public/next.svg similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/public/next.svg rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/public/next.svg diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/public/vercel.svg b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/public/vercel.svg similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/public/vercel.svg rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/public/vercel.svg diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/tailwind.config.js b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/tailwind.config.js similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/tailwind.config.js rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/tailwind.config.js diff --git a/13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/tsconfig.json b/13-run-authenticated-server-side-mutations-with-next.js-server-actions/tsconfig.json similarity index 100% rename from 13-run-authenticated-server-side-mutations-with-next.js-server-actions/blue-bird/tsconfig.json rename to 13-run-authenticated-server-side-mutations-with-next.js-server-actions/tsconfig.json diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/.eslintrc.json b/14-create-a-postgresql-join-table-in-supabase-studio/.eslintrc.json similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/.eslintrc.json rename to 14-create-a-postgresql-join-table-in-supabase-studio/.eslintrc.json diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/.gitignore b/14-create-a-postgresql-join-table-in-supabase-studio/.gitignore similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/.gitignore rename to 14-create-a-postgresql-join-table-in-supabase-studio/.gitignore diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/.vscode/settings.json b/14-create-a-postgresql-join-table-in-supabase-studio/.vscode/settings.json similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/.vscode/settings.json rename to 14-create-a-postgresql-join-table-in-supabase-studio/.vscode/settings.json diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/README.md b/14-create-a-postgresql-join-table-in-supabase-studio/README.md index f13dd33..c0714eb 100644 --- a/14-create-a-postgresql-join-table-in-supabase-studio/README.md +++ b/14-create-a-postgresql-join-table-in-supabase-studio/README.md @@ -25,19 +25,60 @@ **[📹 Video](TODO)** -TODO +In this lesson, we create a PostgreSQL join table for `likes`. This has a many-to-many relationship between the `profiles` and `tweets` table, allowing us to store each instance of a like between a user and a tweet. + +Additionally, we create Row Level Security (RLS) polices to enable `select`, `insert` and `delete`. ## Code Snippets -**TODO** +**Create likes table** + +```sql +create table public.likes ( + id uuid default gen_random_uuid() primary key, + created_at timestamp with time zone default timezone('utc'::text, now()) not null, + user_id uuid references public.profiles on delete cascade not null, + tweet_id uuid references public.tweets on delete cascade not null +); +``` + +**Enable Row Level Security** + +```sql +alter table public.likes enable row level security; +``` + +**Enable insert action with RLS policy** + +```sql +create policy "authenticated users can insert their own likes" ON "public"."likes" +as permissive for select +to authenticated +using (user_id = auth.uid()); +``` + +**Enable delete action with RLS policy** + +```sql +create policy "authenticated users can delete their own likes" ON "public"."likes" +as permissive for delete +to authenticated +using (user_id = auth.uid()); +``` + +**Enable select action with RLS policy** -```js -TODO +```sql +create policy "authenticated users can select likes" ON "public"."likes" +as permissive for select +to authenticated +using (true); ``` ## Resources -- [TODO](TODO) +- [Managing user data docs](https://supabase.com/docs/guides/auth/managing-user-data) +- [Row Level Security docs](https://supabase.com/docs/guides/auth/row-level-security) --- diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/auth-button-client.tsx b/14-create-a-postgresql-join-table-in-supabase-studio/app/auth-button-client.tsx similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/auth-button-client.tsx rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/auth-button-client.tsx diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/auth-button-server.tsx b/14-create-a-postgresql-join-table-in-supabase-studio/app/auth-button-server.tsx similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/auth-button-server.tsx rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/auth-button-server.tsx diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/auth/callback/route.ts b/14-create-a-postgresql-join-table-in-supabase-studio/app/auth/callback/route.ts similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/auth/callback/route.ts rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/auth/callback/route.ts diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/favicon.ico b/14-create-a-postgresql-join-table-in-supabase-studio/app/favicon.ico similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/favicon.ico rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/favicon.ico diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/global.d.ts b/14-create-a-postgresql-join-table-in-supabase-studio/app/global.d.ts similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/global.d.ts rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/global.d.ts diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/globals.css b/14-create-a-postgresql-join-table-in-supabase-studio/app/globals.css similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/globals.css rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/globals.css diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/layout.tsx b/14-create-a-postgresql-join-table-in-supabase-studio/app/layout.tsx similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/layout.tsx rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/layout.tsx diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/login/page.tsx b/14-create-a-postgresql-join-table-in-supabase-studio/app/login/page.tsx similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/login/page.tsx rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/login/page.tsx diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/new-tweet.tsx b/14-create-a-postgresql-join-table-in-supabase-studio/app/new-tweet.tsx similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/new-tweet.tsx rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/new-tweet.tsx diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/page.tsx b/14-create-a-postgresql-join-table-in-supabase-studio/app/page.tsx similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/app/page.tsx rename to 14-create-a-postgresql-join-table-in-supabase-studio/app/page.tsx diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/README.md b/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/lib/database.types.ts b/14-create-a-postgresql-join-table-in-supabase-studio/lib/database.types.ts similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/lib/database.types.ts rename to 14-create-a-postgresql-join-table-in-supabase-studio/lib/database.types.ts diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/middleware.ts b/14-create-a-postgresql-join-table-in-supabase-studio/middleware.ts similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/middleware.ts rename to 14-create-a-postgresql-join-table-in-supabase-studio/middleware.ts diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/next.config.js b/14-create-a-postgresql-join-table-in-supabase-studio/next.config.js similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/next.config.js rename to 14-create-a-postgresql-join-table-in-supabase-studio/next.config.js diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/package-lock.json b/14-create-a-postgresql-join-table-in-supabase-studio/package-lock.json similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/package-lock.json rename to 14-create-a-postgresql-join-table-in-supabase-studio/package-lock.json diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/package.json b/14-create-a-postgresql-join-table-in-supabase-studio/package.json similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/package.json rename to 14-create-a-postgresql-join-table-in-supabase-studio/package.json diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/postcss.config.js b/14-create-a-postgresql-join-table-in-supabase-studio/postcss.config.js similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/postcss.config.js rename to 14-create-a-postgresql-join-table-in-supabase-studio/postcss.config.js diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/public/next.svg b/14-create-a-postgresql-join-table-in-supabase-studio/public/next.svg similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/public/next.svg rename to 14-create-a-postgresql-join-table-in-supabase-studio/public/next.svg diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/public/vercel.svg b/14-create-a-postgresql-join-table-in-supabase-studio/public/vercel.svg similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/public/vercel.svg rename to 14-create-a-postgresql-join-table-in-supabase-studio/public/vercel.svg diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/tailwind.config.js b/14-create-a-postgresql-join-table-in-supabase-studio/tailwind.config.js similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/tailwind.config.js rename to 14-create-a-postgresql-join-table-in-supabase-studio/tailwind.config.js diff --git a/14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/tsconfig.json b/14-create-a-postgresql-join-table-in-supabase-studio/tsconfig.json similarity index 100% rename from 14-create-a-postgresql-join-table-in-supabase-studio/blue-bird/tsconfig.json rename to 14-create-a-postgresql-join-table-in-supabase-studio/tsconfig.json diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/.eslintrc.json b/15-implement-dynamic-buttons-with-next.js-client-components/.eslintrc.json similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/.eslintrc.json rename to 15-implement-dynamic-buttons-with-next.js-client-components/.eslintrc.json diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/.gitignore b/15-implement-dynamic-buttons-with-next.js-client-components/.gitignore similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/.gitignore rename to 15-implement-dynamic-buttons-with-next.js-client-components/.gitignore diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/.vscode/settings.json b/15-implement-dynamic-buttons-with-next.js-client-components/.vscode/settings.json similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/.vscode/settings.json rename to 15-implement-dynamic-buttons-with-next.js-client-components/.vscode/settings.json diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/README.md b/15-implement-dynamic-buttons-with-next.js-client-components/README.md index 69f0e84..410eb64 100644 --- a/15-implement-dynamic-buttons-with-next.js-client-components/README.md +++ b/15-implement-dynamic-buttons-with-next.js-client-components/README.md @@ -25,19 +25,26 @@ **[📹 Video](TODO)** -TODO +In this lesson, we create a new component to display the likes from [Supabase](https://supabase.com/). This component will be interactive so it needs to be a Client Component. + +Additionally, we extend our Supabase query for `tweets`, and join the columns from our `likes` table. + +Lastly, we make this button dynamic by checking whether the user has previously liked this tweet. If they have not, we increment the likes by 1, otherwise, we decrement them by 1. ## Code Snippets -**TODO** +**Querying data across tables** -```js -TODO +```tsx +const { data } = await supabase + .from("tweets") + .select("*, profiles(*), likes(*)"); ``` ## Resources -- [TODO](TODO) +- [Client Component docs](https://nextjs.org/docs/getting-started/react-essentials#client-components) +- [Querying across tables with supabase-js](https://supabase.com/docs/reference/javascript/select) --- diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/auth-button-client.tsx b/15-implement-dynamic-buttons-with-next.js-client-components/app/auth-button-client.tsx similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/auth-button-client.tsx rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/auth-button-client.tsx diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/auth-button-server.tsx b/15-implement-dynamic-buttons-with-next.js-client-components/app/auth-button-server.tsx similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/auth-button-server.tsx rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/auth-button-server.tsx diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/auth/callback/route.ts b/15-implement-dynamic-buttons-with-next.js-client-components/app/auth/callback/route.ts similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/auth/callback/route.ts rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/auth/callback/route.ts diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/favicon.ico b/15-implement-dynamic-buttons-with-next.js-client-components/app/favicon.ico similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/favicon.ico rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/favicon.ico diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/global.d.ts b/15-implement-dynamic-buttons-with-next.js-client-components/app/global.d.ts similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/global.d.ts rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/global.d.ts diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/globals.css b/15-implement-dynamic-buttons-with-next.js-client-components/app/globals.css similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/globals.css rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/globals.css diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/layout.tsx b/15-implement-dynamic-buttons-with-next.js-client-components/app/layout.tsx similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/layout.tsx rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/layout.tsx diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/likes.tsx b/15-implement-dynamic-buttons-with-next.js-client-components/app/likes.tsx similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/likes.tsx rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/likes.tsx diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/login/page.tsx b/15-implement-dynamic-buttons-with-next.js-client-components/app/login/page.tsx similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/login/page.tsx rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/login/page.tsx diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/new-tweet.tsx b/15-implement-dynamic-buttons-with-next.js-client-components/app/new-tweet.tsx similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/new-tweet.tsx rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/new-tweet.tsx diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/page.tsx b/15-implement-dynamic-buttons-with-next.js-client-components/app/page.tsx similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/app/page.tsx rename to 15-implement-dynamic-buttons-with-next.js-client-components/app/page.tsx diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/README.md b/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/lib/database.types.ts b/15-implement-dynamic-buttons-with-next.js-client-components/lib/database.types.ts similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/lib/database.types.ts rename to 15-implement-dynamic-buttons-with-next.js-client-components/lib/database.types.ts diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/middleware.ts b/15-implement-dynamic-buttons-with-next.js-client-components/middleware.ts similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/middleware.ts rename to 15-implement-dynamic-buttons-with-next.js-client-components/middleware.ts diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/next.config.js b/15-implement-dynamic-buttons-with-next.js-client-components/next.config.js similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/next.config.js rename to 15-implement-dynamic-buttons-with-next.js-client-components/next.config.js diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/package-lock.json b/15-implement-dynamic-buttons-with-next.js-client-components/package-lock.json similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/package-lock.json rename to 15-implement-dynamic-buttons-with-next.js-client-components/package-lock.json diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/package.json b/15-implement-dynamic-buttons-with-next.js-client-components/package.json similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/package.json rename to 15-implement-dynamic-buttons-with-next.js-client-components/package.json diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/postcss.config.js b/15-implement-dynamic-buttons-with-next.js-client-components/postcss.config.js similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/postcss.config.js rename to 15-implement-dynamic-buttons-with-next.js-client-components/postcss.config.js diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/public/next.svg b/15-implement-dynamic-buttons-with-next.js-client-components/public/next.svg similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/public/next.svg rename to 15-implement-dynamic-buttons-with-next.js-client-components/public/next.svg diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/public/vercel.svg b/15-implement-dynamic-buttons-with-next.js-client-components/public/vercel.svg similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/public/vercel.svg rename to 15-implement-dynamic-buttons-with-next.js-client-components/public/vercel.svg diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/tailwind.config.js b/15-implement-dynamic-buttons-with-next.js-client-components/tailwind.config.js similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/tailwind.config.js rename to 15-implement-dynamic-buttons-with-next.js-client-components/tailwind.config.js diff --git a/15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/tsconfig.json b/15-implement-dynamic-buttons-with-next.js-client-components/tsconfig.json similarity index 100% rename from 15-implement-dynamic-buttons-with-next.js-client-components/blue-bird/tsconfig.json rename to 15-implement-dynamic-buttons-with-next.js-client-components/tsconfig.json diff --git a/16-declare-global-union-types-with-typescript/blue-bird/.eslintrc.json b/16-declare-global-union-types-with-typescript/.eslintrc.json similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/.eslintrc.json rename to 16-declare-global-union-types-with-typescript/.eslintrc.json diff --git a/16-declare-global-union-types-with-typescript/blue-bird/.gitignore b/16-declare-global-union-types-with-typescript/.gitignore similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/.gitignore rename to 16-declare-global-union-types-with-typescript/.gitignore diff --git a/16-declare-global-union-types-with-typescript/blue-bird/.vscode/settings.json b/16-declare-global-union-types-with-typescript/.vscode/settings.json similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/.vscode/settings.json rename to 16-declare-global-union-types-with-typescript/.vscode/settings.json diff --git a/16-declare-global-union-types-with-typescript/README.md b/16-declare-global-union-types-with-typescript/README.md index 16188c4..49b6b4f 100644 --- a/16-declare-global-union-types-with-typescript/README.md +++ b/16-declare-global-union-types-with-typescript/README.md @@ -25,19 +25,33 @@ **[📹 Video](TODO)** -TODO +[TypeScript](https://www.typescriptlang.org/) reduces runtime errors and makes code more maintainable. In this lesson, we use the [Supabase](https://supabase.com/) CLI to introspect our PostgreSQL schema and generate TypeScript definitions. + +Additionally, we resolve a collection of TypeScript errors and create a custom union type for our transformed tweets - making it globally available throughout our Next.js application. ## Code Snippets -**TODO** +**Custom type for TweetWithAuthor** + +```tsx +type TweetWithAuthor = Tweet & { + author: Profile; + likes: number; + user_has_liked_tweet: boolean; +}; +``` + +**Generate TypeScript definitions** -```js -TODO +```bash +npx supabase gen types typescript --project-id your-project-id > lib/database.types.ts ``` ## Resources -- [TODO](TODO) +- [TypeScript docs](https://www.typescriptlang.org/) +- [Supabase CLI](https://supabase.com/docs/guides/cli) +- [Generating TypeScript definitions](https://supabase.com/docs/guides/api/rest/generating-types) --- diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/auth-button-client.tsx b/16-declare-global-union-types-with-typescript/app/auth-button-client.tsx similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/auth-button-client.tsx rename to 16-declare-global-union-types-with-typescript/app/auth-button-client.tsx diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/auth-button-server.tsx b/16-declare-global-union-types-with-typescript/app/auth-button-server.tsx similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/auth-button-server.tsx rename to 16-declare-global-union-types-with-typescript/app/auth-button-server.tsx diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/auth/callback/route.ts b/16-declare-global-union-types-with-typescript/app/auth/callback/route.ts similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/auth/callback/route.ts rename to 16-declare-global-union-types-with-typescript/app/auth/callback/route.ts diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/favicon.ico b/16-declare-global-union-types-with-typescript/app/favicon.ico similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/favicon.ico rename to 16-declare-global-union-types-with-typescript/app/favicon.ico diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/global.d.ts b/16-declare-global-union-types-with-typescript/app/global.d.ts similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/global.d.ts rename to 16-declare-global-union-types-with-typescript/app/global.d.ts diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/globals.css b/16-declare-global-union-types-with-typescript/app/globals.css similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/globals.css rename to 16-declare-global-union-types-with-typescript/app/globals.css diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/layout.tsx b/16-declare-global-union-types-with-typescript/app/layout.tsx similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/layout.tsx rename to 16-declare-global-union-types-with-typescript/app/layout.tsx diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/likes.tsx b/16-declare-global-union-types-with-typescript/app/likes.tsx similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/likes.tsx rename to 16-declare-global-union-types-with-typescript/app/likes.tsx diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/login/page.tsx b/16-declare-global-union-types-with-typescript/app/login/page.tsx similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/login/page.tsx rename to 16-declare-global-union-types-with-typescript/app/login/page.tsx diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/new-tweet.tsx b/16-declare-global-union-types-with-typescript/app/new-tweet.tsx similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/new-tweet.tsx rename to 16-declare-global-union-types-with-typescript/app/new-tweet.tsx diff --git a/16-declare-global-union-types-with-typescript/blue-bird/app/page.tsx b/16-declare-global-union-types-with-typescript/app/page.tsx similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/app/page.tsx rename to 16-declare-global-union-types-with-typescript/app/page.tsx diff --git a/16-declare-global-union-types-with-typescript/blue-bird/README.md b/16-declare-global-union-types-with-typescript/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/16-declare-global-union-types-with-typescript/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/16-declare-global-union-types-with-typescript/blue-bird/lib/database.types.ts b/16-declare-global-union-types-with-typescript/lib/database.types.ts similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/lib/database.types.ts rename to 16-declare-global-union-types-with-typescript/lib/database.types.ts diff --git a/16-declare-global-union-types-with-typescript/blue-bird/middleware.ts b/16-declare-global-union-types-with-typescript/middleware.ts similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/middleware.ts rename to 16-declare-global-union-types-with-typescript/middleware.ts diff --git a/16-declare-global-union-types-with-typescript/blue-bird/next.config.js b/16-declare-global-union-types-with-typescript/next.config.js similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/next.config.js rename to 16-declare-global-union-types-with-typescript/next.config.js diff --git a/16-declare-global-union-types-with-typescript/blue-bird/package-lock.json b/16-declare-global-union-types-with-typescript/package-lock.json similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/package-lock.json rename to 16-declare-global-union-types-with-typescript/package-lock.json diff --git a/16-declare-global-union-types-with-typescript/blue-bird/package.json b/16-declare-global-union-types-with-typescript/package.json similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/package.json rename to 16-declare-global-union-types-with-typescript/package.json diff --git a/16-declare-global-union-types-with-typescript/blue-bird/postcss.config.js b/16-declare-global-union-types-with-typescript/postcss.config.js similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/postcss.config.js rename to 16-declare-global-union-types-with-typescript/postcss.config.js diff --git a/16-declare-global-union-types-with-typescript/blue-bird/public/next.svg b/16-declare-global-union-types-with-typescript/public/next.svg similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/public/next.svg rename to 16-declare-global-union-types-with-typescript/public/next.svg diff --git a/16-declare-global-union-types-with-typescript/blue-bird/public/vercel.svg b/16-declare-global-union-types-with-typescript/public/vercel.svg similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/public/vercel.svg rename to 16-declare-global-union-types-with-typescript/public/vercel.svg diff --git a/16-declare-global-union-types-with-typescript/blue-bird/tailwind.config.js b/16-declare-global-union-types-with-typescript/tailwind.config.js similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/tailwind.config.js rename to 16-declare-global-union-types-with-typescript/tailwind.config.js diff --git a/16-declare-global-union-types-with-typescript/blue-bird/tsconfig.json b/16-declare-global-union-types-with-typescript/tsconfig.json similarity index 100% rename from 16-declare-global-union-types-with-typescript/blue-bird/tsconfig.json rename to 16-declare-global-union-types-with-typescript/tsconfig.json diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/.eslintrc.json b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/.eslintrc.json similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/.eslintrc.json rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/.eslintrc.json diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/.gitignore b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/.gitignore similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/.gitignore rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/.gitignore diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/.vscode/settings.json b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/.vscode/settings.json similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/.vscode/settings.json rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/.vscode/settings.json diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/README.md b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/README.md index 0de67f3..5a37ebe 100644 --- a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/README.md +++ b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/README.md @@ -25,19 +25,35 @@ **[📹 Video](TODO)** -TODO +"Optimistic UI" is a pattern for updating the page immediately with the data you have available, rather than waiting for the database query to resolve. In this lesson, we use React's `useOptimistic` hook to create an array of tweets that we can instantly update with our new state, when the user clicks the like button. ## Code Snippets -**TODO** +**Call useOptimistic hook** -```js -TODO +```tsx +const [optimisticState, addOptimisticState] = useOptimistic( + initialState, + (currentState, newState) => { + // merge state + // return new state + } +); +``` + +**Add optimistic tweet** + +```tsx +addOptimisticTweet({ + ...tweet, + likes: tweet.likes - 1, + user_has_liked_tweet: !tweet.user_has_liked_tweet, +}); ``` ## Resources -- [TODO](TODO) +- [useOptimistic hook](https://nextjs.org/docs/app/building-your-application/data-fetching/server-actions#enhancements) --- diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/auth-button-client.tsx b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/auth-button-client.tsx similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/auth-button-client.tsx rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/auth-button-client.tsx diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/auth-button-server.tsx b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/auth-button-server.tsx similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/auth-button-server.tsx rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/auth-button-server.tsx diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/auth/callback/route.ts b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/auth/callback/route.ts similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/auth/callback/route.ts rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/auth/callback/route.ts diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/favicon.ico b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/favicon.ico similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/favicon.ico rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/favicon.ico diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/global.d.ts b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/global.d.ts similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/global.d.ts rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/global.d.ts diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/globals.css b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/globals.css similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/globals.css rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/globals.css diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/layout.tsx b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/layout.tsx similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/layout.tsx rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/layout.tsx diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/likes.tsx b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/likes.tsx similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/likes.tsx rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/likes.tsx diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/login/page.tsx b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/login/page.tsx similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/login/page.tsx rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/login/page.tsx diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/new-tweet.tsx b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/new-tweet.tsx similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/new-tweet.tsx rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/new-tweet.tsx diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/page.tsx b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/page.tsx similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/page.tsx rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/page.tsx diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/tweets.tsx b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/tweets.tsx similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/app/tweets.tsx rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/app/tweets.tsx diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/README.md b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/lib/database.types.ts b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/lib/database.types.ts similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/lib/database.types.ts rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/lib/database.types.ts diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/middleware.ts b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/middleware.ts similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/middleware.ts rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/middleware.ts diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/next.config.js b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/next.config.js similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/next.config.js rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/next.config.js diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/package-lock.json b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/package-lock.json similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/package-lock.json rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/package-lock.json diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/package.json b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/package.json similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/package.json rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/package.json diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/postcss.config.js b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/postcss.config.js similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/postcss.config.js rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/postcss.config.js diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/public/next.svg b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/public/next.svg similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/public/next.svg rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/public/next.svg diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/public/vercel.svg b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/public/vercel.svg similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/public/vercel.svg rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/public/vercel.svg diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/tailwind.config.js b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/tailwind.config.js similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/tailwind.config.js rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/tailwind.config.js diff --git a/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/tsconfig.json b/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/tsconfig.json similarity index 100% rename from 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/blue-bird/tsconfig.json rename to 17-implement-optimistic-ui-with-the-next.js-usetransition-hook/tsconfig.json diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/.eslintrc.json b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/.eslintrc.json similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/.eslintrc.json rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/.eslintrc.json diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/.gitignore b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/.gitignore similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/.gitignore rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/.gitignore diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/.vscode/settings.json b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/.vscode/settings.json similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/.vscode/settings.json rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/.vscode/settings.json diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/README.md b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/README.md index 89eac9f..98dadce 100644 --- a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/README.md +++ b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/README.md @@ -25,19 +25,35 @@ **[📹 Video](TODO)** -TODO +[Supabase](https://supabase.com/) allows us to subscribe to changes in the database, and update our UI, without the user needing to refresh the page. In this lesson, we create a subscription for `postgres_changes`, listening for any change events - insert, update or delete - on our tweets table. + +Additionally, we call the `router.refresh()` function to re-run our Server Components, fetching fresh data from Supabase. ## Code Snippets -**TODO** +**Subscribe to database changes** -```js -TODO +```tsx +const channel = supabase + .channel("realtime tweets") + .on( + "postgres_changes", + { + event: "*", + schema: "public", + table: "tweets", + }, + (payload) => { + router.refresh(); + } + ) + .subscribe(); ``` ## Resources -- [TODO](TODO) +- [Supabase Realtime docs](https://supabase.com/docs/guides/realtime) +- [useRouter hook docs](https://nextjs.org/docs/app/api-reference/functions/use-router) --- diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/auth-button-client.tsx b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/auth-button-client.tsx similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/auth-button-client.tsx rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/auth-button-client.tsx diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/auth-button-server.tsx b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/auth-button-server.tsx similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/auth-button-server.tsx rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/auth-button-server.tsx diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/auth/callback/route.ts b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/auth/callback/route.ts similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/auth/callback/route.ts rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/auth/callback/route.ts diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/favicon.ico b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/favicon.ico similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/favicon.ico rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/favicon.ico diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/global.d.ts b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/global.d.ts similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/global.d.ts rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/global.d.ts diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/globals.css b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/globals.css similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/globals.css rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/globals.css diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/layout.tsx b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/layout.tsx similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/layout.tsx rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/layout.tsx diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/likes.tsx b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/likes.tsx similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/likes.tsx rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/likes.tsx diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/login/page.tsx b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/login/page.tsx similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/login/page.tsx rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/login/page.tsx diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/new-tweet.tsx b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/new-tweet.tsx similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/new-tweet.tsx rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/new-tweet.tsx diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/page.tsx b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/page.tsx similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/page.tsx rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/page.tsx diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/tweets.tsx b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/tweets.tsx similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/app/tweets.tsx rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/app/tweets.tsx diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/README.md b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/lib/database.types.ts b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/lib/database.types.ts similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/lib/database.types.ts rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/lib/database.types.ts diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/middleware.ts b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/middleware.ts similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/middleware.ts rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/middleware.ts diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/next.config.js b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/next.config.js similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/next.config.js rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/next.config.js diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/package-lock.json b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/package-lock.json similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/package-lock.json rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/package-lock.json diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/package.json b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/package.json similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/package.json rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/package.json diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/postcss.config.js b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/postcss.config.js similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/postcss.config.js rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/postcss.config.js diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/public/next.svg b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/public/next.svg similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/public/next.svg rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/public/next.svg diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/public/vercel.svg b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/public/vercel.svg similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/public/vercel.svg rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/public/vercel.svg diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/tailwind.config.js b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/tailwind.config.js similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/tailwind.config.js rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/tailwind.config.js diff --git a/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/tsconfig.json b/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/tsconfig.json similarity index 100% rename from 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/blue-bird/tsconfig.json rename to 18-dynamically-update-ui-with-database-changes-using-supabase-realtime/tsconfig.json diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/.eslintrc.json b/19-style-a-twitter-clone-with-tailwind-css/.eslintrc.json similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/.eslintrc.json rename to 19-style-a-twitter-clone-with-tailwind-css/.eslintrc.json diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/.gitignore b/19-style-a-twitter-clone-with-tailwind-css/.gitignore similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/.gitignore rename to 19-style-a-twitter-clone-with-tailwind-css/.gitignore diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/.vscode/settings.json b/19-style-a-twitter-clone-with-tailwind-css/.vscode/settings.json similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/.vscode/settings.json rename to 19-style-a-twitter-clone-with-tailwind-css/.vscode/settings.json diff --git a/19-style-a-twitter-clone-with-tailwind-css/README.md b/19-style-a-twitter-clone-with-tailwind-css/README.md index 33bfee9..c03c529 100644 --- a/19-style-a-twitter-clone-with-tailwind-css/README.md +++ b/19-style-a-twitter-clone-with-tailwind-css/README.md @@ -25,19 +25,15 @@ **[📹 Video](TODO)** -TODO +[Tailwind](https://tailwindcss.com/) is an atomic CSS framework that makes styling an application more consistent and maintainable. In this lesson, we look at building out a similar UI to Twitter using only Tailwind classes. -## Code Snippets - -**TODO** - -```js -TODO -``` +Additionally, we use a heart icon from Feather Icons for our like button, and create a new `` component that displays a nicely styled GitHub logo to trigger the user authentication flow. ## Resources -- [TODO](TODO) +- [Tailwind docs](https://tailwindcss.com/) +- [Feather Icons](https://feathericons.com/) +- [GitHub Logo](http://github.com/logos --- diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/auth-button-client.tsx b/19-style-a-twitter-clone-with-tailwind-css/app/auth-button-client.tsx similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/auth-button-client.tsx rename to 19-style-a-twitter-clone-with-tailwind-css/app/auth-button-client.tsx diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/auth-button-server.tsx b/19-style-a-twitter-clone-with-tailwind-css/app/auth-button-server.tsx similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/auth-button-server.tsx rename to 19-style-a-twitter-clone-with-tailwind-css/app/auth-button-server.tsx diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/auth/callback/route.ts b/19-style-a-twitter-clone-with-tailwind-css/app/auth/callback/route.ts similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/auth/callback/route.ts rename to 19-style-a-twitter-clone-with-tailwind-css/app/auth/callback/route.ts diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/favicon.ico b/19-style-a-twitter-clone-with-tailwind-css/app/favicon.ico similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/favicon.ico rename to 19-style-a-twitter-clone-with-tailwind-css/app/favicon.ico diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/global.d.ts b/19-style-a-twitter-clone-with-tailwind-css/app/global.d.ts similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/global.d.ts rename to 19-style-a-twitter-clone-with-tailwind-css/app/global.d.ts diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/globals.css b/19-style-a-twitter-clone-with-tailwind-css/app/globals.css similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/globals.css rename to 19-style-a-twitter-clone-with-tailwind-css/app/globals.css diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/layout.tsx b/19-style-a-twitter-clone-with-tailwind-css/app/layout.tsx similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/layout.tsx rename to 19-style-a-twitter-clone-with-tailwind-css/app/layout.tsx diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/likes.tsx b/19-style-a-twitter-clone-with-tailwind-css/app/likes.tsx similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/likes.tsx rename to 19-style-a-twitter-clone-with-tailwind-css/app/likes.tsx diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/login/github-button.tsx b/19-style-a-twitter-clone-with-tailwind-css/app/login/github-button.tsx similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/login/github-button.tsx rename to 19-style-a-twitter-clone-with-tailwind-css/app/login/github-button.tsx diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/login/page.tsx b/19-style-a-twitter-clone-with-tailwind-css/app/login/page.tsx similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/login/page.tsx rename to 19-style-a-twitter-clone-with-tailwind-css/app/login/page.tsx diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/new-tweet.tsx b/19-style-a-twitter-clone-with-tailwind-css/app/new-tweet.tsx similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/new-tweet.tsx rename to 19-style-a-twitter-clone-with-tailwind-css/app/new-tweet.tsx diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/page.tsx b/19-style-a-twitter-clone-with-tailwind-css/app/page.tsx similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/page.tsx rename to 19-style-a-twitter-clone-with-tailwind-css/app/page.tsx diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/tweets.tsx b/19-style-a-twitter-clone-with-tailwind-css/app/tweets.tsx similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/app/tweets.tsx rename to 19-style-a-twitter-clone-with-tailwind-css/app/tweets.tsx diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/README.md b/19-style-a-twitter-clone-with-tailwind-css/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/lib/database.types.ts b/19-style-a-twitter-clone-with-tailwind-css/lib/database.types.ts similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/lib/database.types.ts rename to 19-style-a-twitter-clone-with-tailwind-css/lib/database.types.ts diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/middleware.ts b/19-style-a-twitter-clone-with-tailwind-css/middleware.ts similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/middleware.ts rename to 19-style-a-twitter-clone-with-tailwind-css/middleware.ts diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/next.config.js b/19-style-a-twitter-clone-with-tailwind-css/next.config.js similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/next.config.js rename to 19-style-a-twitter-clone-with-tailwind-css/next.config.js diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/package-lock.json b/19-style-a-twitter-clone-with-tailwind-css/package-lock.json similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/package-lock.json rename to 19-style-a-twitter-clone-with-tailwind-css/package-lock.json diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/package.json b/19-style-a-twitter-clone-with-tailwind-css/package.json similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/package.json rename to 19-style-a-twitter-clone-with-tailwind-css/package.json diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/postcss.config.js b/19-style-a-twitter-clone-with-tailwind-css/postcss.config.js similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/postcss.config.js rename to 19-style-a-twitter-clone-with-tailwind-css/postcss.config.js diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/public/github-mark-white.png b/19-style-a-twitter-clone-with-tailwind-css/public/github-mark-white.png similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/public/github-mark-white.png rename to 19-style-a-twitter-clone-with-tailwind-css/public/github-mark-white.png diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/public/next.svg b/19-style-a-twitter-clone-with-tailwind-css/public/next.svg similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/public/next.svg rename to 19-style-a-twitter-clone-with-tailwind-css/public/next.svg diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/public/vercel.svg b/19-style-a-twitter-clone-with-tailwind-css/public/vercel.svg similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/public/vercel.svg rename to 19-style-a-twitter-clone-with-tailwind-css/public/vercel.svg diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/tailwind.config.js b/19-style-a-twitter-clone-with-tailwind-css/tailwind.config.js similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/tailwind.config.js rename to 19-style-a-twitter-clone-with-tailwind-css/tailwind.config.js diff --git a/19-style-a-twitter-clone-with-tailwind-css/blue-bird/tsconfig.json b/19-style-a-twitter-clone-with-tailwind-css/tsconfig.json similarity index 100% rename from 19-style-a-twitter-clone-with-tailwind-css/blue-bird/tsconfig.json rename to 19-style-a-twitter-clone-with-tailwind-css/tsconfig.json diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/.eslintrc.json b/20-deploy-next.js-app-router-project-to-production-with-vercel/.eslintrc.json similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/.eslintrc.json rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/.eslintrc.json diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/.gitignore b/20-deploy-next.js-app-router-project-to-production-with-vercel/.gitignore similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/.gitignore rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/.gitignore diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/.vscode/settings.json b/20-deploy-next.js-app-router-project-to-production-with-vercel/.vscode/settings.json similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/.vscode/settings.json rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/.vscode/settings.json diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/README.md b/20-deploy-next.js-app-router-project-to-production-with-vercel/README.md index a010787..85c7570 100644 --- a/20-deploy-next.js-app-router-project-to-production-with-vercel/README.md +++ b/20-deploy-next.js-app-router-project-to-production-with-vercel/README.md @@ -25,19 +25,19 @@ **[📹 Video](TODO)** -TODO +[Vercel](https://vercel.com) is a hosting platform that works very well with [Next.js](https://nextjs.org) - because it's their framework! In this lesson, we prepare our project to be deployed to production by: -## Code Snippets - -**TODO** - -```js -TODO -``` +- Pushing code to [GitHub](https://github.com/) +- Deploying repo to [Vercel](https://vercel.com) +- Updating [GitHub OAuth app](https://github.com/settings/developers) to use production URL +- Updating [Supabase](https://supabase.com/) project to use production URL ## Resources -- [TODO](TODO) +- [Deploy Next.js to Vercel guide](https://nextjs.org/learn/basics/deploying-nextjs-app/deploy) +- [GitHub OAuth App settings](https://github.com/settings/developers) +- [Vercel](https://vercel.com) +- [Supabase URL configuration](https://app.supabase.com/project/_/auth/url-configuration) --- diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/auth-button-client.tsx b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/auth-button-client.tsx similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/auth-button-client.tsx rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/auth-button-client.tsx diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/auth-button-server.tsx b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/auth-button-server.tsx similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/auth-button-server.tsx rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/auth-button-server.tsx diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/auth/callback/route.ts b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/auth/callback/route.ts similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/auth/callback/route.ts rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/auth/callback/route.ts diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/favicon.ico b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/favicon.ico similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/favicon.ico rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/favicon.ico diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/global.d.ts b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/global.d.ts similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/global.d.ts rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/global.d.ts diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/globals.css b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/globals.css similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/globals.css rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/globals.css diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/layout.tsx b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/layout.tsx similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/layout.tsx rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/layout.tsx diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/likes.tsx b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/likes.tsx similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/likes.tsx rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/likes.tsx diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/login/github-button.tsx b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/login/github-button.tsx similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/login/github-button.tsx rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/login/github-button.tsx diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/login/page.tsx b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/login/page.tsx similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/login/page.tsx rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/login/page.tsx diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/new-tweet.tsx b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/new-tweet.tsx similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/new-tweet.tsx rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/new-tweet.tsx diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/page.tsx b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/page.tsx similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/page.tsx rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/page.tsx diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/tweets.tsx b/20-deploy-next.js-app-router-project-to-production-with-vercel/app/tweets.tsx similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/app/tweets.tsx rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/app/tweets.tsx diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/README.md b/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/README.md deleted file mode 100644 index f4da3c4..0000000 --- a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/README.md +++ /dev/null @@ -1,34 +0,0 @@ -This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app). - -## Getting Started - -First, run the development server: - -```bash -npm run dev -# or -yarn dev -# or -pnpm dev -``` - -Open [http://localhost:3000](http://localhost:3000) with your browser to see the result. - -You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file. - -This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font. - -## Learn More - -To learn more about Next.js, take a look at the following resources: - -- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API. -- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial. - -You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome! - -## Deploy on Vercel - -The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js. - -Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details. diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/lib/database.types.ts b/20-deploy-next.js-app-router-project-to-production-with-vercel/lib/database.types.ts similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/lib/database.types.ts rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/lib/database.types.ts diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/middleware.ts b/20-deploy-next.js-app-router-project-to-production-with-vercel/middleware.ts similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/middleware.ts rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/middleware.ts diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/next.config.js b/20-deploy-next.js-app-router-project-to-production-with-vercel/next.config.js similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/next.config.js rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/next.config.js diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/package-lock.json b/20-deploy-next.js-app-router-project-to-production-with-vercel/package-lock.json similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/package-lock.json rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/package-lock.json diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/package.json b/20-deploy-next.js-app-router-project-to-production-with-vercel/package.json similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/package.json rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/package.json diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/postcss.config.js b/20-deploy-next.js-app-router-project-to-production-with-vercel/postcss.config.js similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/postcss.config.js rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/postcss.config.js diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/public/github-mark-white.png b/20-deploy-next.js-app-router-project-to-production-with-vercel/public/github-mark-white.png similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/public/github-mark-white.png rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/public/github-mark-white.png diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/public/next.svg b/20-deploy-next.js-app-router-project-to-production-with-vercel/public/next.svg similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/public/next.svg rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/public/next.svg diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/public/vercel.svg b/20-deploy-next.js-app-router-project-to-production-with-vercel/public/vercel.svg similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/public/vercel.svg rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/public/vercel.svg diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/tailwind.config.js b/20-deploy-next.js-app-router-project-to-production-with-vercel/tailwind.config.js similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/tailwind.config.js rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/tailwind.config.js diff --git a/20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/tsconfig.json b/20-deploy-next.js-app-router-project-to-production-with-vercel/tsconfig.json similarity index 100% rename from 20-deploy-next.js-app-router-project-to-production-with-vercel/blue-bird/tsconfig.json rename to 20-deploy-next.js-app-router-project-to-production-with-vercel/tsconfig.json diff --git a/README.md b/README.md index 9f29e87..8c3d6c2 100644 --- a/README.md +++ b/README.md @@ -8,7 +8,24 @@ ## 🔍 About -TODO +In this course, we build a Twitter clone from scratch, using the [Next.js App Router](https://nextjs.org/docs/app) and [Supabase](https://supabase.com/). We dive deep on the Next.js App Router, learning about: + +- Client Components +- Server Components +- Route Handlers +- Server Actions +- Middleware +- Implementing Optimistic UI + +On the Supabase side we look at: + +- Configuring Supabase Auth to use cookies +- Using Row Level Security (RLS) policies to implement Authorization +- Querying data across multiple tables +- Introspecting PostgreSQL schema to generate TypeScript definitions with the Supabase CLI +- Subscribing to realtime database changes + +This course is a deep dive into modern web development and I'm very excited to see what you're going to build on the other side! 🚀 ## 🎓 Instructor @@ -20,15 +37,15 @@ Follow Jon Meyers on [Twitter](https://twitter.com/jonmeyers_io) and subscribe t ## 🗺 Table of Contents -01. [Start a new Supabase project](/01-start-a-new-supabase-project/README.md) -02. [Create a Next.js app with the create-next-app CLI](/02-create-a-next.js-app-with-the-create-next-app-cli/README.md) -03. [Query Supabase data from Next.js Server Components](/03-query-supabase-data-from-next.js-server-components/README.md) -04. [Create an OAuth app with GitHub](/04-create-an-oauth-app-with-github/README.md) -05. [Authenticate users with GitHub OAuth using Supabase and Next.js Client Components](/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/README.md) -06. [Refresh session cookie for Next.js Server Components with Middleware](/06-refresh-session-cookie-for-next.js-server-components-with-middleware/README.md) -07. [Restrict access to authenticated users with RLS policies](/07-restrict-access-to-authenticated-users-with-rls-policies/README.md) -08. [Dynamically render UI based on user session with SSR in Next.js Client Components](/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/README.md) -09. [Implement Protected Routes for authenticated users with Supabase Auth](/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/README.md) +1. [Start a new Supabase project](/01-start-a-new-supabase-project/README.md) +2. [Create a Next.js app with the create-next-app CLI](/02-create-a-next.js-app-with-the-create-next-app-cli/README.md) +3. [Query Supabase data from Next.js Server Components](/03-query-supabase-data-from-next.js-server-components/README.md) +4. [Create an OAuth app with GitHub](/04-create-an-oauth-app-with-github/README.md) +5. [Authenticate users with GitHub OAuth using Supabase and Next.js Client Components](/05-authenticate-users-with-github-oauth-using-supabase-and-next.js-client-components/README.md) +6. [Refresh session cookie for Next.js Server Components with Middleware](/06-refresh-session-cookie-for-next.js-server-components-with-middleware/README.md) +7. [Restrict access to authenticated users with RLS policies](/07-restrict-access-to-authenticated-users-with-rls-policies/README.md) +8. [Dynamically render UI based on user session with SSR in Next.js Client Components](/08-dynamically-render-ui-based-on-user-session-with-ssr-in-next.js-client-components/README.md) +9. [Implement Protected Routes for authenticated users with Supabase Auth](/09-implement-protected-routes-for-authenticated-users-with-supabase-auth/README.md) 10. [Generate TypeScript definitions from PostgreSQL schema with Supabase CLI](/10-generate-typescript-definitions-from-postgresql-schema-with-supabase-cli/README.md) 11. [Setup a Foreign Key relationship between PostgreSQL tables](/11-setup-a-foreign-key-relationship-between-postgresql-tables/README.md) 12. [Automatically generate a profile for every user with PostgreSQL Function Triggers](/12-automatically-generate-a-profile-for-every-user-with-postgresql-function-triggers/README.md) @@ -39,4 +56,4 @@ Follow Jon Meyers on [Twitter](https://twitter.com/jonmeyers_io) and subscribe t 17. [Implement Optimistic UI with the Next.js useTransition hook](/17-implement-optimistic-ui-with-the-next.js-usetransition-hook/README.md) 18. [Dynamically update UI with Database changes using Supabase Realtime](/18-dynamically-update-ui-with-database-changes-using-supabase-realtime/README.md) 19. [Style a Twitter clone with Tailwind CSS](/19-style-a-twitter-clone-with-tailwind-css/README.md) -20. [Deploy Next.js App Router project to production with Vercel](/20-deploy-next.js-app-router-project-to-production-with-vercel/README.md) \ No newline at end of file +20. [Deploy Next.js App Router project to production with Vercel](/20-deploy-next.js-app-router-project-to-production-with-vercel/README.md)