Hi @Tekle, We loved your project 💯 and the javascript was very well structured. The code was DRY and you kept it simple. However, there are a few issues to air out in order to improve your project: [Optional]

• Consider adding the description on the about on the Github repository to help users easily know what your project is all about.
• To make your code readable, consider using async and await instead of promise in the scores.js.
• Please validate the name input to accept only alphabetical values on the form.

What this PR does

• Add css styling to improve the look and feel of the application
• Update README.md file to incorporate snapshot images
• Update README.md file to incorporate live link
• Add Press Start 2P Google font.

How to test it

• clone the repository by running
  git clone https://github.com/gtekle/leaderboard.git
• navigate to the folder
  cd leaderboard
• Install packages
  npm install
• To run application using webpack-dev-server
  npm start

Details

• Sort players in score descending order
• Add document body background image
• Add recent scores list section background image and color
• Add styling to add score section
• Add styling to main title
• Add styling to recent scores list
• Add mobile version layout styling
• Update README.md file snapshot images and live link sections
• Fix linter errors

What this PR does

• Add validation for user name form input according to #4
• Update README.md file live demo section

How to test it

• clone the repository by running
  git clone https://github.com/gtekle/leaderboard.git
• navigate to the folder
  cd leaderboard
• Install packages
  npm install
• To run application using webpack-dev-server
  npm start

Details

• Add p tag for displaying error messages in the add score form
• Check for valid user name on form submit and display error message if any

What this PR does

• Create an npm project with webpack.
• Add plain HTML markup with minimum styling according to the wireframe design provided.

How to test it

• clone the repository by running
  git clone https://github.com/gtekle/leaderboard.git
• navigate to the folder
  cd leaderboard
• Install packages
  npm install
• To run application using webpack-dev-server
  npm start

Details

• Add webpack configuration
• Create src folder, dist folder, index.js file and index.html file
• Add boilerplate HTML code to index.html
• Install css-leader and HtmlWebpackPlugin
• Setup github actions and linters
• Install babel transform-modules-commonjs plugin
• First npm run build generated output
• Add header section to index.html template file
• Add main section which renders list of recent scores and a form to ad…
• Add basic styling
• Refactor code into modules
• Update README.md file
• Fix linter errors

What this PR does

• Created new game with ID OYxzLGROB4qVtRjyvig5.
• Fetch (GET) scores on window load event.
• Fetch (GET) scores on "Refresh" button click and render them.
• POST new score on form "Submit" event to the Leaderboard API.

How to test it

• clone the repository by running
  git clone https://github.com/gtekle/leaderboard.git
• navigate to the folder
  cd leaderboard
• Install packages
  npm install
• To run application using webpack-dev-server
  npm start

Details

• Fetch scores from Leaderboard API and render
• Add new score to Leaderboard API on form submit.
• Fetch score from Leaderboard API on refresh button click and render
• Fix linter errors

Hi @gtekle great work on this project! We love how clean and neat your project is. Great on the mobile view!

We have a few suggestions:

• Please transfer your "style files" from the folder "assets" to the "src" folder.
• To reset the form, it would be better to call the reset() function only on the form instead of the event that calls the event listener to prevent unwanted issues!