Редактор текста
Описание:
Необходимо реализовать web редактор текста для совместной работы над документом.
Должен поддерживать одновременное редактирование текстового документа (plain text) несколькими пользователями, т.е. изменения сделанные одним пользователем должны сразу отображаться и у других пользователей.
Требования:
- Язык реализации: Java/Kotlin(серверная часть) и JavaScript/TypeScript(клиентская часть).
- Версия JVM: 1.8+.
- Система сборки: Maven/Gradle.
- Серверная часть: Spring или Vert.x.
- Клиентская часть: должна преставлять из себя веб интерфейс. Для реализации можно использовать любые UI фреймворки и библиотеки: jQuery, Angular, Bootstrap, etc. или Native JS. Для верстки крайне желательно использовать Bootstrap или ему подобные UI фреймворки.
- Приложение должно быть standalone, т.е. не должно требовать для своей работы установки дополнительного ПО(JVM не считается);
- Серверное приложение должно публиковать REST-like или Web Socket API, содержащий необходимые для работы клиента вызовы и ресурсы.
- Клиент и сервер должны обмениваться данными в формате JSON.
- UI не должен зависать в случае, если сеть медленная или есть проблемы со связью. Т. е. запросы к серверу должны выполнятся ассинхронно без блокировки интерфейса и с уведомлением пользователя, что запрос находится в обработке.
Бонус (не требуется для зачета, но идет в плюс, если выполнено):
- Используя docker и docker-compose реализовать задачи для сборки jar и запуска контейнера с приложением.
- Интегрировать сторонний wysiwyg редактор текста с возможностью форматирования текста;
- Реализовать систему пользователей (регистрация, вход в систему) и отображение списка пользователей, которые редактируют документ в настоящий момент;
- Добавить возможность сохранять документы в БД приложения;
- Реализовать историю изменений документа и возможность переключаться между разными срезами одного документа. Например, у пользователя будет кнопка, которая будет сохранять текущую версию документа под определенным именем, а затем можно будет выбрать ее из списка;
- Система пользователей: Авторизация на JWT токенах. Есть точки входа как для регистрации, так и для авторизации, но на фронтенде для регистрации нет вьюшки. Для тестирования при запуске в БД инициализируются 4 пользователя:
Username | Password |
---|---|
admin | admin |
User1 | qwerty |
User2 | qwerty |
User3 | qwerty |
-
Возможность создания, сохранения и просмотра документов в формате HTML. Каждому документу присваивается свой уникальный hash-идентификатор. Зная этот идентификатор вы можете загрузить всю историю изменений документа и посмотреть любую его версию. Кроме того, с помощью WebSocket реализована возможность отображения всех пользователей, работающих в данный момент над документом. а также мгновенного отслеживания изменений, которые они вносят.
-
Frontend клиент, написанный на Angular. Он состоит из парочки бесплатных bootstrap шаблонов и в нём отсутствуют многие критические для пользователей вещи, но тем не менее этот клиент может выполнять свои основные задачи и позволяет оценить функционал приложения в целом.
- Скачайте проект
- Откройте backend-приложение в любой Java IDE. Запустите его с помощью Boot Dashboard или Maven goals.
- Откройте frontend-приложение в любой Angular IDE. Подтяните зависимости (npm i) и запустите его.
- Перейдите на страницу http://localhost:4200/. Вы должны увидеть экран авторизации. Если вы изменили порт backend-сервера, то надо поменять переменные в enviroment.ts