Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

1. create a diagram from my code 2. ok, I updated the diagram, please update the code to match it

306,006 Aufrufe • vor 7 Monaten •via X (Twitter)

34 Kommentare

Profilbild von tldraw
tldrawvor 7 Monaten

Try it here:

Profilbild von Abhimanyu ARYAN ♡
Abhimanyu ARYAN ♡vor 7 Monaten

Looks like a familiar language, "Mermaid"?

Profilbild von tldraw
tldrawvor 7 Monaten

just tldraw shapes

Profilbild von Fernando
Fernandovor 7 Monaten

We are kind of in this space and using react-flow, but are in search of design partners! Let us know if you want to talk! here is a rough old demo

Profilbild von Twlvone
Twlvonevor 7 Monaten

this is how non-engineers end up writing production code. sketch the architecture, AI handles the implementation. the abstraction layer just moved way up

Profilbild von Adrián Mato 🐙
Adrián Mato 🐙vor 7 Monaten

@steveruizok Worth a /skill or something on to of this back and forth

Profilbild von Strakyo
Strakyovor 7 Monaten

This workflow is wild because code to diagram and diagram back to code makes iteration much faster.

Profilbild von sparks
sparksvor 7 Monaten

backend devs in 5yrs

Profilbild von Whq2001@ca
Whq2001@cavor 7 Monaten

IBM RationalRose real-time could do this 20 years ago. Backward marching.

Profilbild von tldraw
tldrawvor 7 Monaten

time is a flat circle @whq2001

Profilbild von Yury Yakubchyk
Yury Yakubchykvor 7 Monaten

Bidirectional diagram and code is the dream. This is it.

Profilbild von Pratyay Banerjee (নীল) 
Pratyay Banerjee (নীল) vor 7 Monaten

@sandipndey

Profilbild von Vlad
Vladvor 7 Monaten

@DavidKPiano yes! also one of the best ways to help a non-programming person work on some moderately complex logic

Profilbild von Vladyslav Hunt
Vladyslav Huntvor 7 Monaten

bidirectional sync between diagram and code is the workflow figma always promised but never delivered

Profilbild von Ravi Gummadi
Ravi Gummadivor 7 Monaten

very nice. i was thinking about a similar idea. Can we also checkin the tldraw source files along with the github commits and keep it in sync with the code base? or alternatively using github actions to ensure that the tldraw master file is always in sync with the code base

Profilbild von tldraw
tldrawvor 7 Monaten

Yeah! Check out our vs code / cursor extensions too

Profilbild von Nikhil Rao
Nikhil Raovor 7 Monaten

damn that will make things a lot easier

Profilbild von sycoms
sycomsvor 7 Monaten

This workflow is the future: spec as diagram, code as compilation target.

Profilbild von GEN-Z Invest
GEN-Z Investvor 7 Monaten

@grok can I just use Obsidian Canvas (maybe connect with AI) instead of this?

Profilbild von Taha Ali Adil
Taha Ali Adilvor 7 Monaten

@mattpocockuk

Profilbild von Safta Catalin Mihai
Safta Catalin Mihaivor 7 Monaten

@disconcision isn’t this what visual basic did for the ui builder, without ai ?

Profilbild von velocity
velocityvor 7 Monaten

Cool.

Profilbild von AIxGeek
AIxGeekvor 7 Monaten

mark

Profilbild von Jakub Z
Jakub Zvor 7 Monaten

In case project is in JS/TypeScript, why not just use stateX?

Profilbild von XSpectreEdge 𝕏
XSpectreEdge 𝕏vor 7 Monaten

!!!

Profilbild von MikhailMits
MikhailMitsvor 7 Monaten

Gow did you setup this?

Profilbild von ImoutoFan
ImoutoFanvor 7 Monaten

would have been faster to just code it yourself lmao

Profilbild von chester
chestervor 7 Monaten

Nice

Profilbild von Yury Yakubchyk
Yury Yakubchykvor 7 Monaten

Diagram-as-code is the way. Version control becomes trivial, and you can generate docs programmatically. Nice to see it evolving.

Profilbild von pysolin
pysolinvor 6 Monaten

OG is back

Profilbild von Edu Wass
Edu Wassvor 7 Monaten

wait theres a desktop app now?!

Profilbild von tldraw
tldrawvor 7 Monaten

secretly

Profilbild von Edu Wass
Edu Wassvor 7 Monaten

👀

Profilbild von DreamCode
DreamCodevor 7 Monaten

Excellent functionality, bidirectional influence

Ähnliche Videos