This is an app that contains scores and names of the user. It is being run by an Api and a user can add both names and scores which will be generated by the Api.

  • By Grayce Muthui
  • Last update: Jun 20, 2022
  • Comments: 3

Screenshot

  • Here is a screenshot of the project. Screenshot from 2022-06-16 18-59-01

Leadership List App

  • This is a Microverse project that entails a leadership score board.

Built With

  • HTML
  • CSS
  • Webpack
  • Javascript

Getting Started

  • Here is the link to the repo link
  • Clone this repo to get started by using git clone(insert the repo here)

Prerequisites

  • Git. Which is a open source distributed version control system designed for source code management
  • A text editor (e.g Visual Studio Code, Vim, Atom & Sublime.)
  • A web browser (e.g Chrome, Safari, Mozilla Firefox.)
  • Live Server which is a web extension that helps you to live reload feature for dynamic content (PHP, Node.js, ASPNET)

Setup

  • Using git, clone the code to your machine or download a Zip File.

Deployment

  • Here is the live view of this project link

🤝 Contributing

  • Contributions, issues, and feature requests are welcome!

  • Feel free to check the issues page.

Show your support

  • Give a ⭐️ if you like this project!

Acknowledgements

  • Background image by Markus Spiske in unsplash
  • Background image by King Siberia in pexels

📝 License

  • This project is MIT licensed.

Github

https://github.com/Graycemuthui/Leaderboard

Comments(3)

  • 1

    Styling : Added styles to the Leaderboard List

    Description.

    In this project I achieved:

    • Improved the look and feel of the application.
    • Kept the general layout of the wireframe.
    • Used plain CSS.

    Screenshot

    • Here is a screenshot of the project. Screenshot from 2022-06-16 18-59-01
  • 2

    Api functionality : Create functionality for the Leaderboard list

    Description

    In this project I achieved the following:

    • Created a new game with the name of your choice by using the API. :heavy_check_mark:
    • Implemented the "Refresh" button (receiving data from the API and parsing the JSON). :heavy_check_mark:
    • Implemented the form "Submit" button (sending data to the API). :heavy_check_mark:
    • Used async and await JavaScript features to consume the API. :heavy_check_mark:

    Screenshot

    • Here is a screenshot for this project

    Screenshot from 2022-06-16 10-05-43

  • 3

    Html-Structure: Creating the Html Structure for the LeaderBoard

    Description

    In this project I achieved the following:

    • Used Gitflow :heavy_check_mark:
    • Created an npm project with webpack. :heavy_check_mark:
    • Wrote plain HTML markup with minimum styling (just to make the layout). :heavy_check_mark:

    Screenshot

    Screenshot from 2022-06-14 18-14-30

Popular Tag

Related