React Github UI Clone

A functional clone of the Github user interface that can show the top 6 repositories of a user based on the stars amount of each repository, using the Github API.

Used Technologies   |    Project's goal   |    Final Result   |    How to Run   |    Features

🚀 Used Technologies

• ReactJS with TypeScript to build the app in general
• Styled Components to style all the app(components, views and so on)
• React Router to make multiple routes
• Sweet Alert to make some toast messages
• Axios to make the all the requests to the API
• Github REST API to get all the data that the app uses

🎯 Project's goal

The aim of this project was practicing React with TypeScript, two techs that I'm liking really much and working hard to improve in them.

▶️ Final Result

You can check the final result clicking here

📋 Features

• Dynamic fetching of a Github user using the Github REST API
• Dynamic sorting of the top 6 repositories of the user, this top 6 is based on the amount of stars of each repository
• Light and Dark theme
• Responsive design
• Loading animation and errors messages

ℹ️ How to Run

Follow the steps below to run the project in your machine, before it all, you need to have the Git, Node.js and Yarn installed on your computer, then follow the steps below:

# Clone the repo
$ git clone https://github.com/TiagoDiass/github-ui-clone.git

# Enter in the directory
$ cd github-ui-clone

# Install the dependencies
$ yarn install

# Start the app
$ yarn start

After following these steps, your browser will automatically open in localhost:3000. To stop the app just go back to the terminal and press CTRL+C.

Hope you enjoyed this project 😃

👋 Get in touch!

Author: Tiago Dias