JavaScript Projects for Kids

Language: English

Pages: 188

ISBN: 1785287176

Format: PDF / Kindle (mobi) / ePub

Key Features

• Get to know the concepts of HTML and CSS to work with JavaScript
• Explore the concepts of object-oriented programming
• Follow this step-by-step guide on the fundamentals of JavaScript programming

Book Description

JavaScript is the most widely-used programming language for web development and that's not all! It has evolved over the years and is now being implemented in an array of environments from websites to robotics. Learning JavaScript will help you see the broader picture of web development.

This book will take your imagination to new heights by teaching you how to work with JavaScript from scratch. It will introduce you to HTML and CSS to enhance the appearance of your applications. You'll then use your skills to build on a cool Battleship game! From there, the book will introduce you to jQuery and show you how you can manipulate the DOM. You'll get to play with some cool stuff using Canvas and will learn how to make use of Canvas to build a game on the lines of Pacman, only a whole lot cooler! Finally, it will show you a few tricks with OOP to make your code clean and will end with a few road maps on areas you can explore further.

What you will learn

• Learn how to work with Google Developer tools to iterate, debug and profile your code
• Develop a Battleship game using the basic concepts of HTML and CSS
• Get to know the fundamentals of JavaScript programming
• Create our own version of Pac Man game.
• Discover the vital concepts of object-oriented programming

About the Author

Syed Omar Faruk Towaha has degrees in physics and computer engineering. He is a technologist, tech speaker, and physics lover from Shahjalal University of Science and Technology (SUST), Sylhet. He has a passion for programming, tech writing, and physics experiments.

His recent books include Easy Circuits for Kids, Fundamentals of Ruby, and How You Should Design Algorithms. He is an Oracle-certified professional developer currently involved with a number of projects that serve both physics and computer architecture.

He is the president of one of the largest astronomical organizations (Copernicus Astronomical Memorial of SUST (CAM-SUST)) in Bangladesh. He also volunteers for Mozilla as a representative.

Table of Contents

1. Exploring JavaScript in the Console
2. Solving Problems Using JavaScript
3. Introducing HTML and CSS
4. Diving a Bit Deeper
5. Ahoy! Sailing into Battle
6. Exploring the Benefits of jQuery
7. Introducing the Canvas
8. Building Rat-man!
9. Tidying up Your Code Using OOP
10. Possibilities

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

This button will call the fire function (we will write the function later.): button.onclick = fire; Now, we will place the button on the body part: var t=document.createTextNode("Fire!"); document.body.appendChild(button); button.appendChild(t); Let's make a function to draw the board: function drawBoard() { var boardContents = ""; var i; var j; for (i=0; i<9; i++) { for (j=0; j<9; j++) { boardContents = boardContents + game[i][j]+" "; // Append array contents for each board square }

following code: var shipfound; var i; var j; // Check if there are any ships remaining on the board for (i=0; i<9; i++) { for (j=0; j<9; j++) { if (game[i][j] != "." && game[i][j] != "*") { shipfound = true; // Taking a boolean data type to set it if a ship is found } } } If no ship is left, we will end the game: if (!shipfound) { // If no ships are found end the game alert("All ships have been sunk. Well done Captain! Game over"); document.body.removeChild(button); // Remove the fire button

randomly placed ships

Custom

Choose any 5 ships and place them where you like. The computer will have the same 5 ships, randomly placed