PetitHub 🌌

Explore the hidden gems of GitHub with PetitHub!

This project is an adaptation of the Petit Tube concept to GitHub: it allows users to discover random, obscure GitHub repositories that have no stars. Whether you're looking to find an undiscovered masterpiece or just satisfy your curiosity, PetitHub is here to take you on a journey through the lesser-known corners of GitHub.

Links 🔗

• Cloudflare: petithub.pages.dev
• GItHub: (coming soon) ⏳

Table of Contents 📋

• PetitHub 🌌
  • Links 🔗
  • Table of Contents 📋
  • Features ✨
  • How It Works 🔍
  • Endpoints 📑
    • Main Page
    • Custom API
  • Getting Started 🚀
    • Prerequisites
    • Installation
    • Using the App
  • Authentication 🔐
  • Technologies Used 🛠️
  • Contributing 🤝
  • License 📄
  • Contact 📧
  • Acknowledgements 🙏
  • Support ☕
  • Roadmap 🗺️
    • TODO
    • Done

Features ✨

• 🎲 Random Repository Discovery: Explore random GitHub repositories that have zero stars.
• 🎨 Custom Repository Display: View repository information (name, author, language, stars, watchers, forks...) in a fully integrated custom display.
• 🔗 Quick Access: Easily navigate to the GitHub page of any displayed repository.
• 👤 Enhanced Browsing with Authentication: Connect your GitHub account to remove rate limits and access additional features like starring repositories.
• 🔧 Custom API: Search for niche repositories by name or ID using the integrated API.
• 🚀 Fast and Fun Interface: Built with the Hono framework for a smooth and enjoyable user experience.

How It Works 🔍

PetitHub uses the Octokit package to interact with the GitHub API. It browses the public repositories looking for unique, not starred repositories. You can use the app without a GitHub account, but signing in with GitHub App provides a more seamless experience without rate limiting and unlocks extra features.

PetitHub is built with Hono over a Vite server for a fast user and easy developer experience. It fully integrates most of the features from Hono.

Endpoints 📑

Main Page

The main page displays a random GitHub repository with all its relevant details. You can quickly star the repository or visit its GitHub page.

Custom API

• Browse by Name or ID: Look up repositories by their name or ID using our custom API endpoints.
• Recent Repository ID: Retrieve the ID of the most recently created repository on GitHub.

Getting Started 🚀

Prerequisites

• Node.js
• npm

Installation

1. Clone the repository:

   git clone https://github.com/cletqui/petithub.git
   cd petithub

2. Install dependencies:

   npm install

3. Start the development server:

   npm run dev

Using the App

Open your browser and navigate to http://localhost:5173 to start exploring obscure GitHub repositories.

Authentication 🔐

For an enhanced experience, connect your GitHub account. This will allow you to bypass rate limits and access special features like starring repositories directly from PetitHub.

Technologies Used 🛠️

• Hono JS Framework: For a fast and clean frontend experience.
• Octokit: To interact with the GitHub API.
• Node.js: Backend runtime environment.
• Vite: Server framework.

Contributing 🤝

Contributions are welcome! Feel free to open an issue or submit a pull request.

1. Fork the repository.

2. Create your feature branch:

   git checkout -b feature/AmazingFeature

3. Commit your changes:

   git commit -m 'Add some AmazingFeature'

4. Push to the branch:

   git push origin feature/AmazingFeature

5. Open a pull request.

License 📄

Distributed under the MIT License. See LICENSE for more information.

Contact 📧

X / Twitter - @cletqui

Project Link: https://github.com/cletqui/petithub

Acknowledgements 🙏

• Inspired by Petit Tube.
• Thanks to the developers of Octokit and Hono JS.

Support ☕

If you like this project, you can support me by buying my next coffee on BuyMeACoffee.

Happy exploring! 🌟

---

Roadmap 🗺️

TODO

• Improve GUI
  • add additional info about the repo
  • implement dark/light themes
  • mimic GitHub layout
  • set page title as full_name & use GitHub link in header like GitHub page
  • cache svg imports
  • add reload button
  • fix header hidden on small screens
  • add colors for languages
  • refactor code wit shadcn UI
  • fix cookie storage/deletion (and interferences with GUI)
  • change the document title dynamically (with nested Suspense)
  • use nested renderer to render multiple components
  • use useRequestContext to have conditional render
  • implement Swagger with API
  • add profile name + icon when connected + fix UI
  • add possibility to logout
  • allow starring repo when connected
• Handle Octokit errors (401 & 403)
• Define unit tests
• Fix interfaces and type definitions
• Setup GitHub Actions
  • to deploy the website to GitHub
  • to run tests automatically
  • fix GitHub security detection on tests files
• Make sure the project is compatible with multiple deployment types
  • Cloudflare
  • GitHub
  • Heroku
• Refactor saving access_token in c.var and access it through octokit.auth instead
• Sanitize all strings into ${string}

Done

• Write README.md
• Write GitHub App description
• fix API by adding 404 not found if no repo by id is found
• Add icons in footer
• Find MAX_ID dynamically and store in Cookies
• Require GitHub API (Bearer Auth) for /api/* requests
• Display Template
• Refactor code into smaller modules
• Setup GitHub App
  • fix oauth workflow
  • define default demo/GitHub choice page
  • error handling when access_token is not defined (go back to authentication or use default token)
  • validate the token used before using them
  • fix access_token/refresh_token cookie storage issue
  • optimize performance
  • change GitHub App icon
  • handle state verification
  • handle access_token refresh with refresh_token
• Use middlewares
  • to declare the octokit instance
  • to add auth header if access_token is valid (to allow API use when access_token is defined)