/emoji-hub

Тестовое задание на Angular

Primary LanguageTypeScript

EmojiHub

This project was generated with Angular CLI version 12.2.4.

  • на всех страницах список эмоджи с гитхаба https://api.github.com/emojis
  • список должен быть в актуальном состоянии при каждом обновлении страницы
  • слева блок навигации с тремя пунктами меню
  • активный пункт меню должен быть выделен
  • над списком - заголовок и строка поиска по названию эмоджи
  • таблица должна иметь следующие колонки - имя, ссылка (путь до эмоджи), превью(эмоджи размером 25x25), [*](иконка звездочки), [x](иконка удалить)
  • при наведении на превью эмоджи должна всплывать полноразмераная картинка
  • при нажатии на [*] эмоджи добавляется в список любимых и меняет иконку на более яркую
  • при нажатии на [x] эмоджи удаляется из текущего списка и добавляется в список удаленного
  • при обновлении страницы состояние списков должно сохранятся
  • список удаленных аналогичен основном списку, за исключением наличия действия [восстановить], и отсутвием [*] [x]
  • действие [восстановить] удаляет эмоджи из списка удаленных и добавляет в основной список
  • список любимых аналогичен основном списку, за исключением отсутсия [*]
  • в списке любимых [x] удаляет эмоджи из списка любимых и меняет состояние в основном списке

Отсебятина

  • Вместо [x] и [*] использовал иконки.
  • Добавил кнопку show more
  • Базовая обработка ошибок сервера и спиннер при загрузке данных
  • bootstrap

Технологии

  • Angular 12.2.0
  • bootstrap 5
  • rxjs 6.6.0
  • eslint
  • typescript

Запуск

Run npm start for a dev server. Navigate to http://localhost:4200/.

Gh-pages

https://doyouwannatea.github.io/emoji-hub/