Prototyping Web Apps with Structr and Neo4j

At this Januar's Neo4j meetup in Amsterdam, I gave a talk about prototyping web applications with Structr. This time, the special task was to use an existing Neo4j database which was populated with some test data generated during the previous meetup with GraphGen, a very useful graph generation tool made by Christophe Willemsen.

You can read the details in Rik's great blog post: Prototyping a Graph Database.

Due to slow WiFi network it was not possible for everyone to download and successfully install Structr, as the hands-on required the latest 1.1-SNAPSHOT version of Structr, so I promised to write a blog post about the prototyping session so everyone can replay what I did in the hands-on part. So here it is (better late than never).

Why did we need the latest Structr snapshot?

The database created with GraphGen contains nodes with a name attribute and a label. Structr needs two additional attributes: "type" and "id". There's a built-in maintenance command which adds the id property and populates it with a UUID. This is the primary identifier for any graph object in Structr.

The type attribute is needed to mark the primary type because a node can have multiple labels which are mapped to classes and interfaces in Structr's Java OGM. In order to make Structr able to use these nodes, I had to apply a small patch to Structr, making the mentioned bulk command add also the type attribute when adding the UUID.

You can download the latest snapshot version from here:

https://oss.sonatype.org/content/repositories/snapshots/org/structr/structr-ui/1.1-SNAPSHOT/

On OS X, download the dist.tar.gz file, on Debian-based linux machines, you can use either the .deb package, or also use the dist.tar.gz file.

Please note that this version is compiled against Neo4j 2.1.6, so it only works with Neo4j databases created with version 2.1 and below. If you happen to use a newer version of the database, like 2.2 milestone 1 or later, please contact us via help@support.structr.com so we can provide you with a Structr version compiled to work with those versions.

Installation

To install Structr, download the distribution tar.gz or Debian package and follow the instructions from the documentation found here: http://docs.structr.org/installation-and-configuration-guide

Copy the existing database to the Structr directory

Before starting Structr, you need to copy the graph.db directory of the previously created database to the structr-ui directory. If you started Structr before, make sure to move away the existing "db" and "files" directories.

Your installation was successfull if you can access the Structr backend UI and the Neo4j browser at these addresses:

http://localhost:8082/structr
http://localhost:7474/

If Structr doesn't detect nodes that comply to the Structr requirements, it will import a seed file (seed.zip) which contains a sample web page ("Welcome") and a first user ("admin" with password "admin").

The data model

The following picture shows the data model used in the previous meetup as a basis for populating the database with example data.

Create the node types

In order to have access to this data in Structr, we need to create the corresponding meta-model in Structr, using the visual Schema Editor. Go to the "Schema" area and create the following new types:

Company, User, Department, Service, Software

Then click on the "Tools" button to open the tools dialog and add UUIDs to all of the above types by selecting the node type and clicking on the "Add UUIDs" button.

When done with all node types, you should see the data appearing in the Data section, but without relationships.

Create relation classes

We of course also want to see the relationships between the data nodes, and all we have to do is to add the possible relations to the data model in Structr.

This can be done by drawing a relationship in the Schema Editor. Click and hold the mouse button on the lower connector point of a source node and drag the relationships onto the upper connection point of the target node you want to connect with. Then click on the relationship label and enter the relationship type exactly as it is written on the relationships in the data model picture. To finalize the relation definition, define the cardinality by setting the multiplicity on source and target node (allowed values are 1 and *).

Repeat this for each different relationship type in the data model. Once done, Structr will display the related nodes in the Data view in a column, automatically added and named according to the other node's type and the relationship type. You can overwrite the names of these Remote Attributes in the Schema Editor's node detail dialog.

Create web application

Once the data model in Structr reflects the data structures in Neo4j, you can go to the Pages section, import a template (we used the well-known Bootstrap Jumbotron example, enter a query and apply a data binding to the reslults:

In our example, we created a list of the companies contained in the example database.

To display a company's name, you can just use ${company.name} as a placeholder:

This blog post ends here. If you want to learn more, start a discussion using the comment function below or join our mailing list.

Share this post

Comments