Create an Admin Dashboard

[shivamluthra]

What you will need to know?

Javascript - Intermediate/Advance level (How to use requests and response using AJAX/Fetch asynchronously)

Create an Admin Dashboard

Admin Dashboard inside CodeBadge platform will be a place where all the management work takes place by Organization Admins. This shall be a new tab which would be visible only to the organization admin(s) (which can be identified while fetching the user roles for user contribution tracking from official GitHub API). This should give admin the access to various major features such as creating/editing/deleting badges which are to be awarded to the top contributors. Along with this, admin should have access to complete organization analytics such as monthly contribution rate, last active date of users, all-time contributions, etc. Same provided API would help you in providing all this kind of analytical data. You can use ChartsJS library for representation of these analytics.

Requirements

• HTML, CSS, Javascript - Intermediate/Advance level

Steps to Follow

• Claim this issue: Comment below. If someone else has claimed it, ask if they've opened a pull request already and if they're stuck -- maybe you can help them solve a problem or move it along!
• Install CodeBadge on your system go through readme.md in development branch for this purpose
• After installing CodeBadge install dependencies of backend and frontend, go through readme.md inside both the folders
  Link to readme https://github.com/codeuino/Codebadge/blob/master/README.md
• To run the project follow the given step in readme.md for both frontend and backend.
• Checkout to a different feature branch in git and start with the coding part.
• Make sure to commit your work daily and create a single PR for all your commits, per feature.

Acceptance Criteria

• Code is short, clean and properly indented.
• Unused code/comments/variables should not be lying in the code unnecessarily exploiting memory.
• Minimal number of re-iterations in order to improve efficiency and keep the commit history clean.
• Best practices should be used in case of multiple approaches, mentors are always there to help you for this 👍

Rejection Criteria

• Not following/Violating Code of Conduct can lead to rejection.
• Coding etiquettes must be taken care of, for eg, always committing code in a different feature branch, same PR is edited in case of re-iteration of code, etc.

Expected Outcome

An Admin Dashboard tab inside CodeBadge platform which won't be visible to general members/contributors of the community but only to org admin(s), showing various kind of analytics as to how the organization is performing/growing as well as features to create/edit 'CodeBadges'.

How to excel fast in the community

• Share the issues you encounter along the way and help others solve theirs.
• Chime in below in a comment to cooperate with others who are also working on this task.
• Report back at the above issue once you succeed, to encourage others and share what worked for you!

Resources & References (Where to Start)

You'll need to go through the docs of official GitHub API for fetching various analytics and ChartsJS library for pictorial representation of the same data.

Extras

Just follow the readme whenever you are stuck . Visit Codeuino's Website in case of any doubts.