OpenFLOW - 로컬에서 빠르게 아름다운 인프라 다이어그램을 만드는 도구

14 hours ago 5

  • 브라우저 기반으로 작동하는 오픈소스 아이소메트릭(3D 스타일) 다이어그램 제작 PWA
  • React 및 Isoflow 엔진 기반으로, 설치 없이 오프라인에서도 작동하며 개인정보 보호·자동 저장·손쉬운 Import/Export 등 다양한 기능을 제공
  • 로컬 브라우저 저장소에 모든 데이터 저장, 다이어그램을 JSON 파일로 자유롭게 공유·백업 가능
  • GitHub Pages, Netlify 등 정적 호스팅 지원, HTTPS 환경에서 PWA 기능을 완전히 사용할 수 있음

OpenFLOW 개요 및 프로젝트 가치

  • OpenFLOW는 개발자, IT 전문가가 인프라 설계 및 네트워크 구조를 시각화할 때 유용한 무료 오픈소스 PWA(프로그레시브 웹 앱)
  • 경쟁 툴 대비 로컬에서 빠르고 안전하게 작업할 수 있으며, 네트워크 연결 없이도 기능 이용이 가능
  • Isoflow 엔진을 활용해 미려한 3D 스타일 다이어그램 생성이 가능하며, 모든 데이터가 외부 서버로 전송되지 않는 강력한 프라이버시 보장
  • 직관적 UI, 자동 저장, 가져오기/내보내기 등 실무에 편리한 기능 덕분에 다양한 팀과 개인이 네트워크, 아키텍처 문서화를 손쉽게 수행
  • 개발 환경 요구가 낮으며, 특별한 설치 없이 웹브라우저만으로 바로 작업이 가능

주요 기능

  • 아이소메트릭 다이어그램 제작: 3D 느낌의 네트워크, 시스템, 기술 다이어그램 등 시각화
  • 자동 저장: 5초마다 작업 내역이 자동 저장
  • 개인정보 보호: 데이터가 오직 브라우저 로컬에 저장됨 (5~10MB 제한)
  • Import/Export: JSON 파일로 다이어그램 공유 및 백업 지원
  • 오프라인 모드: 인터넷 없이도 모든 기능 사용 가능
  • 빠른 실행: PWA로 설치·실행 가능

배포 및 호스팅

  • 정적 호스팅: build 폴더를 GitHub Pages, Netlify, Vercel, AWS S3 등에 배포
  • HTTPS 필수: PWA 정상 작동을 위해 HTTPS 필요(로컬은 예외)
  • 정기 백업 권장: 중요한 작업은 JSON으로 내보내서 백업

기술 스택

  • React, TypeScript, Isoflow, PWA

호환 브라우저

  • Chrome/Edge (권장), Firefox, Safari, 모바일 PWA 지원

오픈소스 및 기여

  • Isoflow 커뮤니티 에디션(MIT 라이선스) + OpenFLOW(Unlicense)
  • 누구나 자유롭게 사용·수정·배포 가능

Read Entire Article