https://github.com/flavvvour/mesto-project

Mesto-project
https://github.com/flavvvour/mesto-project

Last synced: 13 days ago
JSON representation

Mesto-project

• Host: GitHub
• URL: https://github.com/flavvvour/mesto-project
• Owner: flavvvour
• Created: 2024-11-21T13:45:11.000Z (3 months ago)
• Default Branch: main
• Last Pushed: 2024-11-21T14:03:26.000Z (3 months ago)
• Last Synced: 2024-12-02T05:14:51.692Z (2 months ago)
• Language: CSS
• Homepage: https://flavvvour.github.io/mesto-project/
• Size: 703 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# Проектная работа Mesto

**Студент**: Соцков Андрей  

**Стэк**: HTML, CSS, JavaScript

## Описание проекта

**Mesto** — это проект, реализующий функционал динамического списка карточек, которые можно добавлять, редактировать и удалять. Также имеется возможность просматривать изображения карточек в модальном окне. Проект использует чистые HTML, CSS и JavaScript без библиотек или фреймворков.

## Функциональность

1. Все карточки, полученные с сервера, создаются корректно.

2. Корзина удаления присутствует только на карточках, созданных текущим пользователем.

3. В активном состоянии находятся «лайки», которые установлены текущим пользователем.

4. Форма добавления карточки открывается, добавляет карточку.

5. Работает нажатие на кнопку «лайка».

6. Реализовано удаление карточки.

7. Для всех полей ввода в формах включена лайв-валидация.

8. Кнопка отправки формы неактивна, если хотя бы одно из полей не проходит валидацию.

9. Карточку можно добавить из любого текстового поля нажатием Enter.

10. Слушатель событий, который закрывает модальное окно по нажатию на Esc, добавляется при открытии модального окна и удаляется при его закрытии.

## Технологии

- HTML5

- CSS3

- JavaScript (ES6)

- API (using fetch)

- Live form validation

- BEM Nested

## Установка и запуск

1. Клонируйте репозиторий:

    ```bash

    git clone https://github.com/flavvvour/mesto-project.git

    ```

2. Установить **NPM** (_Node Package Manager_) — менеджер пакетов для программной платформы Node.js.

   ```

   npm install имя_пакета

    ```

3. Собрать проект

   ```

   npm build

   ```

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

   ```

   npm run dev

   ```

## Просмотр проекта через GitHub Pages

https://flavvvour.github.io/mesto-project/