movies-explorer-frontend

Ссылка на макет
https://disk.yandex.ru/d/nppcesePgiLuHA

Demo
API
https://khnychkov.nomoredomains.icu/

Интерактивная страница, на которой пользователи могут искать интересный фильмы, добавлять из в избранные, удалять их из своего списка сохраненных.

---

Дипломная работа Яндекс.Практикум, курс 'Веб-разработчик'. Цель проекта:

• закрепить на практике пройденный учебный материал.
  • Добавление регистрации и авторизации пользователя
  • Работа c локальным хранилищем и JWT-токеном
  • Подключение к собственному API серверу

---

Дипломная работа Яндекс.Практикум

На сайте реализовано:

• редактирование имени и e-mail адреса
• добавление и удаление карточки с понравившимся фильмом
• поиск по название
• поиск по фильтру
• закрытие попапа по нажатию на Escape и оверлей;
• все данные хранятся на сервере, использовано собственное API

🔨 Стэк:

• 
• 
• 
  • Flexbox
  • Grid Layout
  • Positioning
  • Adaptive UI
  • Media Queries
• Методология БЭМ
• Фйловая структура Nested БЭМ
• 
  • Стиль CamelCase
  • ООП
  • Асинхронность и оптимизация
  • REST API
• 
• 
  • Create React App
  • Портирование разметки в JSX
  • Функциональные компоненты
  • Хуки

Цель, изучить и закрепить на практике

• React
• Реализация регистрации и авторизации на сторонний бэкэнд
• Личный кабинет пользователя с изменением данных
• Добавление и удаление карточек

---

🔧 Инструкция:

1. Установить Node.js
2. Установить Git
3. Скачайть или склонировать себе командой:

    git clone https://github.com/cactys/movies-explorer-frontend.git

4. Перейти в каталог:

    frontend 'cd ./frontend'

5. Установите зависимости:

    npm i

6. Запустить проект:

    npm run start

---

Учебный проект Яндекс.Практикум х BeatFilm.