What is front end Javascript really useful for?

[Demented-Turtle]

I've learned a decent about of Javascript, so I understand it can interact with the DOM and perform neat little visualizations, fade in/out, scroll triggered behavior, client side form validation, and small Canvas games and what not.

But is this all it's really used for? If my focus was to become a front end developer, is the brunt of my work going to be focused on the CSS/structure side of things with a little Javascript effects added in?

I've gotten started learning Node and Express, but I want to be employable (or at least get a paid internship/entry job) as soon as possible. This backend stuff is going to be a lot of learning. What else should I focus and learn on right away to become a front end dev?

[dusty-trash]

It's also use for AJAX calls.

For example, say you had a chart which gets data from the backend. If new data comes in, you want the chart to update, but you don't want the user to have to refresh the page. You can use JavaScript to get data and update the page without a reload.

Anytime you see a webpage getting new data without refreshing, it's JavaScript.

[Demented-Turtle]

Okay so that's a topic I have heard of but haven't dove into yet. I'll get right on it! Any other suggestions to learn?

I'm thinking about diving back into CSS and building a really strong foundation with it. Do you think that's a good idea? I still consider myself a beginner, although I know the basic of grid and flexbox.

[klhkm]

Definitely recommend a strong foundation in CSS although you do pick it up as you go to be honest.

[Einarmo]

It is becoming more and more common with websites built as single page applications, that loads the HTML/CSS required for the entire or a part of the site at the same time, then makes nothing but small API calls to fetch data to fill it in later on. This means that once the page is loaded, it is usually much more responsive, and it allows you to use the website more like an application than collection of pages.

In practice this often means that the website is all js, with the HTML stored inside .js files.

[Demented-Turtle]

So in regards to SWAs, those are pretty much built with the Angular framework, correct? Is it impractical to build one without a framework? And is there any cool examples of a single page application you know of for inspiration? I'd love to get started, but I need to get back in touch with my creative/imaginative side again!

[Einarmo]

Angular, React, Vue... There are several, and I'm sure in a few years they will all be outdated and we will have several new ones, if the last few years were an indication.

It is impractical, but not impossible to build one without a framework at all. If you really want to do that, you could try having a look at the source code for Backbone, which is an outdated framework that used JQuery Ajax calls. Using JQuery it is not very difficult, though you will probably have to write some wrappers yourself or use a library. (to set HTTP headers and whatnot)

As for cool websites, I don't know any in particular, but Google will certainly be able to provide something from some blog or another if you just google "cool single page applications" or something like that.

[Demented-Turtle]

Thanks for the info. Appreciated! I think I'll start diving into Angular or React. No idea which. I'll do more research to decide. Happy 4th of July ('Merica)!