GitHub Documentation Generator

🚀 AI-Powered README Generator for GitHub Repositories

Generate comprehensive, professional README files for your GitHub projects with intelligent analysis, folder structure visualization, and AI-powered code replication prompts.

📋 Table of Contents

✨ Features
🎯 About
🛠️ Technologies
📁 Project Structure
🚀 Installation
💻 Usage
🤖 AI Features
📱 Responsive Design
🔧 Configuration
🤝 Contributing
📄 License
📧 Contact

✨ Features

🎯 Core Features

Auto README Generation: Instantly create comprehensive README files
GitHub API Integration: Fetch repository data, languages, and file structures
Folder Tree Visualization: Beautiful ASCII tree representation of project structure
Smart Content Analysis: Automatic detection of project type and technologies

🤖 AI-Powered Features

Intelligent Project Analysis: AI analyzes code structure and provides insights
Code Replication Prompts: Generate detailed prompts for AI agents to recreate projects
Quality Indicators: Automatic detection of tests, CI/CD, Docker support
Smart Recommendations: AI suggests use cases and best practices

🎨 User Experience

Fully Responsive: Works perfectly on mobile, tablet, and desktop
Modern UI: Beautiful gradient designs with Tailwind CSS
Real-time Generation: Instant results with loading states
Copy & Download: Easy clipboard copy and file download

🎯 About

The GitHub Documentation Generator is a modern web application built with React 19, TypeScript, and Vite. It leverages the GitHub API to analyze repositories and uses OpenAI's GPT models to generate intelligent documentation and code replication prompts.

Repository Stats:

⭐ Stars: 0
🍴 Forks: 0
👁️ Watchers: 0
🐛 Open Issues: 0

🤖 AI-Generated Project Analysis

Project Type: Vite-powered web application

Primary Language: TypeScript (+ 3 others)

Project Maturity:

Emerging community interest
Initial community contributions
Stable with no open issues

Quality Indicators:

✅ Includes test suite
✅ CI/CD pipeline configured
✅ Docker support available
✅ Documentation available

Recommended Use Cases:

Building modern web applications with TypeScript
Learning web development best practices
Creating developer tools and utilities

🛠️ Technologies

This project is built with cutting-edge technologies:

Frontend Framework

React 19.1.1 - Latest React with concurrent features
TypeScript 5.9.3 - Type-safe JavaScript
Vite 7.1.7 - Fast build tool and dev server

UI & Styling

Tailwind CSS 4.1.16 - Utility-first CSS framework
shadcn/ui - Modern component library
Lucide React - Beautiful icons
Radix UI - Accessible component primitives

State & Data

TanStack Query - Powerful data fetching and caching
React Router - Client-side routing
Sonner - Toast notifications

Development Tools

ESLint - Code linting
TypeScript ESLint - TypeScript-specific linting
PostCSS - CSS processing

APIs & Services

GitHub REST API - Repository data fetching
OpenAI API - AI-powered content generation

📁 Project Structure

github-doc/
├── 📁 public/
│   └── 📄 vite.svg
├── 📁 src/
│   ├── 📁 assets/
│   │   └── 📄 react.svg
│   ├── 📁 components/
│   │   └── 📁 ui/          # shadcn/ui components
│   ├── 📁 hooks/
│   │   ├── 📄 use-mobile.tsx
│   │   └── 📄 use-toast.ts
│   ├── 📁 lib/
│   │   └── 📄 utils.ts
│   ├── 📁 pages/
│   │   ├── 📄 Index.tsx    # Main application page
│   │   └── 📄 NotFound.tsx # 404 error page
│   ├── 📄 App.tsx          # Main app component
│   ├── 📄 App.css          # App-specific styles
│   ├── 📄 index.css        # Global styles
│   └── 📄 main.tsx         # App entry point
├── 📄 .env                 # Environment variables
├── 📄 .gitignore
├── 📄 components.json      # shadcn/ui configuration
├── 📄 eslint.config.js     # ESLint configuration
├── 📄 index.html           # HTML template
├── 📄 package.json         # Dependencies and scripts
├── 📄 pnpm-lock.yaml       # Package lock file
├── 📄 README.md            # This file
├── 📄 tsconfig.app.json    # TypeScript config for app
├── 📄 tsconfig.json        # Base TypeScript config
├── 📄 tsconfig.node.json   # TypeScript config for build tools
└── 📄 vite.config.ts       # Vite configuration

🚀 Installation

Prerequisites

Node.js 18+ and npm/pnpm/yarn
GitHub account (optional, for higher API limits)
OpenAI API key (optional, for AI features)

Setup Steps

# Clone the repository
git clone https://github.com/CodewithEvilxd/gitdocgen.git

# Navigate to project directory
cd gitdocgen

