WEB-ПРИЛОЖЕНИЕ ДЛЯ ВЕДЕНИЯ АВТОМОБИЛЬНОГО ЖУРНАЛА ТЕХНИЧЕСКОГО ОБСЛУЖИВАНИЯ
Киселёв Д.С., Чернышова А.В.
Донецкий национальный технический университет
Кафедра программной инженерии им. Фельдмана
E-mail:
danik.kis03@mail.ru,
chernyshova.alla@rambler.ru
Аннотация
В статье анализируются существующие аналоги и требования к web-приложению журнала технического обслуживания. Предлагается клиент-серверное приложение, разработанное на языке JavaScript и на Backend-as-a-Service платформе Supabase. Описаны основные функции приложения, его преимущества и области применения. Ключевым аспектом нашего предложения является то, что разрабатываемое web-приложение является не коммерческим решением. Это позволит пользователям сэкономить средства, которые обычно требуются для приобретения подобных программных продуктов.
Annotation
The article analyzes existing analogues and requirements for a web application for a maintenance log. A client-server application developed using JavaScript and the Supabase Backend-as-a-Service platform is proposed. The main functions of the application, its advantages and areas of application are described.
Общая постановка проблемы
В современном мире автомобильный транспорт играет значительную роль в повседневной жизни людей. Автомобиль – это не просто средство передвижения, а сложная техническая система, состоящая из множества узлов и агрегатов, каждый из которых выполняет свою функцию. Со временем, под воздействием различных факторов, таких как износ деталей, вибрации и влияние окружающей среды, рабочие характеристики автомобиля постепенно ухудшаются. Это может привести к поломкам и неисправностям, которые, в свою очередь, могут стать причиной аварий.
Чтобы избежать подобных проблем, необходимо регулярно проводить техническое обслуживание (ТО) и текущий ремонт (ТР) автомобиля. В ходе ТО выполняется комплекс регулировочных и профилактических работ, направленных на поддержание работоспособности всех узлов и агрегатов. В случае необходимости производится замена изношенных деталей. ТР же направлен на устранение уже возникших неисправностей [1].
С течением времени возрастает важность надлежащего технического обслуживания автомобилей, которое обеспечивает их безопасность, надежность и долговечность. Ведение журнала технического обслуживания является неотъемлемой частью этого процесса, позволяя владельцам автомобилей контролировать и отслеживать проведенные работы, регулярные осмотры и замены деталей.
Однако, традиционные методы ведения журнала, основанные на бумажных документах или электронных таблицах, имеют свои ограничения и не всегда обеспечивают эффективное использование информации. Для решения этой проблемы возникает потребность в разработке современного web-приложения, которое бы предоставляло удобный и надежный инструмент для ведения журнала технического обслуживания автомобилей.
Обзор существующих продуктов
Рассмотрим и сравним три аналога программного обеспечения для ведения журнала ТО.
«CarKeeper» – мобильное приложение для планирования технических работ, установки напоминаний и ведения личного «гаража». Плюсами данной системы являются: бесплатное использование, простой интерфейс, возможность ведения журнала ТО для нескольких автомобилей, наличие напоминаний о плановых ТО. Однако есть и ряд минусов: ограниченный набор функций, нет возможности вести учёт расходов, нет возможности анализировать статистику.
Следующим продуктом рассмотрим «Автомобильные расходы» - также представляет собой мобильное приложение для учета всех расходов на автомобиль. Из преимуществ можно выделить: расширенный набор функций, возможность ведения учета расходов, возможность анализировать статистику. Недостатками являются: платная подписка для доступа к полному набору функций, интерфейс может оказаться сложным для некоторых пользователей.
«1C: Управление автотранспортом» - CRM, ERP система, предоставляющая широкий спектр возможностей по учёту заказов, ТО, ведении документации, контролю работы транспорта, анализу и контролю различных видов расходов, планирования, учёта рейсов и так далее. Отличительными чертами являются: профессиональное решение, мощный функционал, возможность интеграции с другими программами 1С. Однако есть и слабые стороны: полностью платное использование, сложный интерфейс, требует установки на компьютер.
Наша система будет иметь особенности, представленные ниже.
- Бесплатное использование: в отличие от «Автомобильные расходы» и «1C: Управление автотранспортом», система будет доступна бесплатно для всех пользователей.
- Простота использования: интерфейс системы будет сделан максимально простым и понятным, чтобы им мог пользоваться любой автовладелец.
- Возможностью анализировать статистику: в отличии от «CarKeeper» пользователям будут предложены инструменты для анализа статистики по ТО, что позволит им лучше понимать расходы на содержание автомобиля и предоставит возможность оптимизировать их.
- Кроссплатформенность: приложение будет доступно на всех системах, имеющих веб-браузер.
Анализ требований
Необходимо, чтобы пользовательский интерфейс был удобным. То есть разработать интуитивно понятный интерфейс, позволяющий пользователям легко освоить приложение без дополнительного обучения. Обязательна четкая навигация и организация элементов интерфейса для быстрого доступа ко всем функциям приложения. Важно учесть поддержку различных устройств и экранов для удобства использования как на компьютерах, так и на мобильных устройствах.
В функциональности приложения необходимо учесть аутентификацию пользователей, создание и управление автомобилей по группам. Каждому автомобилю соответствует один журнал ТО, в котором пользователь сможет добавлять и удалять записи. Приложение должно предоставлять возможность добавления и отслеживания расходов, создания и удаления напоминаний о ТО, хранения и отображения истории технического обслуживания для каждого автомобиля, возможность генерации отчетов и статистики по выполненным работам и заменам деталей.
Для обеспечения безопасности и доступности необходима возможность установки различных уровней доступа и прав пользователей для обеспечения конфиденциальности информации.
Система должна быть масштабируемой и надежной. Следовательно, необходимы гибкая архитектура приложения, позволяющая легкое добавление новых функций и возможностей, высокая производительность и надежность при работе с большим объемом данных и множеством пользователей, возможность обновления и расширения приложения без значительных простоев и потери данных.
Проектирование программы и обоснование выбора средств реализации
На рисунке 1 представлена концептуальная схема данных для разрабатываемой системы. Создание концептуальной модели БД направлено на идентификацию основных понятий (сущностей) предметной области, их признаков (атрибутов) и существующих между ними отношений. Следовательно, явно выделим сущности и соответствующие таблицы для них в рамках данного проекта: пользователи, гаражи, автомобили, расходы, категории расходов, записи ТО, виды работ, плановые ТО, уведомления.
Рисунок 1 – Концептуальная схема данных
Для представления общей архитектуры системы необходимо спроектировать диаграмму компонентов. На рисунке 2 взаимодействия клиента с сервером и сервера с базой данных. Пользовательский интерфейс получает данные с сервера через http запросы. Сервер по предоставляемому интерфейсу от базы данных получает информацию через REST запросы.
Рисунок 2 – Диаграмма компонентов
Главными аспектами при выборе средств реализации является то, что продукт должен быть некоммерческим, с открытым исходным кодом и недорогим в разработке. Исходя из предыдущих соображений оптимальным решением для серверной части станет выбор платформы Backend-as-a-Service (BaaS) представляет собой облачную службу, которая помогает разработчикам веб-приложений и мобильных приложений легко создавать серверную часть (бэкэнд) для своих приложений. По сути, BaaS избавляет разработчиков от необходимости создавать и обслуживать серверную инфраструктуру самостоятельно. В то же время, BaaS является легко-масштабируемы и позволяет удовлетворить растущие потребности приложения.
Одной из таких платформ является Supabase [2]. Supabase создана на основе PostgreSQL, которая является мощной и масштабируемой, более того, отечественной реляционной базой данных. Данная платформа, что немаловажно, обеспечивает высокий уровень безопасности для данных. Она использует современные методы шифрования и контроля доступа для защиты информации: безопасность на уровне строк (RLS), SSL-ограничения, сетевые ограничения, поддерживает двухфакторную аутентификацию (2FA), подтверждения по почте, номеру телефона и другие способы подтверждения регистрации и авторизации. Ещё одним, но не последним преимуществом является функции подписки на изменения в базе данных в реальном времени, что идеально подходит для обновления информации о ТО в режиме реального времени. Supabase использует Realtime WebSockets для реализации подписки на изменения в базе данных. Это означает, что между приложением и сервером Supabase устанавливается постоянное соединение через WebSocket. Самым важным является то, что вызов CRUD-операций (Create, Read, Update, Delete) к базе данных выполняется через предоставляемое RESTful API, ответы которого возвращаются в формате JSON.
Средством реализации клиентского приложения выбран фреймворк Next.js [3], который надстраивается над базовой библиотекой React.js и обеспечивает ряд дополнительных функций и возможностей, упрощающих разработку веб-приложений. В то время как React является библиотекой JavaScript [4] для создания пользовательских интерфейсов, позволяет создавать интерактивные и динамические веб-приложения, не требует серверной рендеринга или маршрутизации по умолчанию, Next обеспечивает серверный рендеринг и статическую генерацию для улучшения производительности и SEO, имеет встроенную систему маршрутизации для упрощения создания многостраничных приложений, предлагает функции для API-запросов, компонентов и оптимизации производительности, подходит для создания высокопроизводительных веб-приложений с быстрой загрузкой страниц.
Разработка приложения
После создания необходимых таблиц в базе данных и подключения к Supabase можно выполнять запросы к БД из фреймворка Next.js. Библиотека @supabase/supabase-js предоставляет API JavaScript, который позволяет выполнять различные операции с базой данных: чтение данных из таблиц базы данных с помощью методов select, from, where и orderBy; создание новых записей в таблицах базы данных с помощью методов insert и returning; обновление существующих записей в таблицах базы данных с помощью методов update и returning; удаление записей из таблиц базы данных с помощью метода delete.
Когда пользователь входит в приложение с поддержкой Supabase, процесс аутентификации включает в себя создание уникального токена сеанса. Затем этот токен сохраняется в файле cookie на устройстве пользователя. Файлы cookie позволяют Supabase поддерживать сеансы пользователей и идентифицировать прошедших проверку подлинности пользователей по различным запросам. Это устраняет необходимость в повторных входах в систему и обеспечивает бесперебойную работу пользователей.
Одной из ключевых особенностей фреймворка Next.js является маршрутизация на основе файлов, которая позволяет легко создавать динамические URL-адреса и страницы. Однако, в некоторых случаях необходимо ограничить доступ к определенным страницам приложения только авторизованным пользователям. В этом случае требуется реализовать защищенную маршрутизацию. В рамках проекта защищённая маршрутизация реализована следующим образом: из базы данных берётся информация об авторизованном пользователе, если данные в ответе возвращаются, то защищённая страница загружается, иначе пользователь перенаправляется на страницу аутентификации.
Основным строительным блоком интерфейсов в Next.js являются компоненты React. Компоненты – это повторно используемые фрагменты кода, которые позволяют декомпозировать интерфейс на более мелкие и управляемые части. Одним из реализованных компонентов является Header, то есть верхний навигационный блок сайта, который представлен как пример на рисунке 3. Он отображает логотип продукта и кнопку аутентификации пользователя.
Рисунок 3 – Header сайта
Выводы
В ходе анализа требований к разрабатываемому web-приложению журнала технического обслуживания были выделены ключевые аспекты, которые должны быть учтены при его разработке. Важными требованиями являются удобный пользовательский интерфейс, функциональность, безопасность и доступность, интеграция, масштабируемость и надежность.
Для реализации приложения был проведен обзор существующих аналогов, что позволило определить преимущества и недостатки каждого из них. Был выбран JavaScript в качестве основного языка программирования, обеспечивающего широкие возможности разработки веб-приложений. В качестве Backend-as-a-Service (BaaS) платформы была выбрана Supabase, обеспечивающая масштабируемость, безопасность и интеграционные возможности.
В результате разработки данного web-приложения журнала технического обслуживания автомобилей обеспечен удобный и эффективный инструмент для автомобилистов. Предполагается, что разработка приложения позволит повысить эффективность и точность ведения журнала технического обслуживания автомобилей, упростить процесс планирования и контроля выполненных работ, а также снизить риски возникновения аварий и повреждений в результате ненадлежащего обслуживания.
Литература
- Виноградов, В. М. Организация процессов по техническому обслуживанию и ремонту автотранспортных средств : учебник / В. М. Виноградов, О. В. Храмцова. — Москва : КноРус, 2024. — 272 с. — ISBN 978-5-406-12289-1. — URL: https://book.ru/book/950685 (дата обращения: 01.04.2024).
- Supabase Documentation : официальный сайт. — URL: https://supabase.com/docs (дата обращения: 15.04.2024).
- Next.js Documentation : официальный сайт. — URL: https://nextjs.org/docs (дата обращения: 15.04.2024).
- Дэвид Флэнаган, JavaScript. Полное руководство, 7-е изд. : Пер. с англ. — СПб. : ООО "Диалектика", 2021. — 720 с. : ил. — Парал. тит. англ. — ISBN 978-5-907203-79-2.