Alien War Game - Code to Play :-)

-

Alien War Game ON

Story Time :-)

Imagine that we are in the year 3000 , Aliens are friends with Homo Sapiens at this time . Aliens are silicon based and they do not possess feelings (VROOM ....ROBO DA ROBO DA 😛). Life is smooth , but at that time the Annual Alien vs Homo Sapiens coding competition goes live . This is the only place where Aliens' as well as mankind clash with each other . Each and every Coding clubs across the galaxy is brushing up their skills. In parallel to this competition, there are some Code to Play Sessions conducted by various clubs. It is a fun session where people with basic coding knowledge can also code their game :-) This session is hosted by Coding Club India . All are pretty excited . I hope you people are curious. Let us deep dive into the game coding part . (End of story)

Game Video🎮



You people couldn't believe it right ! Yaaasss , we can code this game with HTML and JavaScript only. Excited ?! I am here to explain you in detail the whole process. All you need is the patience to read and learn :-) Happy Learning 💖

Code to Play 💻

Prerequisites 

PC/Laptop with internet connection
Chrome/Firefox browser
Notepad/ Code editors
Basics of  HTML and JavaScript

Note: Code link is given below . You can read this post side by side with the source code


Sections of game💥

Canvas
Alien ship
Keyboard Handle
Firing Bullets
Back Ground Music
Credits


Canvas

Canvas is basically used to paint something or to draw something. The code snippet defines the style properties of the canvas which we are going to use.

Alien ship

We are going to create an array of Alien Ship image in the canvas which will also give us a hovering effect. In the snippet X,Y denotes the co-ordinates of the particular image

Keyboard Handle

From the phrase , it is clear that this will be the main control of the game. It is designed in such a way that UP, DOWN , LEFT , RIGHT are used for positioning of the ship . SPACE KEY is used for firing bullets

Firing Bullets

A dedicated function is called for firing bullets . If SPACE KEY status is active then the ship will be firing the bullets


Background Music

What is the thrill in it , if a game does not have a BGM !!??  The BGM has copyrights . Here I am giving the credits to Allan Walker .


Credits

The credits of the source code goes to  Coding Club India  .  The source code of the Alien War game can be downloaded from here . The detailed explanation of the game code and its functionalities can be found at Coding Club India YT 

Here goes my version of game :-)

P.s : The game will be more interesting if we have a score board and many of you may think , what happens when ships hit each other . It will be seen in the advancement of this Game Version. that is a content for another post . Until then Keep Learning

Thanks for Reading




Comments

Post a Comment

Popular posts from this blog

Tech Taste #2

-
Image
  Tech Taste #2 WhatsApp - CTC Hello 😇💖 people :-) Welcome to Tech Taste Series . I hope that you found some cool and useful stuffs in the previous post. Haven't checked yet 😅?! No worries ! Here goes the TECH TASTE #1 . Feel free to express your views in the comment box below. Tech Taste #2 is all about our inseparable piece of our day to day life . It is none other than WHATS-APP  ! Are you pretty excited to know some interesting feature in WhatsApp ?Without much buzz let me disclose the feature.  Are you a person who does not want/like to save each and every random numbers to pass an information through WhatsApp ? Then this post is for you . Follow each step side by side to utilize this feature. Click to Chat (CTC) WhatsApp feature will definitely help you to escape from that process !😜😜. Let's see how to use this CTC ! Get ready with the number , which you need to message (without saving the number) Copy that number in your clipboard or somewhere else Just type htt
Read more

Tech Taste #1

-
Image
  Tech Taste #1   Engineer's Day Special  Hello people💖 ! I wish all Engineers across India a very Responsible Engineer's Day (September 15 th)💯💯 Welcome to Tech Taste Series :-)  Tech Taste #1 is all about SECURITY and PRIVACY IS A MYTH.   In this Engineer's Day, you people will be knowing how the saved passwords can be  revealed which are  managed  by search engines(Eg : Google). Follow the below steps side by side in your browser to get a real time experience Step 1 : Let us take any site where we saved/managed our passwords.In my case I took my GitHub account to illustrate the process. Here I have saved my GitHub password so that I am not needed to enter my password during sign in process. It will be auto-filled by our engine. Step 2: Now right click , you could see many options there. We could see many options like the above image. The magical option which helps us to reveal our saved password is the Inspect element option. Step 3: Right click on that password c
Read more

An Emotional Read...

-
Image
She Friend-Zoned My Love Hey folks,           Hello all. This is a special post on the book She Friend-Zoned My Love which is beautifully drafted by Mr. Sudeep Nagarkar. It is an emotional read for me. Let me share my views on this book. The plot and the line which Sudeep chose was the highlight. This book revolves around some 5 characters namely Sia,Ritvik,Amyra,Apurv,Ishaan . The book starts with the faded voice of Amyra. Sia is a fatso. She has been bullied by her classmates in her old school days. She made new friends at her new college. The first half of the revolves around the beautiful friendship between Sia,Ritvik,Apurv. It is a motivational boost for readers who could connect them with the girl character Sia. It almost covers the struggles,hardships and mockeries faced by a fat chubby girl. A good friend worth a library is the mantra which made Sia to overcome all her negative paced life. Those magical spell of Ritvik and Apurv strengthened their friendship bon
Read more