udemy
Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.
Продолжительность
13 ч 41 мин
Категория
Next.jsКоличество уроков
145 Видео
Дата добавления
19 янв. 2024 г., 23:01
Язык
Английский
Дата выхода
1 янв. 2024 г., 01:00
Дата обновления
29 апр. 2026 г., 19:47
Освойте современные инструменты веб‑разработки и создайте реальное приложение с нуля, комбинируя мощь Next.js 14, TailwindCSS, OpenAI API и других передовых технологий. Этот расширенный курс поможет вам уверенно перейти от базовых концепций к созданию полноценных, быстрых и масштабируемых приложений.
Что делает этот курс уникальным
Курс сочетает в себе практику и глубокое понимание ключевых технологий, с которыми работает современный frontend и full‑stack разработчик. Каждая тема подается последовательно, с упором на реальные задачи и применение инструментов в продакшн‑ориентированной среде.
Основные направления обучения
1. Знакомство с Next.js 14
Вы начнете с полного разбора структуры Next.js‑проекта и понимания ключевых принципов работы фреймворка.
- Создание нового приложения и настройка среды
- Разбор папок, маршрутизации и файловой структуры
- Работа со встроенными инструментами и оптимизация разработки
2. Маршрутизация и компоненты
Курс детально объясняет работу маршрутов и их влияние на архитектуру приложения.
- Использование компонентов ссылок
- Динамические и вложенные маршруты
- Создание гибких структур страниц
3. Frontend с TailwindCSS и DaisyUI
Вы научитесь создавать современные, отзывчивые и адаптивные интерфейсы максимально быстро.
- Быстрая стилизация компонентов
- Управление темами и темизация всего приложения
- Построение UI через layout‑компоненты
4. Работа с серверными и клиентскими компонентами
Курс подробно раскрывает философию разделения логики между сервером и клиентом в Next.js.
- Запрос данных в серверных компонентах
- Обработка ошибок, состояний загрузки и нестандартных ситуаций
- Реализация вложенных layout‑структур
5. Реализация CRUD и Server Actions
Вы освоите создание функциональных форм и взаимодействие с бэкендом без ручной настройки API‑маршрутов.
- Создание и редактирование данных
- Валидация с использованием Zod
- Работа с пользовательскими событиями
6. Интеграция базы данных и аутентификация
Курс учит внедрять реальные сервисы хранения и безопасности.
- Развертывание базы данных в Planetscale
- Настройка аутентификации через CLERK
- Организация безопасного доступа к данным
7. Работа с OpenAI, Unsplash и внешними API
Вы научитесь использовать внешние API для расширения функциональности вашего проекта.
- Отправка запросов к OpenAI и обработка ответов
- Генерация изображений прямо в приложении
- Интеграция API Unsplash для медиа‑контента
8. Деплой и оптимизация на Vercel
В финале курса вы развернете полноценное приложение и изучите лучшие практики публикации.
- Подготовка проекта к деплою
- Оптимизация производительности
- Настройка доменов, переменных окружения и тем
Практический подход к обучению
Каждый модуль содержит практические задания, которые помогут закрепить знания и сразу применить их в реальных сценариях. Вы не просто изучаете теорию — вы создаете полноценный проект шаг за шагом.
Для кого подходит этот курс
- Новичкам, которые хотят уверенно войти в мир веб‑разработки
- Frontend‑разработчикам, желающим освоить Next.js
- Full‑stack разработчикам, стремящимся работать с современными инструментами
- Тем, кто хочет интегрировать OpenAI в свои приложения
Итог
После прохождения курса вы сможете создавать быстрые, масштабируемые и функциональные веб‑приложения, используя лучшие технологии 2024 года. Этот курс станет надежным фундаментом для вашей дальнейшей карьеры в разработке.
Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум
- Урок 1. 00:01:08Introduction to Next.js
- Урок 2. 00:02:00Tutorial Overview
- Урок 3. 00:01:59Create New Next.js App
- Урок 4. 00:01:47Files and Folder Structure
- Урок 5. 00:04:35Home Page
- Урок 6. 00:01:52More Pages
- Урок 7. 00:02:02Link Component
- Урок 8. 00:01:53Nested Routes
- Урок 9. 00:03:09First Challenge
- Урок 10. 00:02:31CSS
- Урок 11. 00:09:32TailwindCSS
- Урок 12. 00:09:49DaisyUI
- Урок 13. 00:04:05Layout File
- Урок 14. 00:09:38Navbar Challenge
- Урок 15. 00:02:08Server Component VS Client Component
- Урок 16. 00:07:38Counter Challenge
- Урок 17. 00:04:32Fetch Data
- Урок 18. 00:03:59Loading Component
- Урок 19. 00:05:00Error Component
- Урок 20. 00:03:09Nested Layouts
- Урок 21. 00:03:20Dynamic Routes
- Урок 22. 00:05:08Drinks List - Challenge
- Урок 23. 00:06:17Single Drink - Challenge
- Урок 24. 00:05:16Static Images
- Урок 25. 00:05:52Remote Images
- Урок 26. 00:04:32Responsive Images
- Урок 27. 00:06:20More Routing
- Урок 28. 00:05:39Prisma Setup
- Урок 29. 00:04:38Prisma Model
- Урок 30. 00:09:32Prisma CRUD
- Урок 31. 00:10:44Display Tasks - Challenge
- Урок 32. 00:02:14Server Actions - Info
- Урок 33. 00:08:15First Server Action
- Урок 34. 00:03:13Refactor App
- Урок 35. 00:05:10Delete Task
- Урок 36. 00:04:51Edit Task - Setup
- Урок 37. 00:09:40Edit Task - Complete
- Урок 38. 00:05:41Pending State
- Урок 39. 00:05:38Error Checking
- Урок 40. 00:02:57Zod Library
- Урок 41. 00:05:42Providers
- Урок 42. 00:03:29Delete Button - Challenge
- Урок 43. 00:02:35Route Handlers - Info
- Урок 44. 00:06:04Route Handlers - GET
- Урок 45. 00:04:27Route Handlers - POST
- Урок 46. 00:05:24Middleware
- Урок 47. 00:02:19Render (optional)
- Урок 48. 00:05:47PlanetScale
- Урок 49. 00:06:25Local Build
- Урок 50. 00:05:08Force Dynamic
- Урок 51. 00:06:25Deploy
- Урок 52. 00:03:31Intro
- Урок 53. 00:01:34New App
- Урок 54. 00:02:18Libraries
- Урок 55. 00:04:14First Pages
- Урок 56. 00:05:09Home Page
- Урок 57. 00:11:01Clerk Setup
- Урок 58. 00:07:16Custom Auth Pages
- Урок 59. 00:01:57React Icons
- Урок 60. 00:08:41Dashboard Layout
- Урок 61. 00:04:31Sidebar
- Урок 62. 00:02:57Sidebar Header
- Урок 63. 00:03:26Nav Links
- Урок 64. 00:04:26Member Profile
- Урок 65. 00:08:04Theme Toggle
- Урок 66. 00:00:54Boilerplate Overview
- Урок 67. 00:01:24User Profile
- Урок 68. 00:02:57React Hot Toast Library
- Урок 69. 00:09:17Chat Structure
- Урок 70. 00:06:27React Query - Info
- Урок 71. 00:09:16React Query - Setup
- Урок 72. 00:03:59OpenAI - Pricing
- Урок 73. 00:06:57OpenAI - Playground
- Урок 74. 00:03:21OpenAI - Docs
- Урок 75. 00:06:26First Prompt
- Урок 76. 00:09:00Context
- Урок 77. 00:07:33Display Messages
- Урок 78. 00:02:05New Tour - Setup
- Урок 79. 00:06:19New Tour - Form
- Урок 80. 00:07:44New Tour - React Query
- Урок 81. 00:05:47Tour Prompt
- Урок 82. 00:05:06Generate Tour Response
- Урок 83. 00:02:18Tour Info
- Урок 84. 00:02:34PlanetScale
- Урок 85. 00:04:23Tour Model
- Урок 86. 00:06:54Save Tour
- Урок 87. 00:02:25Timeout Info
- Урок 88. 00:03:13GetAllTours Function
- Урок 89. 00:03:04Tours Page - Setup
- Урок 90. 00:07:15Tours List
- Урок 91. 00:06:48Search Functionality
- Урок 92. 00:05:15Single Tour Page
- Урок 93. 00:08:39Generate Image
- Урок 94. 00:04:38Unsplash API
- Урок 95. 00:02:50Custom Pages - Bug/Fix
- Урок 96. 00:02:46Tokens - Intro
- Урок 97. 00:02:36Max Tokens
- Урок 98. 00:10:12Token Actions
- Урок 99. 00:05:33Display Tokens
- Урок 100. 00:06:58Tours Logic
- Урок 101. 00:04:44Chat Logic
- Урок 102. 00:04:27Deploy
- Урок 103. 00:05:03Intro
- Урок 104. 00:03:41Setup
- Урок 105. 00:11:34Shadcn-ui
- Урок 106. 00:07:22Shadcn-ui API
- Урок 107. 00:10:34Layout and Homepage
- Урок 108. 00:04:14Create Pages
- Урок 109. 00:03:27Clerk Auth
- Урок 110. 00:04:49Nav Links
- Урок 111. 00:09:19Dashboard Layout
- Урок 112. 00:05:58Sidebar
- Урок 113. 00:03:41Navbar
- Урок 114. 00:07:31Dropdown Links
- Урок 115. 00:03:29Change Theme
- Урок 116. 00:08:16Toggle Theme
- Урок 117. 00:11:15Shadcn-ui Forms
- Урок 118. 00:07:10Types
- Урок 119. 00:12:07Custom Form Components
- Урок 120. 00:10:36CreateJobForm Continued
- Урок 121. 00:06:27Render and Prisma
- Урок 122. 00:11:57CreateJobAction
- Урок 123. 00:01:38Toast Component
- Урок 124. 00:04:33React Query - Setup
- Урок 125. 00:09:05CreateJobForm - Complete
- Урок 126. 00:06:16GetAllJobsAction - Overview
- Урок 127. 00:08:03GetAllJobsAction
- Урок 128. 00:06:52Jobs Page - Setup
- Урок 129. 00:08:17SearchForm Component - Setup
- Урок 130. 00:07:05SearchForm Component - Functionality
- Урок 131. 00:07:51JobsList Component
- Урок 132. 00:01:59Additional Shadcn-UI Components
- Урок 133. 00:05:30JobCard Component
- Урок 134. 00:05:14JobInfo Component
- Урок 135. 00:06:00Delete Job
- Урок 136. 00:05:58Single Job Page
- Урок 137. 00:07:36EditJobForm Component
- Урок 138. 00:10:19Seed Database
- Урок 139. 00:07:05Stats Action
- Урок 140. 00:06:18Charts Actions
- Урок 141. 00:06:36Stats Container
- Урок 142. 00:05:49Loading Skeleton
- Урок 143. 00:03:36Charts Container
- Урок 144. 00:15:20Button Component
- Урок 145. 00:13:34Complex Button Component
Автор - udemy
Комментарии