/github-user

A React app which dynamically displays GitHub user info and stats.

Primary LanguageJavaScript

GitHub User

A React app which dynamically displays GitHub user info and stats. Authentication via GitHub is required.

Live demo

Getting Started

In order to setup and work on this project on your own, you will need to:

  1. Clone this project:
    git clone https://github.com/GDimitroff/github-user.git

  2. Once you have cloned this project, you can install the required dependencies by using:
    npm install

  3. A live demo of the project can be started by using:
    npm start

  4. Distribution files can be produced using:
    npm run build

  5. You will need to create Firebase account and follow the instructions in their documentation in order authentication to work.

Features

  • Data is dynamically loaded via GitHub's API.
  • Authentication.
  • Routing.
  • Fully responsive.
  • Fancy charts provided by FusionCharts
  • When signing in with GitHub the app displays your own info and stats first before allowing you to search for different user.

Outcome

  • Deepened knowledge of using useEffect hook.
  • Deepened knowledge of using useCallback hook.
  • Deepened knowledge of using context for the global state management.
  • Used react-router.
  • Used FusionCharts for the fancy charts.
  • Used Firebase services for authentication.
  • Used react-firebase-hooks which in the end was overkill.
  • Used global CSS styles in combination with styled components.
  • Used axios and learned a lot about error handling.
  • Tried to keep file structure as clean as possible.
  • Deepened knowledge of using third party libraries.
  • Overall, I have improved my learning abilities A LOT! šŸ§ 

Screenshots

Screenshot