{"id":31593102,"url":"https://github.com/panoramicdata/schemamagic","last_synced_at":"2025-10-06T03:37:02.787Z","repository":{"id":318167685,"uuid":"1070183488","full_name":"panoramicdata/SchemaMagic","owner":"panoramicdata","description":"Interactive HTML+SVG Database Schema Visualizer for Entity Framework Core","archived":false,"fork":false,"pushed_at":"2025-10-05T15:59:40.000Z","size":122,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-10-05T16:13:00.999Z","etag":null,"topics":["csharp","database-diagrams","dotnet-tool","entity-framework","html","interactive","schema-visualization","svg"],"latest_commit_sha":null,"homepage":"https://github.com/panoramicdata/SchemaMagic","language":"C#","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/panoramicdata.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"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,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-10-05T12:46:42.000Z","updated_at":"2025-10-05T15:59:43.000Z","dependencies_parsed_at":"2025-10-05T16:13:19.870Z","dependency_job_id":"faf6d0e6-e360-4ddc-adf6-ea7fea322a03","html_url":"https://github.com/panoramicdata/SchemaMagic","commit_stats":null,"previous_names":["panoramicdata/schemamagic"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/panoramicdata/SchemaMagic","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/panoramicdata%2FSchemaMagic","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/panoramicdata%2FSchemaMagic/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/panoramicdata%2FSchemaMagic/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/panoramicdata%2FSchemaMagic/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/panoramicdata","download_url":"https://codeload.github.com/panoramicdata/SchemaMagic/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/panoramicdata%2FSchemaMagic/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":278556223,"owners_count":26006079,"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","status":"online","status_checked_at":"2025-10-06T02:00:05.630Z","response_time":65,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["csharp","database-diagrams","dotnet-tool","entity-framework","html","interactive","schema-visualization","svg"],"created_at":"2025-10-06T03:36:33.615Z","updated_at":"2025-10-06T03:37:02.771Z","avatar_url":"https://github.com/panoramicdata.png","language":"C#","funding_links":[],"categories":[],"sub_categories":[],"readme":"﻿# SchemaMagic ✨\n\n**Interactive HTML+SVG Database Schema Visualizer for Entity Framework Core**\n\nTransform your Entity Framework DbContexts into beautiful, interactive schema diagrams with just one command.\n\n[![NuGet Version](https://img.shields.io/nuget/v/SchemaMagic.svg)](https://www.nuget.org/packages/SchemaMagic)\n[![Downloads](https://img.shields.io/nuget/dt/SchemaMagic.svg)](https://www.nuget.org/packages/SchemaMagic)\n[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)\n[![.NET](https://img.shields.io/badge/.NET-9.0-purple.svg)](https://dotnet.microsoft.com/)\n[![Web App](https://img.shields.io/badge/Web-App-blue.svg)](https://panoramicdata.github.io/SchemaMagic)\n\n## 🌐 Try Online\n\n**[🚀 SchemaMagic Web](https://panoramicdata.github.io/SchemaMagic)** - Analyze GitHub repositories online without installing anything!\n\n## 🎯 Features\n\n- 🖱️ **Interactive Tables**: Drag tables around, pan and zoom the canvas\n- 🔗 **Smart Relationships**: Automatic detection of foreign keys and navigation properties\n- 🎨 **Professional Styling**: Beautiful SVG rendering with hover effects and animations\n- 🧲 **Physics-Based Layout**: Intelligent auto-positioning of tables for optimal readability\n- 🔍 **Click to Navigate**: Click FK/Navigation properties to jump between related entities\n- 📋 **Table Selection**: Click tables to highlight and filter their relationships\n- 💾 **Persistent Customization**: Your layout changes are saved and restored automatically\n- 📦 **Self-Contained**: Generated HTML files work offline with no external dependencies\n- ⚡ **Fast Generation**: Parses C# code directly using Roslyn - no compilation needed\n\n![SchemaMagic Demo](https://github.com/panoramicdata/SchemaMagic/raw/main/docs/demo.gif)\n\n## 🚀 Quick Start\n\n### Option 1: Web Application (No Installation)\n\nVisit **[SchemaMagic Web](https://panoramicdata.github.io/SchemaMagic)** to:\n- 📁 Analyze any public GitHub repository\n- 🔍 Automatically discover DbContext files\n- ⚡ Generate schemas instantly in your browser\n- 💾 Download interactive HTML files\n\n### Option 2: Command-Line Tool\n\nInstall as a global .NET tool:\n\n```bash\ndotnet tool install -g SchemaMagic\n```\n\nGenerate an interactive schema from your DbContext:\n\n```bash\n# Basic generation\nschemamagic path/to/MyDbContext.cs\n\n# Custom output file\nschemamagic MyDbContext.cs --output MyProjectSchema.html\n\n# Include custom CSS styling\nschemamagic MyDbContext.cs --css-file custom-styles.css\n```\n\n### Example Output\n\nThe generated HTML file creates an interactive diagram where you can:\n- **Drag tables** to arrange them as you prefer\n- **Click tables** to select and highlight their relationships \n- **Click again** to deselect and show all relationships\n- **Navigate** by clicking foreign key and navigation properties\n- **Zoom and pan** to explore large schemas\n- **Toggle** inheritance and navigation property visibility\n\n## 📖 Usage Guide\n\n### Command Line Options\n\n```bash\nschemamagic [DbContext file path] [options]\n\nArguments:\n  \u003cdbcontext-file\u003e    Path to the DbContext C# file\n\nOptions:\n  --output \u003cfile\u003e     Output HTML file path (default: auto-generated)\n  --css-file \u003cfile\u003e   Custom CSS file to override default styling  \n  --guid \u003cguid\u003e       Preserve localStorage state with specific GUID\n  --output-default-css Export default CSS for customization\n  -h, --help          Show help information\n  --version           Show version information\n```\n\n### Interactive Features\n\nOnce you open the generated HTML file:\n\n- **🖱️ Drag Tables**: Click and drag any table to reposition it\n- **🔍 Pan \u0026 Zoom**: Use mouse wheel to zoom, drag background to pan\n- **🎯 Select Tables**: Click a table to select it and highlight its relationships\n- **❌ Deselect Tables**: Click a selected table again to deselect it\n- **🧭 Navigate**: Click foreign key or navigation properties to jump to related entities\n- **⚙️ Toggle Options**: Use toolbar buttons to show/hide different elements\n- **💾 Save Layout**: Your customizations are automatically saved in browser storage\n- **⌨️ Keyboard**: Press `Escape` to deselect any selected table\n\n### Relationship Visualization\n\nSchemaMagic automatically detects and visualizes:\n\n- **Foreign Key Relationships**: Shows connections between FK properties and primary keys\n- **Navigation Properties**: Displays entity navigation properties with proper cardinality\n- **Inheritance**: Visualizes entity inheritance hierarchies\n- **Crow's Foot Notation**: Professional ERD-style relationship indicators\n\n### Property Icons and Colors\n\n- **🔑 PK**: Primary Key (yellow)\n- **🔗 FK**: Foreign Key (purple) \n- **🧭 N**: Navigation Property (green)\n- **📊 INH**: Inherited Property (blue)\n- **Type Colors**: Different colors for strings, numbers, dates, etc.\n\n## 🎨 Customization\n\n### Custom Styling\n\nExport the default CSS to customize appearance:\n\n```bash\nschemamagic --output-default-css my-custom.css\n```\n\nThen use your custom styles:\n\n```bash\nschemamagic MyDbContext.cs --css-file my-custom.css\n```\n\n### Layout Persistence\n\nEach generated schema has a unique GUID for localStorage. To maintain layouts across regenerations:\n\n```bash\nschemamagic MyDbContext.cs --guid \"your-custom-guid-here\"\n```\n\n## 🛠️ Development\n\n### Building from Source\n\n```bash\ngit clone https://github.com/panoramicdata/SchemaMagic.git\ncd SchemaMagic\ndotnet build\ndotnet run -- path/to/YourDbContext.cs\n```\n\n### Running the Web Application Locally\n\n```bash\ncd SchemaMagic.Web\ndotnet run\n```\n\nThe web application will be available at `https://localhost:5001`\n\n### Running Tests\n\n```bash\ndotnet test\n```\n\n### Project Structure\n\n```\nSchemaMagic/\n├── SchemaMagic/                # Main CLI tool project\n├── SchemaMagic.Web/           # Blazor WebAssembly web application\n├── templates/                  # Modular HTML/CSS/JS templates\n├── samples/                    # Example DbContexts for testing\n├── docs/                       # Documentation and examples\n└── .github/workflows/          # CI/CD automation\n```\n\n## 📋 Requirements\n\n- .NET 9.0 or later (for CLI tool)\n- Entity Framework Core DbContext files (any version)\n- Modern web browser for viewing generated HTML\n\n## 🌐 Web Application Features\n\nThe **[SchemaMagic Web](https://panoramicdata.github.io/SchemaMagic)** application offers:\n\n- 🔗 **GitHub Integration**: Connect to public repositories\n- 🔍 **Auto-Discovery**: Find DbContext files automatically  \n- ⚡ **Real-time Analysis**: Generate schemas without downloads\n- 📱 **Mobile Friendly**: Works on all devices\n- 💾 **Export Options**: Download interactive HTML files\n- 🚀 **No Installation**: Works entirely in your browser\n\n## 🤝 Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request. For major changes, please open an issue first to discuss what you would like to change.\n\n### Development Setup\n\n1. Fork the repository\n2. Create your feature branch (`git checkout -b feature/AmazingFeature`)\n3. Commit your changes (`git commit -m 'Add some AmazingFeature'`)\n4. Push to the branch (`git push origin feature/AmazingFeature`)\n5. Open a Pull Request\n\n### Adding New Features\n\n- **Template System**: Add new `.js` files to the `templates/` folder for client-side features\n- **Schema Analysis**: Extend the Roslyn-based C# parsing in `SchemaGenerator.cs`\n- **Styling**: Modify `templates/styles.css` for visual enhancements\n- **Interactive Features**: Add JavaScript functions to appropriate template files\n- **Web Application**: Enhance the Blazor WebAssembly app in `SchemaMagic.Web/`\n\n## 📄 License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n\n## 🙏 Acknowledgments\n\n- Built with ❤️ by [Panoramic Data Limited](https://panoramicdata.com)\n- Uses [Microsoft.CodeAnalysis](https://github.com/dotnet/roslyn) for C# parsing\n- Uses [Octokit](https://github.com/octokit/octokit.net) for GitHub API integration\n- Inspired by traditional ERD tools but designed for modern web browsers\n\n## 🐛 Issues and Support\n\nFound a bug or have a feature request? Please [open an issue](https://github.com/panoramicdata/SchemaMagic/issues) on GitHub.\n\nFor questions and discussions, visit our [GitHub Discussions](https://github.com/panoramicdata/SchemaMagic/discussions).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpanoramicdata%2Fschemamagic","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpanoramicdata%2Fschemamagic","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpanoramicdata%2Fschemamagic/lists"}