Custom Guides

May 31, 2021

Custom Browser Guide って何?


Neo4jを入門する時に便利だなと思うのは、 Browser Guide です。 Browser Guide を動かすと最初にメニューが出てきますが、あれがブラウザ・ガイドです。 :guide movie-graph はこんな画面です。

Guide movie-graph

何をしているかの説明と、コマンドを記述できます。 画像ももちろん使えます。

メニューを出したりコマンドをクリックだけで入れるガイドで、 Jupyter Notebookに似ていると言えば良いでしょうか?

Neo4j Browserの4.2.6 (2021-04-29) から、guideコマンドが新規にリリースされました。 これからは、:playではなく:guideが使われると思います。 画面は狭くはなりますがストリームと呼ばれる問い合わせ結果の表示画面と独立しているので扱いやすくなります。

Browser Guide を作ろう


neo4j-guidesを使います


neo4j-contrib/neo4j-guides を使って作るのが簡単です。

git clone https://github.com/neo4j-contrib/neo4j-guides

AsciiDocとは


.adocは軽量マークアップ言語の1つです。

このアプリケーションで、Neo4j Guideを作るには AsciiDoc を使います。

Markdown.mdファイルを使ったことがあると、.adocはすぐに理解できると思います。

helloworld.adocを作りましょう


cd neo4j-guides
edit adoc/helloworld.adoc

ディレクトリは、adocの直下にしました。 本格的に作成する場合はadoc/sample/helloworld.adocのようにディレクトリは分けた方が良いと思います。

neo4j-guides
├── adoc
│   └── helloworld.adoc
└── run.sh

helloworld.adoc

= My Guide

== Hello World

=== Creating Data

CREATE a Node

[source,cypher]
----
CREATE (n:SomeNode {name:"Hello World"})
RETURN n
----

== Search

=== Substring search using CONTAINS

Search 'Hello'

[source,cypher]
----
MATCH (n:SomeNode)
  WHERE n.name CONTAINS 'Hello'
RETURN n
----

では、.adoc.htmlに変換しましょう。

./run.sh adoc/helloworld.adoc

そうするとhtmlのディレクトリに、htmlが作られます。

neo4j-guides
├── adoc
│   └── helloworld.adoc
├── html
│   └── helloworld.html
├── http-server.py
└── run.sh

helloworld Guideを使いましょう


helloworld.htmlをどこかのWebサーバで動かしたす。 一番簡単なのはローカルのサーバです。

python http-server.py &

ウェブブラウザでちょっと見てみましょう。

http://localhost:8001/html/

Neo4j Browserにコマンドを入力します。

:guide http://localhost:8001/html/helloworld.html

画面には、HelloWorldのGuideが表示されました。 2ページのGuideを作成しましたが、その1ページが表示されています。 右下の Next で2ページ目が表示されます。 Guide hello world

左の背景が黒で枠に囲まれたCypherをクリックすると、右上のコマンドラインにコピーされます。 セミナーで使うには便利ですね。 create hello world

補足


:play と :guide


Neo4j Browserの4.2.6 (2021-04-29) から、guideコマンドが新規にリリースされました。 画面は狭くはなりますがGuideが独立して表示されますので便利です。

Remote guide error


例えば、個人のドメインなどにGuideを入れて動かそうとするとRemote guide errorになります。 下記のように、neo4j.comにallowlistの定義追加をしてください。

browser.remote_content_hostname_whitelist=https://www.annoura.com

Remote guide error


Profile picture

Written by Koji Annoura who lives and works in Fukuoka Japan. Please follow me on Twitter

© 2021, Koji Annoura, Built with Gatsby