Code Tetris: JavaScript Tutorial for Beginners

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!

Grab it

Dive into JavaScript fundamentals by building your own Tetris game from scratch in this beginner-friendly tutorial. Set up a project using the Atom code editor and command prompt tool, then progress through essential concepts including variables, arrays, functions, and DOM manipulation. Learn to draw Tetrominoes, implement game logic, handle user input, and create features like displaying the next piece and pausing the game. Explore important JavaScript methods such as forEach(), splice(), and concat(). By the end of this 1-2 hour hands-on tutorial, gain a solid foundation in JavaScript programming while creating a fun, interactive game.

Syllabus

Introduction.
Setting up the project.
HTML Basics.
CSS Basics.
Explaining Variables.
Working with Arrays.
What exactly is a function?.
Arrow Functions and forEach().
Drawing Tetrominoes using classList.add().
Times and intervals.
Using Modulus to define our place on the grid .
Keycodes and events.
Choosing items from Arrays.
Displaying the ‘Next Up’ Tetromino.
Adding a start and pause game function..
Splice().
Splice(), concat() and appendChild().
Game over using some() and innerHTML.
Assigning colors to our Tetrominos.