ia-stepanov / book-app

Проект «Book App» — это полноценное Single-Page Application (SPA) на JavaScript, представляющее собой библиотеку книг, использующую API от OpenLibrary. Stack: HTML5, CSS3, Flexbox, UX, БЭМ, Figma, JavaScript, Промисы (Promise) и Rest API, Single-Page Application (SPA), Rollup.

Библиотека книг

Учебный проект из курса JavaScript Advanced - продвинутые концепции языка и ООП

Автор курса: Антон Ларичев

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

Book App — это полноценное Single-Page Application (SPA) на JavaScript, представляющее собой библиотеку книг, использующую API от OpenLibrary. В этом приложении пользователи могут осуществлять поиск книг, добавлять их в избранное, а также просматривать детальную информацию о каждой книге.

Функционал:

• Поиск книг и отображение результатов поиска;
• Добавление книг в избранное и просмотр списка избранных книг;
• Подробная информация о каждой книге, включая теги и обложку;
• Реактивное обновление интерфейса при изменении данных;
• Single-Page Application с динамической загрузкой контента.

Стек технологий:

• HTML5;
• CSS3:
  • Flexbox;
  • User eXperience (UX);
• Методология БЭМ;
• Вёрстка по макету в Figma;
• JavaScript (чистый JS, без использования фреймворков):
  • Стиль CamelCase;
  • Установка и настройка библиотек;
  • Промисы (Promise) и Rest API;
  • Асинхронность и оптимизация;
  • Single-Page Application (SPA);
• Rollup — сборщик проекта.

Важные моменты:

• Приложение основано на компонентной структуре;
• Вьюшки реализованы на классах и наследовании;
• Автоматического обновления интерфейса при изменении данных.

Установка и запуск проекта:

Клонировать репозиторий:

git clone https://github.com/ia-stepanov/book-app.git

Установить зависимости:

npm install

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

• Live Server

API для работы сервером:

https://openlibrary.org/developers/api

Языки:

• JavaScript

Библиотеки:

• on-change — отслеживает изменения в объектах и массивах, автоматически вызывая заданную функцию при любых изменениях в наблюдаемых данных;
• Marked — это JavaScript-библиотека, которая позволяет преобразовывать Markdown в HTML.

Макет в Figma:

• Макет BookApp

Скриншоты:

Развернуть

Ссылка на сайт:

https://ia-stepanov.github.io/book-app/