{"id":23592575,"url":"https://github.com/ahmedkhaleel2004/gitdiagram","last_synced_at":"2025-05-12T13:24:21.454Z","repository":{"id":269739836,"uuid":"903700733","full_name":"ahmedkhaleel2004/gitdiagram","owner":"ahmedkhaleel2004","description":"Free, simple, fast interactive diagrams for any GitHub repository","archived":false,"fork":false,"pushed_at":"2025-04-24T01:38:29.000Z","size":529,"stargazers_count":10821,"open_issues_count":12,"forks_count":728,"subscribers_count":36,"default_branch":"main","last_synced_at":"2025-04-27T23:58:35.008Z","etag":null,"topics":["ai","code","github","system-design"],"latest_commit_sha":null,"homepage":"https://gitdiagram.com","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ahmedkhaleel2004.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":null,"patreon":null,"open_collective":null,"ko_fi":"ahmedkhaleel2004","tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"lfx_crowdfunding":null,"polar":null,"buy_me_a_coffee":null,"thanks_dev":null,"custom":null}},"created_at":"2024-12-15T10:32:03.000Z","updated_at":"2025-04-27T23:35:37.000Z","dependencies_parsed_at":null,"dependency_job_id":"4ee00ea0-b775-4c20-b05b-acd1a0f26e06","html_url":"https://github.com/ahmedkhaleel2004/gitdiagram","commit_stats":null,"previous_names":["ahmedkhaleel2004/gitdiagram"],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ahmedkhaleel2004%2Fgitdiagram","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ahmedkhaleel2004%2Fgitdiagram/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ahmedkhaleel2004%2Fgitdiagram/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ahmedkhaleel2004%2Fgitdiagram/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ahmedkhaleel2004","download_url":"https://codeload.github.com/ahmedkhaleel2004/gitdiagram/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253745761,"owners_count":21957438,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ai","code","github","system-design"],"created_at":"2024-12-27T08:14:32.475Z","updated_at":"2025-05-12T13:24:21.432Z","avatar_url":"https://github.com/ahmedkhaleel2004.png","language":"TypeScript","funding_links":["https://ko-fi.com/ahmedkhaleel2004"],"categories":["TypeScript","ai","AI \u0026 LLM","HarmonyOS","🤖 AI \u0026 Machine Learning"],"sub_categories":["LLM Apps \u0026 Interfaces","Windows Manager"],"readme":"[![Image](./docs/readme_img.png \"GitDiagram Front Page\")](https://gitdiagram.com/)\n\n![License](https://img.shields.io/badge/license-MIT-blue.svg)\n[![Kofi](https://img.shields.io/badge/Kofi-F16061.svg?logo=ko-fi\u0026logoColor=white)](https://ko-fi.com/ahmedkhaleel2004)\n\n# GitDiagram\n\nTurn any GitHub repository into an interactive diagram for visualization in seconds.\n\nYou can also replace `hub` with `diagram` in any Github URL to access its diagram.\n\n## 🚀 Features\n\n- 👀 **Instant Visualization**: Convert any GitHub repository structure into a system design / architecture diagram\n- 🎨 **Interactivity**: Click on components to navigate directly to source files and relevant directories\n- ⚡ **Fast Generation**: Powered by OpenAI o4-mini for quick and accurate diagrams\n- 🔄 **Customization**: Modify and regenerate diagrams with custom instructions\n- 🌐 **API Access**: Public API available for integration (WIP)\n\n## ⚙️ Tech Stack\n\n- **Frontend**: Next.js, TypeScript, Tailwind CSS, ShadCN\n- **Backend**: FastAPI, Python, Server Actions\n- **Database**: PostgreSQL (with Drizzle ORM)\n- **AI**: OpenAI o4-mini\n- **Deployment**: Vercel (Frontend), EC2 (Backend)\n- **CI/CD**: GitHub Actions\n- **Analytics**: PostHog, Api-Analytics\n\n## 🤔 About\n\nI created this because I wanted to contribute to open-source projects but quickly realized their codebases are too massive for me to dig through manually, so this helps me get started - but it's definitely got many more use cases!\n\nGiven any public (or private!) GitHub repository it generates diagrams in Mermaid.js with OpenAI's o4-mini! (Previously Claude 3.5 Sonnet)\n\nI extract information from the file tree and README for details and interactivity (you can click components to be taken to relevant files and directories)\n\nMost of what you might call the \"processing\" of this app is done with prompt engineering - see `/backend/app/prompts.py`. This basically extracts and pipelines data and analysis for a larger action workflow, ending in the diagram code.\n\n## 🔒 How to diagram private repositories\n\nYou can simply click on \"Private Repos\" in the header and follow the instructions by providing a GitHub personal access token with the `repo` scope.\n\nYou can also self-host this app locally (backend separated as well!) with the steps below.\n\n## 🛠️ Self-hosting / Local Development\n\n1. Clone the repository\n\n```bash\ngit clone https://github.com/ahmedkhaleel2004/gitdiagram.git\ncd gitdiagram\n```\n\n2. Install dependencies\n\n```bash\npnpm i\n```\n\n3. Set up environment variables (create .env)\n\n```bash\ncp .env.example .env\n```\n\nThen edit the `.env` file with your Anthropic API key and optional GitHub personal access token.\n\n4. Run backend\n\n```bash\ndocker-compose up --build -d\n```\n\nLogs available at `docker-compose logs -f`\nThe FastAPI server will be available at `localhost:8000`\n\n5. Start local database\n\n```bash\nchmod +x start-database.sh\n./start-database.sh\n```\n\nWhen prompted to generate a random password, input yes.\nThe Postgres database will start in a container at `localhost:5432`\n\n6. Initialize the database schema\n\n```bash\npnpm db:push\n```\n\nYou can view and interact with the database using `pnpm db:studio`\n\n7. Run Frontend\n\n```bash\npnpm dev\n```\n\nYou can now access the website at `localhost:3000` and edit the rate limits defined in `backend/app/routers/generate.py` in the generate function decorator.\n\n## Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request.\n\n## Acknowledgements\n\nShoutout to [Romain Courtois](https://github.com/cyclotruc)'s [Gitingest](https://gitingest.com/) for inspiration and styling\n\n## 📈 Rate Limits\n\nI am currently hosting it for free with no rate limits though this is somewhat likely to change in the future.\n\n\u003c!-- If you would like to bypass these, self-hosting instructions are provided. I also plan on adding an input for your own Anthropic API key.\n\nDiagram generation:\n\n- 1 request per minute\n- 5 requests per day --\u003e\n\n## 🤔 Future Steps\n\n- Implement font-awesome icons in diagram\n- Implement an embedded feature like star-history.com but for diagrams. The diagram could also be updated progressively as commits are made.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fahmedkhaleel2004%2Fgitdiagram","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fahmedkhaleel2004%2Fgitdiagram","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fahmedkhaleel2004%2Fgitdiagram/lists"}