Web чат на чистой Java (Vaadin)

Web чат на Java фреймворке Vaadin, без единой строки HTML, JS, CSS
За Java давно закрепилась слава слишком многословного языка. При этом люди часто забывают, что многословность это не черта самой платформы и экосистемы, а отдельновзятых неудачных решений в прошлом. Времена, когда на джаве нужно было написать пару десятков файлов конфигураций, давно прошли. Современные версии языка вкупе с современными фреймворками позволяют решать проблемы разработчиков и бизнеса очень быстро и легко.
Один из таких примеров как раз фреймворк Vaadin, речь о котором идёт в этом видео, где я создаю простой многопользовательский вэб чат в виде SPA приложения.
Код из видео:
github.com/dru...
Сайт Vaadin:
vaadin.com/
Генератор проекта Spring:
start.spring.io/
Библиотека рендера Markdown в HTML:
github.com/rje...
Сайт проекта Lombok:
projectlombok....
Видео про Lombok:
• Java Tools: Project Lo...
Видео про Markdown:
• Markdown - напиши READ...
Написание простого Vaadin приложения:
vaadin.com/doc...
Описание Vaadin компонента grid (таблица):
vaadin.com/com...
Использование Push нотификаций с сервера в браузер:
vaadin.com/doc...
Использование Vaadin component event bus:
vaadin.com/doc...
➡ Мерч letscode.vsema...
➡ Стать спонсором www.youtube.co...
➡ donate.stream/...
➡ donate.qiwi.co...
➡ PayPal paypal.me/lets...
➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖
➡ Второй канал: / geekchatdru
➡ Twitch: / drucoder
➡ Твиттер: / letscodedru
➡ Группа Вконтакте: letscod...
➡ Канал в Telegram: t.me/letsCode_dru
➡ Чат в Telegram: t.me/joinchat/...
➡ Сервер в Discord: / discord
➡ Яндекс.Дзен: zen.yandex.ru/...

[@tatyanayurchenko6840]

Спасибо! На фоне кучи видео об основах java интересно посмотреть видео с реальным программированием. Особенно понравилось, что 1) чёткая приятная дикция 2) без воды 3) интересно

[@bohdanzhuk5736]

Агонь! Вечно если чат то сразу веб сокеты, вот он прогрес, новые подходы!) Спасибо за ваши видео! Всегда интересно смотреть 😊

[@alexnovik6223]

Решил для начала воспроизвести один в один. Первое с чем столкнулся - ломбок не прописывался, в помнике красным подсвечен был. Нужно было тег version добавить. Далее не сразу сообразил как из new Grid получился метод с именем, всего лишь любимая комбинация Alt + Enter. Пошел дальше по шагам изучать Java.

[@seoonlyRU]

вот это прям реально круто!!! с ходу лайк от самого известного вебмастера и сео-специалиста в рунете СЕООНЛИ

[@olegreutcky4286]

Андрей, как обычно все на высоте, без лишнего. Спасибо тебе. 👍

[@malkovmaksim2698]

Я думал, по ваадину только шутки да стенания в чате, а тут видос. Круто!!!

[@iwanttobreakfee]

Сижу с отвисшей челестью, почему я первый раз слышу о Vaadin, это же просто гениально. Принцип разработки UI под десктоп или мобилки перенесён в веб, ещё и с поддержкой адаптивных сайтов. Java в очередной раз превзошла мои ожидания, хотелось бы увидеть Vaadin в связке с Котлином - это вообще новый уровень бытия

[@awenn2015]

Не знаю зачем я вообще это смотрю так как я пишу на js typescript, но ты очень интересно рассказываешь))

[@letsCodeDru]

я тоже сейчас почти всё время на TypeScript пишу в связке TypeORM + TypeDI + GraphQL. По ощущениям Java + Spring на минималках)

[@awenn2015]

@@letsCodeDru про graphQL в курсе, но пока не тороплюсь изучать и использовать, не знаю какие там плюсы и чем это лучше обычных api запросов, а вот TypeORM + TypeDI хз что такое, я сейчас react использую, надо будет еще next опробовать

[@abdulloh3254]

