Main image of article How to Become a Full-Stack JavaScript Developer

Despite its age, JavaScript remains an immensely popular language deployed in a galaxy of applications and services. If you want to become a full-stack JavaScript developer, you’ll need to learn how to use the language in conjunction with other languages and tools to build both the front- and back-end portions of the project.

In simplest terms, the part of the application that runs in the browser is known as the front end; the part involving the servers is known as the back end. The front end is written in JavaScript, because that’s the language the browsers understand. For the back end, you have many choices for languages, but one popular choice is to also use JavaScript with the help of a system called node.js. Let’s explore what you need to become a full-stack JavaScript developer.

Learn JavaScript and Most Likely TypeScript

JavaScript is generally considered a pretty easy language to learn, but it’s also a bit messy; if you don’t know what you’re doing, you can quickly generate many bugs. that reason, a lot of developers have switched to TypeScript to build their JavaScript apps. In this approach, you write your code in TypeScript, and the TypeScript compiler generates JavaScript based on your code. This resulting JavaScript code can then be run on the back end using node.js.

As a full stack developer, you’ll want to learn both TypeScript and JavaScript. Even though you’ll likely be coding mostly in TypeScript, you’ll still need to understand the JavaScript code, especially if you’re tinkering with any kind of legacy app or service.

The best place to learn JavaScript is by reading through the documentation put together by the Mozilla Developer Network (MDN). To learn TypeScript, you can start with the official website. Given the intense popularity of JavaScript, there are lots of other free resources available online, such as this extensive tutorial from w3schools.

Master Node.js and Its Tools

In order to effectively write backend code in JavaScript and TypeScript, you’ll need to completely master the entire node.js infrastructure. Node.js includes a package manager called npm, which is a tool that lets you easily pull down libraries of JavaScript code and add them to your application. As a JavaScript developer, you’ll want to be comfortable searching for node packages found at npmjs.com and then installing the packages you find using the npm command-line tool; that’s including as part of node.js.

Regarding packages and your code, you’ll also need to understand:

  • Package names get saved in a file called package.json. Learn the structure of this file and how to manually modify it.
  • Learn how to set up your .gitignore file to not include the node_modules folder (which is where all your npm packages get installed) when you push to GitHub. (This means learning how to use both git and GitHub.)
  • Learn how to add scripts to your package.json file and run them from the command prompt.

You’ll also need to know how to run tests. There are a few testing frameworks in node.js, the two most popular being mocha and jest. They’re very similar; pick one to learn first, and then experiment with the other so that you’re eventually comfortable with both.

Next, if using TypeScript, you’ll need to know how to package up your resulting JavaScript code such that it can be deployed on your server.

Learn the Basics of Databases

The vast majority of JavaScript full-stack positions will require database work. As a developer, you’re generally expected to just know how to use databases. MongoDB is a database that’s popular among JavaScript developers, because its data is stored in a way similar to how JavaScript stores its objects. It’s pretty easy to get up to speed on MongoDB just by browsing the documentation and practicing with the official node.js MongoDB drivers. Using the driver, you’ll want to practice writing code that reads and writes data to a MongoDB collection.

A lot of teams don’t use the native drivers and instead opt for a package called Mongoose, which makes writing MongoDB code far less error-prone. Mongoose is a type of library called an ORM, which stands for Object-Relational Mapping. Mongoose allows you to build ‘schemas’ that describe how your data is stored in a MongoDB database. Mongoose takes care of a lot of the hard work with reading and writing data; it can be a bit overwhelming to learn, so start with the basics, such as with this article on MongoDB’s site.

Some JavaScript development teams prefer to use a relational database; one of the more popular is MySQL. For this, you’ll want to learn how to install MySQL along with a tool called MySQL Workbench; from there, practice your SQL inside Workbench. Specifically, concentrate on creating databases, tables, adding data to tables, querying tables, and updating data, and deleting data from tables. Then, to use MySQL in your node.js application, you’ll need to use a MySQL driver (such as this one, called mysql2).

Learn to Build the Front End

At the heart of the front end is HTML and CSS. These two technologies describe what a web page looks like. A typical full-stack developer needs to be highly skilled in HTML. As for CSS, the more you know the better, but you can get away with not being an expert in it. Learn the basics while saving your neurons for mastering JavaScript and TypeScript. Most full-stack teams have designers who are experts in CSS and can take care of the hard parts.

The best place to learn HTML and CSS is back to the MDN mentioned earlier; go here for HTML and here for CSS. When you build your front-end application, you’ll use your JavaScript (or TypeScript) skills to write code for the browser. Before you can take that step, though, you’ll need to learn how to use a framework.

Front-End Frameworks

The browser was originally created to primarily display web pages. But over time, browsers have evolved to run entire apps written in JavaScript. However, the whole way the browser displays and manipulates the user interface is strange and somewhat difficult to program with. You can do it with just JavaScript, but life becomes much easier if you use a front-end framework.

Currently the two most commonly used ones are Angular and React; you will need to pick one and learn it. Ideally, you’ll want to become highly skilled with just one, and spend a little time becoming familiar with the other.

Pro tip: Don’t try to master both Angular and React unless you want to be primarily a front-end developer. As a full-stack developer, you need to learn lots of different technologies; senior developers and managers interviewing you would be very skeptical if you claim to be a full stack developer who is an expert JavaScript/TypeScript programmer as well as an expert in both React and Angular.

Completing the Picture

In addition to learning how to code the back end, front end, and manipulate databases, you’ll need to learn a few additional technologies to complete your resume. These include:

  • Learn git and GitHub, as mentioned earlier. This is an absolute requirement for any development job today. Learn how to create branches, commit code, push branches to GitHub, and how to merge branches using pull requests. (There’s a whole lot more you can learn with git, but this covers the majority of what you’ll need to know.) Also, make sure you know how to use the command-line version of git, not just the git tools built into VS Code, which is mentioned next.
  • Learn to use an IDE. Right now, the most popular IDE for JavaScript development is Visual Studio Code, usually shortened to VS Code. (This is not the same as Visual Studio. Microsoft created a new IDE a few years ago and named it after its existing flagship IDE. While you can use the full Visual Studio to do node.js development, you most likely won’t be using it in the field. Learn VS Code instead.)
  • Learn Docker. Most applications today are deployed in what are called containers, which are essentially very small virtual machines. Docker is a system for such containers. You will want to learn how to create images and containers and how to run your back-end code in containers.
  • Learn AWS or Azure or Google Cloud. Pick one of the big three and become familiar with deploying apps. All three of these cloud platforms are utterly massive, and it’s easy to get overwhelmed learning them. Don’t try to learn everything; focus on learning how to deploy apps, databases, and containers.

Conclusion

A full-stack JavaScript developer needs to know a lot of technologies. Don’t try to learn it all at once. Take it slowly. And as you’re studying and practicing, consider specializing. For example, you might find you really enjoy working on the front end, but not so much on databases. If this happens, definitely focus your efforts on what you enjoy and master tools and languages such as CSS, Angular, and React. The popularity of JavaScript ensures there’s likely a market for your skills, no matter what you choose to focus on—the goal is to just get good at it.