Codecourse
Codecourse - предостовляет короткие курсы в основом по php фреймворкам yii, laravel, symfony и пока незначательно затрагивает фронтенд...
Создайте со мной snippets.codecourse.com
Build snippets.codecourse.com with me
★4.8 (всего оценок - 27)
Продолжительность
7 ч 26 мин
Категория
VueКоличество уроков
70 Видео
Дата добавления
26 нояб. 2019 г., 17:44
Язык
Английский
Дата выхода
19 нояб. 2019 г., 17:35
Дата обновления
29 апр. 2026 г., 05:38
Добро пожаловать! В этом курсе мы шаг за шагом разберём, как воссоздать функциональность snippets.codecourse.com с нуля, используя связку Nuxt, Laravel и Tailwind. Вы узнаете, как объединить современные фронтенд‑и бэкенд‑технологии в один мощный, гибкий и элегантный проект.
О чём этот курс
Мы детально пройдём путь создания полноценного приложения для управления сниппетами: от настройки окружения до деплоя. Курс подходит тем, кто хочет углубить навыки разработки на Laravel и Nuxt, улучшить понимание SPA‑архитектуры, а также освоить современные UI‑подходы с Tailwind.
Ключевые технологии
- Nuxt — современный фреймворк на базе Vue для создания быстрых и масштабируемых интерфейсов.
- Laravel — один из самых удобных PHP‑фреймворков для создания API и серверной логики.
- Tailwind CSS — утилитарный CSS‑фреймворк для быстрой и гибкой разработки интерфейсов.
Что вы создадите
В результате вы соберёте веб‑приложение, в котором можно создавать, редактировать и структурировать кодовые сниппеты. Оно будет визуально аккуратным, лёгким, быстрым и полностью функциональным.
Основные функции проекта
- Создание и редактирование сниппетов
- Подсветка синтаксиса
- Поиск и фильтрация
- Авторизация и управление пользователями
- Страница детализации сниппета
Структура курса
Материал разбит на логичные части, чтобы обучение было плавным и последовательным. Каждый модуль содержит практические шаги и понятные объяснения.
Фронтенд на Nuxt
- Инициализация проекта и настройка архитектуры
- Создание страниц и компонентов
- Работа с маршрутизацией и состоянием
- Интеграция с API Laravel
Бэкенд на Laravel
- Настройка API и маршрутов
- Создание моделей и миграций
- Реализация CRUD‑функциональности
- Аутентификация и защита данных
UI с Tailwind
- Создание чистого и удобного интерфейса
- Адаптивная вёрстка
- Использование утилитарных классов для ускорения разработки
Для кого этот курс
Курс будет полезен:
- Разработчикам, которые хотят улучшить навыки работы с Nuxt или Laravel
- Тем, кто хочет изучить современный подход к созданию SPA‑приложений
- Тем, кто желает повторить реальный проект от начала до конца
Итоги
Пройдя курс, вы получите практический опыт создания полноценного веб‑приложения, узнаете лучшие практики разработки и поймёте, как связать Nuxt, Laravel и Tailwind в единую мощную экосистему. Это отличный шаг к более продвинутым проектам и профессиональному росту.
- Урок 1.00:07:47Introduction and demo
- Урок 2.00:07:02Nuxt and Laravel
- Урок 3.00:04:39Tailwind with Nuxt
- Урок 4.00:07:01Base styles with Tailwind
- Урок 5.00:12:42Designing the navigation
- Урок 6.00:04:49The hamburger menu
- Урок 7.00:10:39JWT authentication
- Урок 8.00:05:51Getting authenticated user information
- Урок 9.00:02:08Environment variables
- Урок 10.00:08:29Signing in
- Урок 11.00:03:16Signing out
- Урок 12.00:09:09Designing form components
- Урок 13.00:03:46Really simple form validation
- Урок 14.00:03:03Don't forget about meta
- Урок 15.00:20:05Designing the snippet page
- Урок 16.00:13:44Designing the snippet edit page
- Урок 17.00:03:45Snippets and steps in the database
- Урок 18.00:09:52Creating a snippet
- Урок 19.00:12:51Snippet and steps transformer
- Урок 20.00:03:57Creating a snippet on the client
- Урок 21.00:03:28Editable snippet title
- Урок 22.00:07:05Output and edit ordered steps
- Урок 23.00:05:43Saving the snippet title
- Урок 24.00:04:35Saving step title and body
- Урок 25.00:02:00Updating the edit page title
- Урок 26.00:03:09Navigating steps
- Урок 27.00:07:08Arrow step navigation
- Урок 28.00:08:39Applying everything to the snippet view page
- Урок 29.00:03:58Current step index
- Урок 30.00:02:59Tidying duplicated computed properties
- Урок 31.00:12:24Adding new steps
- Урок 32.00:13:11Ordering newly created steps
- Урок 33.00:01:51Hooking up ordering on the client
- Урок 34.00:10:19Deleting steps
- Урок 35.00:06:14Touching the last saved time
- Урок 36.00:07:46Toggling snippet public status
- Урок 37.00:12:44Reviewing permissions
- Урок 38.00:01:17Hiding the snippet edit button
- Урок 39.00:06:31Keyboard step navigation
- Урок 40.00:05:28Previewing markdown
- Урок 41.00:10:38Syntax highlighting
- Урок 42.00:12:31Implementing a code editor
- Урок 43.00:03:15Code editor tweaks
- Урок 44.00:19:52Browsing all snippets
- Урок 45.00:02:44Endpoint for user snippets
- Урок 46.00:04:17Listing snippets in the dashboard
- Урок 47.00:02:38Deleting snippets
- Урок 48.00:04:59Edit and delete links
- Урок 49.00:01:09Adding some missing page titles
- Урок 50.00:04:59Setting up Laravel Scout and Algolia
- Урок 51.00:02:53Indexing snippets for search
- Урок 52.00:12:24Setting up Algolia Vue InstantSearch
- Урок 53.00:10:16Implementing search
- Урок 54.00:01:09Search tweaks
- Урок 55.00:07:33Faceting search results
- Урок 56.00:02:10Reviewing client middleware
- Урок 57.00:06:38Public user profile endpoints
- Урок 58.00:07:42Public user profile
- Урок 59.00:08:18Patching a user
- Урок 60.00:06:32Account settings page
- Урок 61.00:07:16The home page
- Урок 62.00:01:54Setting the example snippet UUID
- Урок 63.00:06:44The Footer
- Урок 64.00:04:09Creating accounts
- Урок 65.00:05:44Creating an account on the client
- Урок 66.00:00:47Fix - Dashboard snippets count
- Урок 67.00:01:31Fix - Showing snippet visibility
- Урок 68.00:01:07Fix - Clearing password on change
- Урок 69.00:01:05Fix - Clearing validation
- Урок 70.00:02:50Fix - Fixing various links
Автор - Codecourse
Комментарии