Здравствуйте, я один из ваших подписчиков из Ташкента. По возможности, было бы здорово, если бы вы могли брать видео уроки по таким технологиям, как Redis, RabbitMq, Kafka, Jenkins, ElasticSearch.

[@ceounit]

круто, впрочем как обычно осталось только сделать микросервисы с ваадином на монге, и можно удаляться в закат на гироскутере, попивая смузи

[@letsCodeDru]

Мсье знает толк в извращениях

[@ceounit]

@@letsCodeDru это ещё не всё Можно всё на кваркусе захерачить

[@nikolai_kelin]

Круто, весело, задорно!!! )) Давай ещё ))

[@Ту-ту-ту-ту]

Андрей очень здорово видеть новые видео. Спасибо

[@dmitryvasilenko4214]

Моё почтение!) Новая порция годноты!)

[@Oleksiy_Konovalov]

У тебя всегда классные и позитивные видосы, без сухости и воды) Но все же без JS уже никуда.

[@letsCodeDru]

Зависит от задачи. Я на ваадине коммерческий проект пилил. Вообще без JS жили великолепно)

[@Oleksiy_Konovalov]

@@letsCodeDru спасибо, буду знать, может в будущем пригодится)

[@miku2293]

@@Oleksiy_Konovalov Vaadin и построен поверх JS

[@hunterlive2434]

@@Oleksiy_Konovalov на паре собесов ребята говорили что фулстечат java + vaadin. Так что используется в комерции.

[@tatyanayurchenko6840]

О! Вас в дайджест Javarush добавили :)

[@letsCodeDru]

воу. А я-то всё не могу понять, откуда трафик подкатил

[@МихаилКурагин-г8м]

Ничего не понял, но кайфанул. ))

[@LAZIO14]

Спасибо) бомбезное видео. А у тебя есть видео где ты при написании сервиса, программы, приложения... работаешь с HashMap?

[@bashlaev_ka]

Классные и интересные видео ты пилишь, спасибо!

[@ДмитрийТищенко-е9ъ]

Как всегда отлично и интересно!!!!!

[@ДиляраЯппарова-ъ1м]

Спасибо за знания и позитив)

[@Givmemp3]

Вижу отличный способ прототипировать, особенно если нет времени/желания курить js. Спасибо за видео

[@letsCodeDru]

Так и есть. Для прототипов отлично подходит. Бонусом хорошая адаптивная вёрстка под мобилки

[@vlad_chereshnya]

@@letsCodeDru а можно ли делая мобильное приложение, интегрировать его с этим сервером на спринге и работать с базой данных сервера?

[@Az1zdev]

Спасибо большое.

[@МихаилЕвтушенко-к6щ]

Лучший) приложение на микросервисах с секьюрностью пилить не будешь?

[@letsCodeDru]

если придумаю, как это сделать просто-понятно и интересно

[@Az1zdev]

++++

[@alessandramacneva6874]

Спасибо за ваш труд! Как сделать чат через интернет соеденение?

[@Aticinsane]

Крутяк! Спасибо! 👍

[@TymofiiLanevych]

"Я умный, я знаю" - я проорал вконце. 🤣

[@matriks2007]

Шикарно как всегда)))

[@armantulendi7320]

Спасибо, быстро и понятно, внятно

[@michaelfreeman6179]

Спасибо за Vaadin

[@antondoronin1261]

Постигаем олениху, она все чаще в вакансиях светится, лишним не будет

[@nikkie_cold]

Будут гайды по новым версиям спринг бут секьюрити и выходящих из них?

[@Scechevarov_family]

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

[@universeunity9970]

Так само собой. Он здесь фреймворк использует. Что ты собирался здесь понять? Ещё очень рано. Нужно много всего изучить, а потом изучить сам этот фреймворк, что бы на нём работать, если тебе именно это будет нужно, конечно.

[@tatyanayurchenko6840]

Автор молодец пиши ещё!

[@zhennik263]

Этот Vaadin мне напоминает до боли богом забытый GWT. На последнем пришлось поработать.

[@letsCodeDru]

Так на нём и построен. Google подарил GWT компании, создавшей Vaadin, как главному контрибьютору. Но они хорошенько улучшили эту технологию

