Plone
Plone5
React
Volto

Plone5.1とVoltoを気軽に試すためのdocker-compose


概要

VoltoというReactベースのPlone用(厳密には他でも使える)のSPA実装がある。

以下を参照

Volto というPloneのReactによるフロントエンド実装のインストール方法

手元で簡単に試すために、以下を準備した。


  • VoltoのDockerイメージ

  • docker-composeファイル

  • 起動に必要なcfgファイル


準備した物


VoltoのDockerイメージ

docker hub に volto-demo イメージをアップした

https://cloud.docker.com/repository/docker/terapyon/volto-demo


docker-composeファイル


  • Ploneは公式に公開されているイメージを使う。

  • Voltoは上記のイメージを使う


docker-compose.yml

plone:

image: plone/plone:5.1
volumes:
- ./plone-data/filestorage:/data/filestorage
- ./plone-data/blobstorage:/data/blobstorage
- ./plone-data/src/:/plone/instance/src/
- ./custom.cfg:/plone/instance/custom.cfg
ports:
- "8080:8080"
environment:
ZCML: /plone/instance/custom.cfg
volto:
image: terapyon/volto-demo
ports:
- "3000:3000"
- "3001:3001"


起動に必要なcfgファイル


custom.cfg

[buildout]

extends = buildout.cfg

[instance]
eggs +=
Plone
Pillow
plone.restapi

develop +=

zcml-additional =
<configure xmlns="http://namespaces.zope.org/zope"
xmlns:plone="http://namespaces.plone.org/plone">
<plone:CORSPolicy
allow_origin="http://localhost:3000,http://127.0.0.1:3000"
allow_methods="DELETE,GET,OPTIONS,PATCH,POST,PUT"
allow_credentials="true"
expose_headers="Content-Length,X-My-Header"
allow_headers="Accept,Authorization,Content-Type,X-Custom-Header"
max_age="3600"
/>
</configure>



起動方法


ファイルの設置

適当なフォルダに、上記に書いた2ファイルを置く


  • docker-compose.yml

  • custom.cfg


起動コマンド

$ docker-compose up


起動後の作業

重要 以下2つの作業


Ploneインスタンスを作る

ブラウザで、 http://localhost:8080 に行き、Ploneインスタンスを作る。

ユーザ名: admin / パスワード: admin

その際に必ず、 Plone というIDで作る必要がある。

(Voltoが接続する先が、 http://localhost:8080/Plone となっているため。(変更には、Voltoの起動コマンドを変更する必要がある。)


plone.restapiを有効化

Ploneの管理画面のアドオンで、 plone.restapi を有効化


以下で動作確認可能


データファイル

カレントディレクトリの、 plone-data 以下にPloneのデータが保存される。


TODO


  • このままだと、Voltoのカスタマイズができないので、カスタマイズ用のフォルダをボリュームとしてマウントするように変更する