[Twitter-app: Spring boot 3, React 18] 35 Добавляем роутинг (react-router-dom)

#fullstack #react #reactrouter
В этом видео добавим функционал по роутингу (переходу между веб страницами приложения).
Ссылка на github: github.com/SLa...

[@eduardklygunov1412]

спасибо большое за видео!

[@ram0973]

Попробовал tanstack router вместо react-router, файловый вариант. Очень медленный, по 2 раза рендерит компоненты (на гитхабе есть issue). В общем кажется пока сырой) Из плюсов - дерево роутов наглядно лежит по папкам и файлам. И есть примеры для Router Query

[@sergey_labuzov]

Это хороший опыт для вас, уже можете сравнивать две реализации и выбирать наиболее подходящий вариант. Tanstack router очень похож на роутинг Next.js

[@ram0973]

Здравствуйте, можно вас попросить забежать вперед и записать короткое видео, как упаковать приложение реакт в jar со спрингом? Не терпится свой проект блога на vps выложить...

[@sergey_labuzov]

Здравствуйте. В планах реализовать очень маленький проект с полным циклом разработки серверной и клиентской частей. Но сейчас времени катастрофически не хватает на новые видео. Наслаждаюсь отцовством :) На самом деле все эту задачу можно реализовать достаточно просто (если говорить про ручные манипуляции). Последовательность действий: 1. Билд фронта ( npm run build ) 2. Все файлы из директории dist переносим в директорию resources/static 3. Билдим в JAR. + 1. Нужно будет добавить фильтр для отображения клиента Пример реализации фильтра: github.com/jhipster/jhipster-sample-app/blob/1ef3d9e0170abd923f2f7dd8c928d9cdc858a0b3/src/main/java/io/github/jhipster/sample/web/filter/SpaWebFilter.java#L10 2. Подшаманить конфиг (52 строка) github.com/jhipster/jhipster-sample-app/blob/1ef3d9e0170abd923f2f7dd8c928d9cdc858a0b3/src/main/java/io/github/jhipster/sample/config/SecurityConfiguration.java#L7

[@ram0973]

@@sergey_labuzov Спасибо большое!

[@ram0973]

Попробовал сделать Crud для сущности User. Вывожу таблицу пользователей и 3 иконки (исправить, удалить, просмотреть) и действия на них. При удалении вылезает Модальное окно с подтверждением. Также сделал переключатель enabled и при нажатии - срабатывает обработчик, который выводит Chakra Alert - успешно или неуспешно отработал бэкенд. Но получился такой винегрет из тегов Чакры и обработчиков событий, как интересно всё это красиво разложить...

[@sergey_labuzov]

Добрый день. Есть ссылка на репозиторий с кодом?

[@ram0973]

@@sergey_labuzov приложил ссылку, но ютуб её удалил 😂👍Я просто видимо забежал вперед.

[@sergey_labuzov]

Тогда переходите в гит ( github.com/SLabuzov/twitter-client-app/issues ) и создавайте новый тикет, в котором указывайте все что пожелаете 😁

[@bbrother92]

Разве

[@sergey_labuzov]

вопрос не дописали?

[@bbrother92]

@@sergey_labuzov разве бывают вакансии фулстек джава +js?

[@bbrother92]

вроде бы это как оч маленькие контрактные работы. Я вообще не видео не одного фулстек джава в более менее крупных компаниях

[@sergey_labuzov]

Естественно 🙂

[@sergey_labuzov]

Ох-ох-ох. Давайте порассуждаем немного. У нас все такие компании продуктовые или больше ориентированы на работы на внешних заказах? Если Вы ответили «оутсорс», значит условия будет выставлять именно заказчик. И вот здесь уже как богатый дядя скажет, так и будет. И совсем будет неважно, большая IT компания или маленькая. Зачастую, при ограниченном бюджете в приоритете будет именно фулл-стек позиция. Ну а если бюджет нужно распилить, нет лимитов, тогда велика вероятность разделения позиций на бэк и фронт. П.С. Многие ребята со знанием только серверной части сталкиваются с трудностями при желании реализовать какие-либо свои идеи, где нужно понимать не только бек и фронт, но и немного девопс части.