If you’ve ever looked at a web app and wondered how long it would take to build something like that yourself, the first question you should ask yourself is: Which JavaScript frameworks could you use?
With JavaScript, a popular programming language for beginners, frameworks are pre-written collections of code that you can use as a foundation for the code that you write. Although JavaScript frameworks can save you time and heavy lifting, using them isn’t cheating — it’s smart.
Frameworks enable you to do more things in a shorter amount of time and with fewer lines of code, explains Jiwon Shin, Senior Curriculum Developer at Codecademy. Developers should know how to utilize JavaScript frameworks to accomplish routine tasks. “No professional or industry is going to ever do anything without those frameworks,” Jiwon says.
Here’s what you need to know about JavaScript frameworks, and how to choose a beginner-friendly framework that’s right for you.
What are JavaScript frameworks?
A JavaScript framework is prewritten code that you can utilize and build upon, rather than having to write all of your code from scratch. “Frameworks provide you with a blueprint, so that you can use little bits to create a whole structure, and then you can style it in your own way,” Jiwon says.
You might’ve heard devs use the phrase “vanilla JavaScript,” which sounds like a fancy coffee order, but actually refers to bare-bones JavaScript code that doesn’t incorporate any frameworks or libraries. “The whole point of having a framework is really that it takes care of things for you that you might not think about,” Jiwon says. For example, an app that would take you hundreds of lines of vanilla JavaScript to code could be done in half that using a framework.
Frameworks not only make you a more efficient developer, but they also reduce the likelihood that you’ll make mistakes or errors, since the code has already been written and tested by other devs.
So, which JavaScript framework should you learn first?
That depends on what your goal is. For starters, figure out if you want to work in front-end or back-end development. “Are you interested in coding things behind the scenes and doing all the operations of a web app?” Jiwon says. “Or, are you interested in rendering what people actually see?”
Each JavaScript framework has its own official website (for example, React.js or Node.js) where you can download it and begin using the product. Our framework courses will walk you through exactly what to do next and how to utilize all of the features.
React.js
If you ultimately want to focus on front-end development, Jiwon suggests that you start with React.js. In a 2021 Stack Overflow survey of 60,000+ developers, React.js was the most widely used web framework. And it makes sense why React.js tends to be a front-end favorite: It allows you to build dynamic and interactive web apps that are scalable.
In our course Learn React, you’ll get comfortable using JSX, a syntax extension of JavaScript, and learn how different React.js components interact with each other. You’ll also hone your React fluency working on a project that involves setting up an authorization layer for a website.
Good to know: There’s some debate about whether React.js is technically classified as a “framework” or a “library,” which is another set of previously-written code that you can use to build your own code. The subtle distinction might make your head spin, because both libraries and frameworks contain pre-written code that helps you do something. “The difference between a library and a framework is that frameworks generally give you structure for the whole web app,” Jiwon says. “A library will help you achieve one specific goal.”
Node.js
For folks who are more interested in back-end development, then it’s “Node.js all the way,” Jiwon says. Node.js is both a framework and a JavaScript runtime environment (which means that it runs a server in the language) for building desktop applications. Node.js is equipped to handle asynchronous JavaScript code, which means it can run programs while waiting for a longer-running task to complete.
Check out our course Learn Node.js, which will teach you the basics of back-end web architecture and how to write server-side logic. While learning Node.js, you’ll discover that there are lots of different modules, which are built-in features that interact with the command line. For example, in the course, you’ll get to make your own HTTP server for an online Rock-Paper-Scissors game.
Getting started with JavaScript frameworks
Before you jump into a JavaScript framework, you’ll need to be familiar with JavaScript syntax, so you can understand the code that you’re copying, pasting, and altering, Jiwon says. Start with our course Learn JavaScript to get a handle on the fundamentals of the programming language. If you already know some JavaScript, Learn Intermediate JavaScript might be a better option — though it’s not a requisite to start on frameworks.
If you’re really ready to take the next step and want to pursue a tech career, check out our Front-End Engineer or Back-End Engineer career paths for in-depth practice and lessons that will get you ready to interview for jobs.
And remember: Everyone has different learning styles and philosophies, so you’re not limited to these beginner-friendly frameworks. If you’re someone who likes to dive in and learn by doing, don’t be afraid to explore more advanced frameworks (like Angular.js), Jiwon says. You really can’t choose the “wrong” framework, and there’s a good chance you’ll touch on lots of other frameworks as you progress as a developer.
