Git Product home page Git Product logo

fifa-world-cup-emulator-frontend's Introduction

FIFA World Cup Emulator

This project was inspired by the biggest upcoming sporting event of the world - 2022 Qatar FIFA World Cup.
By presenting all qualified national teams (including teams still reamins in the qualification matches) and the basic match / tournament simulation engine, this project is aiming to provide a simple glance of the football games and makes everyone can enjoy the upcoming 2022 Qatar FIFA World Cup.

Getting Started with intallation & development

This project was bootstrapped with Create React App.

Available Scripts

To start with the porject, you should first run follwing command in the project directory:

npm install

This allows you to install all the necessary dependencies for the app.

In the project directory, you can run:

npm start

Runs the app in the development mode.
Open http://localhost:3000 to view it in your browser.

The page will reload when you make changes.
You may also see any lint errors in the console.

Playing With the app

In the home page of this app, you will see two buttons clickable:

Alt text

By clicking the view / edit teams button on the home page, you will be directed to the temas page that allow you to view all qualified national teams for the 2022 Qatar FIFA World Cup.
You can choose to view the detialed information or editing the squad / formations of a specific team via clicking the country flag of that team.

Alt text

By clicking the play matches button on the home page, you will be directed to the game page that contains two modes for you to choose to play.
In the single match mode, you can choose two different teams to play against each other.
After selecting the teams that you want to play, you can hit the start game button to start the simulation match between your chosen teams.

Alt text

You can also choose to play in the tournament mode by selecting the corresponding option on the game page, and you will see the simulation of the entire tournament.

Demo

This app was also deployed with the Netlify, click here to play with the demo.
If you had any questions or suggestions for this app, feel free to reach out to us via the contact information on the contact page.

fifa-world-cup-emulator-frontend's People

Contributors

joey2005 avatar

Watchers

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