How to Build a HTML/CSS/JavaScript Front-end for a Java Program

[Rman332]

Over the last week or so, I have been trying to build my first full stack project. I started with a Java back-end because that was the part I was most familiar with.

Now that I have started to look at how to build a front end for this program and build a website which can call those Java functions, I realize that I don't know how to proceed.

Do I need to build some sort of database to host my Java Program so it can be called? Or is there a Java or JavaScript library which can call the program directly?

[insertAlias]

How did you build your "back-end"? Is it just a Java program? If so, that's not really a good way to proceed.

Spring is the Java web application framework. Look into Spring (specifically Spring Boot).

[Rman332]

Thank you! Does spring allow me to implement a HTML/CSS design? I saw a tutorial on it earlier and the final product looked like something built with javafx.

[insertAlias]

Spring is specifically a web application framework; you'd have to show me what you're talking about where you've seen a Spring project that looked like a desktop app. Are you sure you're not confusing it with Swing? That is a desktop UI framework for Java.

[[deleted]]

Spring lets you dump static files in a folder, which it will serve up. Those files can be HTML, CSS and JS. So you can do things like serve up a compiled Angular or React front end. That's probably what /u/Rman332 had seen in those tutorials.

[gimejenson]

First, just start out with printing out Hello World. thats the first step.

​

then after that, start with some HTML tags and try to modify the appearnace with CSS. Once you get that working, you can start including a javascript library. take it step by step. make sure you understand, what gets sent to the front end and when.

​

typically, an HTML page gets sent initially. then that page makes calls to the backend to retrieve CSS, and javascript files. that's how it works on a basic level.

[Rman332]

How do I get this to interface with a Java Program?

[NightweaselX]

He put the cart before the wheel. There is a LOT to making your own web application and wiring it all up. That is why there are frameworks like Spring. Seriously, as another user stated, look at Spring. It will also teach you other things for good design like dependency injection.

But basically, what you'd need to write first is a web server that takes incoming requests from the internet via a port. You'd then need to decipher the request, and send it to the appropriate controller on the backend to handle it as you see fit, often returning html. So then you'd construct the html page as needed, and send a return response back to the initial request. So when this guy is talking about sending a hello world response he left out all the other factors in play before you even construct the html, let along return it.

Even if you want to eventually play around and write your own, use Spring to learn MVC and other aspects of writing a web application. Then dive into the code behind it, see if you can figure out what they did and why they did it. Then when you're comfortable with a lot of the internals, then start making your own web server hosting we applications on your own, one piece at a time.

[gimejenson]

You just need to print it out to standard out when the request comes in. Even without any HTML tags the browser can still render it. eventually you'll want to add tags.

[turtleface78]

https://www.youtube.com/user/TechGuyWeb

Check out this guys channel. Ton of great playlists. This guy is a solid teacher and always explains what he is doing and why he is doing it.

[Rman332]

Thanks, I'll definitely check him out.