Volto - Deployment options

I was browsing through the Volto training documentation https://training.plone.org/5/volto/
and the following came to mind...

@tisto or maybe @davilima6,
What is your sugggested approach to deploying a Volto-based project?

I suppose you could use nginx and proxy the Volto service or maybe just "bake" the finished product as static files served via Plone.
Are there any gotchas?

2 Likes

I wasn't involved in deployment when working with Volto but do I recommend not serving its static files via Zope/Plone but instead with Nginx, which is specialised for that. Also you probably already have Nginx serving Plone anyway, since it's not a good practice to have an Application Server exposed directly on the internets.

1 Like

We use pm2 as process manager for the server side rendering process. It is not sufficient to just build the project once and then ship the js code via nginx. The setup is pretty much standard (in the JavaScript world) I'd say.

I think @sneridagh will talk about this at Ploneconf next week. If not, we can share our config in the Volto docs...lots of things to do right before the conference though. :slight_smile:

3 Likes

No problem. I understand and can wait until post conference.

@tisto Did you published the deployment docs?
I didn't find the docs in repo (https://github.com/plone/volto/tree/master/docs/source/07-deploying)

And we want to deploy without node server. I tried to build volto project but i got a server.js. I want to get static js file as main.min.js. I think we need to modify Plone template for appending a div as <div id="app">. Please let us know how to make a simple deployment structure.

1 Like

We are super busy right now with client projects so we did not manage to write those docs. I am not sure if it is possible right now to run Volto without SSR and Node on the server.

@sneridagh or @robgietema might be able to tell.

In any case I would recommend going with pm2 and Node, otherwise, you will be on your own if you run into issue. You will also lose speed on first-page load and the ability to be indexed by search engine bots.

Sorry, it is not possible right now to run Volto without the SSR server. However, Volto is based on Razzle (https://github.com/jaredpalmer/razzle) and in its roadmap there is such a feature... We will have to wait for it to have it in Volto.

By the way, are you sure you want to run it without SSR? I wouldn't recommend it, because of SEO and Social media cards, and the performance will be also noticeably bad.

We will document the deployment as soon as possible. For now I'll leave you the PM2 config for both the node process and a generic Plone one (replace paths and names whenever required):

module.exports = {
  apps: [
    {
      script: '/path/to/myapp/build/server.js',
      name: 'volto',
      cwd: '/path/to/myapp',
    },
    {
      script: '/path/to/myapp/bin/instance',
      args: 'console',
      name: 'plone-api',
      cwd: '/path/to/myapp',
      interpreter: '/path/to/myapp/bin/python',
    },
  ],
};

And the Nginx:

location ~ /api($|/.*) {
  rewrite ^/api($|/.*) /VirtualHostBase/https/voltocms.com:443/Plone/VirtualHostRoot/_vh_api$1 break;
  proxy_pass http://ploneapi;
}

location ~ / {
  # Set to 1m during development
  location ~* \.(ico|jpg|jpeg|png|gif|svg|js|jsx|css|less|swf|eot|ttf|otf|woff|woff2)$ {
  add_header Cache-Control "public";
  expires +1m;
  proxy_pass http://volto;
}

Hope this helps!
V.

3 Likes

Is that an app.js file? I know very little about pm2 but got the impression that it needs to execute some kind of .js file.

@pigeonflight This is the syntax of a PM2 config file:
https://pm2.io/doc/en/runtime/guide/ecosystem-file/

please take a look into the PM2 docs:
https://pm2.io/doc/en/runtime/quick-start/

They are quite good. Sorry not to be able to spend more time on this for now :frowning: for documenting it properly. It will be addressed soon in the upcoming sprints.

1 Like

Thanks @sneridagh... this a lot of good direction!

Looking back at this... it looks like the documentation has been shuffled around a bit.
I found information on the ecosystem file here:

And quick start is now here:

1 Like

@sneridagh & @tisto I've contributed some of my notes on running Volto with PM2 and NGINX. You can find it on the deployment-docs branch in github. The docs aren't building successfully for me at the moment but it's there for what it's worth.

1 Like

@sneridagh Is it safe to say that server side rendering (SSR) for SEO and performance is the biggest benefit of using PM2 in this scenario.

Plone Foundation Code of Conduct