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
Collaborative Project with @JuliAlchemDev - HTML, CSS, JS, Jest, Git
#bem#accessibility#jest#nodeLVL 3Submitted 23 days agoTo-do App with Reactjs, Node.js, Express.js and Neon DB
#react#node#express#postgres#sass/scssLVL 2Submitted about 1 month agoMortgage Repayment Calculator using React, SASS and React Hook Form
#accessibility#react#react-hook-form#sass/scss#nodeLVL 3Submitted about 1 month agoInteractive Comments Section
#node#mongodb#react#tailwind-css#expressLVL 3Submitted about 1 month agoResults Summary Component with SASS and React
#sass/scss#react#vite#accessibility#nodeLVL 3Submitted about 1 month agonextjs, react, css, html, javascript, nodejs, vercel, responsive, api
#next#react#nodeLVL 3Submitted about 1 month agoResponsive shopping page using tailwindcss, html and javascript
#tailwind-css#nodeLVL 1Submitted 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,146,987 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

























