Skip to content

Реализация Web-представления Desktop приложения

License

Notifications You must be signed in to change notification settings

Dvurechensky/RiskStrategyTask

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 

Repository files navigation

RiskStrategyTask

Static Badge

🔮 Тестовое задание компании Стратегия Рийска (Владикавказ)

🎯SCAM вакансия

https://hh.ru/vacancy/83142848?from=share_ios

  • 🚀 Требования системы для запуска:
  1. Visual Studio 2022
  • 🚀 Требования системы для разработки:

для функционирования встроенного Grunt в проекте

  1. Выгрузить папку node_modules из проекта
  2. В PowerShell в корне проекта ввести команду
cmd /c mklink /D node_modules node_modules
  1. Перезапустить проект

✨Требования задания

The text in the "Company Name" column should be a link that opens "Details" for its object

  1. Текст в столбце «Название компании» должен быть ссылкой, которая открывает «Подробности» компании

Use EntityFramework, store data in memory (add a code that creates initial data at application startup)

  1. Используйте EntityFramework, храните данные в памяти (добавьте код, создающий исходные данные в запуск приложения)

Set a fixed width for groups in "Details"

  1. Установите фиксированную ширину для групп в разделе «Подробности».

Use CSS Flex to align groups in "Details", there should be 1 column of groups if browser window is narrow

  1. Используйте CSS Flex для выравнивания групп в разделе "Подробности", должен быть 1 столбец групп, если окно браузера узкое

Use CSS Grid to align items in groups in "Details"

  1. Используйте CSS Grid для выравнивания элементов в группах в разделе «Подробности».

Avoid duplication of CSS and HTML markup code that generates "Details" in C#/markup code (each group should have the same layout for the 'caption', 'toolbar' and 'content' items)

  1. Избегайте дублирования кода разметки CSS и HTML, который генерирует «Подробности» в C#/разметке. код (каждая группа должна иметь одинаковый макет для объектов «заголовка», «панели инструментов» и «контента»)

Implement behavior for 'Refresh' button: reload data from the server and recreate DOM in browser

  1. Реализовать поведение кнопки «Обновить»: перезагрузить данные с сервера и заново создать DOM. в браузере

Adjust the "Employees" group to be nearly twice wider than other groups, keep vertical groups alignment

  1. Отрегулируйте группу "Сотрудники", чтобы она была почти в два раза шире, чем другие группы, сохраняя вертикальность выравнивание групп

Don't render grids on the server side. Instead, render an empty grid and perform a new 'fetch' request when a page is loaded and build grid rows in javascript code, in browser. Implement necessary server side API to load data for grids

  1. Не визуализируйте сетки на стороне сервера. Вместо этого визуализируйте пустую сетку и выполните новую запрос «выборки» при загрузке страницы и построение строк сетки в коде javascript в браузере. Реализовать необходимый API на стороне сервера для загрузки данных для сеток.

🤖 Результат выполнения

👨🏽‍💻 Версия на ПК

💫 Main 💫

💫 Details 💫

👨🏽‍💻 Для заполнения групп создано REST API

👨🏽‍💻 Пример заполненной версии 💫Details💫

👨🏽‍💻 Пример мобильной версии 💫Details💫

💫 870px 💫

💫 500px 💫

👾 Важно отметить

  • В задаче не была описана логика работы кнопок редактирования и поведение кнопки добавления
  • В задаче не затрагивались вопросы ограничения по стеку технологий применяемых для ускорения разработки
  • В задаче нету пунктов о сложности или простоте исполнения, конкретного формата выполнения работы не указано
  • Бонусом в задаче реализована поддержка TypeScript и автоматическая генерация JavaScript и CSS сразу в минимизированный формат
  • Бонусом в задаче сделано API способное принимать пачки данных на обработку