/stats.jenkins.io

Revamped Jenkins Infra Stats Website as a part of GSoC 2024

Primary LanguageHTML

Jenkins Infra Statistics

Welcome to the stats.jenkins.io project! This repository contains the source code and resources for generating and displaying statistics related to Jenkins infrastructure. The project uses modern web technologies, including React, TypeScript, and Vite, to build a fast and responsive web interface for viewing Jenkins stats.

Table of Contents

  1. Project Overview
  2. Technologies Used
  3. Getting Started
  4. Development Workflow
  5. Building the Website Locally
  6. Testing
  7. Contributing
  8. Inspiration and References

Project Overview

The stats.jenkins.io project aims to provide an intuitive and efficient way to visualize and analyze various statistics related to Jenkins infrastructure. These statistics help the Jenkins community monitor and manage the infrastructure more effectively.

This project is part of the Jenkins Infra team’s efforts to improve transparency and operational efficiency by making infrastructure data accessible and understandable to all contributors and users.

Previous Version and GSoC 2024 Contribution

This website was built as part of Google Summer of Code (GSoC) 2024. The goal was to modernize and enhance the Jenkins infrastructure statistics site, providing a more intuitive and responsive interface for visualizing Jenkins usage stats.

Previous Version of the Site

Before GSoC 2024, the Jenkins infrastructure statistics were displayed on a different site, which can still be accessed at the following repository:

The old site remains as a submodule in this new project. We retrieve the data from the old site and display it on the new site, ensuring that the statistics are always up to date.

Usage Stats Generation

The statistics displayed on this site are generated by the Jenkins usage stats project, which the old site automatiallcy pulls in on a monthly schedule.

Note for Future Contributors and GSoC 2025 Project Idea

One of the goals for future development, potentially as a project for Google Summer of Code (GSoC) 2025, would be to remove the dependency on the old site. Currently, the usage stats are generated and updated on the old site, and each time the new site is built, it pulls the old site as a submodule to retrieve the data.

A valuable enhancement would be to develop a method that allows the usage stats to automatically update directly on the new site, eliminating the need to rely on the old site as an intermediary. This would streamline the data retrieval process, reduce dependencies, and improve the overall efficiency and maintainability of the project.

This could be a significant improvement for future contributors to consider, aligning with the ongoing goal of modernizing and optimizing the Jenkins infrastructure statistics site.

Technologies Used

  • React: A JavaScript library for building user interfaces.
  • TypeScript: A typed superset of JavaScript that compiles to plain JavaScript.
  • Vite: A next-generation front-end tool that provides fast builds and instant Hot Module Replacement (HMR).
  • ECharts: A powerful, interactive charting and visualization library.
  • Jenkins CI/CD: Automated testing and deployment pipelines.
  • Markdown: For writing documentation.

Getting Started

Prerequisites

To get started with this project, you will need the following installed on your machine:

  • Node.js (LTS version recommended)
  • npm (latest stable version)
  • Git: For cloning the repository and version control.

Installation

  1. Clone the repository:

    git clone https://github.com/jenkins-infra/stats.jenkins.io.git
cd stats.jenkins.io

  2. Retrieve data from infra-statistics:

    ./retrieve-infra-statistics-data.sh

  3. Install dependencies:

    npm install

Building the Website Locally

  1. Run the development server:

    npm run dev

    This will start the development server and open the website in your default browser. Any changes you make to the code will be automatically reflected in the browser thanks to Vite's HMR.

  2. Build for production:

    npm run build

    This will create an optimized production build of your application in the dist directory.

  3. Preview the build locally:

    After building the site, you can preview it locally to ensure everything is working as expected. Run the following command:

    npm run preview

    This will start a local static web server that serves the files from the dist directory. Open your browser and navigate to the provided URL to see the preview.

Contributing

Contributions to the stats.jenkins.io project are welcome! Please see the CONTRIBUTING.md file for more information on how to get involved.

Inspiration and References

For additional inspiration and detailed instructions, refer to the following documentation and resources: