What is Node.js?
Node.js is a runtime environment that lets you run JavaScript outside of the browser. Normally, JavaScript is the language of the web—it runs in your browser to make websites interactive. Node.js takes that same language and lets you use it on a server, which means you can use JavaScript to build the backend of a website, not just the frontend.
Before Node.js came along, developers who wanted to work on both the frontend and backend of a website typically had to learn two different programming languages. Node.js changed that by making JavaScript a full-stack language that works everywhere.
Why learn Node.js?
If you've been learning or already know some JavaScript, one of the biggest benefits of learning Node.js is that you don't need to pick up a second programming language to start building backends. You can use the same JavaScript skills you've been developing for the frontend and apply them on the server side too.
Learning Node.js also opens up a lot of doors if you're getting into web development. It's one of the most in-demand skills in the industry as it lets you build fast, scalable applications and has a massive ecosystem of open-source packages through npm (Node Package Manager).

Practice Node.js on Frontend Mentor
Reading articles and watching videos to learn about Node.js is great, but actually building with it is where the real learning happens. That's exactly what Frontend Mentor is designed for.
Frontend Mentor gives you realistic, professional-looking projects to build from scratch. Although most of these projects are front-end focused, many of them can be built as full-stack apps, which will push you to use JavaScript both on the frontend and the server side and help you connect the dots between the two.
Recommended Node.js challenges
Hand-picked challenges to help you practice Node.js at every skill level.
- Free
Interactive comments section
- HTML
- CSS
- JS
intermediateThis is project will put your JavaScript skills to the test. We provide a JSON file to pull the data, but it's also a perfect project to build as a full-stack CRUD app!
- Free
Todo app
- HTML
- CSS
- JS
intermediateThe classic todo app with a few twists! This app includes a dark/light theme toggle and drag & drop reordering for anyone wanting an extra test.
- Premium
Personal blog
- HTML
- CSS
- JS
intermediateThis multi-page personal blog project has a JSON file to practice working with dynamic data. You can even use a headless CMS to take the difficulty up a notch!
- Free
Multi-step form
- HTML
- CSS
- JS
advancedAn excellent test for your form-building and JS skills, this project will pose many challenges along the way to completion.
- Free
REST Countries API with color theme switcher
- HTML
- CSS
- JS
- API
advancedIf you're wanting to test your JavaScript skills this is the challenge for you. Use whichever JS framework you prefer and pull data from the REST Countries API.
- Free
Job listings with filtering
- HTML
- CSS
- JS
intermediateIn this challenge, you'll be using JavaScript to filter out jobs based on selected categories. We provide a local JSON file to help you practice working with JSON data.
- Premium
Note-taking web app
- HTML
- CSS
- JS
advancedThis project has many fun and challenging features to add, including color and font themes. It can also be built as a full-stack web app!
- Premium
Personal finance app
- HTML
- CSS
- JS
guruThis app contains 5 pages (Overview, Transactions, Budgets, Pots, and Recurring Bills) and includes a lot of tricky elements. You can also build it as a full-stack app!
- Premium
Invoice app
- HTML
- CSS
- JS
guruThis invoicing app project will test you on many levels. You'll be working with JSON data, managing state, plus a lot more. You can even build it out as a full-stack app!
Solutions made with Node.js
Built a todo task manager with user authentication Using React & Node
#react#node#expressLVL 2Submitted 4 days agoFeedback App with React, Node and PostgresSQL
#react#node#postgres#tanstack-query#expressLVL 3Submitted 7 days agoResponsive Todo App built with CSS custom properties, Flexbox and ES6+
#accessibility#animation#node#viteLVL 2PSubmitted 12 days agoAngular Bank Page (FrontEnd/Backend)
#angular#typescript#node#express#mongodbLVL 3Submitted 17 days agocss flexbox javascript Dom html
#pure-css#bootstrap#react#node#react-hook-formLVL 2Submitted 25 days agoBrowser UI Extension with Vue, Typescript frontend, NodeJS backend
#vue#typescript#node#axios#viteLVL 3Submitted 26 days agoCollaborative Project with @JuliAlchemDev - HTML, CSS, JS, Jest, Git
#bem#accessibility#jest#nodeLVL 4Submitted about 2 months ago
Related tags
- #react
React is a popular JavaScript library for building user interfaces. It is efficient and declarative, using a virtual DOM to optimize updates to the UI. React is often used with other libraries or frameworks.
- #vue
Vue.js is a progressive, reactive JavaScript framework for building web applications. Its adaptable architecture enables seamless integration with other libraries or existing projects, while its core library focuses on the view layer, making it easy to learn and use for a variety of applications.
- #angular
Angular is a robust, open-source front-end web application framework developed by Google. Featuring a component-based architecture, powerful data binding, and extensive tooling, Angular simplifies the development and testing of large-scale, maintainable web applications.
- #next
Next.js is a framework for building server-rendered or statically exported React applications with automatic code splitting, optimized performance, and easy deployment.
Join 1,154,235 people building portfolio-worthy projects
Our highly supportive, positive community is here to help you improve your skills. We all try to help each other out wherever possible. We’d love to welcome you to our community!
Log in with GitHub

























