Show HN: A JavaScript Tool for Database Diagramming | Hacker News Reader

Show HN: A JavaScript Tool for Database Diagramming

github.com

75 pointsrms_returns28 comments

Another pretty good tool e.g. for fast prototyping: https://github.com/ondras/wwwsqldesigner

I like it, thanks. One thing: When two tables are right next to each other, there's no need for the relation links to curve. Generally, rectangular links are easier to follow.

Thank You! Yes, I've been struggling with the jsPlumb library to convert that to rectangular curves, but its on the list!

Disclaimer: I don't want to minimize your achievement or be overly critical of the tool you've built. I've used a lot of relational database modeling tools in the past and what you've built looks perfectly capable for the job. But I clicked on your link hoping for something very different and didn't find it. So hopefully others can point me in the right direction if what I am looking for exists.

The crux of my disappointment stems from you having left out a word in the description of your tool. It's a Relational Database Diagramming tool...the Relational aspect of it making it significantly less useful for me. I've worked with Relational databases for close to 30 years and I find that I'm able to design schemas in my head without the need for a tool. On occasion, a tool that's able to reverse engineer a visualization of the model from the schema can be useful in quickly coming up to speed on an existing schema, but even that isn't essential.

Where I think tools would really help me is in designing for non-relational databases. It's a harder problem, since those databases are often schemaless, but that would make a design tool all the more useful, since those designs could act as documentation that's often unnecessary in the relational world where the schema is readily available.

So can anyone point me towards a visual design tool for non-relational databases, document, kv or otherwise?

Crayons?

"schemaless databases" are somewhat badly named - there is a schema, in the sense that something knows what the constraints on the data are, but it's not defined in the database itself. It's defined in the code that interacts with the data in the database.

With that in mind, the thing that you actually need to diagram (or model) is the data, not the database. What your diagram needs to tell you is what data there is, what type of data it is, and what that means. That doesn't change regardless of what technology you're using.

Thanks for your views, I'm the author of the linked VA tool. One of the primary aspects of this tool besides diagramming is to automate code generation. Presently, it exports the diagram to SQLAlchemy classes and raw mysql format. The idea is that once you design the tables in your head, you should be able to seamlessly translate it to an actual database format like mysql, pgsql, etc. and don't have to waste much time on that!

As for "schema-less" diagramming tools, I think your best bet will be a mind-map. There are many mind-mapping software available including GPL ones like Freemind. What it does is take a central idea and create branches from that root. For example, Database will split into Relational/Non-relational branch. Relational will split into mysq/pgsql and non-relational will split into mongodb/couchdb, etc. To the best of my knowledge, this is how non-relational databases like mongodb work document inside a document inside a document, right?

For graph databases, I designed a tool to visually describe queries that can be applied upon a DB. It introspects the current data model and display it as entities and relationships, then with some drag n drops, you can visually design the queries that can legally be applied upon that data model, therefore on this database.

It is ok for any RDF database with SPARQL endpoint. It could be simply extended to manage Neo4J and Cypher.

Comments welcome.

PS: cf http://datao.net/

That looks awesome. Tools like this are why I asked the question. Thanks for responding!

Try GraphViz. You write a text document that defines your record/object types, and then specifies the relationships. Basically just a directed graph, in an easy syntax with a reasonable amount of control over the nodes and edges. When the spec is done you run the tool on it and the graph is generated for you.

One thing I like about GraphViz is that it's really easy to write analysis software that generates the spec document. My most recent use case is parsing the sln and csproj files in huge c# code repos, figuring out cross-project dependencies based on references, graphing a dependency tree and a circular reference graph, and creating an msbuild file that optimizes build order. The visualizations are really useful for understanding the results.

Impressive. By chance have you looked at jsPlumb? If so what, if any, pain points did you encounter? http://jsplumbtoolkit.com

Yes. I'm using exactly jsPlumb to create the relationship links between the table! The only slight issue I've encountered till now is that the joining points are slightly moved to the left whilst the table is being moved, which creates a slightly ugly user experience!

hmm it seems their community edition has no autolayout mechanism. And OPs tool doesn't either. Anyone got some pointers how to add auto layout to jsPlumb community edition?

This is a similar tool I authored, however, tied to Mongoose/mongodb http://mongomulch.com/

Hey I would like to try this but it fails to download. I reckon you could host the zip on github which would be better.

Edit: Nevermind, finally downloaded, and its for mac only. Darn.

Since its an electron app you should be able to build a local copy for windows by just following the directions on the github repo: https://github.com/gholevas/mongomulch

It's nice but I like tools that actually take the database and then design the layout e.g. Entity Framework Power Tools.

Nice work. On your github page this caught my eye...

"Governance: Meritocracy"

So, who does Merit-determinance?

I really liked this tool, and it's what I used to quickly knock out the data structures for my flask app.

Is there an alternative for django or flask?

p.s. I found the ability to save and reload old schemas was buggy (or i couldn't get it to work).

Hi, this looks nice, but could you make the examples somewhat more realistic? I really wonder what this looks like with, say, 50 entities, all interconnected.

Your only issue would be perhaps screen real estate! Since this is a pure JavaScript plus jQuery app and doesn't have any heavy framework like Angularjs, performance shouldn't be a problem. Having said that, there are a few UI issues that needs taken care of and I'm working on those bugs.

Yes, screen real estate would be a problem, and also the way in which the relationships between the entities are drawn (I am imagining that it may become a "tangled" mess :) So a realistic example would be awesome.

Hi check this out similar tools but tied to laravel now... https://github.com/BioDesignRealWorld/LaravelDatabaseDesigne...

Ps, im the author

Nice tool badgeek! You've given me some nice ideas for displaying the tables on canvas. I like the fact that you've given "add column" button on the tables itself instead of opening a separate edit view.

And you give me idea on how to add column seems nice with one dialog cheers!

Reply on news.ycombinator.com