Вы устали от сложных и непонятных схем инфраструктуры? Хотели бы вы, чтобы существовал более простой и наглядный способ отображения ваших систем? Хорошие новости! FossFLOW поможет вам по-новому взглянуть на визуализацию вашей архитектуры. Это инструмент с открытым исходным кодом, который с невероятной легкостью поможет вам создавать красивые изометрические диаграммы в 3D-стиле.
Что такое FossFLOW?
FossFLOW — это мощное прогрессивное веб-приложение (PWA) с открытым исходным кодом, разработанное специально для создания изометрических диаграмм инфраструктуры.
Инструмент для создания изометрических диаграмм FossFLOW
Пользователи могут добавлять и соединять компоненты, настраивать схемы и управлять своей работой с помощью таких функций, как автосохранение и импорт/экспорт.
Созданный на основе React и библиотеки Isoflow (https://github.com/markmanx/isoflow), FossFLOW предлагает фантастические возможности для обеспечения конфиденциальности, при этом все данные вашей диаграммы хранятся локально в вашем браузере, что гарантирует конфиденциальность вашей работы и возможность доступа к ней в автономном режиме.
Создатель FossFLOW взял Isoflow Community Edition и сделал так, чтобы любой желающий мог настроить и запустить его с невероятной лёгкостью.
Хотя основная библиотека Isoflow великолепна, FossFLOW предлагает дополнительные преимущества, позволяя экспортировать и загружать резервные копии в формате JSON ваших диаграмм. Эта функция недоступна в версии Isoflow для сообщества.
Это полностью проект с открытым исходным кодом, выпущенный под лицензией Unlicense, что означает, что вы можете свободно использовать и изменять его по своему усмотрению.
Ранее FossFLOW был известен как OpenFLOW, но был переименован, чтобы избежать путаницы с существующим протоколом сетевой телеметрии и продуктом Snowflake.
Ключевые особенности
FossFLOW обладает множеством функций, которые упрощают создание диаграмм:
- Потрясающие изометрические виды: создавайте привлекательные технические схемы в 3D-стиле, которые помогут разобраться в сложных системах.
- Простой редактор с функцией перетаскивания: легко создавайте свою архитектуру с помощью иконок, областей и соединителей. Просто выберите компонент из библиотеки и разместите его на холсте.
- Расширяемая система иконок: используйте существующие библиотеки иконок для основных облачных провайдеров, таких как AWS, Azure, GCP или даже Kubernetes. Вы также можете создавать собственные наборы иконок.
- Автоматическое сохранение и быстрое сохранение: ваша работа автоматически сохраняется каждые 5 секунд прямо в хранилище вашего браузера. Нужно сохранить прямо сейчас? Функция «Быстрое сохранение (сеанс)» поможет вам без лишних всплывающих окон.
- Автономный доступ: поскольку это PWA, вы можете работать над своими диаграммами даже без подключения к интернету.
- Простой импорт/экспорт: легко делитесь своими диаграммами и создавайте их резервные копии в виде файлов JSON. Это позволяет загружать диаграммы, созданные другими пользователями, или сохранять важные наработки.
- Интуитивно понятная навигация: перемещайте и масштабируйте холст, чтобы сосредоточиться на разных областях диаграммы.
- Сочетания клавиш: ускорьте рабочий процесс с помощью сочетаний клавиш для удаления элементов, масштабирования и панорамирования. Кроме того, есть даже Ctrl+Z для отмены и Ctrl+Y для повтора!
Установить FossFLOW
Готовы визуализировать свою инфраструктуру как никогда раньше? С FossFLOW начать невероятно просто.
Вы можете установить его как обычное приложение на устройство с Linux или Mac или просто запустить его прямо в веб-браузере.
Попробуйте FossFLOW Онлайн
Перейдите по ссылке https://stan-smith.github.io/FossFLOW/, чтобы мгновенно начать создавать диаграммы.
Попробуйте FossFLOW Онлайн
Запустите FossFLOW локально
Для тех, кто предпочитает локальную среду, сначала клонируйте репозиторий FossFLOW на GitHub:
git clone https://github.com/stan-smith/FossFLOW cd FossFLOW
Затем убедитесь, что у вас установлен npm, и установите необходимые зависимости с помощью:
npm install
Наконец, запустите сервер разработки:
npm start
Чтобы получить доступ к FossFLOW, откройте http://localhost:3000 в своём веб-браузере.
FossFLOW хорошо работает в современных браузерах, таких как Chrome, Edge, Firefox и Safari, в том числе в мобильных браузерах с поддержкой PWA.
Для оптимальной работы автор рекомендует использовать браузеры Chrome или Edge.
Создавайте изометрические диаграммы с помощью FossFLOW
FossFLOW предназначен для изометрического построения диаграмм, что позволяет создавать потрясающие технические диаграммы в 3D-стиле.
Создание диаграмм
Добавлять элементы:
- Использование меню: нажмите кнопку «+» в правом верхнем углу меню, чтобы слева появилась библиотека компонентов. Затем вы можете перетаскивать компоненты из этой библиотеки на холст.
- С помощью правой кнопки мыши: или же щелкните правой кнопкой мыши по сетке и выберите «Добавить узел». После создания нового узла вы можете нажать на него и настроить его с помощью меню слева.
- Инструмент поддерживает расширяемую систему иконок, что позволяет использовать существующие библиотеки для AWS, Azure, GCP, Kubernetes и других платформ или создавать собственные.
Соединяйте Элементы:
Используйте доступные соединители, чтобы показать связи между компонентами на вашей схеме.
Настройка:
Вы можете изменить цвета, подписи и свойства элементов в соответствии со своими потребностями.
Навигация и взаимодействие
Ориентироваться:
Вы можете перемещать и масштабировать холст, чтобы работать с разными областями диаграммы.
- Масштаб: используйте колесико мыши, чтобы увеличить или уменьшить масштаб.
- Панорамирование: Нажмите и перетащите, чтобы панорамировать холст.
Сочетания клавиш:
- Удалить: удалить выбранные элементы.
- Ctrl+Z: отменить последнее действие.
- Ctrl+Y: повторить действие, которое было отменено ранее.
Сохранение Вашей работы и управление ею
FossFLOW уделяет первостепенное внимание конфиденциальности: все данные вашей диаграммы хранятся локально в вашем браузере.
- Автосохранение: ваши диаграммы автоматически сохраняются в хранилище браузера каждые 5 секунд.
- Быстрое сохранение (сеанс): Нажмите «Быстрое сохранение (сеанс)» для мгновенного сохранения без всплывающих диалоговых окон.
- Сохранить как новое: используйте кнопку «Сохранить как новое», чтобы создать копию диаграммы с другим названием.
- Загрузить: нажмите «Загрузить», чтобы просмотреть и получить доступ ко всем ранее сохранённым диаграммам.
- Импорт: вы можете загружать диаграммы из файлов JSON, которыми поделились другие пользователи.
- Экспорт: Загрузите свои диаграммы в виде файлов JSON, чтобы поделиться ими или создать резервную копию.
- Диспетчер хранилища: используйте «Диспетчер хранилища», чтобы управлять пространством, используемым в хранилище вашего браузера. Это особенно полезно, поскольку браузер
localStorageимеет ограничение примерно в 5–10 МБ. Рекомендуется регулярно экспортировать важные диаграммы в виде файлов JSON для резервного копирования.
FossFLOW упрощает создание схем инфраструктуры, делая их доступными, красивыми и конфиденциальными. Чего же вы ждёте? Начните создавать схемы своих систем, используя понятный и стильный подход!
Ресурс:
- Репозиторий FossFLOW на GitHub: https://github.com/stan-smith/FossFLOW