developments.md

Описание

На этой странице описаны этапы разработки и работы, которые реализованы в проекте, какие инструменты и методы использованы.

Также в директории structures расположены реализованные схемы проекта.

Webpack

• Подключен webpack. Настроен tsconfig.json
• Настроен webpack-dev-server. Настроены переменные окружения для сборки
• Настроен webpack для scss.
• Подключены плагины:
  • ProgressPlugin - позволяет настроить отображение прогресса во время компиляции.
  • HTMLWebpackPlugin - упрощает создание HTML-файлов для обслуживания webpack. Это особенно полезно для webpack, которые включают в имя файла хеш, который меняется при каждой компиляции.
  • MiniCssExtractPlugin - Этот плагин извлекает CSS в отдельные файлы. Он создает файл CSS для каждого файла JS, который содержит CSS.
  • CopyWebpackPlugin - Копирует отдельные файлы или целые каталоги в каталог сборки.
• настроен ts-loader для интеграции TS с Webpack
• настроен sass-loader для компиляции scss в css
• настроены alias
• настроен babel/present-env для перевода js для поддержки браузеров

Eslint и Prettier

• настроен eslint с надстройкой arbnb-ts.
• настроен prettier для соблюдения code style

HTML и CSS

• Реализованы два базовых шаблона для дальнейшей работы
• Добавлены scss стили для соответствующих страниц. Реализован миксин для работы с кнопками

JS

• Добавлен метод рендеринга на страницу
• Добавлены методы добавления и удаления слушателей событий
• Добавлен класс dom - аналог JQuery
• Реализован шаблон таблицы
• Реализовано динамическое изменение ширины столбцов и высоты строк
• Добавлена навигация по ячейкам таблицы при помощи клавиатуры и мыши
• Реализован класс Observer для интерактивности таблицы
• Реализовано двухстороннее связывание между ячейками и компонентом Formula

Store

• Реализован аналог Redux для работы с данными
• Создана имитация сохранения данных и размеров ячеек при помощи localStorage
• Реализовано добавление стилей для ячеек в соответствии с тулбаром
• Реализовано изменение заголовка таблицы
• Реализован debounce для оптимизации

Routing

• Реализован роутинг приложения:
  • Создание новых таблиц с добавлением query-params
  • Переход на существующие таблицы
  • Выход в главное меню
  • Удаление таблицы

TSDoc

• Задокументированы все методы и функции проекта