Какой инструмент-конструктор выбрать для разработки UI для REST API?
Я бекенд разработчик, и по совместительству студент.
Стоит задача разработки приложения по учебе.
Сам бек я понятное дело легко сделаю, но разбираться как делать фронт на react у меня желания нет.
Пока я знаю, что есть ThymeLeaf, но в данный момент хочу найти no-code конструктор.
Идеал ответа для меня, это какое нибудь no-code решение(мб не совсем), где я смогу накидать страницы, кнопки в каком нибудь конструкторе, и смогу привязать их к своему Rest приложению.
Дополнительно:
Сам бек я понятное дело легко сделаю
Ой, не факт.
какое нибудь no-code решение
Не майтесь дурью: берите Thymeleaf и напишите простенькую JavaScript-прослойку - не развалитесь.
Добрый день.
Может быть vaadin подойдет вам?
Thymeleaf не подойдет, ибо это шаблонизатор для разработки MVC приложений.
Если postman & swagger не подходят и вы не хотите писать отдельный фронт на reactç angular etc., то стоит посмотреть в сторону Vaadin
- Даааааааааа, это прям то что нужно.
Глянул небольшой тутор на ютубе, и оно покрыло все мои потребности.
Спасибо большое
Ответы:
Я тоже бэк :) Когда возник вопрос "для себя" делать простой фронт, попытался изучать React как самый популярный. Но чёт не осилил, какой-то он предельно странный. А вот Angular зашёл! Много слышал что он очень сложный, но я особых сложностей не узрел, по крайней мере для моих примитивных задач. Говорят, Angular заходит именно бэкам т.к. у нас нет проблем с основами ООП.
Я думаю что фронт лучше делать именно на фронтовых фреймворках чем на Java-шаблонизаторах (таймлиф, мусташ и пр.). Во-первых, их (шаблонизаторов) несколько и непонятно какой учить. А на фронте 3 фреймворка и все популярны. Потом - ты получаешь ещё одну специальность, пусть и на примитивном уровне. Далее - тренируясь с "настоящим" фронтом, ты начинаешь лучше понимать что нужно фронту и, соответственно, лучше пишешь бэк.
Я учил Angular по курсу Владилена Минина. Правда, он довольно старый (по 8-9 версии, а сейчас актуальна 14), но в целом актуальный. Плюс и минус этого курса - автор объясняет не "академично", а исключительно на примерах. Минус - тяжело потом что-то искать в официальных доках Ангуляра, просто не знаешь как формулировать запрос. Плюс - зная как должен выглядеть твой фронт, ты практически сразу начинаешь его писать (конечно, самые основы HTML/CSS знать надо).
Удобно писать и отлаживать бэк и фронт отдельно. А запускать фронт "на проде" можно как на отдельном сервере (Nginx, Apache), так и "заэмбедить" в Jar-файл и тогда он будет работать на "встроенном" сервере (Tomcat, Netty).
ЗЫ: да, учил "для себя", но активно использую по работе :))
Для того чтобы "дергать" Rest API я бы использовал Postman.
- Тогда уж лучше swagger запихнуть, но хочется более user-friendly решение
- fifepls, а чем postman или swagger не подходят?
В idea ultimate можно средствами самой идеи делать запросы для rest
- тут проблема не в том, что мне нужно дернуть какие то эндпоинты.
Мне их нужно оформить в юзер-френдли интерфейс. - Хочется что то вроде QT, но это декстоп. А Мне хочется так же просто накидать формы и кнопки. Но чтобы движком отрисовки выступал браузер
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Для разработки UI для REST API можно использовать различные инструменты-конструкторы, в зависимости от ваших потребностей и уровня опыта. Ниже представлены несколько популярных инструментов-конструкторов, которые могут быть полезны при создании пользовательского интерфейса для вашего REST API:
1. Swagger UI: Swagger UI - это инструмент, который позволяет автоматически создавать интерактивную документацию для вашего REST API. Он позволяет пользователям легко просматривать и тестировать различные эндпоинты API, а также генерировать код клиента для взаимодействия с API.
Swagger UI({ url: "https://api.example.com/swagger.json", dom_id: '#swagger-ui', presets: [ SwaggerUI.presets.apis, SwaggerUI.SwaggerUIStandalonePreset ] }) |
Swagger UI({ url: "https://api.example.com/swagger.json", dom_id: '#swagger-ui', presets: [ SwaggerUI.presets.apis, SwaggerUI.SwaggerUIStandalonePreset ] })
2. Postman: Postman - это популярный инструмент для тестирования API, который также может быть использован для создания пользовательского интерфейса для вашего REST API. Он позволяет отправлять запросы к API, просматривать ответы и автоматизировать тестирование API.
const response = pm.sendRequest('https://api.example.com', { method: 'GET', header: { 'Content-Type': 'application/json' } }); console.log(response.json()); |
const response = pm.sendRequest('https://api.example.com', { method: 'GET', header: { 'Content-Type': 'application/json' } }); console.log(response.json());
3. React: Если вам нужно создать более сложный пользовательский интерфейс для вашего REST API, вы можете использовать библиотеку React. React позволяет создавать динамические и интерактивные интерфейсы, которые могут эффективно взаимодействовать с вашим API.
class App extends React.Component { constructor(props) { super(props); this.state = { data: [] }; } componentDidMount() { fetch('https://api.example.com') .then(response => response.json()) .then(data => this.setState({ data })); } render() { return ( <div> {this.state.data.map(item => ( <p>{item.name}</p> ))} </div> ); } } ReactDOM.render(, document.getElementById('root')); |
class App extends React.Component { constructor(props) { super(props); this.state = { data: [] }; } componentDidMount() { fetch('https://api.example.com') .then(response => response.json()) .then(data => this.setState({ data })); } render() { return ( <div> {this.state.data.map(item => ( <p>{item.name}</p> ))} </div> ); } } ReactDOM.render(, document.getElementById('root'));
4. Angular: Для создания сложных пользовательских интерфейсов также можно использовать фреймворк Angular. Angular предоставляет мощные инструменты для создания SPA (Single Page Application) и удобного взаимодействия с REST API.
$http.get('https://api.example.com') .then(function(response) { $scope.data = response.data; }); |
$http.get('https://api.example.com') .then(function(response) { $scope.data = response.data; });
Выбор инструмента-конструктора для разработки UI для REST API зависит от ваших потребностей, уровня опыта и предпочтений. Рекомендуется ознакомиться с каждым из вышеперечисленных инструментов и выбрать тот, который лучше всего подходит для вашего проекта.

