mirror of https://github.com/mingrammer/diagrams
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
14 lines
5.9 KiB
14 lines
5.9 KiB
<!DOCTYPE html><html lang=""><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Diagrams · Diagram as Code</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="Diagram as Code"/><meta property="og:title" content="Diagrams · Diagram as Code"/><meta property="og:type" content="website"/><meta property="og:url" content="https://diagrams.mingrammer.com/"/><meta property="og:description" content="Diagram as Code"/><meta property="og:image" content="https://diagrams.mingrammer.com/img/diagrams.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://diagrams.mingrammer.com/img/diagrams.png"/><link rel="shortcut icon" href="/img/diagrams.ico"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/default.min.css"/><script>
|
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
|
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
|
|
|
|
ga('create', 'UA-84081627-3', 'auto');
|
|
ga('send', 'pageview');
|
|
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/"><img class="logo" src="/img/diagrams.ico" alt="Diagrams"/><h2 class="headerTitleWithLogo">Diagrams</h2></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/docs/getting-started/installation" target="_self">Docs</a></li><li class=""><a href="/docs/guides/diagram" target="_self">Guides</a></li><li class=""><a href="/docs/nodes/aws" target="_self">Nodes</a></li><li class=""><a href="https://github.com/mingrammer/diagrams" target="_self">GitHub</a></li><li class=""><a href="https://www.buymeacoffee.com/mingrammer" target="_self">Sponsoring</a></li></ul></nav></div></header></div></div><div class="navPusher"><div><div class="homeContainer"><div class="homeSplashFade"><div class="wrapper homeWrapper"><div class="projectLogo"><img src="/img/diagrams.png" alt="Project Logo"/></div><div class="inner"><h2 class="projectTitle">Diagrams<small>Diagram as Code</small></h2><div class="section promoSection"><div class="promoRow"><div class="pluginRowBlock"><div class="pluginWrapper buttonWrapper"><a class="button" href="/docs/getting-started/installation">Try It Out</a></div><div class="pluginWrapper buttonWrapper"><a class="button" href="/docs/getting-started/examples">Show Examples</a></div></div></div></div></div></div></div></div><div class="mainContainer"><div class="productShowcaseSection paddingBottom" style="text-align:center"><h2>About Diagrams</h2><div><span><p>Diagrams lets you draw the cloud system architecture <strong>in Python code</strong>.</p>
|
|
</span></div><div><span><p>It was born for <strong>prototyping</strong> a new system architecture without any design tools. You can also describe or visualize the existing system architecture as well.</p>
|
|
</span></div><div><span><p><code>Diagram as Code</code> allows you to <strong>track</strong> the architecture diagram changes in any <strong>version control</strong> system.</p>
|
|
</span></div><div><span><p>Diagrams currently supports main major providers including: <code>AWS</code>, <code>Azure</code>, <code>GCP</code>, <code>Kubernetes</code>, <code>Alibaba Cloud</code>, <code>Oracle Cloud</code> etc... It also supports <code>On-Premises</code> nodes, <code>SaaS</code> and major <code>Programming</code> frameworks and languages.</p>
|
|
</span></div><div><span><p><code>NOTE: It does not control any actual cloud resources nor does it generate cloud formation or terraform code. It is just for drawing the cloud system architecture diagrams.</code></p>
|
|
</span></div></div><div class="container paddingBottom paddingTop"><div class="wrapper"><div class="gridBlock"><div class="blockElement alignCenter imageAlignSide imageAlignLeft twoByGridBlock"><div class="blockImage"><img src="/img/message_collecting_code.png"/></div><div class="blockContent"><div></div></div></div><div class="blockElement alignCenter imageAlignSide imageAlignRight twoByGridBlock"><div class="blockContent"><div></div></div><div class="blockImage"><img src="/img/message_collecting_diagram.png"/></div></div></div></div></div><div class="container paddingBottom paddingTop"><div class="wrapper"><div class="gridBlock"><div class="blockElement alignCenter imageAlignSide imageAlignLeft twoByGridBlock"><div class="blockImage"><img src="/img/event_processing_code.png"/></div><div class="blockContent"><div></div></div></div><div class="blockElement alignCenter imageAlignSide imageAlignRight twoByGridBlock"><div class="blockContent"><div></div></div><div class="blockImage"><img src="/img/event_processing_diagram.png"/></div></div></div></div></div></div></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/diagrams.ico" alt="Diagrams" width="66" height="58"/></a><div><h5>Docs</h5><a href="/docs/getting-started/installation">Getting Started</a><a href="/docs/guides/diagram">Guides</a><a href="/docs/nodes/aws">Nodes</a></div><div><h5>More</h5><iframe src="https://ghbtns.com/github-btn.html?user=mingrammer&repo=diagrams&type=star&count=true&size=large" frameBorder="0" scrolling="0" width="170" height="30" title="Star mingrammer/diagrams on GitHub"></iframe></div></section><section class="copyright">Copyright © 2025 mingrammer</section></footer></div></body></html> |