[@andygr1n1]

крутяк!

[@trommo]

Круто, блин!

[@mika2557]

Спасибо за видео :)

[@maximtronin4510]

Как второй, третий и четвертый лайк поставить ?

[@alexandrguravskiy9985]

Спасибо за видео. Вопрос сколько времени у тебя примерно уходит чтобы разобраться с нуля что для чего например с этим ваадином?

[@letsCodeDru]

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

[@alexandrguravskiy9985]

​@@letsCodeDru А если точнее если ориентироваться на 12 год и ваадином и началом работы с java, 1-2 дня или неделю - две ? Хочу понять на сколько я туп или это норма.

[@StoneWeaver_RU]

О, свежий видосик ) А когда включил спонсорство, и почему не сказал?

[@letsCodeDru]

2 недели назад включил) Я еще и мерч запускаю, но там всё сложно. Про тебя и мерч помню)

[@antondoronin1261]

На всемайки есть одежка, мне уже пришла)

[@zhuravel_]

Какой же удобный GWT 3.0 🥲

[@letsCodeDru]

ну удобней всяких Wicket и JSF))

[@VladShtaiier]

Привет! При входе в проект мы вводим имя. Есть ли возможность заменить на имя с Spring Security authentication, которое юзер вводит при регистрации акка

[@AnnaSmirnova1]

Ура)

[@letsCodeDru]

[@dddsss12345]

Хорошо то как :)

[@fabulous8605]

если на х2 смотреть то мозг взрывается ехехех, но я привыкший чучуть. писал на WCF чатик и пипяо там гайды, а тут прям контраст на фоне тех гайдов (они подобный чат делают на гайдах за часов 5)

[@johnrambo6996]

но круто, спасибо

[@ВладиславКлочков-с8й]

Почему не юзаете аннотацию ломбока RequiredArgsConstructore для инжекта? Тогда можно опустить конструктор.

[@letsCodeDru]

Для наглядности

[@АнтониоПанотти]

Видео крутое, но я не понимаю логику - откуда автор узнал, что нужно писать именно так. Что нужно поизучать, чтобы в этом разобраться.

[@nikitasidorov5538]

на чистой джаве, это без фреймворков, а так классно конечно

[@mihailsoosaar6213]

Не думал, что вааден ещё живой. Цель данного видео понятна - показать, что можно сделать все на джава. Но вот насколько это актуально?

[@letsCodeDru]

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

[@mihailsoosaar6213]

@@letsCodeDru согласен. Мне это напомнило просто ASP WEB FORMS, которые в своё время доставили мне массу проблем и неудобств.

[@alexnovik6223]

метода setItems для grid не обнаруживается, в помнике для vaadin ошибка в vaadin-maven-plugin и vaadin.version Пошел копать дальше что происходит. Проект так же сделал с сайта спринга.

[@letsCodeDru]

Ну я в видосе отметил, что за 1 день у меня проект поехал из-за обновления версий библиотек, так что кури, дружище, где ошибка

[@alexnovik6223]

@@letsCodeDru ноу проблемс. Только так и достаются знания и никак иначе. Так даже веселее - много тонкостей узнаешь пока до ошибки раскопаешь )

[@alexnovik6223]

@@letsCodeDru самое главное - есть архитектура, а обвязка мелочи, на которые тратится оставшиеся 80% времени

[@artemv3160]

@letsCode зачем тереть комменты про то, что Vaadin не использует больше GWT?

[@letsCodeDru]

Ничего я не тру, не нагнетай. За 3 года существования канала удалил только 1 коммент. Ютуб сам может удалять сообщения, если расценивает их как спам. Ваадин есть в 2 версиях: GWT и на Webpack + TS. Это вскользь в видео отмечено (развилка Flow Fusion vaadin.com/start)

[@artemv3160]

