Задача

Создание веб-приложения для заполнения форм документов с возможностью интерактивного редактирования и экспорта в различные форматы. Приложение должно поддерживать выбор данных из JSON и автоматическое определение редактируемых полей. Необходимо было разработать интуитивно понятный интерфейс, который позволил бы пользователям легко загружать форматы документов и выбирать необходимые данные для заполнения. Задача заключалась не только в создании функционала, но и в обеспечении высокой производительности и удобства использования.

Решение

Разработано приложение LiveForms, которое позволяет пользователям загружать файлы форм в формате DOCX и заполнять их данными из JSON. Приложение предоставляет возможность редактирования полей и выбора шрифта, а также экспортирует готовые документы в PDF и DOCX. Пользователи могут легко управлять процессом заполнения, а также настраивать внешний вид документа в соответствии с их предпочтениями. Это решение значительно упростило работу с документами, сделав процесс более быстрым и эффективным.

Архитектура и стек

Приложение построено на основе следующих технологий:

• Frontend: React 18 с TypeScript, Vite, Tailwind CSS, mammoth.js для конвертации DOCX в HTML, html2pdf.js для экспорта в PDF, React Hook Form для управления состоянием форм. Эти технологии обеспечивают высокую производительность и отзывчивость интерфейса.
• Backend: NestJS с TypeScript, docxtemplater для генерации DOCX, pdf-lib для генерации PDF. Такой стек позволяет эффективно обрабатывать запросы и генерировать документы на серверной стороне.

Ключевые функции

• ✅ Автоматическое определение редактируемых полей из DOCX
• ✅ Выбор данных из JSON для автозаполнения
• ✅ Выбор шрифта (печатный/рукописный)
• ✅ Редактирование полей в реальном времени
• ✅ Экспорт в PDF
• ✅ Экспорт в DOCX с использованием плейсхолдеров
• ✅ Печать формы Эти функции делают приложение универсальным инструментом для работы с документами, позволяя пользователям легко адаптировать их под свои нужды.

Результат

Приложение LiveForms успешно реализует возможность заполнения форм, что значительно упрощает процесс работы с документами. Пользователи могут быстро и удобно заполнять документы, а также экспортировать их в нужных им форматах. Это решение оказалось востребованным и получило положительные отзывы от пользователей, которые оценили его функциональность и удобство.

Что бы улучшил

В дальнейшем планируется расширить функциональность приложения, добавив возможность автоматического определения полей из загруженных DOCX, сохранение конфигураций форм, поддержку множественных форм и интеграцию базы данных для хранения данных пользователей. Эти улучшения помогут сделать приложение еще более полезным и удобным для пользователей, что позволит увеличить его популярность на рынке.