Code Monkey home page Code Monkey logo

wdi-project1's Introduction

Mario-Hero

GA WDI London - Project 1

Brief

After the first three weeks of the course, the instructors told us to make a game using pure vanilla JavaScript in order to use all we have learned.

The goal of the game is to collect 100 coins, as many stars as possible and try to not lose too many lives (taking mushrooms), in order to save Princess Peach.

Play it here!

Run Locally

  • Download or clone the Github repo
  • Run yarn install or npm install in the terminal to install all the dependencies
  • Run gulp in the terminal to compile the source code and open in the browser

Technologies

To create this project I used the following technologies:

  • HTML5
  • SCSS
  • JavaScript (ECMAScript 6)
  • jQuery
  • Gulp
  • Yarn

Challenges faced

The big challenge I had with this project was making the character caught the coins and determinate when the coins hit the floor.

I did solve that using a collision function dropCoins which, based on the character height, the coins height and the grid height, was able to determinate when the coins did hit the floor or the character.

Wins

I cant believe how much I have learnt in such a short space of time, JavaScript in particular. It has been a brilliant opportunity to put my learning into practice and build my confidence in my new skillset.

Future Features

There are few improvements that I would love to add.

  • Improve the code and fixing the bugs.
  • Store the player's score using LocalStorage.
  • Improve the UI which is not perfect at the moment.

MarioHero

MarioHero

MarioHero

wdi-project1's People

Contributors

gio85 avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.