@@letsCodeDru понял, прошу прощения за нагнетание, был не прав (но справедливости ради, комменты прям на глазах исчезали). Как раз Flow - это с использованием WebComponents. GWT не используется, начиная с 10 версии. Что достаточно важно, т.к. позволяет с небольшими усилиями использовать библиотеку сторонних веб компонентов. Одна из причин непопулярности и застоя Vaadin 7 и 8 как раз была в скудности готовых компонентов и сложности создания новых. С WebComponents это должно упроститься. Собственно, с сайта Vaadin: Vaadin 8 and earlier were based on GWT. Vaadin 10 and later use web components for the browser implementation, and come with an entirely new set of components. The framework architecture is more modular: you can use the components independently of the Java backend, and you can more easily control custom client-side components though the Flow Java API. The Java programming model remains similar to previous Vaadin versions, although there are some API changes in the new component set.

[@nikolay7658]

@@artemv3160 у нас пару проектов на 8, свои компоненты пишутся достаточно просто

[@awenn2015]

21:14 в java разве нет тернарных операторов ? Типо return isEmpty ? блок if : блок else

[@letsCodeDru]

есть

[@awenn2015]

@@letsCodeDru ы в чем проблема тогда их использовать, зачем копипастить один и тот же код два раза если меняется только аргумент функции

[@karaedd]

с танцем и бубнами все таки заработало, скачал код с гита. И это - npm install chokidar. Может кому-то сохранит время

[@alekseizharov7987]

Лучший комментарий. Спасибо, помогло

[@nikolay7658]

У нас проект Энтерпрайз сектора, на ваадине 8 (уже почти написана новая версия на 14 ваадине) почти без js (катомную слайд панель намутили)

[@mouviem7951]

и как, хватает ваадина?)

[@nikolay7658]

@@mouviem7951 да, для задач Энтерпрайз-сектора - вполне. Бизнес деньги имеет, а это, как считаю, самый главный показатель

[@Aleksei12595]

Расскажите, пожалуйста как написать вэб страницу на java, не зная html или зная минимум

[@letsCodeDru]

Так видео собсно об этом)

[@ХромовВладислав]

С этими вашими Ваадинами как правило начинаются проблемы, когда заказчик говорит, что колонка в таблице должна быть шириной 234px...

[@miku2293]

настройка всех стилей там есть через установку параметров

[@nikolay7658]

Ещё можно свою тему со своими стилями определять, всё достаточно просто.

[@sawfanish]

К сожалению не получается запустить проект, даже готовый проект автора не на маке не на винде в intelij, ошибки: Unable to start web server и Unable to start embedded Tomcat. Посоветуйте плиз как решить? Автору спасибо за видосы такие)

[@Givmemp3]

Попробуй поставить node lts версии. 16.13.0

[@sawfanish]

@@Givmemp3 Спасибо тебе, помогло!)

[@artemv3160]

Насколько безопасно использовать в компонентах Vaadin {{ и }}, не будет утечек?

[@letsCodeDru]

не проверял, если честно. Но в flex версии (про которую видос), проблем быть не должно

[@artemv3160]

@@letsCodeDru не совсем понял, что за flex версия. Можете уточнить?

[@artemv3160]

@@letsCodeDru ну собсвтенно, а зачем использовать потенциально проблемную практику, да еще и новичков учить этому? Чтобы сэкономить 1,5 строки?

[@letsCodeDru]

@@artemv3160 vaadin.com/start

[@ВладиславМелехин-е5р]

Java! Ырряяя!

[@maximtronin4510]

Какой-то комментарий из нескольких слов ))

[@letsCodeDru]

Знаешь, чем меня порадовать )

[@mouviem7951]

у Vaadin все печально от перехода с версии на версию(

[@dolor9096]

комментарий.

[@SemenGubarev]

А spring зачем тащить?

[@letsCodeDru]

меньше кода

[@WiseApe1]

Сколько строк кода получилось?)))

[@letsCodeDru]

Сколько нужно XD

[@mergmerg5156]

Здравствуйте, очень хороши видео можете помочь и видеозвонок добавит ???

[@letsCodeDru]

Не понял вопрос. Ты хочешь видос про написание видеоконфы? о_О

[@mergmerg5156]

@@letsCodeDru хочу что бы было возможность сделать видеозвонок, как зум (видеочат в реальном времени). Не могли бы вы мне помочь, пожалуйстаaaaaaaa :)

[@danilishei]

