Git Product home page Git Product logo

matabugs-client's Introduction

Bugs Hunters

Introduction

Bugs Hunters is an App where you can access to see all the players, see the ranking of the best players, create a player and more, Bugs Hunters it is an RPG game where a group of players assumes the role of programmers of the new metaverse where they must destroy bugs, which in said virtual reality take the form of giant insects that devour space itself. As players progress, destroying more bugs and overcoming the challenges that will be imposed on them in the metaverse, they will earn more points, which will allow them to improve their equipment and increase their ranking.

Project Objetives

  • Build a React - Express - Postgres App
  • Implement services in AWS cloud.
  • Test implementation both in the Front (Cypress) and in the back (Jest).
  • Use Scrum agile methodology.

Stack of Technologies

Front End:

  • HTML, CSS, Javascript, React, Redux, Cloudinary, SASS
  • Test: Cypress
  • Deploy: AWS(EC2 - ngnix)
  • Responsive Design

Back End:

  • Node.js, Express, Sequelize, JWT
  • Test: Jest
  • Deploy: AWS(EC2 - RDS) - PM2

Database:

  • PostgreSQL - AWS(RDS)

Development Interface:

  • Visual Studio Code

Starting Instructions

IMPORTANT: Necesary version of node and NPM

  • Node: 16.15.1 or higher
  • NPM: 8.11.0 or higher

BoilerPlate

The boilerPlate has two folders: api and client. You can find the first folder MataBugs-client in this repo (https://github.com/dev-back55/MataBugs-client) and the second folder in the same repo like MataBugs-api in this same github.

Inside api you must have to create a file called: .env that has the following form:


DB_USER=postgres
DB_PASSWORD=12345
DB_HOST=localhost
DB_DIALECT=postgres
PORT=3000
CLIENT_URL=http://15.229.74.105:3000


You have to replace DB_USER and DB_PASSWORD with your own credentials to connect to postgres database. This file will be ignored by github, as it contains sensitive information (the credentials).

In Auth Config you must generated your own SendGrid credential to use this functionalities.

Next

Connect the data base

  • Go to your postgres database manager and create a new database called halloffame, this is the name of the database to which we will connect.

Install the necesary package to run it

  • Open the project console
    • Inside MataBugs-api folder, run the command line, npm install
    • Inside MataBugs-client folder, run the command line, npm install

Run the project

  • Open the project console
    • Inside MataBugs-api folder, run the command line, npm start
    • Inside MataBugs-api folder, run the command line, node dataBaseTemporal.js to create standard users with theirs avatars in local environments
    • Inside MataBugs-client folder, run the command line, npm start and then (go to http://localhost:3000/).

For testing

  • You can find in api/src/index.js

    • conn.sync({ force: false }), switch it between " true " ( if you want reset database in each loaded ) or " false "( if you dont want reset database in each loaded )
  • Inside MataBugs-api folder, run the command line, npm run test 'Number of test' (Ej.: npm run test 01) to run each api's test. Run individual API test to ensure successful verification.

  • Inside MataBugs-client folder, run the command line, npm run test to run each client's test. This test will open a new browser window where you need to select which test you want to test. This test check the localhost App with api deployed. It is possible to execute the tests on the deployed app by changing the base url in MataBugs-client/cypress.config.js.

Deploy Project

Live Front End Proyect Bugs Hunters: http://15.229.74.105

  • You can create a standard user to see all funcionality or use this user like admin to see admin funcionality:

Live Back End Proyect Bugs Hunters: http://15.229.74.105:3000

Developers

Project Screens

  • Charging Page ChargingPage

  • Home Page HomePage

  • Search Player Page SearchPlayer

  • Details Player Page DetailsPlayer

  • Create Player Page CreatePlayer

  • About Page About

  • Login Page About

matabugs-client's People

Stargazers

 avatar  avatar  avatar

Watchers

 avatar  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.