Create A 3D Car Racing Game With Three.Js And Cannon.Js

0

1

2

3

4

5

Posted on 22 Dec 11:37 | by mitsumi | 12 views

Last updated 10/2022
MP4 | Video: h264, 1280x720 | Audio: AAC, 44.1 KHz
Language: English | Size: 1.43 GB | Duration: 2h 12m

Use the CANNON.js physics library and the WebGL library, THREE.js, to easily create a car racing game.

What you'll learn
You will have a knowledge of the THREE js library.
You will have a working knowledge of how a physics engine works. Particularly CANNON js
You will know how to adapt your assets to work with the CANNON RayCastVehicle class.
You'll know how to use the position and rotation information from the physics engine and apply it to your assets.
You will know how to use colliders in your scene to prevent your car driving through your 3d environment.
Requirements
You need to know basic jаvascript.
The tools required are a good text editor and optionally a 3D application program that exports FBX files such as Blender.
Description
Creating a car racing game that works in a browser including mobile devices has never been easier. Using the two Open Source libraries THREE.js and CANNON.js this course takes you through the steps you will need to know and builds towards a complete car racing game. On the way you will learnHow to setup your development environmentHow to access free and low cost assets to use in your game.How to edit those assets to work with the THREE.js and CANNON.js libraries.How to use THREE.js to add 3D to an HTML page.The basics of THREE.js lights, cameras and meshes.The basics of the CANNON.js library, including rigid bodies.How to debug your physics either using the CannonDebugRenderer or using the CannonHelper class created by the author. Both are included in the resources for the course.How to use the CANNON.RayCastVehicle class to add a car with suspension and fully working wheels.How to apply your own assets to the RayCastVehicle and add colliders so it bumps into your content.How to add a responsive GUI to the gameThe course includes the assets for car racing game as shown in the course image and promo video. The author has won awards for the 3D games he has produced. Learn from an expert who has been creating games for over 30 years. The game we'll develop allows the player to choose from optional, body, engine, exhaust and wheels. It involves driving a remote controlled car around a garden track. It's a great way to improve your jаvascript skills along the way. All code uses the latest ES6 style, using classes throughout.
Overview
Section 1: Introduction
Lecture 1 Welcome to the course
Lecture 2 jаvascript in 12 Easy Lessons - e-book
Lecture 3 Introduction
Lecture 4 Setting up a Web Server
Lecture 5 3D Basics
Lecture 6 How to get your assets
Lecture 7 Using Blender
Section 2: Introducing THREE.js
Lecture 8 The THREE.js website
Lecture 9 Your first 3D app
Lecture 10 The FBXLoader class
Section 3: Introducing CANNON.js
Lecture 11 The CANNON.js website
Lecture 12 CANNON.js basics
Lecture 13 More about rigid bodies
Lecture 14 Debugging your physics
Section 4: The CANNON.RaycastVehicle class
Lecture 15 Creating a CANNON.RaycastVehicle
Lecture 16 Adding wheels
Lecture 17 Using the JoyStick class to control your vehicle
Lecture 18 Limitations for colliders
Section 5: Adding the eye-candy
Lecture 19 Sizing your assets
Lecture 20 Adding colliders
Lecture 21 Loading your assets
Lecture 22 Converting the colliders to Cannon Bodies
Lecture 23 Adding a SkyBox
Lecture 24 Adding checkpoints and resetting the car
Lecture 25 Using the Preloader class
Lecture 26 Adding SFX
Section 6: Adding a GUI
Lecture 27 Limiting the GUI to the corners and the centre
Lecture 28 Adding onclick events
Lecture 29 Controlling the width and height for different screens
Section 7: Conclusion
Lecture 30 What have you learned?
Lecture 31 More fun with THREE.js and CANNON.js
Lecture 32 Bonus Lecture
If you are interested in developing 3D games that work in the browser including on mobile devices.,If you are interested in learning how physics engines work while creating a fun game.,If you want to know how to add a responsive GUI to your game.