A Car Racer JavaScript Game Exercise Using Vanilla JavaScript [Video]
-
Free ChapterIntroduction to JavaScript Car Racer Exercise
- Car Racer Introduction.
- New JavaScript Racer Game Exercise
- HTML setup container
- Gameplay CSS setup styling
- JavaScript Element Selection
- JavaScript Event Listeners
- Setup Player Car and Start Functions
- JavaScript Road Building
- Interaction with Keyboard
- Update Dashboard Values
- Moving Road JavaScript
- Tweak moving road Side move
- Keep player on the road
- JavaScript Game Adding other Cars
- Making other cars move
- JavaScript Element Collision detection Element Overlap Detection
- Crash Checker JavaScript Collide
- JavaScript Game Over end Game planning
- Enemy collision detection Car hit Car Check
- Final Game Over Play JavaScript
- Next level Restart Game
- JavaScript Exercise Code Review and Overview
Have you ever wanted to build amazing and interactive games? If yes, then this course is perfect for you.
A basic knowledge of JavaScript is desirable as the course covers only JavaScript relevant to building a game. Also, HTML and CSS knowledge is essential as the scope of this course focuses entirely on JavaScript.
The course is designed to teach you to use JavaScript. We cover the following:-
- Learn how to set up your gameplay area using HTML and CSS
- Add JavaScript setting event listeners
- Add keyboard actions to move an HTML div using keyboard arrow keys
- Run AnimationFrame() to change element position and respond to the user's commands
- Set up and start game functionality
- Create a dynamic JavaScript road
- Create elements within JavaScript
- Access the JavaScript Document Object Model to manipulate element properties
- Set up and add values within an object to track location and movement
- Set up a dashboard to output variables for the user such as the score and speed
- Add road movement
- Track speed dynamically with braking and accelerating
- Add other cars and have them move within the gameplay area
- Check for element overlap and detect collisions
- Score and extend gameplay
Practicability is the key to this course. Using JavaScript, you have a wide variety of options whereby you can take the code provided within this course and expand it in any number of directions. Learn, practice, and create your own interactive game.
Style and Approach
This course will literally take you from knowing nothing about game development with JavaScript to mastering JavaScript elements, components, and animations and applying JavaScript to your own car racing game.
- Publication date:
- September 2018
- Publisher
- Packt
- Duration
- 2 hours 14 minutes
- ISBN
- 9781789801910