Какие есть высокоуровневые компонентные javascript фреймворки?

Question

[Антон Астафьев]

Какие есть javascript фреймворки высокоуровневых компонентов, такие, чтобы можно было сразу начать реализовывать логику приложения, не углубляясь в тонкости этих фреймворков? То есть решение наподобие JSF, но на фронте, с фронтенд/джэм рендерингом и так, чтобы М из MVC было связано (полу-)автоматически с бэкендом?

У самого у меня есть начальный опыт с Реактом - сразу скажу не понравился, слишком громоздко и приходится пилить низкоуровневый javascript.

Comments

[Aetae]

>было связано (полу-)автоматически с бэкендом?
Сейчас так не принято.

Фронты пилят только фронт, бэк пилит только бэк. Ни тем ни другим не интересно лезть в чужую степь.

Бэк сам выбирает свои игрушки, фронт подключает соответствующую либу для взаимодействия к своему любимому фреймворку и все довольны.

Но фреймворки-комбайны конечно есть.

[Антон Астафьев]

Фронты пилят только фронт, бэк пилит только бэк.

Aetae, меня устроит и вариант когда фронт предлагает способ для более-менее автомагического связывания по РЕСТу / графкул. То есть, чтобы компоненту можно было указать на эндпойнт - и он бы большую часть операций схватывал, то есть миниум КРУД и какой-то поиск.
Я посмотрел, например, Vue + Axios примерно так работают. Но там всё равно надо вручную связку делать.
Плюс в Вью как-то мало именно высокоуровневых компонент.

[Антон Астафьев]

Ещё дополнение. Как я предполагаю автоматическую привязку.
Да, в связи с тем, что придётся переехать на фронт, надо как-то фетчить модель на фронт. Прописывать при этом в каждом компоненте вручную адреса эндпойнтов совсем не хочется. Мне видится так, что мы объявляем некий образ/отражение эндпойнтов на фронте. Эти образы используются по типу ява-бинов. Привязка модели происходит к этому образу. Это чем-то напоминает Реактовый Редукс, но в Редуксе вручную прописываются все фетчи, что очень трудоёмко и надоедает. Я же предполагаю, что будет некий общий Рест ресурс, конкрентые подпути которого должны выбираться исходя из имён сущностей.
Не знаю, возможно, так будет работать.

Answer 1

[Виктор Кожухарь]

Если я правильно понял вашу фразу "связано (полу-)автоматически с бэкендом", то вы имеете ввиду SSR (Server Side Rendering)

Если бы я не увидел у вас ссылку на Quarkus (то бишь Java), я бы посоветовал вам не терять время на изучение чего-то странного и непопулярного, и приступить непосредственно к изучению React и его фреймворка для SSR Next.js. Я не люблю ни то, ни другое, но это, к сожалению, индустриальный стандарт, и очень желательно их знать.

Но так как я увидел у вас бэкенд на Java и желание всё же иметь ту самую "полу-автоматическую связь с бэкендом", то можете поступить радикальным образом: взять какую-то UI библиотеку из веб-компонентов (например Shoelace), или более традиционные библиотеки UI, основанные на tailwindCSS (например, daisyUI).
Весь HTML рисовать на бэкенде, а оживлять это всё с помощью библиотеки HTMX. Это позволит вам всю логику и стейт держать на бэкенде, и, в то же время, иметь очень хорошую интерактивность. https://www.youtube.com/watch?v=vgAKrggD0vQ&t=173s

Comments

[Антон Астафьев]

Спасибо за ответ, я посмотрю ссылки. Но
Server Side Rendering вовсе не предполагается обязательным условием. То есть какая-то, пожалуй значительная, часть стейта будет на бэке, причём это на первых порах, затем это по методе микросервисов скорее всего выделится в сторонние сервисы.
Но для быстрого старта пока всё - на бэк, всё, кроме собственно модели из МВЦ. То есть стейт Модели таки на фронте в любом случае.
Исходя из этого рендерить на сервере не надо. Привязка к бэку же не предполагает бэк-рендеринга (исходя из того, что я знаю). В комментарии выше я подробнее описал, как это видится
PS. На этом сайте не работают относительные/фрагментные ссылки. Видимо неправильный джс фрейморк выбрали

[Виктор Кожухарь]

Антон Астафьев, Если вам понравился Vue, то очень советую посмотреть в сторону библиотеки Vuetify. Очень хорошая штука

[Антон Астафьев]

Виктор Кожухарь, не то чтобы он мне нравился, я пока не знаю. Но первое впечатление самого подхода - вполне устраивает. Не хватает высокоуровневости. И не понятно, как они всё организуют при работе сложных композитных объектов.

Вообще я нашёл вот такой очень старый вопрос на стеке с довольно старыми ответами (последние от 17-го года). Оттуда из того, что ещё живо, можно рассматривать JQWidgets или Ionic (но он для мобилок) как вполне аналог JSF. Так вот, JQWidgets вроде и на Vue рабоает в т.ч.

[Виктор Кожухарь]

Антон Астафьев, Лично от меня совет: не ищите древние решения, потому что документация и помощь по странным древним решениям на порядки хуже всего современного.
Кучу кода на React или Vue вам поможет написать даже тот же AI. А если совсем будет туго, то найти специалиста по React будет в разы дешевле и проще, чем по всем остальным фреймворкам вместе взятым. Vue мне кажется чуть более сбалансированным вариантом, если React совсем не заходит.

[Антон Астафьев]

Виктор Кожухарь, вы считаете ИИ может уже что-то ползеное нагенерить?
Насчёт React - я не отвергаю его совсем, просто с ним в своё время пришлось довольно неплохо поковырятся, в мысле на чистом ДжС. Этого хотелось бы избежать. Возможно я просто отстал от жизни, и сейчас Реакт работает из коробки. Я видел 3 года назад проекты по интеграции React с GraphQL. Может быть там всё упростилось в плане линка до бэка.
Vuetify выглядит многообещающе.

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