# Install dependencies
npm install
# or
pnpm install
# or
yarn install

# Copy environment variables
cp .env.example .env

# Add your API keys to .env
# VITE_GITHUB_TOKEN=your_github_token_here
# VITE_OPENAI_API_KEY=your_openai_api_key_here

# Start development server
npm run dev
# or
pnpm dev
# or
yarn dev

💻 Usage

Basic Usage

Open the application in your browser (usually http://localhost:5173)
Enter a GitHub repository URL (e.g., https://github.com/facebook/react)
Select your options:
- ✅ AI-powered project analysis
- ✅ Folder structure tree
- ✅ Code replication prompt (requires OpenAI API key)
Click "Generate Documentation"
Copy or download the generated README.md

Advanced Features

GitHub Token (Recommended)

Add your GitHub personal access token to increase API rate limits:

VITE_GITHUB_TOKEN=ghp_your_token_here

OpenAI Integration

Add your OpenAI API key for AI-powered features:

VITE_OPENAI_API_KEY=sk-your_openai_key_here

🤖 AI Features

Project Analysis

The AI analyzes your repository and provides:

Project type detection (React app, Node.js, Python, etc.)
Technology stack identification
Quality indicators (tests, CI/CD, documentation)
Maturity assessment (stars, forks, issues)
Use case recommendations

Code Replication Prompts

Generate detailed prompts that AI agents can use to recreate your project:

Complete file structure
Code snippets for each file
Setup and installation instructions
Configuration details
Deployment guidance

📱 Responsive Design

The application is fully responsive and works perfectly on:

📱 Mobile phones (320px and up)
📟 Tablets (640px and up)
💻 Desktops (1024px and up)
🖥️ Large screens (1280px and up)

Responsive Features

Adaptive layouts that stack on mobile
Touch-friendly buttons and interactions
Optimized text sizes for readability
Collapsible navigation elements
Responsive typography and spacing

🔧 Configuration

Environment Variables

Create a .env file in the root directory:

# GitHub API (optional, increases rate limits)
VITE_GITHUB_TOKEN=your_github_personal_access_token

# OpenAI API (optional, enables AI features)
VITE_OPENAI_API_KEY=your_openai_api_key

Build Configuration

The project uses Vite for building. Customize vite.config.ts for advanced configuration:

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  // Add your custom configuration here
})

🤝 Contributing

We welcome contributions! Please follow these steps:

Development Setup

Fork the repository

Clone your fork:

git clone https://github.com/your-username/github-doc.git
cd github-doc

Create a feature branch:
```
git checkout -b feature/amazing-feature
```
Install dependencies:
```
npm install
```
Start development server:
```
npm run dev
```
Make your changes
Run linting:
```
npm run lint
```
Commit your changes:
```
git commit -m 'Add amazing feature'
```
Push to your branch:
```
git push origin feature/amazing-feature
```
Open a Pull Request

Guidelines

Follow the existing code style
Add tests for new features
Update documentation as needed
Ensure responsive design works on all screen sizes
Test with different repository types

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.

📧 Contact

Project Link: https://github.com/CodewithEvilxd/gitdocgen

Author: CodewithEvilxd

Issues: Report bugs or request features

Built with ❤️ by CodewithEvilxd

Transform your GitHub repositories into professional documentation with AI-powered insights

React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

@vitejs/plugin-react uses Babel (or oxc when used in rolldown-vite) for Fast Refresh
@vitejs/plugin-react-swc uses SWC for Fast Refresh

React Compiler

The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.

Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:

export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...

      // Remove tseslint.configs.recommended and replace with this
      tseslint.configs.recommendedTypeChecked,
      // Alternatively, use this for stricter rules
      tseslint.configs.strictTypeChecked,
      // Optionally, add this for stylistic rules
      tseslint.configs.stylisticTypeChecked,

      // Other configs...
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])

You can also install eslint-plugin-react-x and eslint-plugin-react-dom for React-specific lint rules:

// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'

export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...
      // Enable lint rules for React
      reactX.configs['recommended-typescript'],
      // Enable lint rules for React DOM
      reactDom.configs.recommended,
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])

Name		Name	Last commit message	Last commit date
Latest commit History 3 Commits
public		public
src		src
.gitignore		.gitignore
README.md		README.md
components.json		components.json
eslint.config.js		eslint.config.js
index.html		index.html
package-lock.json		package-lock.json
package.json		package.json
pnpm-lock.yaml		pnpm-lock.yaml
tsconfig.app.json		tsconfig.app.json
tsconfig.json		tsconfig.json
tsconfig.node.json		tsconfig.node.json
vite.config.ts		vite.config.ts

CodewithEvilxd/gitdocgen

Folders and files

Latest commit

History

Repository files navigation