A few of you have asked me to go over my very FIRST YOUTUBE VIDEO EVER - An Alternative guide to Building Tetris, in a slower, more beginner focused-way. I decided to remake the video but with more diagrams and explainer videos of each inbuilt method as we use it. I hope you enjoy my remake! (As seen on @freeCodeCamp.org )
In this 18 part tutorial, you will learn how to set up a project from scratch using the Atom code editor and your command prompt tool, as well as gain a fundamental understanding of JavaScript by building your very own version of Tetris.
This is a great course for those of you who have never touched code before or those of you with some basic understanding of JavaScript, that would like to go over the fundamentals again.
This course consists of explainer videos that will run you through concepts such as 'Explaining Variables', 'What is a Function and how we use it', 'Understanding Arrays', and many more. These explainer videos are dotted throughout the Tetris project and play when we start to discover each javaScript concept or method. These explainer videos consist of imagery and diagrams for those of you who are visual learners. There are also multiple-choice questions at the end of selected lectures.
In this game of Tetris we will be covering the following inbuilt JavaScript methods:
- addEventListener()
- querySelector()
- querySelectorAll()
- keyCode()
- Math.floor()
- Math.random()
- length
- forEach()
- splice()
- clearInterval()
- setInterval()
- some()
- innerHTML()
- every()
- add()
- remove()
- contains()
Chapters include:
0 - Introduction
1 - Setting up the project
2- HTML Basics
3 - CSS Basics
4 - Explaining Variables
5 - Working with Arrays
6 - What exactly is a function?
7 - Arrow Functions and forEach()
8 - Drawing Tetrominoes using classList.add()
9 - Times and intervals
10 - Using Modulus to define our place on the grid
11 - Keycodes and events
12 - Choosing items from Arrays
13 - Displaying the ‘Next Up’ Tetromino
14 - Adding a start and pause game function.
15 - Splice()
16 - Splice(), concat() and appendChild()
17 - Game over using some() and innerHTML
18 - Assigning colors to our Tetrominos
If you have any questions or get stuck, please do reach out to me on my socials below:
YouTube: https://www.youtube.com/aniakubow
Twitter: https://www.twitter.com/ania_kubow
Top comments (0)