-
Our mission for this project was to take our new-found knowledge and try to build our own games from scratch.
-
We used Angular as our front-end framework and Spring as our back-end framework.
-
We set out with a simple goal of testing our skills and understanding of the frameworks we used to build this project.
-
We started with a simple game that we called
Pongand we built it entirely using Typescript. -
Use
ng serveto run the application locally on a dev server. -
We used the following libraries:
-
User has access to 4 different games on the landing page:
PongMega-man prototypeMinesweeperSnake
-
User can navigate to the game page by clicking on the buttons with the desired game name.
-
This will change the contents of the canvas as well as reset the others games.
- The game is a single player game where the user can move the paddle left and right using the mouse while hovering over the canvas.
- The game is played by using the paddle to stop the ball from reaching the bottom of the screen.
- If the ball reaches the bottom of the screen, the ball will reset to the middle of the screen and continue to move about the canvas, while bouncing off the other bounding walls.
- User can move the character left and right using the
AandDkeys. - If the character doesn't move, it will trigger an idle animation where he blinks every few seconds.
- User can jump by pressing the
Spacebarand the character will jump higher the longer it is pressed.
- The object of this game is to reveal all the tiles that don't contain a bomb.
- Upon navigating to the Minesweeper tab, the user is presented with an empty grid with bombs hidden randomly under tiles.
- Each tile contains a number or a bomb, click the tile to reveal its contents.
- If the tile contains a bomb, the user loses the game.
- If the user reveals all the tiles without revealing any bombs, the user wins the game.
- The user can reset the game by clicking the
Resetbutton. - Right-click on a tile to flag it as a bomb.
- When a number is revealed, the number equals the number of bombs in the adjacent tiles.
- This game will remain paused until the snake is moved.
- Control the snake using the
Arrowkeys. - The object of the game is to move the snake about the board collecting apples.
- Each apple eaten increases the snake's length by one segment and increases your score by one.
- Snake gradually gets faster as its length increases.
- Game is lost if the user runs into a bounding wall or if it runs into its own body.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent