Welcome to the JavaScript tutorial series. Here you will find a wide range of tutorials that will teach you the basics of the JavaScript programming language. You will learn how to add JavaScript code to a website and work on several projects including a calculator, multiple-choice quiz program, and 2D game. This tutorial series is a great start to web development, game design, and app design with JavaScript.
Nearly every tutorial includes a video that shows you exactly what to do along with sample code so you can try it out yourself. All tutorials are listed so that you can start with basic coding concepts and gradually move up to intermediate and advanced concepts. You can start from the very first tutorial or skip to any tutorial if you already have some JavaScript skills and are looking for something in particular.
This tutorial series is currently being updated for 2020. The tutorials in bold below have been recently updated.
- Introduction to JavaScript (display a simple message in the browser)
- Variables and data types
- Arithmetic
- Strings
- Events
- Functions
- Calling functions from events
- Variable scope
- Arrays
- Array methods
- Finding the length of arrays (and strings)
- Multi-dimension arrays
- If statements (if, else if, else)
- Nested if statements
- Using and/or operators in an if statement
- Switch statements
- While loops
- Do..while loops
- For loops
- Looping through arrays (and strings)
- forEach loop
- Objects, properties and methods
- Using the getElementById() method
- Changing an image using getElementById() method
- Swapping images back and forth using JavaScript
- Swapping images using an interval timer
- Taking user input from a form
- Treating text input from a form as an integer
- Submitting forms
- Validating form data
- Radio buttons and form validation
- Checkboxes and form validation
- Alert boxes and confirmation boxes
- JavaScript prompts (user input boxes)
- Keyboard events in JavaScript
- Introduction to JSON
- Making a 2D game with JavaScript and HTML5 canvas
- Make a multiple-choice quiz with JavaScript
Where to next?
If you have completed the JavaScript tutorials and have a craving to learn more, then why not check out the HTML5 canvas? You can use the HTML5 canvas and JavaScript to draw shapes, make animations and develop games! Click here to check out the HTML5 canvas tutorials.
Sample code for JS projects
You can also access the code to different JS projects here: