Boot.dev Blog ยป Javascript ยป Top 4 Practical Uses of JavaScript

Top 4 Practical Uses of JavaScript

By Zulie Rane on January 30, 2022

Curated backend podcasts, videos and articles. All free.

Want to improve your backend development skills? Subscribe to get a copy of The Boot.dev Beat in your inbox each month. It's a newsletter packed with the best content for new backend devs.

JavaScript is one of the most versatile programming languages, maybe even more flexible than Python. JavaScript is used on both the front and back end of web systems. Because of that, of the 1.8 billion websites in the world, 95% of them use JavaScript. It’s hard to interact with the modern Internet, with its pretty graphics and interactive maps, without using JavaScript. Enable Marketing says the top four qualities of a visually appealing website are design and color, graphics and visuals, usability, and consistency. JavaScript is a major player in all four of those attributes.

JavaScript was originally designed to elevate websites above simple HTML and CSS. It is used to make web pages interactive. It was intended as a scripting language for web browsers. It’s still used for that today, but also so much more. If you want to run programs in the browser, JavaScript is the language to do it in.

What makes JavaScript so perfect for the web is that it is able to be fully integrated with HTML and CSS, the building blocks of every single page on the internet.

JavaScript is often the language of choice for learning how to program. It’s well-known for not being fussy and is generally easy to work with, making it an ideal choice for beginners looking to teach themselves how to program. Since it’s so diverse in its uses, you can “learn once, write anywhere,” as React Native claims. Let me fill you in on all the things JavaScript is used for.

Frontend web development with JavaScript ๐Ÿ”—

When asking “What is JavaScript used for?” it’s important to know that JavaScript is what makes web pages more interesting than a downloadable PDF. HTML and CSS are used to give web pages their structure and style, but JavaScript is absolutely necessary for sliders, pop-ups, accordions, and more.

JavaScript is great for adding functionality to web pages, like form validation to check if what the user entered as an email address fits all of the requirements. JavaScript is the dominating language to run code in the browser. If you want anything more advanced than essentially pretty-looking text on a page, you’ll need to use JavaScript.

JavaScript has a bunch of uses when it comes to frontend web development, including adding new HTML content to the page, changing existing content, and modifying styles (like making a “submit” button disappear after it’s been clicked). More specifically, it allows the website to react to user actions and run things on mouse clicks or key presses. JavaScript can also handle [sending requests] “over the network to remote servers, downloading, and uploading files”

Another really cool thing that JavaScript allows you to do when developing websites is that it allows you to store data in your user’s browser. There are a few limitations to this, due to storage size limits and security concerns. But apart from this, client-side storage can be very useful. You can store a user’s personalized site preferences or save previous site activity, like the contents of a shopping cart or whether they have already logged in.

Mozilla highlights another application of JavaScript in the browser, which is to store"data and assets locally so a site will be quicker." If your website consists of two pages, and an API call is made to retrieve the data for each page when the user loads it, you can cache the data that was loaded for each page the first time the user visits. The user can switch between the different pages of your website without having to constantly reload the data, which will significantly reduce load times.

JavaScript is widely known for making the Internet pretty. There are a lot of great JavaScript libraries out there for graphics and data visualization, like d3. Many developers are even using the native HTML5 canvas API to build beautiful designs on the web. Even the New York Times uses HTML and JavaScript for most of their graphics, and “many staffers use D3.”

You may remember the New York Times’ visual coverage of the global Covid-19 outbreak, like this one. Americans alone use 4.2 million GB of internet data every single minute. Big data is here to stay, and to make sense of all of this data, we need data visualizations. There are so many different ways to visually represent data, from a simple pie chart to heatmaps of electricity sources. JavaScript is a must-use web development programming language for visualizing complex data sets.

Web Server and Server Applications with JavaScript ๐Ÿ”—

What is JavaScript used for, other than the frontend web? Well, the Node.js framework is used to create server-based applications. Node.js enables JavaScript code to be run on the server. The results are then downloaded and displayed in the browser. Node.js also has an HTTP module that can be used to build an HTTP server. Node.js was designed to build scalable server applications.

The Node.js environment can be run on OS X, Windows, and Linux. It also includes a bunch of Javascript libraries, which allow developers to leverage open source components and tools to get their applications built faster. Unlike other server-side platforms, like the Apache HTTP server, Node.js is a single-thread server. It is also, however, completely asynchronous. All of Node.js’s associated libraries are also asynchronous. This takes away the headache of developing a thread-safe program, and you don’t have to mess around with locks.

Some people make the argument that Java is better for the backend, but in my experience, Node.js can be just as performant than Java on the server-side, especially since a Java server uses 2MB of RAM just to create a thread. You could have hundreds of thousands of threads if your website is popular or users are doing a lot at the same time, and those 2MB of RAM per thread can quickly add up. Node.js is superior when it comes to delegation, as it is able to handle tons of requests on a single thread. Since Node.js is a single-threaded server, RAM usage isn’t nearly so much of a concern.

Mobile Apps with JavaScript ๐Ÿ”—

