🔥 Наши интенсивы и мастер-классы — без воды, только практика: РФ -
Мир -
❤️ Отзывы тут -
🦋 Наш ТГ канал -
Поддержи видео лайком, 2500 лайков 👍 и я делаю новый большой проект! 🖥 RED Planner бесплатный исходник -
🧪 Также есть версия папка проекта + схема insomnia + дизайн + базовый сетап для практики (доступно по подписке) -
Представляем вам разработанный нами сайт для планирования. В этом ролике мы создадим full-stack приложение Red Planner на популярном фреймворке React. Мы начнем с создания фронтенда, а затемку перейдем к созданию бэкенда с использованием фреймворка Nest и проект будет типизирован с использованием TypeScript (TS). Ещё в проекте будет использоваться такие технологии как prisma, horizon ui, axios, nextjs 14, express и тд. Приложение Trello 2.0 будет иметь все основные функции оригинального Trello, такие как создание, редактирование и удаление карточек, таймер, канбан, перетаскивание карточек между колонками и тд. Более того мы добавим в приложение тайм блокинг, который дает возможность идеально планировать свое расписание, перетаскивать задачи и многое другое. Приятного просмотра. ⚡️ Список интенсивов по подписке -
☑️ Чеклист "С нуля до Senior front-end" -
VK -
https://vk.com/redgroupchannel 🍥 Тема в редактор/IDE - After Dark / Halcyon. Font - Jetbrains mono 🎹 Клавиатура - NuPhy Halo65 / switch Night Breeze Шрифт -
Если есть какие то вопросы по этой теме - дай знать в 💬 комментариях! 00:00:00 - Начало 00:01:40 - Исходник проекта 00:03:10 - Почему такая система планирования? 00:04:35 - Стэк проекта 00:06:30 - ДЕМО 00:18:50 - Структура БД 00:25:00 - Шрифт/Тема/Иконки 00:25:19 - Разворачиваем бэкэнд 00:30:50 - Ставим важные зависимости 00:33:50 - Базовые настройки проекта 00:35:50 - Insomnia 00:37:50 - Prisma и схема БД 00:54:50 - Настройка back-end 00:59:50 - Первая генерация 01:03:20 - Авторизация 01:11:20 - Детальный разбор ошибок NestJS 01:12:20 - Продолжаем делать авторизацию 01:22:30 - Сервис авторизации 01:35:50 - Серверные куки к запросу 01:37:50 - Контроллер для авторизации 01:43:10 - Тест в Insomnia 01:44:57 - DTO пользователя 01:47:50 - Сервис пользователя 01:53:50 - Контроллер пользователя 01:59:50 - DTO и сервис задачи 02:02:50 - Контроллер для задачи 02:04:20 - Тест в Insomnia 02:06:20 - Подготовка к временным блокам 02:09:45 - Транзакция 02:18:20 - Сервис для таймера 02:22:50 - Контроллер для таймера 02:24:20 - Тест в Insomnia 02:29:20 - Настройка front-end 02:35:50 - Зависимости для фронта 02:38:20 - Базовые важные настройки 02:45:10 - Tailwind конфиг 02:46:50 - Продолжаем важные настройки 02:52:30 - Пишем все типы 02:58:20 - Axios интерсепторы 03:09:10 - Сервисы на фронте 03:11:10 - Форма входа и регистрации 03:18:40 - UI компоненты 03:29:10 - Продолжаем форму 03:33:50 - middleware next 14 03:42:10 - Статистика в кабинете 03:48:10 - Dashboard Layout 04:03:00 - Настройки профиля и таймера 04:13:30 - Страница задач 04:18:30 - DragNDrop задач 04:22:00 - Группировка по дате 04:31:50 - UI для задач 04:43:30 - Хуки для задач 04:45:30 - Debounce 04:53:50 - Продолжаем делать задачи 05:04:30 - Фильтрация задач по колонкам 05:11:30 - Переключатель видов задач 05:17:30 - Канбан вид 05:24:43 - Помодоро Таймер 06:04:00 - Time blocking форма 06:13:40 - DND Time blocking 06:27:10 - Финал 06:28:00 - Итоги ⚡️Закрытый клуб "5 утра" -
💡 Личный ТГ канал -
👇 Полезные видео: Настройка vs code - • Полный курс по настройке Vs Code на 2024 [... Настройка webstorm - • Настройка, которая сделает WebStorm в 10 р... Настройка терминала - • Настройка терминала 2024 [Oh My zsh / Плаг... 👉 Все ссылки (+ настройка редактора) и информация обо мне: РФ -
Мир -
#Nextjs #Nestjs #RedGroup #React #Postgresql #Prisma
