https://github.com/itmtm/form_get_swap
https://github.com/itmtm/form_get_swap
html5 http javascript scss
Last synced: 7 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/itmtm/form_get_swap
- Owner: ITmTm
- Created: 2024-01-31T17:23:05.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-02-04T19:35:47.000Z (about 2 years ago)
- Last Synced: 2025-01-12T17:30:38.096Z (about 1 year ago)
- Topics: html5, http, javascript, scss
- Language: JavaScript
- Homepage:
- Size: 937 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Тестовое задание на должность frontend-разработчика.
В тестовом задании представлены обязательные и дополнительные пункты. Чтобы тестовое задание считалось выполненным, необходимо реализовать обязательные пункты. Дополнительные пункты можно делать по желанию в любом количестве, их выполнение будет говорить о вашем профессиональном уровне. В соответствии со сложностью выполнения заданий нами будут оценены ваши компетенции и выдвинуто соответствующее зарплатное предложение.
Необходимо на чистом javascript’e реализовать небольшое приложение, которое выводит данные в таблицу, полученных через API. Вы можете использовать любой доступный API (например https://swapi.dev/).
Обязательные пункты (уровень 1):
· Приложение написано без использования вспомогательных библиотек и фреймворков.
· Присутствует минимальная верстка – дизайн также остается на ваше усмотрение.
· Реализовать кнопку, которая при нажатии отправляет запрос на получение данных с сервера.
· При успешном выполнении запроса вывести данные в таблицу 5х10 (без учета заголовков). Какие данные выводить – на ваше усмотрение.
· Реализовать кнопку очистки таблицы. При нажатии на нее, все данные из таблицы должны очиститься до нового запроса.
· До отправки запроса и при полной очистке таблицы выводить заглушку / подсказку об отсутствии загруженных данных.
Дополнительные пункты (уровень 2):
· Код написан с использованием возможностей es6+
· Реализовать прокрутку таблицы - закрепить шапку и ограничить высоту.
· Каждую запись таблицы можно удалить отдельно.
· Реализовать сортировку по клику на заголовок столбца (например, по алфавиту).
· Реализовать прелоадер загрузки данных.
· Реализовать механизм сохранения – перезагрузка не должна терять текущие данные таблицы.
Дополнительные пункты (уровень 3):
· Реализовать пагинацию. Для удобства можно выводить больше данных. Важно, чтобы пагинация осуществлялась в рамках одной страницы (без изменения URL’a).
