Giter VIP home page Giter VIP logo

rammazzoti2000 / js_capstone_rpg Goto Github PK

View Code? Open in Web Editor NEW
11.0 1.0 2.0 20.22 MB

JavaScript Capstone project at the end of JavaScript module in Microverse Curriculum. It is an RPG game built with Phaser3. The main inspiration was from multiplayer online games. In this particular game the action is mainly focused on collecting as many chests as possible while having to combat against monsters (also covid monsters are present as well).

Home Page: https://rammazzoti2000.github.io/js_capstone_rpg/

License: MIT License

CSS 0.07% HTML 0.76% JavaScript 99.17%
phaser js vanilla-javascript microverse capstone jest gh-pages

js_capstone_rpg's Introduction

Contributors Forks Stargazers Issues


Logo

JavaScript / Capstone --> [Final Warrior]

This project is the Capstone of the Microverse curriculum at the end of the JavaScript module!
Explore the docs ยป

Report Bug ยท Request Feature

Table of Contents

About The Project

This is the Capstone project that signs the completion of the JavaScript module in Microverse Curriculum. It is an RPG game, specifically a platform game. The main inspiration was from multiplayer online games. In this particular game the action is mainly focused on collecting as many chests as possible while having to combat against monsters (also covid monsters are present as well).

How to Play

screenshot

The game can be played using the arrow keys for moving the player and the spacebar for attacking the monster. By moving the player you will be able to collect chests that contain gold. Each chest will update the score with a random amount between 20 and 30 golds. Each character has a health bar, player included. The monster's health bar will decrease each time the player will attack, but watch out, the monsters have a random movement and each time you will attack they will fight back making your health bar decrease. As a bonus though, for each monster killed the player will have back some gold and some life to increase his health bar.

Design Process

Fatal Warrior was designed on an initial, quite complex, webpack configuration specific for Phaser3. This allowed me to investigate Phaser and its tools from a specific perspective. The entire map was built with Tiled on a 32 x 32 collection of squares. The map then has been exported as a json file and used for placing chests, and monsters at random positions.

The player has a set velocity and can move across the map by using the arrow keys. Each time the player dies it will be spawned at a different random position to make the game more interesting. The monsters and the chests will be as well randomly generated and spawned on the map. Each spawned element has a random unique id used to interact with the user. The unique id is generated with the help of uuid npm package.

Built With

This project was built using these technologies.

  • JavaScript
  • Phaser3
  • Webpack
  • Jest Tests
  • Tiled Map
  • GithubActions ๐Ÿ’ช
  • Atom :atom:

Walkthrough Video and Deployment (GitHub-Pages)

https://www.loom.com/share/34f0969ac0524696937bb2b2ccc21eba

  • Live Demo Link --> App Deployed with GitHub-Pages: Final Warrior ๐Ÿ‘ˆ

Screenshots

screenshot-1 screenshot-2 screenshot-3

Getting Started

To get a local copy up and running follow these simple example steps.

Prerequisites

  • Node.js is required to install dependencies and run scripts via npm.
  • A modern browser

Clone

  • download or clone this repo:
    • Clone with SSH:
      [email protected]:rammazzoti2000/js_capstone_rpg.git
    
    • Clone with HTTPS
      https://github.com/rammazzoti2000/js_capstone_rpg.git
    
    

Setup

Install dependencies:

$ npm install

Start the local webserver:

$ npm start > will open a local webserver at http://localhost:8080/ directly in your default browser with the game ready to be played

Automated Test

  • Run the command and see the output: $ npm run test

Potential future features

  • Extend the game to a multiplayer online game
  • Add authentication process

Contributors

๐Ÿ‘ค Alexandru Bangau

๐Ÿค Contributing

Contributions, issues and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a โญ if you like this project!

Acknowledgements

๐Ÿ“ License

This project is MIT licensed.

js_capstone_rpg's People

Contributors

dependabot[bot] avatar imgbotapp avatar rammazzoti2000 avatar rammazzoti2001 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

Forkers

vzdrizhni xchsp

js_capstone_rpg's Issues

Game Over

Return a new object each time the player dies and plays again without refreshing

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.