So far, we’ve answered the question “What is JavaScript used for” by discussing its purpose in the frontend and backend. However, there’s more. Since JavaScript is good at enhancing interaction within a user interface, it makes sense that there are tons of very popular JavaScript frameworks for mobile app development like React Native, NativeScript, Ionic, Mobile Angular, and more. Just as JavaScript makes web pages interactive, it also provides a lot of cool functionalities to mobile apps, like 2D/3D animated graphics with Three.js.

So many of the popular JavaScript mobile app development frameworks are intended to be used for cross-platform development, or as the Asper brothers put it, “building a single application that can run on various operating systems.” There is a long list of JavaScript frameworks that make your life a lot easier by enabling cross-platform development, like NativeScript, Ionic, Vue Native, and others.

By using JavaScript’s service workers, you can optimize how your mobile app (or web app) behaves with a slow or no internet connection by maximizing the use of the cache and storing network requests. A great metric to follow is how long it takes to get meaningful content on the screen for the user. You want to create a great experience for your users, regardless of how good their internet connection is. You can use the service worker API with Node.js to reliably and instantly load your app’s content onto the screen.

Machine Learning with JavaScript ๐Ÿ”—

And other than those three uses, what is JavaScript used for? Although Python tends to dominate the machine learning stage, there is a growing group of developers that choose to implement machine learning models using JavaScript. The famous Python machine learning package TensorFlow also has a JavaScript version, TensorFlow.js. TensorFlow.js can be used to develop machine learning models and makes machine learning models directly available in the browser or on the backend, using Node.js.

The classic way in which machine learning developers make their models available is by having them run on a server and allow requests and share results via an API. There are several situations, however, where it is advantageous to run the model on the end user’s device. For example, the model that recognizes the faces of your contacts in the photos that are stored in your phone could be run locally on your device, so your photos remain private and never leave your device.

Another advantage of machine learning with JavaScript is that your machine learning application can run in all modern browsers, which makes it accessible to a lot more people than if they have to set up their development environment to get your Python code running. TensorFlow.js allows you to convert Python TensorFlow models to run in the browser too, so you can take any work you’ve already done there and convert it. There are tons of cool projects that use TensorFlow.js for live tools, like YouTube’s LipSync or this model used to classify baseball pitch types.

Career Possibilities with JavaScript ๐Ÿ”—

Those four uses are valuable to know, but anyone asking “What is JavaScript used for?” probably has a more practical purpose for asking: jobs. The beauty of JavaScript is how much of the tech development stack it covers. From cool animations in the UX to server-side applications using Node.js, there’s a lot you can do using just JavaScript. If you can code using JavaScript, you open yourself up to a lot of potential jobs including frontend web developer, web app developer, JavaScript developer, and UI/UX designer.

A frontend web developer would be responsible for everything from writing use case stories, implementing features in the UX, and integrating the UX with APIs. The main technologies used will be HTML, CSS, and JavaScript. The average base pay for a frontend web developer in the US is $73K and can range up to $113K or $134K for more senior positions.

A web app developer is “a software designer or engineer who is involved in the development and design of web and/or network applications,” according to InfoSec Institute. This role involves more devops responsibilities than a pure frontend web developer and includes developing and managing software packages and installation programs for websites. You can also be expected to improve performance and improve SEO. A web app developer is paid similarly to a frontend web developer. The average base salary in the US is $75K, and more senior positions can earn more towards $100K+.

A JavaScript developer tends to be more full-stack. They are responsible for connecting front-end and server-side application components and logic. You’ll be expected to be skilled with frontend and backend technologies, so it’s best to be competent in JavaScript, HTML/CSS, a frontend framework like React, and either Java, C#, or Python for the backend. GreyCampus has put together a comprehensive list of technologies that you should know as a fullstack developer. Since fullstack developers are expected to have a wider range of skills, pay tends to be a little higher. The average base pay for full-stack developers in the US is $85K, and it can range up to $136K.

A UI/UX designer is responsible for designing the user faces of a website or application. They focus on the user experience and consider how things look as well as how easily users will understand the interface. A UI designer would decide how the frontend that a frontend or web app developer would implement. They are also responsible for understanding the priorities of the customer and integrating those into the experience. To understand the difference between UI and UX design, check out this explanation from Celarity. A UI/UX designer earns on average $96K and those at the top of the career ladder earn around $150K.

Why use JavaScript over other languages? ๐Ÿ”—

When asking what is JavaScript used for, it can seem that the answer is everything. Why is it chosen over other languages?

To begin with, JavaScript is one of the easiest programming languages to learn as your first programming language. Its syntax is super simple, so if you already know how to program using another programming language, learning JavaScript will be extremely fast. JavaScript is a great language to learn because it allows you to gain experience across the development stack.

If you don’t know yet whether you only want to do frontend or never want to touch another UI, JavaScript lets you keep your options open. Since it can be used across the development stack, you can simultaneously improve your frontend and backend skills. This’ll give you time to figure out what you like best, and it will help you qualify for more job opportunities. From frontend widgets to machine learning models, there’s little that JavaScript can’t do.

Find a problem with this article?

Report an issue on GitHub