Details
| Title | Разработка клиентской части no-code веб-сервиса для визуального проектирования ETL-процессов: выпускная квалификационная работа бакалавра: направление 09.03.04 «Программная инженерия» ; образовательная программа 09.03.04_01 «Технология разработки и сопровождения качественного программного продукта» = Development of the client side of a no-code web service for the visual design of ETL processes. |
|---|---|
| Creators | Емшанова Полина Игоревна |
| Scientific adviser | Прокофьев Олег Валерьевич |
| Organization | Санкт-Петербургский политехнический университет Петра Великого. Институт компьютерных наук и кибербезопасности |
| Imprint | Санкт-Петербург, 2026 |
| Collection | Выпускные квалификационные работы ; Общая коллекция |
| Subjects | клиентская часть ; no-code ; ETL ; визуальное проектирование ; обработка данных ; React ; TypeScript ; React Flow ; Zustand ; TanStack Query ; веб-сервис ; client side ; visual design ; data processing ; web service |
| Document type | Bachelor graduation qualification work |
| Language | Russian |
| Level of education | Bachelor |
| Speciality code (FGOS) | 09.03.04 |
| Speciality group (FGOS) | 090000 - Информатика и вычислительная техника |
| DOI | 10.18720/SPBPU/3/2026/vr/vr26-2694 |
| Rights | Доступ по паролю из сети Интернет (чтение, печать, копирование) |
| Additionally | New arrival |
| Record key | ru\spstu\vkr\42580 |
| Record create date | 8/21/2026 |
Allowed Actions
–
Action 'Read' will be available if you login or access site from another network
Action 'Download' will be available if you login or access site from another network
| Group | Anonymous |
|---|---|
| Network | Internet |
Данная работа посвящена разработке клиентской части веб-сервиса, позволяющего проектировать ETL-процессы без написания программного кода с использованием визуального редактора. Инструмент ориентирован на бизнес-пользователей и предполагает локальное развертывание. В ходе работы были решены следующие задачи: • Анализ предметной области и существующих no-code ETL-решений; • Формулирование требований к клиентской части; • Проектирование архитектуры; • Реализация клиентского приложения; • Тестирование разработанного приложения. Клиентская часть веб-сервиса реализована как Single Page Application с использованием React и TypeScript. Для построения визуального редактора ETL-процессов использована библиотека React Flow, для управления состоянием – Zustand, для синхронизации с сервером – TanStack Query, для HTTP-запросов – Axios. Для сборки использован Vite, для стилизации – SCSS Modules. В результате создано клиентское приложение, включающее визуальный редактор ETL-процессов с поддержкой drag-and-drop узлов, и возможностью настраивать узлы без использования кода с предпросмотром результатов на каждом шаге, а также модули аутентификации, управления пайплайнами и профиля пользователя.
This work is devoted to the development of the client-side of a web service that allows designing ETL processes without writing code using a visual editor. The tool is designed for business users and assumes local deployment, The following tasks were solved in the course of the work: • Analysis of the subject area and existing no-code ETL solutions; • Formulation of requirements for the client-side; • Architecture design; • Implementation of the client application; • Testing of the developed application. The client-side of the web service is implemented as a Single Page Application using React and TypeScript. The React Flow library is used for building the visual ETL editor, Zustand for state management, TanStack Query for server synchronization, and Axios for HTTP requests. Vite is used for building, and SCSS Modules for styling. As a result, a client application was created that includes a visual ETL editor with drag-and-drop nodes and the ability to configure transformations without code with preview of results at each step, as well as authentication, pipeline management and user profile modules.
| Network | User group | Action |
|---|---|---|
| ILC SPbPU Local Network | All |
|
| Internet | Authorized users SPbPU |
|
| Internet | Anonymous |
|
- ВВЕДЕНИЕ
- ГЛАВА 1. АНАЛИЗ ПРЕДМЕТНОЙ ОБЛАСТИ И СУЩЕСТВУЮЩИХ РЕШЕНИЙ
- 1.1. ETL как основа подготовки данных в аналитических системах
- 1.2. Классификация ETL-решений по подходу к реализации
- 1.2.1. Программно-ориентированные ETL-решения
- 1.2.2. ELT-платформы с автоматизацией загрузки
- 1.2.3. No-code и low-code ETL-решения
- 1.3. Обзор существующих no-code и low-code ETL -решений
- 1.3.1. Parabola.io
- 1.3.2. Apache NiFi
- 1.3.3. Luxms Data Boring
- 1.4. Выводы по обзору существующих no-code ETL решений и обоснование ниши разработки
- ГЛАВА 2. ПРОЕКТИРОВАНИЕ КЛИЕНТСКОЙ ЧАСТИ
- 2.1. Требования к клиентской части
- 2.2. Архитектура клиентской части
- 2.2.1. Подход к разработке приложения
- 2.2.2. Взаимодействие с сервером: REST API
- 2.2.3. Проектная архитектура клиентского приложения
- 2.3. Обоснование выбора технологий и средств разработки
- 2.3.1. Фреймворк и язык разработки
- 2.3.2. Библиотека для визуального редактора ETL-процессов
- 2.3.3. Библиотека для управление состоянием приложения.
- 2.3.4. Библиотеки для взаимодействия с серверной частью
- 2.3.5. Библиотеки пользовательского интерфейса
- 2.3.6. Стилизация
- 2.3.7. Инструменты сборки и разработки
- ГЛАВА 3. РЕАЛИЗАЦИЯ КЛИЕНТСКОЙ ЧАСТИ
- 3.1. Управление состоянием приложения
- 3.2. Взаимодействие с серверной частью
- 3.3. Реализация визуального редактора
- 3.4. Настройка узлов и предпросмотр данных
- 3.5. Запуск пайплайна и отображение результата
- 3.6. Управление пайплайнами
- 3.7. Аутентификация и управление сессией
- 3.8. Профиль пользователя
- 3.9. Контейнеризация и развёртывание
- ГЛАВА 4. ТЕСТИРОВАНИЕ КЛИЕНТСКОЙ ЧАСТИ
- 4.1. Инструменты тестирования
- 4.2. Модульное тестирование
- 4.3. Интеграционное тестирование
- 4.4. Сквозное тестирование (E2E)
- ЗАКЛЮЧЕНИЕ
- СПИСОК ИСПОЛЬЗУЕМЫХ ИСТОЧНИКОВ