Создай интернет-магазин лыжного снаряжения с нуля
за 14 дней
Практический онлайн-марафон по фронтенд-разработке
31 марта — 13 апреля 2025
До начала марафона осталось:
Что мы создадим за 7 уроков
За время марафона мы полностью разработаем современный адаптивный интернет-магазин для лыжного снаряжения "Ski-people" с реальным функционалом.
- ✓ Современный дизайн с адаптивом под все устройства
- ✓ Каталог товаров с фильтрацией и поиском
- ✓ Детальные страницы товаров со слайдером
- ✓ Функция добавления в избранное
- ✓ Корзина с оформлением заказа
Что вы научитесь делать
Верстка и стили
- ✓ Работать со сборщиком проектов Vite
- ✓ Верстать сайты по макету FIGMA
- ✓ Писать стили используя SCSS
- ✓ Адаптировать сайт под все устройства
JavaScript и взаимодействие
- ✓ Работать с элементами DOM-дерева
- ✓ Отлавливать события пользователя и браузера
- ✓ Применять делегирование событий
- ✓ Использовать шаблонные строки и интерполяцию
- ✓ Применять деструктуризацию
Функционал магазина
- ✓ Создавать удобную структуру проекта
- ✓ Настраивать роутинг и навигацию
- ✓ Генерировать списки и карточки товаров из API
- ✓ Реализовать функционал избранного
- ✓ Создавать корзину с подсчетом стоимости
- ✓ Отправлять заказы на сервер
Ваш наставник на марафоне
Александр Пойлов
Фронтенд-разработчик, 7+ лет опыта
- ✓ Опытный фронтенд-разработчик с 7-летним стажем
- ✓ Успешный фрилансер с более чем 50 выполненными проектами
- ✓ Куратор образовательных программ по фронтенду
- ✓ Эксперт по JavaScript и современным фреймворкам
- ✓ Автор учебных материалов и мастер-классов
Программа марафона
Подготовка рабочего пространства
- Установка node.js и инициализация npm
- Установка sass и normalize.css
- Настройка сборщика Vite
- Разбор макета проекта
- Подготовка файловой структуры
- Вёрстка с использованием методологии БЭМ
Базовая стилизация и адаптив
- Подключение и настройка шрифтов
- Стилизация header и остальных блоков
- Разработка адаптивного дизайна под все устройства
- Работа с медиа-запросами
Слайдер и роутинг
- Реализация слайдера (swiper) для страницы карточки товара
- Реализация роутера (navigo) с рендером
- Настройка переходов между страницами
Рендер карточек товара
- Рендер карточек товара из данных API
- Реализация выбора категории товара в каталоге
- Работа с шаблонными строками и интерполяцией
Избранное
- Запись избранного в localStorage для хранения
- Разработка страницы избранных товаров
- Функционал добавления/удаления из избранного
Поиск и навигация
- Реализация поиска по товарам
- Breadcrumbs (хлебные крошки)
- Пагинация для списков товаров
Корзина и оформление заказа
- Реализация страницы карточки товара
- Реализация корзины с подсчетом стоимости
- Реализация отправки заказа на сервер
Технологии, которые вы освоите
Vite
Современный быстрый сборщик проектов с горячей перезагрузкой
SCSS
Препроцессор CSS с расширенными возможностями
JavaScript ES6+
Современный стандарт JavaScript с мощными возможностями
Navigo
Простой JavaScript роутер для создания SPA
Swiper
Современный слайдер с поддержкой тач-устройств
localStorage
Хранение данных в браузере пользователя
Стань участником марафона
Участие в марафоне
Скидка 65% до 30.03 включительно
До конца акции осталось:
- 7 практических занятий
- 3 живые трансляции с преподавателем
- Проверка домашних заданий
- Закрытый чат поддержки с наставником
- Сертификат о прохождении марафона
Способы оплаты: банковской картой из любой страны
Приятные бонусы для участников
-
Доступ к записям без ограничений
-
Карта развития в профессии в 2025 году
-
Тёплые посиделки на стримах и в закрытом чате
-
Именной сертификат о прохождении марафона (но это не точно :))
Отзывы о наших марафонах
После марафона создала свой первый рабочий проект! Материал подается очень понятно, даже для новичков. Особенно понравилась работа с Navigo и localStorage.
Отличный марафон! За неделю узнал больше практических приемов, чем за месяц самостоятельного изучения. Преподаватель доступно объясняет сложные темы.
Благодаря марафону разобралась с современными подходами к разработке. Теперь чувствую себя увереннее на собеседованиях. Рекомендую всем, кто хочет прокачать практические навыки.
Очень интенсивный и полезный марафон! Понравилось, что мы создали полноценное приложение с нуля до работающего финального проекта. Александр отлично объясняет материал и всегда готов помочь.
Часто задаваемые вопросы
Да, все материалы марафона, включая записи уроков, исходные коды и дополнительные материалы, будут доступны вам после завершения марафона.
Да, на протяжении всего марафона у вас будет доступ к чату поддержки, где вы можете задавать вопросы преподавателю и кураторам. Кроме того, во время трансляций вы сможете задавать вопросы в режиме реального времени.
Вам понадобится компьютер с доступом в интернет, установленный Node.js и любой современный текстовый редактор (рекомендуем VS Code). Все необходимые инструкции по настройке рабочего окружения будут даны на первом уроке.
Да, после успешного завершения марафона вы получите именной сертификат от школы METHED, который можно добавить в ваше портфолио и резюме.