JointJS

JavaScript diagramming library powering exceptional UIs

[JointJS @jointjs]

🚀 Introducing JointJS for React

Teams use JointJS to build AI workflow builders, BPMN editors, SCADA/HMI dashboards, and data modeling tools — apps where the diagram is the product.

Today, that same powerful core comes to React.

[JointJS @jointjs]

🔥 Black Friday: 50% off JointJS+. Our only discount of the year.

For a limited time, the JointJS+ Standard license is half price. Why teams choose JointJS+ for production-grade apps:
🚀 Built for performance
🔥 40+ UI components and 180+ demo apps to start from
💪 Actively maintained components by the core team
🔒 Regular security updates and audits
☀️ Perpetual license with unlimited commercial use. Pay once, use forever.

Trusted by teams at Airbnb, IBM, Oracle, and many more.

🏷️ Coupon code: BLACKFRIDAY26
🔗 Link: https://t.co/Hy2Om910XO

#BlackFriday #Diagramming #WebDevelopment #DataVisualization

[JointJS @jointjs]

Mermaid has become the standard for diagrams as code. But once a Mermaid diagram becomes part of your product, users want to click it and edit it, not learn the syntax.

We built a visual Mermaid editor with JointJS to close that gap, and with a detailed walkthrough so you can see exactly how it works:
→ Edits on the canvas are written back into the Mermaid text
→ Only the affected part of the source changes
→ Mermaid's own parser reads the diagram, so syntax support follows Mermaid itself
→ Curved or orthogonal links, with dagre and ELK layouts
→ It ships as a React app template you can embed in your own product

It's a good fit if you're building a docs platform, a wiki, a low-code tool, or an AI assistant that generates flowcharts your users want to fix by clicking instead of re-prompting.

📖 Read the article: https://t.co/q5Lj5mHMLk
🎥 Watch the walkthrough: https://t.co/OxQjfXMBjU
🧪 Try the live demo: https://t.co/tU4G0w8P5L

#Mermaid #React #DiagramsAsCode #JointJS #DeveloperTools

[JointJS @jointjs]

PS. If you're publishing on Medium, please submit any diagramming-related articles you created to our publication—we'd love to feature them and share them with our audience. 😉

[JointJS @jointjs]

📣 JointJS is now on Medium and https://t.co/lLmGEco0po.

We’re bringing our articles to where more developers read, starting with our posts on JointJS for React.

On @Medium, we’ve also started Diagramming for Developers, a publication for devs who build with diagrams, from architecture deep dives to practical how-tos, UX tips, and more. It’s about the craft of diagramming, not exclusively about JointJS.

✍️ Medium: https://t.co/17GrM8ob86
🧑‍💻 https://t.co/lLmGEco0po: https://t.co/aArxb8WQWJ

If you're writing about diagramming, visual editors, or graph UIs, we’d love to hear from you. 👋

#JointJS #diagramming #ux #webdev

[JointJS @jointjs]

Paste SQL → get a live, editable database diagram. Edit the diagram → the SQL updates too. 🔁

Our new Data Modeling app template for JointJS+ for React: https://t.co/5MnWIhGjYI

[JointJS @jointjs]

@hozak_marek That's not bad, Marek! I just had more practice. 😉

[JointJS @jointjs]

Here's a fun puzzle challenge for you. 🧩

Try to beat my score in the Shikaku puzzle game built with JointJS. I solved it in 54 seconds. Can you do better? Let me know your score in the comments below. 🙂

JointJS Shikaku puzzle: https://t.co/IxzOdjQADM

[JointJS @jointjs]

You can find the detailed data modeling app template walkthrough on our blog: https://t.co/R6bLWG05lE

[JointJS @jointjs]

Have you already seen our new Data Modeling app template? 🔥

It's a perfect starting point for any data-driven UI, and below is a quick overview of some key features, from undo/redo to accessibility and smooth diagram performance. 🚀

#JointJS #diagramming #datamodeling

[JointJS @jointjs]

🎥 Video: https://t.co/UOmB6vA0yd

[JointJS @jointjs]

We're excited to share our new in-depth guide on building modern data modeling tools with JointJS+ for React!

In this guide, we’ll walk you through the architecture, key design decisions, and practical techniques behind our open-source Data Modeling app template.

Whether you're creating visual SQL editors, custom database tools, ERD editors, or lineage tools, you'll find actionable insights, code samples, and best practices for building data modeling apps. 🚀

(Links to both the blog post and the video are below. 👇)

[JointJS @jointjs]

📝 Blog post: https://t.co/R6bLWG0Dbc

[JointJS @jointjs]

Check the full hands-on guide to see how much easier it is to work with JointJS for React: https://t.co/pYBbvZJEFr

[JointJS @jointjs]

Using JointJS in React no longer means you need useRefs, useEffects, and a bunch of clunky code to connect everything.

Here's what changes with JointJS for React, with before-and-after code examples for every common pattern. 👇

#diagramming #JointJSforReact

[JointJS @jointjs]

You no longer have to manually sync graph state with React, and you can gradually transition your app to JointJS for React.

[JointJS @jointjs]

A hands-on guide outlining how much easier it is to integrate JointJS with React with a new native JointJS for React integration. https://t.co/gHjPpvp8Ns

[JointJS @jointjs]

We created an in-depth guide that explains everything you need to know about JointJS performance. 🔥

Key takeaways:
🚀 Render fewer DOM elements
📐 Don't measure the DOM
🔎 Use dia.SearchGraph + QuadTree for spatial queries

Read the full guide: https://t.co/D81efRnSPU