HTML, CSS JavaScript practice exercises

JavaScript is a language that can be intimidating for newcomers. But it’s actually easier than it seems.

One of the ways to get started is to do practice exercises. But there are so many online that it can be hard to choose the right ones for a beginner.

Before you go and do exercises, it’s best to learn a little about the subject. In this article, we’ll be introducing JavaScript and give you a curated list of the best JavaScript practice exercises to get started.

What is JavaScript?

JavaScript (not to be confused with Java) scripting programming language that appeared in 1995 and is at the core of the modern World Wide Web. While HTML takes care of the content and structure of a page and CSS of the style, JS is used on the client-side for the behavior of a page—it makes it come to life.

However, JavaScript is more complex than the first two. It lets you do things like:

  • Auto-update content, like a social media feed

  • Animate visual elements

  • Add visual feedback on user interactions

  • Add interactive maps

  • Trigger pop-ups/offers after user actions

It’s a high-level, interpreted language just like Python. High-level means that a lot of abstraction is made, so you don’t have to deal with memory management as you would with low-level languages like C or C++. Interpreted means that you don’t need to run it through a compiler, and the language can be directly executed by your computer’s processor.

JavaScript is also multi-paradigm so that you can write your code in a variety of ways, like object-oriented or functional.

Behind JavaScript exist a convention called ECMAScript. It is the scripting language specification it’s based on. It defines language lexicon & syntax and the APIs that should be made available in it.

With time, many frameworks have been developed to improve the functionalities and development of JS. The most popular ones are React (and Next.js its sub-framework), Vue (and Nuxt.js its sub-framework), and Angular.

What can it be used for?

It can be used in the front-end and run on the client-side/browser or in the back-end with node.js.

It’s your browser’s programming language, meaning it's the only language browser can execute. But JavaScript isn't only restricted to websites. With it, you can build:

  • Complete full-stack web apps

  • Mobile apps (with React Native or Ionic, for example)

  • Desktop apps (with Electron.js),

  • Complete shopping cart solutions

  • And more

Why learn JavaScript?

Well, as you probably already observed, JavaScript is a powerful programming language that can be used to do a lot of things. It’s also very fast and relatively easy to learn compared to other languages.

Here are the reasons why you should learn JS:

75% of companies are looking for JavasScript web developers.

As we’ve seen earlier, JavaScript can be used to build almost anything for the modern world. Learning this language will enable you to be versatile in the different tasks you’ll have in your career.

JavaScript is one of the easiest scripting languages out there. A lot of tools for debugging, for example, are also available to make your life as a newcomer a lot easier.

Since it’s one of the most popular programming languages, there are a lot of resources to get started. From books, blog tutorials, and videos, you can learn the way that suits you most.

Learning the JavaScript fundamentals

Before you dive into the JavaScript exercises, it’s best to learn the fundamentals. Here are a few resources I recommend to get started:

If you are an absolute beginner:

JavaScript exercises for all levels

So, now let’s get into it and explore how to get started when you have understood the basics.

Whatever your JavaScript skills are, here's are some JavaScript coding exercises you can do at your own pace.

67 exercises to practice the JavaScript basics.

Free exercises covering the basics to the more advanced aspect of JS like the DOM (document object modal) async function, and more.

An exercise created by our co-founder Charles. Ideal for beginners to practice the basic fetch function in the CodePen code editor.

An exercise created by our co-founder Charles. Ideal for beginners. You’ll practice creating a simple wishlist with JS in the CodePen code editor.

A resource with 47 exercises to practice whatever your level is, With exercises from well-known universities.

Tutorial and exercise on how to debug your Vue.js frontend. Ideal for intermediate developers.

JavaScript tutorial and exercise on how to create a React dynamic website.

JavaScript tutorial and exercise on how to build a PWA with a JavaScript framework. 

Tutorial and exercise about creating a complete eCommerce website using Snipcart, Node.js, and Koa.js as the frontend.

5 exercises to practice for a JavaScript web developer interview.

JavaScript courses

Intro to JS: Drawing & Animation

This is a free course by Khan Academy. Each section is covered with an explanatory video and then you have exercises to practice what you just learned.

JavaScript Algorithms and Data Structures

Free course by freecodecamp. With 113 exercises that cover the basics of JavaScript.

Learn JavaScript

Free course by Learn JavaScript. Cover the fundamentals with exercises to practice at every step.

Learn JavaScript

This is a course by Code Academy. It’s highly interactive, however, you need a subscription in order to have access to the whole course.

JavaScript courses on mobile

If you are looking for a way to learn and practice JavaScript while on the go, I suggest your look at two free apps.


This is an app (mobile and web) developed by a team at Google. It’s a fun way to learn JavaScript by doing exercises. The course is divided into small sections that you can do when you have a few minutes.


Mimo is an app to learn web development. While it’s not strictly limited to JavaScript you can select to learn and practice only JavaScript. While they offer a free version, you can also subscribe to Mimo Pro to unlock more exercises.


As you may have noted, learning JavaScript is pretty accessible. Practice exercises are an important part of the learning experience. Because it’s a constantly evolving language, It’s best to keep up to date with the latest developments in the ecosystem. There are even some JavaScript podcasts if you want to learn on the go.

Let us know in the comments how it went if you’ve tried any of the exercises. If you enjoyed it, consider sharing it.

Where can I practice my HTML CSS and JavaScript?

10 Websites To Practice Your Frontend Development Skills 😲.
FrontendMentor. Improve your front-end coding skills by solving real-world HTML, CSS and JavaScript challenges whilst working to professional designs..
Codepen Challenges. ... .
Codewell. ... .
CSS Battle. ... .
FreeCodeCamp. ... .
Codewars. ... . ... .
Ace FrontEnd..

How can I practice HTML CSS?

If you want to learn HTML and CSS skills and start making money, here are some great practice projects to help you get started..
Build a Portfolio or Simple Personal Website. ... .
Make your resume interactive. ... .
Create an Email Newsletter. ... .
Make a static responsive website. ... .
Build a form. ... .
Create an animation..

Where can I practice JavaScript exercises?

JavaScript practice for beginners: 8 free sites with JavaScript exercises.
Learn JavaScript..
JavaScript Hero..
Learn JavaScript on Codecademy..
Khan Academy: JavaScript Quiz..

What projects can I do with HTML CSS and JavaScript?

Advanced JavaScript Projects With Source Code.
Real-time Weather app. This project will show you how to create a weather app using Vanilla JS, HTML, and CSS. ... .
Movie App. Movie. ... .
Real-Time Chat Application. How about we build our own chat application? ... .
File Sharing App. File Sharing app. ... .
Instagram Clone. Instagram..