6. Installation and Setup of Plone 6#

Plone is the combination of a backend (data storage) with a frontend (user interface) into a fully featured CMS.

Plone 6 is an installation of Plone. By default it uses Volto for the frontend, based on ReactJS, on top of the plone.restapi to interact with the backend. This combines the stability, maturity, and security of the Plone backend with a modern, mature, user-friendly, and well maintained frontend.

Plone Classic is another installation of Plone. It uses Barceloneta, a customized version of Twitter Bootstrap, for the frontend. It will stay in place as a frontend option, giving developers and users time to adapt to Volto.

See the Plone road map for details.

This training is about Plone 6.

6.1. Installing Plone backend#

Make sure you have a current and by Plone supported Python 3 version. One way to achieve is pyenv which lets you manage different Python versions. It even let's you setup virtual Pythons of the same version for individual projects. https://github.com/pyenv/pyenv-installer

pyenv install 3.9.5
pyenv virtualenv 3.9.5 plonepy
pyenv activate plonepy

This installs and activates a Python 3.9.5. It does not affect your system Python as it is an isolated virtual Python environment.

6.1.1. Prerequisites#

The following instructions are based on Ubuntu and macOS. If you use a different operating system (OS), please adjust them to fit your OS.

On Ubuntu/Debian, you need to make sure your system is up-to-date:

sudo apt-get update
sudo apt-get -y upgrade

Then, you need to install the following packages:

sudo apt-get install python3.9-dev python3.9-tk python3.9-venv build-essential libssl-dev libxml2-dev libxslt1-dev libbz2-dev libjpeg62-dev
sudo apt-get install libreadline-dev wv poppler-utils
sudo apt-get install git

On MacOS you at least need to install some dependencies with Homebrew

brew install zlib git readline jpeg libpng libyaml

See also

For more information or in case of problems see the official installation instructions.

6.1.2. Get Plone backend and install#

Download Plone from https://plone.org/download

Follow the instructions. Select option 'standalone' for your first Plone installation.

Note

You do not find a Plone 6 to download? Well it's not released. We still do a Plone 6 setup: Plone backend plus Plone frontend. If Plone backend is still a Plone 5, that's OK.

6.2. Installing Plone frontend#

For a Plone 6 installation by now two installations are needed: Plone backend and Volto frontend. The former section is describing the options for a Plone backend installation. This section is about setting up a Volto project.

6.2.1. Installing Prerequisites#

First Install nvm (NodeJS version manager).

Install Yarn (JavaScript package manager).

Install @plone/generator-volto, the Yeoman Volto App Generator:

npm install -g yo @plone/generator-volto

6.2.2. Bootstrapping A Project#

To create a new Volto project type the following:

yo @plone/volto

Follow the prompts' questions, providing my-volto-app as the project name.

It will create a folder called my-volto-app inside the current folder with the following structure:

my-volto-app/
├── babel.config.js
├── build
├── create-sentry-release.sh
├── cypress
│   ├── fixtures
│   ├── .gitkeep
│   ├── integration
│   ├── plugins
│   └── support
├── .eslintignore
├── .eslintrc.js
├── .gitignore
├── jsconfig.json
├── locales
├── Makefile
├── mrs.developer.json
├── node_modules
├── omelette -> node_modules/@plone/volto/
├── package.json
├── patches
├── public
│   ├── android-chrome-192x192.png
│   ├── android-chrome-512x512.png
│   ├── apple-touch-icon.png
│   ├── favicon-16x16.png
│   ├── favicon-32x32.png
│   ├── favicon.ico
│   ├── icon.svg
│   ├── index.html.spa
│   ├── robots.txt
│   └── site.webmanifest
├── razzle.config.js
├── README.md
├── src
│   ├── actions
│   ├── addons
│   ├── client.js
│   ├── components
│   ├── config.js
│   ├── constants
│   ├── customizations
│   ├── helpers
│   ├── index.js
│   ├── reducers
│   ├── routes.js
│   └── theme.js
├── .storybook
├── theme
│   └── theme.config
├── yarn.lock
└── .yarnrc

6.2.3. Running The Project#

To run the project you can type:

cd my-volto-app
yarn start

This will start the server on port 3000.

You can change the port and/or hostname for the frontend by specifying PORT and/or HOST:

HOST=my_hostname PORT=1234 yarn start

If your backend runs on a different port and/or uses a different hostname you can specify the full URL:

RAZZLE_API_PATH=http://localhost:55001/plone yarn start

6.3. Creating a Plone Website#

Now that you have a backend and a frontend up and running, you can create your concrete website for a project.

Create a Plone site object Plone on http://localhost:8080

Point your browser to http://localhost:3000 and see that Plone is up and running.

You can stop the Volto app anytime using ctrl + c.

6.4. Hosting Plone#

If you want to host a real live Plone site yourself then running it from your laptop is not a viable option.

You can host Plone...

  • with one of many professional hosting providers

  • on a virtual private server

  • on dedicated servers

See all the ways you can set up Plone

See also

Plone Installation Requirements: https://docs.plone.org/manage/installing/requirements.html

6.5. Production Deployment#

The way we are setting up a Plone site during this class may be adequate for a small site — or even a large one that's not very busy — but you are likely to want to do much more if you are using Plone for anything demanding.

  • Using a production web server like Apache or nginx for URL rewriting, SSL and combining multiple, best-of-breed solutions into a single web site.

  • Reverse proxy caching with a tool like Varnish to improve site performance.

  • Load balancing to make best use of multiple core CPUs and even multiple servers.

  • Optimizing cache headers and Plone's internal caching schemes with plone.app.caching.

And you will need to learn strategies for efficient backup and log file rotation.

All these topics are introduced in Guide to deploying and installing Plone in production.