OpenFLOW - लोकल पर तेज़ी से सुंदर इंफ्रास्ट्रक्चर डायग्राम बनाने का टूल

 (github.com/stan-smith)
46 पॉइंट द्वारा GN⁺ 2025-07-02 | 1 टिप्पणियां | WhatsApp पर शेयर करें
  • ब्राउज़र-आधारित ओपन सोर्स isometric (3D स्टाइल) डायग्राम बनाने वाला PWA
  • React और Isoflow इंजन पर आधारित, इंस्टॉल किए बिना ऑफलाइन भी काम करता है और प्राइवेसी, ऑटो-सेव, आसान Import/Export जैसी कई सुविधाएँ देता है
  • सारा डेटा लोकल ब्राउज़र स्टोरेज में सेव होता है, और डायग्राम को JSON फ़ाइल के रूप में आसानी से शेयर या बैकअप किया जा सकता है
  • GitHub Pages, Netlify जैसे static hosting का समर्थन, HTTPS वातावरण में PWA फीचर पूरी तरह इस्तेमाल किए जा सकते हैं

OpenFLOW का अवलोकन और प्रोजेक्ट का महत्व

  • OpenFLOW डेवलपर्स और IT प्रोफेशनल्स के लिए इंफ्रास्ट्रक्चर डिज़ाइन और नेटवर्क स्ट्रक्चर को विज़ुअलाइज़ करने में उपयोगी मुफ़्त ओपन सोर्स PWA (Progressive Web App) है
  • प्रतिस्पर्धी टूल्स की तुलना में यह लोकल पर तेज़ और सुरक्षित तरीके से काम करने देता है, और नेटवर्क कनेक्शन के बिना भी फीचर्स इस्तेमाल किए जा सकते हैं
  • Isoflow इंजन की मदद से आकर्षक 3D स्टाइल डायग्राम बनाए जा सकते हैं, और सारा डेटा बाहरी सर्वर पर भेजे बिना मज़बूत प्राइवेसी सुनिश्चित होती है
  • सहज UI, ऑटो-सेव, import/export जैसी काम की सुविधाओं की वजह से अलग-अलग टीमें और व्यक्ति नेटवर्क तथा आर्किटेक्चर डॉक्यूमेंटेशन आसानी से कर सकते हैं
  • डेवलपमेंट एनवायरनमेंट की आवश्यकताएँ कम हैं, और किसी विशेष इंस्टॉलेशन के बिना सिर्फ़ वेब ब्राउज़र से तुरंत काम शुरू किया जा सकता है

प्रमुख फीचर्स

  • Isometric डायग्राम निर्माण: 3D एहसास वाले नेटवर्क, सिस्टम और टेक्निकल डायग्राम आदि को विज़ुअलाइज़ करना
  • ऑटो-सेव: हर 5 सेकंड में काम अपने आप सेव होता है
  • प्राइवेसी: डेटा केवल ब्राउज़र लोकल में स्टोर होता है (5~10MB सीमा)
  • Import/Export: JSON फ़ाइल के रूप में डायग्राम शेयर और बैकअप करने का समर्थन
  • ऑफलाइन मोड: इंटरनेट के बिना भी सभी फीचर्स इस्तेमाल किए जा सकते हैं
  • तेज़ शुरुआत: PWA के रूप में इंस्टॉल और रन किया जा सकता है

डिप्लॉयमेंट और होस्टिंग

  • Static hosting: build फ़ोल्डर को GitHub Pages, Netlify, Vercel, AWS S3 आदि पर डिप्लॉय किया जा सकता है
  • HTTPS अनिवार्य: PWA के सही काम करने के लिए HTTPS ज़रूरी है (लोकल अपवाद है)
  • नियमित बैकअप की सिफारिश: महत्वपूर्ण काम को JSON के रूप में export करके बैकअप रखें

टेक स्टैक

  • React, TypeScript, Isoflow, PWA

समर्थित ब्राउज़र

  • Chrome/Edge (सिफारिश), Firefox, Safari, मोबाइल PWA समर्थन

ओपन सोर्स और योगदान

  • Isoflow Community Edition (MIT लाइसेंस) + OpenFLOW (Unlicense)
  • कोई भी इसे स्वतंत्र रूप से इस्तेमाल, संशोधित और वितरित कर सकता है

संबंधित पढ़ाई

