Перейти к содержимому

Міні курс по Supabase - платформі, яку я довго шукав. (Next.js App Router)

Maksym Rudnyi

0:00 / 0:00

Міні курс по Supabase - платформі, яку я довго шукав. (Next.js App Router)

5 299 просмотров · 2 года назад
Maksym Rudnyi
13,5 тыс. подписчиков
5 299 просмотров · 2 года назад
Сьогодні огляд та міні курс платформи, яку нещодавно знайшов - Supabase. Supabase is an open source Firebase alternative. В даному курсі розберемось з двома функціями цієї платформи - база даних PostgreSQL та Authentification. Зручна робота з базою даних і стали основною причиною чому ця платформа мені сподобалась та стала корисною. Код будемо писати на Next.js (App Router, React Server Components, Server actions). В сьогоднішньому відео також хочу порекомендувати крутого спеціаліста з веб розробки, автора YouTube каналу "programming mentor ua" ‪@programmingmentorua‬ та Telegram каналу https://t.me/programmingmentor - В’ячеслава Колдовського. В’ячеслав Колдовський - розробник, сертифікований Google Cloud Architect, інструктор і ментор починав кар’єру в IT ще в 1990-х і за 20+ років встиг попрацювати з купою технологій і мов програмування. 00:00 Supabase intro 02:20 План курсу 04:58 Колаборація з Programming Mentor UA 08:01 Ціна Supabase - Free 10:00 Клієнтські бібліотеки Supabase (JS) 11:27 Supabase CLI 12:28 Про автора 13:25 Реєстрація в Supabase 15:00 Огляд інтерфейсу 16:19 Створюємо першу таблицю 18:54 Створюємо Next.js проєкт 22:56 Отримання даних з Supabase 25:23 Додавання Policies для отримання даних 27:42 Опис Schema 29:13 Авторизація через GitHub 32:44 Auth кнопки авторизації 37:29 Auth callback endpoint 44:51 Next.js middleware 47:40 Додавання автора до коментарів 49:27 Додаємо user_id в таблицю коментарів 52:39 Візуалізація бази даних 53:37 Зміна Policy лише для авторизованих 57:33 Створюємо Profiles таблицю 59:20 Створюємо Postres Functions 01:02:15 Створюємо тригер 01:04:37 Змінюємо foreign key для таблиці коментарів 01:10:11 Робота з сесією 01:10:46 Динамічне показання Auth кнопки 01:13:22 Auth кнопка Server Component 01:17:27 Insert into. Додавання коментарів 01:18:11 Server actions 01:27:57 Сортування коментарів 01:28:56 TypeScript генерація типів 01:36:24 Оновлюємо TypeScript конфіг 01:36:58 Глобальні типи TypeScript 01:41:27 Table alias 01:43:25 Кнопка Видалення 01:48:48 Локальна база даних та міграція Стати спонсором каналу:    / @maksymrudnyi   Буду вдячний за підтримку каналу: Patreon -   / rudnyi   BuyMeACoffee - https://www.buymeacoffee.com/maksymru... Mono Bank - https://send.monobank.ua/jar/6oqhydjLGp або так - 5375 4114 0505 7287 Приват банк - 4627 0551 1331 6110 Давайте дружити: Telegram ↣ https://t.me/maksymrudnyi Telegram чат ↣ https://t.me/joinchat/H4AF4W4dfGeGepNQ INSTAGRAM ↣   / maksym_rudnyi   TWITTER ↣   / maksymrudnyi   FACEBOOK ↣   / travelscode   WEB-SITE ↣ https://travelscode.com/ GITHUB ↣ https://github.com/MaksymRudnyi/ Другий YouTube канал ↣    / travelscode   #Supabase #NextJS #React #JavaScript