Skip to content

Nicocappabianca/commit-activity-graph

Repository files navigation

Commit Activity Graph

Welcome! 👋 This project is a web application to visualize GitHub repository commit activity in a calendar-like format. Each day’s contributions are represented by a colored cell, with tooltips displaying the exact number of contributions and date on hover. You can search for any GitHub repository by username.

View Live 💻

  • You can view the live version here: Full Live Demo 🔗
  • 🚀 Also you can directly view the commit activity graph of /facebook/react here: Live Graph Demo 🔗

How to Clone and Run the Project 👨🏽‍💻

Prerequisites

Before you begin, ensure you have the following tools installed on your computer:

  • Node.js (v14 or later)
  • npm or yarn (latest version)

Installation & Run Instructions

  1. Clone the Repository:
git clone https://github.com/Nicocappabianca/commit-activity-graph.git
cd commit-activity-graph
  1. Install Dependencies:
npm install
# or
yarn install
  1. Run the Application in Development Mode:
npm run dev
# or
yarn dev
  1. Open the Application: Open your browser and navigate to http://localhost:3000 to view the application.

Tech Stack 🛠️

The tools behind the project

Tech Stack

  • TypeScript: Chosen for its static typing, which helps catch errors early and improves code maintainability.
  • React: Selected for its component-based architecture, making the UI modular and reusable.
  • Tailwind CSS: Used for its utility-first approach, allowing for rapid and responsive design development.
  • Next.js: Selected for its performance benefits, server-side rendering and routing capabilities.

Thank you for taking the time to explore this project. If you have any questions or feedback, feel free to reach out.

👥 LinkedIn: /in/nicolascappabianca 📧 Email: nicolas.cappabianca@gmail.com