Есть ряд непонятностей с эвент басом, что-то куда-то там регистрируется... Надо поэкспериментировать, но в целом выглядит действительно просто

[@Hrachik333]

То случай когда зашел не тот кабинет, что тут происходит? )

[@ЄгорПавленко-м4ь]

Мне очень нравятся Ваши видео, Ваша просветительская работа. Поэтому пишу это сообщение. Пожалуйста не надо так. Не учите людей плохому. Они и сами этим успешно занимаются. Какой же это без JS если всё превращается в HTML, CSS, JS. Не нужно соваться в WEB не зная HTML, CSS, JS. Ничего хорошего из этого не выйдет. Матчасть нужно знать. Кстати Ваши ролики мне всегда нравились объяснениями того что происходит.

[@letsCodeDru]

Но-но-но! Речь идёт про НАПИСАНИЕ. Сильно сомневаюсь, что у кого-то останутся иллюзии, что это всё в браузере в чистой джавке исполняется. Любой ньюкоммер должен понимать, что времена сервлетов остались далеко в прошлом. Это же база Java SE

[@sivr5vs38]

Писал гневный ответ, а потом понял, что таким людям хрен че объяснишь 😕

[@alexnovik6223]

а можно я не буду оставлять никакого сообщения под этим видео?

[@letsCodeDru]

Можно

[@МаксимЖивотовский-ж8о]

+

[@NoNameEtcDot]

Не чистая джава, ваадин это фрейм и там также по капотом цсс и джаваскрипт генерятся и да не самого хорошего качества.

[@letsCodeDru]

да-да, я слукавил, шоподелать А про качество генерируемого кода... Смотря что считать качеством: если я продукт за выходные на коленке накидал и он мне деньги приносит, это качественно? Если мне не нужно греть голову, как это в сафари будет работать, это качественно? С моей точки зрения вполне качественно.

[@crazym8nd]

ожидал plain java а не всякие спрингбуты и ваадины)

[@letsCodeDru]

се ля ви)

[@mergmerg5156]

@letsCode хочу что бы было возможность сделать видеозвонок, как зум (видеочат в реальном времени). Не могли бы вы мне помочь, пожалуйстаaaaaaaa :)

[@letsCodeDru]

Не могу. Там сложно.

[@mitoxtech3284]

Вам нужно в web Rtc , а для удобства выбрать библиотеки что с ним работают, есть и на java и на js (Jitsi, Janus, etc)

[@TheExcentro]

Про любимый vaadin это сарказм?

[@letsCodeDru]

Кто знает)

[@Narryel]

Эх. ожидал вебсокет =(

[@letsCodeDru]

Он там под капотом

[@Desmont870]

Сэнсэй, научите меня =\

[@reznic.a]

Gradle и kotlin рулят. А так интересно Я думал ваадин умер как gwt

[@letsCodeDru]

Gradle хорош. Котлин тоже. Но с maven меньше шансов сорваться и начать писать код в build скрипте. А это дорога в один конец

[@vladimir_128]

Ужас какой. Нафиг учить весь этот стек когда есть java. Когда дойдет до мелких правок и изменений окажется что нужно все с нуля написать так как фреймворк не дает таких возможностей.

[@letsCodeDru]

На самом деле нет, там все достаточно прозаично. Если аллергия на gwt, можно фронт на TS для ваадина описыватт

[@nikolay7658]

Можно свою тему полность писать

[@johnrambo6996]

ооооочень быстро

[@taras7630]

крч первонах, ничего не знаю

[@letsCodeDru]

засчитано

[@Keeper2]

Доводилось поработать с этим ужасом, хватило, больше не надо)

[@letsCodeDru]

Ой, да ладно ты. Поработай с JSF, поймёшь, насколько крута олениха

[@nikolay7658]

Ну хз, самый простой веб, который можно писать на джаве без этих ваших жэсов

[@MarvelCold]

как всегда ничего не работает , класс , наверное это последнее видео которое я посмотрел у вас на канале

[@recycle-bin-camp]

какой ужас кромешнейший жесть!!!

[@djkos7]

