These look relevant if anyone is interested in developing node based tools with react https://reactflow.dev https://flume.dev
Flume and ReactFlow are Fire! Thanks for sharing.
Designing a Dataflow Editor with TypeScript and React
11–20 of 20 posts
Re: Designing a Dataflow Editor with TypeScript and React
#12Love to see other flow based applications. Fluxion (https://fluxion.app) was my baby for a long time.
Re: Designing a Dataflow Editor with TypeScript and React
#13These look relevant if anyone is interested in developing node based tools with react https://reactflow.dev https://flume.dev
As someone who's been building small projects with these kinds of libraries for years now, https://x6.antv.vision/en is absolutely incredible. All the antv libraries, especially when combined, are a vast distance ahead of anything else (most importantly in their conceptual foundations and design), and I highly recommend playing with them.
Re: Designing a Dataflow Editor with TypeScript and React
#14The one thing that I always wonder about things like this which is basically Figma or Miro is how you persist / store the coordinate of the nodes given the user might have different screen sizes or resize their window etc.
Re: Designing a Dataflow Editor with TypeScript and React
#15The one thing that I always wonder about things like this which is basically Figma or Miro is how you persist / store the coordinate of the nodes given the user might have different screen sizes or resize their window etc.
the screen, or rather whatever container is rendered on the page, is just a viewport to an underlying canvas. The canvas can be zoomed and panned, and the focus of the panning and level of the zoom can be synced across machines. People with different size or shape viewports see slightly different cropping, but they are looking at a synchronised canvas through that viewport.
Re: Designing a Dataflow Editor with TypeScript and React
#16These look relevant if anyone is interested in developing node based tools with react https://reactflow.dev https://flume.dev
As someone who's been building small projects with these kinds of libraries for years now, https://x6.antv.vision/en is absolutely incredible. All the antv libraries, especially when combined, are a vast distance ahead of anything else (most importantly in their conceptual foundations and design), and I highly recommend playing with them.
Can you elaborate?
Re: Designing a Dataflow Editor with TypeScript and React
#17The one thing that I always wonder about things like this which is basically Figma or Miro is how you persist / store the coordinate of the nodes given the user might have different screen sizes or resize their window etc.
the screen, or rather whatever container is rendered on the page, is just a viewport to an underlying canvas. The canvas can be zoomed and panned, and the focus of the panning and level of the zoom can be synced across machines. People with different size or shape viewports see slightly different cropping, but they are looking at a synchronised canvas through that viewport.
Hmm Right that makes sense but you have to give some width/height to the container right?
I guess you can set it something absurdly large.
Re: Designing a Dataflow Editor with TypeScript and React
#18"Our broader goal in writing this up was to illustrate some higher-level TypeScript features and type-driven design patterns in the practical context of modern web development." Is type-driven design a think? For me it's just development ...
It’s as opposed to db driven design, or object oriented design
Re: Designing a Dataflow Editor with TypeScript and React
#19Nice, too bad it’s React. Once you go Svelte you can’t go back.
Re: Designing a Dataflow Editor with TypeScript and React
#20For anyone intending to use this in production, note that it is inoperable to people who can't use mice (which can be caused by any number of disabilities or conditions).
What are some accessibility interfaces/strategies for art/design tools? Surely some of those can be adapted here.