Skip to content

somnathkaushik/InterviewBit

Repository files navigation

Overview

The GitHub Analytics Dashboard is a web application built using React.js that allows users to search for GitHub users and view information about their repositories. The dashboard provides insights into a user's repositories, including details such as repository names, stars, forks, and open issues. Additionally, users can explore individual repositories to access detailed information such as the README file, recent commits, and open issues.

Key Features

  • User Search: Users can search for GitHub users by entering their usernames.
  • Repository Table: Displays a table of repositories for the selected user, including key metrics like stars, forks, and open issues. Users can sort repositories based on different criteria and click on repository names to view detailed information.
  • Detailed Repository View: Upon clicking a repository name, users can access a detailed view that includes the repository's README file, a list of recent commits, and open issues.
  • Contributors List: Shows a list of contributors for each repository, along with the option to view their GitHub profiles.

Technologies Used

  • React.js: Frontend library for building user interfaces.
  • Vite: Next-generation frontend tooling.
  • Tailwind CSS: Utility-first CSS framework for styling the application.
  • Axios: HTTP client for making API requests to the GitHub API.
  • GitHub API: Used to fetch user and repository data, including repositories, commits, issues, and contributors.

Installation

  1. Clone the repository:

    git clone https://github.com/your-username/github-analytics-dashboard.git
  2. Navigate to the project directory:

    cd frontend
  3. Install dependencies:

    • Vite:

      npm install vite
    • React:

      npm install react react-dom
    • Tailwind CSS:

      npm install -D tailwindcss@latest postcss@latest autoprefixer@latest
    • Axios:

      npm install axios
    • Other Dependencies:

      npm install

How to Run

  1. Start the development server:

    npm run dev
  2. Open your web browser and navigate to http://localhost:3000 to view the application.

Usage

  1. Enter a GitHub username in the search bar.
  2. Select a user from the search results to view their repositories.
  3. Explore repositories by clicking on their names to access detailed information.
  4. View README content, recent commits, open issues, and contributors for each repository.

Contributors

About

Interview bit hackathon

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •