https://github.com/bushmusi/leaderboard
In this project l set up a JavaScript project for the Leaderboard list app, using webpack and ES6 features, notably modules. I consume the Leaderboard API using JavaScript async and await and add some styling.
https://github.com/bushmusi/leaderboard
babel css es6-modules eslint gitflow githubflow html js linter scss stylelint webpack
Last synced: 3 months ago
JSON representation
In this project l set up a JavaScript project for the Leaderboard list app, using webpack and ES6 features, notably modules. I consume the Leaderboard API using JavaScript async and await and add some styling.
- Host: GitHub
- URL: https://github.com/bushmusi/leaderboard
- Owner: bushmusi
- Created: 2022-03-11T11:01:36.000Z (over 4 years ago)
- Default Branch: develop
- Last Pushed: 2022-03-12T20:10:11.000Z (over 4 years ago)
- Last Synced: 2025-02-26T09:46:08.830Z (over 1 year ago)
- Topics: babel, css, es6-modules, eslint, gitflow, githubflow, html, js, linter, scss, stylelint, webpack
- Language: SCSS
- Homepage: https://bushmusi.github.io/leaderboard/
- Size: 624 KB
- Stars: 1
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Leaderboard
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.
### [Live Demo Link](https://bushmusi.github.io/leaderboard/)
## Built With
- HTML5, Javascript
- CSS3
## Getting Started
To get a local copy up and running follow these simple example steps.
## Prerequisites
- Have a good knowledge on how to parse UI designs
- Have VSCode or other text editor installed. [Link to download VSCode](https://code.visualstudio.com/download)
- Install node package. [Link to download node](https://nodejs.org/en/download/)
- Have git installed.[Link to download git](https://git-scm.com/downloads)
- Create a github repository.
## Setup
- `git clone https://github.com/bushmusi/leaderboard`
- `cd leaderboard/`
- Install packages: `npm install`
- Start Live Server: `npm start`
-Follow the HTML-CSS linter confuguration to docs to setup linters [Link to Microverse linter docs](https://github.com/bushmusi/linters-config/tree/master/html-css-js)
## Run tests
For tracking linters errors locally, you need to follow these steps:
- For tracking linter errors in HTML file run:
1. `npm install --save-dev hint@6.x`
2. `npx hint .`
- For tracking linter errors in CSS file run:
1. `npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x`
2. `npx stylelint "**/*.{css,scss}"`
- For tracking linter errors in Javascript file run:
1. `npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x`
2. `npx eslint .`
## Deployment
- Use GitHub pages to deploy website
- For more information about publishing sources, see [About github pages](https://pages.github.com/)
## Author
👤 **Bushra**
- GitHub:
- [Bushra](www.github.com/bushmusi)
## 🤝 Contributing
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](../../issues/).
## Show your support
Give a ⭐️ if you like this project!
## Acknowledgments
- Microverse
- Coding Partners
- Code Reviewers
## 📝 License
This project is [MIT](./MIT.md) licensed.