1 टिप्पणियां

 
GN⁺ 2025-07-02
Hacker News राय
  • Mermaid.js का लुक पसंद नहीं आता, इसकी syntax भी कठिन है और इसमें काफ़ी bugs हैं, लेकिन static site generators में सबसे बेहतर supported diagram tools में से एक होने के कारण इसका उपयोग किया जा रहा है; साथ ही यह उम्मीद भी जताई गई कि अगर Isoflow diagrams को भी Markdown में इसी तरह आसानी से embed किया जा सके तो बहुत अच्छा होगा
    • दिलचस्प राय के लिए धन्यवाद, इसे TODO सूची में जोड़ने की योजना
    • mermaid का आइडिया अपने-आप में अच्छा है, लेकिन इसकी syntax बहुत जटिल है और GitLab जैसे tools के साथ integration अस्थिर रहने की समस्या बताई गई
    • यह राय कि Markdown integration feature होने पर users को कहीं ज़्यादा बड़ा लाभ मिलेगा
  • Isoflow और Styus को साथ उपयोग करने का सुझाव; Stylus एक lightweight home-state server है जो CSS classes को अपने-आप बदलता है, और संबंधित लिंक भी साझा किया गया https://github.com/mmastrac/stylus, साथ ही उम्मीद जताई गई कि यह Isoflow library के साथ अच्छी तरह compatible होगा
  • Clive Maxfield की किताब में आने वाले isometric diagrams हमेशा पसंद रहे हैं, और यह अनुभव साझा किया गया कि कई circuit diagrams non-planar structures वाले होते हैं (flip-flops, semiconductor layers, FPGA architecture आदि), जहाँ perspective जोड़ने से जानकारी कम जटिल लगती है और उसे समझना या याद रखना आसान हो जाता है; साथ ही इसे विभिन्न technical domains में भी अच्छी तरह फिट होने वाला तरीका बताया गया https://www.clivemaxfield.com
  • यह सावधानी कि हाल ही में Snowflake ने Openflow नाम का एक product जारी किया है, इसलिए इसे ढूँढना मुश्किल हो सकता है; naming पर फिर से सोचने की ज़रूरत हो सकती है
    • यह भी याद दिलाया गया कि networking क्षेत्र में OpenFlow नाम का telemetry protocol भी बहुत प्रसिद्ध है, और जानकारी के लिए संबंधित लिंक साझा किया गया https://en.wikipedia.org/wiki/OpenFlow
  • यह सवाल कि Isoflow के ऊपर वास्तव में क्या जोड़ा गया है; क्या Isoflow ही सबसे मुख्य भूमिका नहीं निभा रहा?
    • वास्तव में Isoflow ही काम का 90% हिस्सा संभालता है; कुछ भी छिपाया नहीं गया है, बस community pack को सीधे उपयोग करने लायक रूप में उपलब्ध नहीं कराया गया था, इसलिए उसे खुद उपलब्ध कराया गया—यह बात पारदर्शी ढंग से स्पष्ट की गई
  • बिना किसी विशेष काम के ISOFLOW Community Edition https://github.com/markmanx/isoflow को wrap करके setup और run करना बहुत आसान बना दिया गया है; diagram का JSON backup export करके फिर से import किया जा सकता है, इसलिए लगभग असीमित diagrams बनाना संभव हो जाता है—इस सुविधा के ज़रिए community version की सीमाओं को सीधे दूर करने का लाभ बताया गया
    • Node.js से परिचित न होने वाले user का सवाल: Isoflow code में 3D-style icons की graphics कहाँ हैं, क्या वे SVG files हैं, और क्या custom icons जोड़े जा सकते हैं?
  • Diagram quality की प्रशंसा, साथ ही अतीत के ऐसे मिलते-जुलते projects की याद जिनको monetization में मुश्किल हुई और वे बंद हो गए; यह भी कहा गया कि यह project MIT OSS है, इसलिए अभी monetization इसका मुख्य लक्ष्य नहीं लगता; नीचे मौजूद "Built with the Isoflow library" लिंक के 404 error होने की बात भी बताई गई https://github.com/isoflow/isoflow
    • design और icons का लगभग पूरा श्रेय Isoflow को जाता है, और Community Edition की संरचना Pro version की ओर upsell कराने के लिए है; monetization की कोई योजना नहीं है, बस लोग इसे खुशी से इस्तेमाल करें यही इच्छा है; गलत लिंक की ओर ध्यान दिलाने पर तुरंत सुधारने की बात कही गई
  • यह सवाल कि क्या इसे GitHub Pages पर भी host किया जा सकता है, और demo link के बारे में पूछताछ
  • इसे मज़ेदार app बताया गया और विस्तृत जानकारी साझा करने के लिए सकारात्मक प्रतिक्रिया दी गई