- π About the Project
- π» Getting Started
- π₯ Authors
- π Future Features
- π€ Contributing
- βοΈ Show your support
- π Acknowledgements
- π License
The leaderboard website displays scores submitted by different players. It also allows you to submit your score. All data is preserved thanks to the external Leaderboard API service.
HTML
- This project use HTML.
CSS
- The CSS is used to provide the design in the whole page.
Linters
- The Linters are tools that help us to check and solve the errors in the code This project count with three linters:
- HTML
- CSS
- JavaScript
Webpack
- HTML Webpack Plugin
- Webpack Style/CSS Loader
- Local dev Server
In this section there are some features that you can notice in the project.
- Single page
- LeaderboardAPI usage
- Button refresh: get the information from the API
- Add a new user and score using POST
To get a local copy up and running, follow these steps.
In order to run this project you need:
- To have a Git in your device : this is in order to clone and modify this project.
- To have a code editor : such as VS code, Atom or another that you would like to use.
- To have a web local server such as XAMPP : this is in with the purpose of you will be able to watch the changes you make in the project.
- Have basic knowledge about HTML, CSS and JS in order to understand the code and be able to modify the elements you want.
- Count with Node.js in your device due to it is a tool needed to run the linters
Clone this repository to your desired folder:
- Clone this repo on your local device you need to open Git Bash and paste the link with the command
cd my-folder-name
$ git clone https://github.com/AndreaM2429/Leaderboard.git
In order can run the linters tools you need use the following command in your local work environment:
npm install
Note: About the webpack server you need to run the following command.
You can check the documentation here
npm start
Now you are able to modify the files in the src/
, but be careful just modify the HTML, CSS and JS the rest of them are for the funcionality of webpack so NOT MODIFY THEM.
To see the linter errors run the following codes for:
- HTML
npx hint .
- CSS
npx stylelint "**/*.{css,scss}"
To fix the errors add --fix
- JS
npx eslint .
To fix the errors add --fix filename.js
--fix . is for solving the problems in all the files
To deploy this project by someone who isn't the owner is prohibit.
π€ Andrea Manuel
- GitHub: @AndreaM2429
- Twitter: @twitter
- LinkedIn: LinkedIn
- Make deploy
Contributions, issues, and feature requests are welcome!
Feel free to check the issues page and add your thoughts
If you like this project you could clone the repo and work with it or do the changes in a new branch. Also you could let a message with your thoughts
I would like to thank Microverse for provided the necessary resources for this project.
This project is MIT licensed.