Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

frontend-engineering/RepoArch

Repository files navigation

GitHub Architecture Generator

A powerful tool to automatically generate and visualize architecture diagrams for GitHub repositories. This tool helps developers understand and document their codebase structure through beautiful, interactive diagrams.

Features

  • 🎨 Automatic generation of functional and deployment architecture diagrams
  • πŸ”„ Interactive diagram editing with drag-and-drop support
  • πŸ“Š JSON-based intermediate representation for easy integration
  • πŸ›  Multiple usage options: CLI, SDK, and README integration
  • πŸ”Œ Plugin system for custom diagram generation
  • πŸ“± Responsive and beautiful visualization

Installation

# Install globally
npm install -g github-architecture-generator
# Or use as a dev dependency in your project
npm install --save-dev github-architecture-generator

Usage

CLI Usage

GitHub Architecture Generator

Usage

CLI Usage

# Generate architecture diagrams for a repository and export as Excalidraw format (default)
github-arch generate --repo username/repo-name
# Generate specific diagram types and export as Excalidraw format
github-arch generate --repo username/repo-name --type functional
github-arch generate --repo username/repo-name --type deployment
# Output to specific format, including Excalidraw
github-arch generate --repo username/repo-name --output json
github-arch generate --repo username/repo-name --output mermaid
github-arch generate --repo username/repo-name --output svg
github-arch generate --repo username/repo-name --output png
github-arch generate --repo username/repo-name --output excalidraw

SDK Usage

import { ArchitectureGenerator } from 'github-architecture-generator';
const generator = new ArchitectureGenerator({
 token: 'your-github-token'
});
// Generate functional architecture
const functionalDiagram = await generator.generateFunctionalArchitecture('username/repo-name');
// Generate deployment architecture
const deploymentDiagram = await generator.generateDeploymentArchitecture('username/repo-name');
// Export to different formats
const jsonOutput = await generator.exportToJson();
const mermaidOutput = await generator.exportToMermaid();

README Integration

Add the following to your README.md:

<!-- Architecture Diagram -->
![Architecture Diagram](https://github-architecture-generator.vercel.app/api/diagram?repo=username/repo-name&type=functional)

Configuration

Create a .github-arch-config.json file in your project root:

{
 "githubToken": "your-github-token",
 "diagramTypes": ["functional", "deployment"],
 "outputFormats": ["json", "mermaid", "svg"],
 "excludePatterns": ["node_modules", "dist"],
 "customStyles": {
 "nodeColor": "#4CAF50",
 "edgeColor": "#2196F3"
 }
}

Development

# Install dependencies
npm install
# Run in development mode
npm run dev
# Build the project
npm run build
# Run tests
npm test

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT License - see the LICENSE file for details.

About

Generate architecture for repo

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

AltStyle γ«γ‚ˆγ£γ¦ε€‰ζ›γ•γ‚ŒγŸγƒšγƒΌγ‚Έ (->γ‚ͺγƒͺγ‚ΈγƒŠγƒ«) /