{"id":18638741,"url":"https://github.com/starsheriff2/leaderboard-eureka-js","last_synced_at":"2026-05-09T07:05:28.409Z","repository":{"id":48349387,"uuid":"390065991","full_name":"StarSheriff2/Leaderboard-Eureka-JS","owner":"StarSheriff2","description":"The leaderboard website displays scores submitted by different players. All data is preserved through an external API service.","archived":false,"fork":false,"pushed_at":"2021-07-30T16:40:51.000Z","size":1481,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"development","last_synced_at":"2025-05-17T14:41:22.695Z","etag":null,"topics":["api","api-rest","async","classes","javascript","jest","jest-tests","modules","sass","webpack"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/StarSheriff2.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-07-27T17:11:14.000Z","updated_at":"2021-08-05T21:38:58.000Z","dependencies_parsed_at":"2022-08-29T17:11:50.898Z","dependency_job_id":null,"html_url":"https://github.com/StarSheriff2/Leaderboard-Eureka-JS","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":"StarSheriff2/webpack-template","purl":"pkg:github/StarSheriff2/Leaderboard-Eureka-JS","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StarSheriff2%2FLeaderboard-Eureka-JS","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StarSheriff2%2FLeaderboard-Eureka-JS/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StarSheriff2%2FLeaderboard-Eureka-JS/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StarSheriff2%2FLeaderboard-Eureka-JS/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/StarSheriff2","download_url":"https://codeload.github.com/StarSheriff2/Leaderboard-Eureka-JS/tar.gz/refs/heads/development","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/StarSheriff2%2FLeaderboard-Eureka-JS/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":32810382,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-08T08:22:46.396Z","status":"online","status_checked_at":"2026-05-09T02:00:06.633Z","response_time":123,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["api","api-rest","async","classes","javascript","jest","jest-tests","modules","sass","webpack"],"created_at":"2024-11-07T05:43:22.198Z","updated_at":"2026-05-09T07:05:28.329Z","avatar_url":"https://github.com/StarSheriff2.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Leaderboard App\n\n![](https://img.shields.io/badge/Microverse-blueviolet)\n![](https://img.shields.io/badge/Academic-blue)\n![](https://img.shields.io/badge/HTML-red)\n![](https://img.shields.io/badge/JavaScript-yellow)\n![](https://img.shields.io/badge/CSS-blue)\n![](https://img.shields.io/badge/SASS-violet)\n![](https://img.shields.io/badge/Webpack-green)\n\nThe leaderboard app displays scores submitted by different players. It also allows you to submit your score. The app consumes data stored in an external **API** service located [here](https://www.notion.so/Leaderboard-API-service-24c0c3c116974ac49488d4eb0267ade3).\n\n\u003e I built the app using **webpack** and **ES6** features, such as **modules**.\n\n![screenshot](./other/app_screenshot.png)\n\n## About\n\nI built this project using webpack and Vanilla JS. I implemented asynchronous code through **async** and **await** to load scores from the API. The page is fully responsive.\n\n### Features:\n- Submit a new score to the leaderboard API\n- Get the latest scores\n- See scores by highest score\n### Live Demo\nSee demo here [https://github.com/StarSheriff2/Leaderboard-Eureka-JS/](https://starsheriff2.github.io/Leaderboard-Eureka-JS/)\n\n### Built With\n- HTML, CSS, JS\n- NPM 7.18.1\n- Webpack 5.44.0\n- HtmlWebpackPlugin\n- webpack-dev-server\n- Jest 27.0.6\n- SASS 1.35.1\n- Linters: ESLint, Stylint, WebHint\n- VS Code\n\n### About the API\n- This app consumes a public API located at https://us-central1-js-capstone-backend.cloudfunctions.net/api/\n- The API allows the following calls:\n  - Create new game at endpoint `/games/`\n  - Submit a new score at endpoint `/games/:id/scores/`\n  - Get latest scores from `/games/:id/scores/`\n- The API calls are made according to its documentation, which can be accessed [here](https://www.notion.so/Leaderboard-API-service-24c0c3c116974ac49488d4eb0267ade3)\n\n## Getting Started\n\nTo get a local copy up and running, follow these simple example steps.\n\n### Prerequisites\n- A browser to open the main file\n- Node.js\n- NPM\n\n### Setup\n1. Open your terminal or command prompt.\n2. If you do not have git installed in your system, skip this step and go to step 3; otherwise, go to the directory where you want to copy the project files and clone it by copying this text into your command prompt/terminal: `git@github.com:StarSheriff2/Leaderboard-Eureka-JS.git`.\n\u003cbr\u003eNow go to the ***\"Install Dependencies\"*** section\n3. Download the program files by clicking on the green button that says “**Code**” on the upper right side of the project frame.\n4. You will see a dropdown menu. Click on “**Download ZIP**.”\n5. Go to the directory where you downloaded the **ZIP file** and open it. Extract its contents to any directory you want in your system.\n\n### Install Dependencies\n1. Go to the root directory of the project\n2. In your command line, while in the root dir, type `npm install`. It will install all necessary dependencies in your project files\n3. Now type `npm run start`. It will load the project in your default browser.\u003cbr\u003e\u003cbr\u003e\n**Note:\u003cbr\u003e_This command will not stop on its own. If you change something in your project files, it will recompile and reload the page in your browser. To exit, hit \"ctrl + c\"_**\n\n## Development\n\n### Bundle project\n- `npm run build`\n\n### To compile SCSS\n- `npm run wsass`\n### Testing\nTo test, run\n\n- `npm test`\n\n### Linters\nTo run the linters included in this repository, you will need to install them locally. **Note:** You will need node.js for this and npm:\n- to install WebHint, run `npm install --save-dev hint@6.x`\n- for Stylelint, `npm install --save-dev stylelint@13.x stylelint-scss@3.x stylelint-config-standard@21.x stylelint-csstree-validator@1.x`\n- for ESlint, `npm install --save-dev eslint@7.x eslint-config-airbnb-base@14.x eslint-plugin-import@2.x babel-eslint@10.x`\n\nTo run the linters, go the root directory of your repository, and copy/paste the following commands in your terminal:\n- to check the HTML file, `npx hint`\n- to check the stylesheets, `npx stylelint \"**/*.{css,scss}\"`\n- to check the JS files, `npx eslint`\n\n## Usage\n\n- Submit a new score by entering your name and your score\n- To see the latest scores submitted by other players, just hit `Refresh`\n\n## Author\n\n👤 **Arturo Alvarez**\n- Github: [@StarSheriff2](https://github.com/StarSheriff2)\n- Twitter: [@ArturoAlvarezV](https://twitter.com/ArturoAlvarezV)\n- Linkedin: [Arturo Alvarez](https://www.linkedin.com/in/arturoalvarezv/)\n\n## 🤝 Contributing\n\nContributions, issues, and feature requests are welcome!\n\nFeel free to check the [issues page](https://github.com/StarSheriff2/Leaderboard-Eureka-JS/issues).\n\n## Show your support\n\nGive a ⭐️ if you like this project!\n\n## 📝 License\n\nThis project is [MIT](https://github.com/StarSheriff2/Leaderboard-Eureka-JS/blob/main/LICENSE) licensed.\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstarsheriff2%2Fleaderboard-eureka-js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstarsheriff2%2Fleaderboard-eureka-js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstarsheriff2%2Fleaderboard-eureka-js/lists"}