1. Java враппер над JS !== писать без JS. Просто за тебя это делает жава имплементация 2. Там все равно вебсокеты или лонгполлинг. RPC там скорее всего нет, так как барузеры не умеют в него нативно. Так что опять же, это все просто красивая обертка. Автор, что за кликбейт? Покажи лучше сетевые запросы и бандл, который получил браузер.

[@djkos7]

Даже больше скажу, все компоненты то не родные, а взяты как: import com.google.gwt.dom.client.DivElement;

[@ИльяКалашников-ш6ф]

Сейчас я сделаю трипл эй игру или любой другой софт на Java всего одной строчкой. Для этого мне понадобится фреймворк, делающий игру или любой другой софт одной строчкой кода. Пишу одну строчку кода, игра или софт готовы. Как работает этот фреймворк, что он делает внутри себя, какие фреймворки использует этот фреймворк, что делают эти фреймворки в фреймворке. Это вообще можно называть программированием? Вся эта фреймворк культура такая дичь. Качаешь какой нибудь калькулятор хитроумный, а он весит 10 гигабайт. Ну там потому что фреймворки на фреймворках, потому что там одной строчкой всё. А слабо без фреймворков, а? Что бы действительно вся логика программы была прозрачна и очевидна?

[@ИльяКалашников-ш6ф]

Так то я тоже могу дом построить. Куплю дом, покрашу в нём одну недокрашенную стену, я строитель! Как он построен, какие несущие способности у стен, какие температуры выдержит, как там с проводкой и прочей инженерией, ай да вообще пофиг. Я построил при помощи "фреймворка".

[@ИльяКалашников-ш6ф]

Прости за хейт, автор, накипело. Никаких претензий к тебе не имею совершенно. Твори, показывай ещё.

[@letsCodeDru]

Всё правильно пишешь. Но согласись, что для тебя, как разработчика, идея писать с нуля всё то, что уже реализовано в паре-тройке хороших фреймворков, совершенно не привлекательная перспектива.То же самое сейчас во всех сферах: если что-то уже сделано, то проще купить готовые части или права на производство, чем запускать дорогущий ресёрч на сотни часов и тысяч деняк. В такое время живём, где навык орудования изолентой ценится выше, чем навык изобретателя. Изобретателей нужно 1% и не все готовы туда идти, а слесарей по изоленте и клею нужно в 99 раз больше и это более приемлемо для масс. Для инженеров, желающих менять мир это даёт простор для самовыражения. Мне больше изобретать нравится, но понимаю, что если не будет пользователей, то мои изобретения никому в хер не впёрлись)

[@kolyuchkin]

Таким софистическим методом можно и до "столба докопаться" (читай JVM), аргументируя это тем, что мол фиг знает, как там все исполняется, почему байткод тасуется, и т.д. Мол давайте все на ассемблере писать, а потом и в машинных командах... @Илья, не воспринимай это как хейт, тоже накипело)) На любом популярном канале (будь то по кузнечной тематике или по столярной) есть немалый процент комментаторов, которые ноют, что мол с "таким инструментом любой сможет". Фреймворки хороши тем, что их саппортят и развивают разработчики, используют многие программисты, есть качественная документация и комьюнити. А свой "велосипед" нужно каждый раз разрабатывать заново и тратить потом уйму времени на обучение новых разработчиков правильно "кататься на вашем велосипеде". А когда вы уволитесь с текущего проекта, то сначала вас проклянут преемники, а потом и менеджеры (нужно либо писать заново велосипед, либо тоже писать уже правильно).

[@letsCodeDru]

@@kolyuchkin всё верно. Фреймворки снимают с нас головняки на разработку, отладку, доведение до ума, саппорт и развитие шаблонного (ака болерплейт) кода. Разработчику остаётся вкусняшка: запилить на этом продукт, получить за это бабло и идти покупать "новый спортивный БМВ"))

[@alexalex4601]

идея видео, сам этот вадин - ф............. Это, видимо, новая политика канала - снимать всякую ......... , которая началась с http-сервера ))

[@alekseysverbeev2934]

> spring boot > vaadin > чистая джава

[@letsCodeDru]

Всё верно. На превьюхе честнее написал "без JS".

[@АлександрА-т5о4л]

отличное видео, спасибо!