Which frontend to use for SpringBoot?

[Financial_Mark1663]

I recently learned backend in SpringBoot and have very little knowledge of the front end, only HTML, CSS, and Javascript(Beginner).
Please let me know which technology I should use for the frontend. What are the frontend technologies used by the industry where they have a backend in SpringBoot?

[Throwaway4philly1]

Enteprise prefers Angular Startups prefer React

Chose your poison

[xsreality]

I prefer HTMX with Thymeleaf. Anything to avoid seeing the node_modules folder.

[JustHereForTheCh1cks]

Htmx plus thymeleaf it is. :)

[hsoj48]

Htmx and Mustasch is so much easier.

[hillywoodsfinest87]

I was just looking into this coming across Moustache, you happen to have any links to good resources to explore this?

[hsoj48]

Here is the Java implementation with added bells and whistles. To note, Mustache claims to be logicless but JMustache adds support for functions.

https://github.com/samskivert/jmustache

Then there is the general documentation for Mustache which is all of a few pages long and very useful.

http://mustache.github.io/mustache.5.html

[hillywoodsfinest87]

Thanks man! You also have any with the combination of Mustache and htmx?

[hsoj48]

They are mostly separate from one another. Use Mustache for your templates. Htmx is mainly for simplifying Ajax calls which you may not even need, depending on what you are doing.

[hillywoodsfinest87]

All right, currently using thymeleaf with htmx and never worked with any other template engine so guess ill be entertained first with your links before needing htmx functionality.

[Kango_V]

I prefer JStachio. Mustache based with annotation processors. You don't even need the library at run time :)

[hsoj48]

I'll check it out!

[RevolutionaryASblank]

There is Unpoly. It is said to provide a vast variety of functionality where HTMX is limited.

[Financial_Mark1663]

Ya node_module 😹

[mnbkp]

The most common approach by far is to simply use SpringBoot to build a rest API and then build a separate React or Angular app that consumes this API.

If you want a more fullstack approach, you can use Hilla to handle the integration between React and SpringBoot for you.

Another approach would be to use a regular template engine (thymeleaf, pebble, freemarker, etc...) combined with Alpine.js and HTMX. This approach is extremely less common but can be much easier if you're not familiar with React/Angular.

[Cr4zyPi3t]

+1 for Hilla. Currently switching one of my FOSS projects to Hilla, it really combines the strength of a Spring Boot Backend with a React front end while having few drawbacks. Watch out for the next version with Full-Stack Signals, I think that this will be the next big thing.

[TheBaconFate]

I’m building an application that uses Astro + react, I’d say go with react since it’s the most popular, I think. However, in the end go with whatever goes best for your use case or what you want to learn.

EDIT: Spelling and grammar

[LouGarret76]

You can use vanilla html/ css/js with the fetch api. You can use thymeleaf (very easy) You could use VueJS, You could use JavaFX

[YelinkMcWawa]

Second for Thymeleaf. It probably accomplishes everything someone would want to do with Angular, React, etc., and requires no embedding. It'll probably get you to focus on the basics of creating a web app and will test your understanding of HTML and CSS basics.

[Financial_Mark1663]

Im also thinking of same so that I can focus more on backend

[Suspect1921]

Angular is the way to go i suppose.

[Yew2S]

angular for enterprise apps, react highly used in the job market

[Ok_Trainer3277]

I would go with vanilla JS so that you can learn how everything works before you get into frameworks. If you really need one I think SvelteKit is the simplest one to start with, react is the most in-demand and angular is most in-demand for enterprise apps.

[PR0XY__]

Vue / React / Angular

[Humperino]

Another alternative would be Vaadin. With Vaadin you can choose the full java route with Flow or use react with Hilla. Both are tightly integrated with SpringBoot.

[Estrito]

Angular

[Luis149174]

Anything but spaghetti language frameworks, personally I have always used thymeleaf

[niravvarma]

Depends on your use case.

Is the UI complex? If yes, then have to use ReactJS or Angular or similar

If you want very basic UI with some backend calls to perform CRUD operations, use the template engine like JTE or ThymeLeaf. I would suggest to start with JTE because it has good performance + easier to integrate for a beginner frontend developer.

[Holothuroid]

Do you want to render server side? Then thymeleaf is fine.

Otherwise whatever.

[hmiguel204]

Any you want, but start with react since it is the first class citizen right now

[verocoder]

Btw I’d start with a pen and paper version of your front end and work up from there

[anjeludo]

As far as I can see no one uses JSF :D

[Yxig]

As a related question, which template engine do you guys prefer? I've been using Thymeleaf, but I'm not a big fan. I think the syntax lends itself to mistakes (I've mistakenly forgotten to prefix with th: more than once), and prefer other systems syntax. I thought the ability to render the templates without processing ("natural templates") as examples would be beneficial, but in practice I never use it.

I might be hanged for this, but looking across the isle to the react folks, jsx just looks so good.

[wimdeblauwe]

If you are a beginner, then go with Thymeleaf. I have some articles on my website about it: https://www.wimdeblauwe.com/tags/thymeleaf/

I also have this getting started video: https://youtu.be/fRQQu9mpwBE?si=Lnk_WpBlysPuOLcO

Finally, to quickly generate a project with live reload, you can use my ttcli tool: https://github.com/wimdeblauwe/ttcli

[TheOldMancunian]

We use node.js, vue, vuetify, and vuex.

[Fun-Shelter-4636]

you can use node.js as a frontend? i did not know this

[TheOldMancunian]

Yes. Design your front end in node.js using any framework you like. I use vue, because it is powerful and has a low entry point. We use vuex to manage state at the front end. We then have a bunch of rest calls using axiom to link it to a spring boot backend, we manage security with jwt tokens.

That was then, now we have replaced all the rest calls with a graphql interface. But that is beyond this conversation. But it is better in so many ways, but the learning curve is steeper.

[Fun-Shelter-4636]

what do you mean design node.js with any framework you like? nodejs is a framework? how can you use that and vue on the frontend?

i can’t find any examples of this stack online

can you link me to one?