Учебный проект: "Shelter"

1. Описание

Проект выполнен в рамках курса «JavaScript/Front-end» от RS School. Задачей стояло создание по макету в Figma двухстраничного отзывчиво-адаптивного интерактивного сайта. В личном репозитории не сохранена вся история разработки, поскольку проект изначально выполнялся в приватном репозитории школы

Ссылка на задание: https://github.com/rolling-scopes-school/tasks/blob/master/tasks/shelter/shelter.md

Ссылка на деплой: https://elrouss.github.io/shelter/shelter/pages/main/index.html

Ссылка на макет: https://www.figma.com/file/Yk6EnbY63FyG2PJTFkJDMh/shelter

2. Стех технологий

3. Установка и запуск приложения в локальном репозитории

1. https://github.com/elrouss/shelter.git - клонировать репозиторий (HTTPS) на свое устройство

4. Процесс создания

Работа разделена на 3 этапа (каждый оценивался однокурсниками в ходе cross-review):

1. Фиксированная верстка по макету двух страниц на разрешение экрана 1280px и выше
2. Отзывчиво-адаптивная верстка на компьютер, планшет и телефон (брейкпоинты: 1280px, 1024px, 768px, 480px, 320px)
3. Интерактивные элементы

5. Функционал

• Двухстраничная отзывчиво-адаптивная верстка
• Карусель с рандомной генерацией карточек
• Слайдер с рандомной генерацией карточек и пагинацией
• Открытие модальных окон по клику на карточки с возможностью закрытия по крестику, оверлею и клавише Escape
• Открытие и закрытие гамбургер-меню

6. Статус проекта

• Доработать рандомную генерацию карточек в карусели при прокрутке пользователем
• Фиксировать определенное количество карточек в слайдере для каждого из разрешений экрана (на данном этапе - выполнено только для десктопа)
• Рефакторинг и оптимизация программного кода