Welcome folks today in this blog post we will be building a chrome dinosaur running game in javascript. All the full source code of the application is shown below.
Get Started
In order to get started you need to create an index.html file and copy paste the following code
index.html
<!DOCTYPE html>
<html>
<head>
<title>RAWRRRR!</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<!--
Boilerplate to start the basic layout.
Making the canvas white will make our work space really obvious.
-->
<h1>Dinosaur Game!</h1>
<canvas id="game" height="200" width="800"></canvas>
<p class="controls">press space bar to start</p>
<script src="js/helpers.js"></script>
<script src="js/objects/game-object.js"></script>
<script src="js/objects/cactus.js"></script>
<script src="js/objects/dinosaur.js"></script>
<script src="js/objects/background.js"></script>
<script src="js/objects/score.js"></script>
<script src="js/game.js"></script>
<script>
new Game({
el: document.getElementById("game")
});
</script>
</body>
</html>
Now you need to download the full source code of application from github repository as shown below
After downloading the source code you will see the following directory structure
If you open index.html file inside the browser you will see the following output
