Не відставай! Підвищіть свою цінність як веб-розробника вже сьогодні, дізнавшись, як інтегрувати ШІ у свої проекти!Ласкаво просимо в захоплюючий світ додатків Next JS наступного покоління на базі штучного інтелекту!
У цьому курсі ми створимо вигаданий продукт Software-as-a-Service (SAAS) під назвою "BlogStandard". Ми створимо "BlogStandard", використовуючи комбінацію Next.JS, GPT OpenAI, MongoDB, Auth0, Stripe та Tailwind CSS. BlogStandard дозволяє користувачам створювати обліковий запис (обробляється auth0), купувати маркери (обробляється Stripe) і витрачати ці маркери на створення публікацій у блогах за допомогою GPT API OpenAI. Маркери користувача та створені дописи в блозі зберігатимуться за допомогою MongoDB.
У цьому всеосяжному онлайн-курсі ви дізнаєтесь, як використовувати потужність цих передових технологій для створення швидкого, чуйного та динамічного веб-додатка, який генерує високоякісні публікації в блогах за допомогою ШІ. Завдяки покроковим інструкціям ви отримаєте практичний досвід роботи з кожною з цих технологій, щоб втілити своє бачення в життя.
По-перше, ми зануримось у Next.js, популярний фреймворк для створення веб-додатків. Ви дізнаєтесь, як створювати швидкі та чуйні сторінки, керувати маршрутизацією та інтегрувати API для створення потужного та динамічного веб-додатка.
Далі ми розглянемо OpenAI GPT, сучасну модель генерації мови, і дізнаємось, як використовувати її для створення високоякісних публікацій у блогах. Ви також дізнаєтесь, як інтегрувати MongoDB, масштабовану та гнучку базу даних NoSQL, для зберігання та управління даними для нашого додатка.
Крім того, ви дізнаєтесь, як використовувати Auth0, потужну платформу управління ідентифікацією, для автентифікації та авторизації користувачів, а також Stripe, провідну платіжну систему, для обробки транзакцій та обробки платежів. Нарешті, ви дізнаєтеся, як використовувати Tailwind CSS, сучасну структуру CSS, для стилізації та дизайну вашого додатка, втілюючи своє бачення в життя.
До кінця цього курсу ви матимете навички та знання, необхідні для створення власного додатка на основі ШІ та розкриття всього потенціалу ШІ у ваших проектах веб-розробки. І так, чого ж ти чекаєш? Приєднуйтесь і почніть свою подорож у захоплюючий світ додатків Next JS на базі штучного інтелекту!
Для кого цей курс:
- Розробники React, які хочуть підвищити свою цінність як розробника, навчившись створювати продукти SAAS і почавши використовувати можливості ШІ.
Чого ви навчитеся
- Створюйте власні продукти SAAS на базі ШІ та Next JS
- Використовуйте GPT OpenAI для реалізації вмісту, створеного ШІ, у ваших програмах.
- Аутентифікуйте свої програми Next JS за допомогою Auth0
- Стилізуйте свої програми Next JS за допомогою Tailwind CSS
- Зберігайте дані для ваших додатків Next JS за допомогою MongoDB
- Стягуйте плату з клієнтів, використовуючи смугу
- Потрібно базове розуміння React - все інше включено!
8 розділів
39 лекцій
Загальна тривалість 4 год 52 хв
Введення та налаштування проекту
39 лекцій
Загальна тривалість 4 год 52 хв
Введення та налаштування проекту
- Важливо! Прочитайте це перед початком курсу! - 00:47
- Вступ до курсу та демонстрація проекту-03:24
- Налаштування проекту-04: 13
- Удемі рейтинги та огляди-00: 38
- Налаштуйте всі необхідні маршрути для нашого застосування-05:28
- Налаштуйте auth0 для автентифікації-07:48
- Встановіть стан автентифікації та інформацію про користувача, якщо ви ввійшли в систему-09:25
- Реалізуйте захищені маршрути, які доступні тільки при вході в систему-04: 21
- Створіть базовий компонент AppLayout-05: 31
- Реалізація бічної панелі та стилю за допомогою Tailwind CSS-09: 31
- Реалізація нижнього колонтитула бічної панелі-05: 09
- Створіть заголовок бічної панелі та розгорніть AppLayout для всіх відповідних сторінок-08:28
- Створіть компонент логотипу програми за допомогою Google Fonts і FontAwesome-08: 43
- Створіть домашню сторінку/головну цільову сторінку та завершіть заголовок бічної панелі-07:56
- Налаштування нашого проекту для роботи з GPT-11:02
- Уточніть запрошення OpenAI та візуалізуйте результати-09:09
- Передати тему і ключові слова в кінцеву точку API generatePost-07: 53
- Налаштувати MongoDB-04: 53
- Реалізувати функціональність додавання токенів і зберігати їх в MongoDB - 10:27
- Збережіть згенеровані дані поста в MongoDB-10:00
- Завантажити дані поста для конкретної сторінки поста-07: 54
- Автоматичний перехід до повідомлення після його створення-06: 01
- Візуалізувати вміст поста для конкретної сторінки поста-11:45
- Відображати список доступних постів на бічній панелі-15: 17
- Налаштувати смугу-12:41
- Реалізувати чергуються веб-хуки-14:50
- Fix Font Awesome блимає масивним значком при завантаженні у виробництві-01:42
- Оновлення стилів і значок завантаження-09: 26
- Перевірка даних форми при створенні нових повідомлень-08: 21
- Створити контекст повідомлень і отримати перші 5 повідомлень-11: 49
- Створити кінцеву точку getPosts-12: 23
- Приховати кнопку "Завантажити більше повідомлень" і виправити зникаючі повідомлення на бічній панелі-03:51
- Виправити повідомлення на бічній панелі при початковому завантаженні повідомлення-06:41
- Створити кінцеву точку deletePost-04: 33
- Створіть користувальницький інтерфейс видалення повідомлення і викличте кінцеву точку видалення повідомлення-08: 23
- Видалити повідомлення з бічної панелі-03: 42
- Рефакторинг публікує контекст, щоб використовувати редьюсер замість стану-06: 20
- Розгортання в DigitalOcean-11:47
- БОНУС!
https://privatelink.de/?https://www.udemy.com/course/next-js-ai/