Vue + Tailwind CSS | Создание приложения с нуля (Часть 4/5)

Опубликовано: 05 Октябрь 2024
на канале: Игорь Бабко

784

Разработка реального проекта на Vue с использованием Composition API и последующим развертыванием на production.

Telegram - https://t.me/igorbabko_dev

🌐 Финальное приложение: https://ontrack.igorbabko.com

🧪 Репозиторий: https://github.com/igorbabko/ontrack
🧪 Исходные коды для каждого урока: https://github.com/igorbabko/ontrack/...

🪄 Мои настройки VS Code:    • Мои настройки VS Code

🧪 Репозиторий с настройками: https://github.com/igorbabko/vscode-s...

🎨 Тема VS Code: https://marketplace.visualstudio.com/...
🎨 Иконки VS Code: https://marketplace.visualstudio.com/...
✍️ Шрифт: https://philpl.gumroad.com/l/dank-mono

🍿 Весь плейлист:    • Vue Composition API + Tailwind CSS | ...

👀 Другие курсы:
VS Code Продуктивность | Мои Горячие Клавиши:    • VS Code Продуктивность | Мои Горячие ...
Vite - сборщик нового поколения:    • Vite - сборщик нового поколения
Vue Composition API с нуля:    • Vue Composition API с нуля
Кастомная настройка Tailwind CSS:    • Кастомная настройка Tailwind CSS
Tailwind CSS + JIT компилятор:    • Tailwind CSS + JIT компилятор
Лендинг Tesla на Tailwind CSS:    • Лендинг Tesla на Tailwind CSS
Верстка YouTube на Tailwind CSS:    • Tailwind CSS YouTube клон #1 - Шапка
YouTube клон на Vue 3 и Tailwind CSS:    • YouTube клон на Vue 3 и Tailwind CSS
Настройка VS Code:    • Настройка VS Code

#vue #vuejs #vue3 #tailwindcss #tailwind

🕛 Тайм-коды:
00:00 - 85. Универсальная функция для обновления объектов timeline items
08:40 - 86. Универсальная функция для обновления активностей
11:21 - 87. Рефакторинг прокрутки
18:39 - 88. Рефакторинг прокрутки к текущему часу
22:02 - 89. Роутинг с помощью динамического компонента
28:24 - 90. Хук onActivated
33:28 - 91. Базовый компонент иконок
42:05 - 92. Модуль иконок
50:59 - 93. CSS классы иконок
55:59 - 94. Шаблон страницы прогресса
01:01:33 - 95. Компонент ProgressItem
01:10:14 - 96. Заполнение шкалы прогресса
01:18:50 - 97. Цвет шкалы прогресса
01:24:28 - 98. Рефакторинг и исправление багов
01:33:55 - 99. Обновление прогресса времени
01:39:57 - 100. Изолирование глобальных модулей
01:48:24 - 101. Зависимости вычисляемого свойства
01:54:38 - 102. Составные функции (composables)
02:01:27 - 103. Рефакторинг компонента ActivitySecondsToComplete
02:07:46 - 104. Составная функция useStopwatch
02:12:11 - 105. Изолирование составной функции useStopwatch
02:21:24 - 106. Упрощение реализации секундомера
02:31:16 - 107. Пустое состояние страницы прогресса
02:35:13 - 108. Составная функция useTotalProgress
02:49:23 - 109. Улучшения шкалы прогресса
02:56:04 - 110. Индикатор временной шкалы
03:07:53 - 111. Изменение позиции индикатора временной шкалы
03:16:15 - 112. Оптимизация индикатора временной шкалы