Для разработки UI для REST API можно использовать различные инструменты-конструкторы в зависимости от ваших потребностей и опыта работы. Ниже приведены несколько популярных инструментов, которые могут помочь вам создать интерфейс для взаимодействия с вашим REST API:
1. Swagger UI: Swagger UI - это инструмент, который автоматически генерирует интерфейс для вашего REST API на основе спецификации OpenAPI (ранее известной как Swagger). Вы можете определить структуру вашего API в спецификации OpenAPI и затем использовать Swagger UI для создания интерактивной документации и тестирования запросов к вашему API.
Swagger UI прост в использовании и предоставляет удобный способ взаимодействия с вашим API.Swagger UI прост в использовании и предоставляет удобный способ взаимодействия с вашим API.
2. Postman: Postman - это популярный инструмент для тестирования API, который также предоставляет возможность создания и отправки запросов к вашему REST API. Вы можете создавать коллекции запросов, настраивать переменные и окружения, а также автоматизировать тестирование вашего API.
Postman имеет удобный пользовательский интерфейс и обширный набор функций для работы с REST API.Postman имеет удобный пользовательский интерфейс и обширный набор функций для работы с REST API.
3. Insomnia: Insomnia - это еще один инструмент для тестирования и отладки API, который может быть использован для разработки UI для REST API. Insomnia поддерживает работу с различными типами запросов, автоматизацию тестирования и экспорт запросов в различные форматы.
Insomnia предоставляет гибкие настройки и возможность организации запросов в рабочих пространствах.Insomnia предоставляет гибкие настройки и возможность организации запросов в рабочих пространствах.
Выбор конкретного инструмента-конструктора зависит от ваших предпочтений и требований проекта. Рекомендуется попробовать несколько инструментов и выбрать тот, который лучше всего подходит для вашей ситуации. Надеюсь, что эта информация поможет вам выбрать подходящий инструмент для разработки UI для вашего REST API.