Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Deployment updates #888

Open
wants to merge 11 commits into
base: main
Choose a base branch
from
2 changes: 1 addition & 1 deletion docs/effective-volto/architecture/CORS.md
Original file line number Diff line number Diff line change
Expand Up @@ -51,4 +51,4 @@ The default backend will live in `http://localhost:8080/Plone` and the frontend
RAZZLE_DEV_PROXY_API_PATH=http://localhost:8080/mysite
```

In production, you'll probably will be using Volto's Seamless mode, so you won't be defining any custom `API_PATH` but using `++api++` traversal, and reverse proxying it through your webserver.
In production, you'll probably will be using Volto's Seamless mode, so you won't be defining any custom `API_PATH` but using `++api++` traversal, and reverse proxying it through your web server.
2 changes: 1 addition & 1 deletion docs/effective-volto/architecture/bootstrap-volto.md
Original file line number Diff line number Diff line change
Expand Up @@ -107,7 +107,7 @@ To install Docker desktop for Mac, here are the detailed instructions:
2. Install the package as any other Mac software, if required, follow
instructions from:

https://docs.docker.com/desktop/install/mac-install/
https://docs.docker.com/desktop/setup/install/mac-install/

3. Check that docker is installed correctly, open a new terminal and type:

Expand Down
4 changes: 2 additions & 2 deletions docs/effective-volto/deployment/seamlessmode.md
Original file line number Diff line number Diff line change
Expand Up @@ -30,11 +30,11 @@ The first question, *"what is my domain name?"* can be answered by looking at th
The second question is a lot harder to answer, there can be so many unknowns, so, instead, we have a few layers of conventions and configuration variables.

- If you're running Volto for development, the Plone backend is exposed from the frontend (`localhost:3000`) via a "devproxy" that assumes that the Plone backend is at `http://localhost:8080/Plone`. You can override it with [`RAZZLE_DEV_PROXY_API_PATH`](https://github.com/plone/volto/blob/5eb332829956dbf0505283b176008c9364ccf2f9/src/config/index.js#L101).
- If you're running in production, the Plone backend is assumed to be exposed at the same domain, but available via the special traversal path, the `++api++`. So you need to add aditional rewrite rules in your Apache or Nginx proxy server to directly redirect those requests to the Plone backend.
- If you're running in production, the Plone backend is assumed to be exposed at the same domain, but available via the special traversal path, the `++api++`. So you need to add aditional rewrite rules in your Apache or nginx proxy server to directly redirect those requests to the Plone backend.
- Before the `++api++` traverser was developed, we would configure the proxy server to serve Plone directly via a `/api` subpath and the `_vh_api` VirtualHostMonster suffix. Then we would configure Volto with the `RAZZLE_API_PATH` variable. This is still available and works.
- If you want the Volto nodejs server to communicate directly with the Plone backend via the internal network (for example, when running a Docker stack), you can use the `RAZZLE_INTERNAL_API_PATH` setting to configure the address of the Plone backend.

## Nginx example config for seamless mode deployments
## nginx example config for seamless mode deployments

```nginx
upstream backend {
Expand Down
8 changes: 4 additions & 4 deletions docs/effective-volto/development/i18n.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ myst:

Internationalization (i18n) is the process of creating user interfaces which are suitable for different languages and cultural contexts.
Volto uses the library [react-intl](https://www.npmjs.com/package/react-intl) to provide translations for any potential language.
Anything you can read in the [official documentation of react-intl](https://formatjs.io/docs/react-intl/) also applies for Volto.
Anything you can read in the [official documentation of react-intl](https://formatjs.github.io/docs/getting-started/installation) also applies for Volto.

However this section teaches you about the most common use cases relating to i18n you probably will have when developing your {doc}`../addons` or contributing to the Volto core itself.

Expand Down Expand Up @@ -95,12 +95,12 @@ function HelloWorld(props) {

The identifier `hello_world` is then commonly used between all the translations.
There are also more features available such as using placeholders.
See the docs for all features in the [FormattedMessage component](https://formatjs.io/docs/react-intl/components#formattedmessage).
See the docs for all features in the [FormattedMessage component](https://formatjs.github.io/docs/react-intl/components/#formattedmessage).

### Translating Attributes

As `FormatMessage` is only suitable for creating text within HTML elements, it cannot be used for translating individual attributes.
But with the method [formatMessage](https://formatjs.io/docs/react-intl/api/#formatmessage) there exists another way to translate primitive strings.
But with the method [`formatMessage()`](https://formatjs.github.io/docs/react-intl/api#formatmessage) there exists another way to translate primitive strings.

This approach can be best explained with an example: Assume you have a component called `TeaserImage` which contains an image that has for accessibility reasons the `alt` attribute.

Expand All @@ -112,7 +112,7 @@ To translate the `alt` attribute, you have to do the following steps:
import { defineMessages, injectIntl, intlShape } from 'react-intl';
```

2. Define a message (or more) via [defineMessages](https://formatjs.io/docs/react-intl/api/#definemessagesdefinemessage):
2. Define a message (or more) via [`defineMessages()`](https://formatjs.github.io/docs/react-intl/api#definemessagesdefinemessage):

```js
const messages = defineMessages({
Expand Down
17 changes: 9 additions & 8 deletions docs/glossary.md
Original file line number Diff line number Diff line change
Expand Up @@ -274,7 +274,14 @@ mxdev
plonecli
A Plone CLI for creating Plone packages. [plonecli usage](https://github.com/plone/plonecli)

Cookiecutter
A command-line utility that creates projects from cookiecutters (project templates), for example, creating a Python package project from a Python package project template.
[See Cookiecutter's documentation](https://cookiecutter.readthedocs.io/en/stable/).

Cookieplone
```{versionadded} Volto 18.0.0-alpha.43
```

[Cookieplone](https://github.com/plone/cookieplone) is the method to create a Plone project.
You can use Cookieplone to build a backend add-on, a new Volto add-on, or a full project with both backend and frontend.
Cookieplone simplifies the process using robust Cookiecutter templates from {term}`cookieplone-templates`.
Expand All @@ -290,19 +297,13 @@ cookiecutter-plone-starter
[cookiecutter-plone-starter](https://github.com/collective/cookiecutter-plone-starter) is a `cookiecutter` template, created by the Plone community, to bootstrap
a new Plone 6 project using Volto and a relational database.

Cookiecutter
[Cookiecutter](https://github.com/cookiecutter/cookiecutter) is tool used to generate codebases / projects.

cookieplone
[cookieplone](https://github.com/plone/cookieplone) is a wrapper around {term}`Cookiecutter` designed to streamline the development of Plone codebases

Traefik
[Traefik](https://doc.traefik.io/traefik/) is an open-source reverse proxy and load balancer designed to handle HTTP and TCP applications.
It simplifies the deployment and routing of services and is particularly well-suited for cloud-native and containerized environments,
offering features like automatic service discovery, middleware plugins, and robust security options.

Nginx
[Nginx](https://nginx.org/en/) is a high-performance web server, reverse proxy, and load balancer that is known for its speed, reliability, and flexibility.
nginx
[nginx](https://nginx.org/en/) is a high-performance web server, reverse proxy, and load balancer that is known for its speed, reliability, and flexibility.
It can also serve as a mail proxy server and provides features for HTTP and TCP/UDP applications, making it a popular choice for serving web content,
optimizing resource utilization, and enhancing web performance and security.

Expand Down
2 changes: 1 addition & 1 deletion docs/mastering-plone-5/buildout_1.md
Original file line number Diff line number Diff line change
Expand Up @@ -104,7 +104,7 @@ Even in smaller buildouts this is a useful feature. We are using [collective.rec
The omelette recipe needs to know which eggs to reference. We want the same eggs that our instance uses, so we reference the eggs of the instance instead of repeating the whole list.
Another example: Say you create configuration files for a webserver like nginx, you can define the target port for the reverse proxy by looking it up from the zope2instance recipe.
Another example: Say you create configuration files for a web server like nginx, you can define the target port for the reverse proxy by looking it up from the zope2instance recipe.
Configuring complex systems always involves a lot of duplication of information. Using references in the buildout configuration allows you to minimize these duplications.
```
Expand Down
2 changes: 1 addition & 1 deletion docs/mastering-plone-5/deployment_sites.md
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ Load balancer (nginx or haproxy)
|
Webserver (nginx)
Web server (nginx)
```

Deploying Plone and production-setups are outside the scope for this training.
Expand Down
2 changes: 1 addition & 1 deletion docs/mastering-plone-5/installation.md
Original file line number Diff line number Diff line change
Expand Up @@ -100,7 +100,7 @@ See all the ways you can [set up Plone](https://plone.org/download)
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.
- 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.
Expand Down
2 changes: 1 addition & 1 deletion docs/mastering-plone-5/restapi.md
Original file line number Diff line number Diff line change
Expand Up @@ -143,7 +143,7 @@ A big advantage of Vue.js over other frameworks for our purpose is that it doesn
NodeJS..

Our focus is Plone and interacting with {py:mod}`plone.restapi`, and `Vue.js` perfectly suits our needs
because it simply lets us use Plone as our development webserver.
because it simply lets us use Plone as our development web server.

To get started, we create a new subdirectory of {file}`browser` named {file}`talklist`.

Expand Down
2 changes: 1 addition & 1 deletion docs/mastering-plone/volto_testing.md
Original file line number Diff line number Diff line change
Expand Up @@ -151,7 +151,7 @@ exports[`renders a talk view component with only required props 1`] = `
```

```{seealso}
{doc}`plone6docs:volto/contributing/testing` in docs.plone.org.
{doc}`plone6docs:volto/contributing/testing`
```

(testing-cypress)=
Expand Down
36 changes: 18 additions & 18 deletions docs/plone-deployment/deploy.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ make test

## Manual Deployment with `devops/Makefile`

Utilize the `Makefile` at {file}`devops/Makefile` for manual deployment.
Utilize the {file}`Makefile` at {file}`devops/Makefile` for manual deployment.

### Deploying the Stack

Expand Down Expand Up @@ -66,9 +66,9 @@ make stack-create-site

Monitor the logs of each service with these commands:

- Traefik: ```make logs-webserver```
- Frontend: ```make logs-frontend```
- Backend: ```make logs-backend```
- Traefik: `make logs-webserver`
- Frontend: `make logs-frontend`
- Backend: `make logs-backend`

## Automating Deployment with GitHub Actions

Expand All @@ -88,17 +88,17 @@ Monitor the logs of each service with these commands:

Add secrets in the `Secrets` section of your environment. Refer to the table below:

| Secret Name | Secret Value | Description |
|-------------|--------------|-------------|
| DEPLOY_HOST | Your hostname or IP | The Docker Swarm managers address. |
| DEPLOY_PORT | 22 | The SSHD port. |
| DEPLOY_USER | Your username | A user with Docker command permissions. |
| DEPLOY_SSH | Content of `devops/etc/keys/plone_prod_deploy_rsa` | The private SSH key for connection. |
| ENV_FILE | Content of {file}`devops/.env_file_gha` | File containing environment variables for the stack file. |
| Secret Name | Secret Value | Description |
|-------------|----------------------------------------------------------|-----------------------------------------------------------|
| DEPLOY_HOST | Your hostname or IP | The Docker Swarm manager's address. |
| DEPLOY_PORT | 22 | The SSHD port. |
| DEPLOY_USER | Your username | A user with Docker command permissions. |
| DEPLOY_SSH | Content of {file}`devops/etc/keys/plone_prod_deploy_rsa` | The private SSH key for connection. |
| ENV_FILE | Content of {file}`devops/.env_file_gha` | File containing environment variables for the stack file. |

#### Adding Repository Variables

Navigate to `Settings` > `Secrets and Variables` > `Actions`. Under `Variables`, add the repository variable:
Navigate to {menuselection}`Settings --> Secrets and Variables --> Actions`. Under {guilabel}`Variables`, add the repository variable:

| Name | Value |
|----------|-------|
Expand All @@ -111,15 +111,15 @@ This variable is referenced in {file}`.github/workflows/manual_deploy.yml`.
Ensure both Backend and Frontend tests are successful and images for both servers are available.

1. Go to the project's repository on GitHub.
2. Click the `Actions` tab.
3. Find **Manual Deployment...** and click `Run workflow`.
4. Select `Branch: main` under **Use workflow from**.
5. Press `Run workflow`.
2. Click the {guilabel}`Actions` tab.
3. Find {guilabel}`Manual Deployment...` and click {guilabel}`Run workflow`.
4. Select {guilabel}`Branch: main` under {guilabel}`Use workflow from`.
5. Press {guilabel}`Run workflow`.

The workflow connects to **DEPLOY_HOST** using **DEPLOY_USER** and **DEPLOY_SSH** key, initiates a new deployment using the specified stack, and provides a detailed deployment report.
The workflow connects to `DEPLOY_HOST` using `DEPLOY_USER` and `DEPLOY_SSH` key, initiates a new deployment using the specified stack, and provides a detailed deployment report.

## Accessing the Site

Your site should now be accessible via the defined public URL.

Note: Ensure to replace placeholders like `<url>` with actual values as per your project's specifics. Also, ensure that the paths to files and directories are correct and exist in your project structure.
Note: Ensure you replace placeholders, such as `<url>`, with actual values per your project's specifics. Also, ensure that the paths to files and directories are correct and exist in your project structure.
1 change: 1 addition & 0 deletions docs/plone-deployment/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -38,4 +38,5 @@ project-start
project-edit
server-setup
deploy
virtual-host
```
6 changes: 4 additions & 2 deletions docs/plone-deployment/intro.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,8 @@ or considering a virtual machine on your personal computer for testing, this tra

We will delve into a basic setup, scalable to accommodate extensive Plone installations.

(deployment-training-choices)=

### Training Choices

#### Linux
Expand Down Expand Up @@ -55,9 +57,9 @@ simplifies the setup process, making it accessible even for beginners.

#### GitHub and GitHub Actions

With Plones development anchored on GitHub, the community is gravitating towards GitHub Actions for new packages.
With Plone's development anchored on GitHub, the community is gravitating towards GitHub Actions for new packages.
The principles outlined are adaptable to GitLab, Jenkins, and similar platforms.

#### Kubernetes

While the current training edition doesnt cover Kubernetes, we anticipate its inclusion in upcoming updates.
While the current training edition doesn't cover Kubernetes, we anticipate its inclusion in future updates.
19 changes: 9 additions & 10 deletions docs/plone-deployment/plone-docker-images.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,16 +9,15 @@ myst:

# Plone Docker Images

Since the release of Plone 6, the community has a new set of Docker images -- and offering more base options.
Since the release of Plone 6, the community has a new set of Docker images offering more base options.

## plone/plone-frontend
## `plone/plone-frontend`

Repository available at [https://github.com/plone/plone-frontend/](https://github.com/plone/plone-frontend/)
Repository available at https://github.com/plone/plone-frontend/.

Installs the Plone 6 default user-experience (Using the React-powered frontend: Volto).
Installs the Plone 6 user-experience using the React-powered frontend, Volto.

Should be used to showcase the default Plone 6 experience, as new projects will probably implement their own Docker images (with a similar Dockerfile),
like the one below:
Should be used to showcase the Plone 6 experience, as new projects will probably implement their own Docker images (with a similar Dockerfile), like the one below:

```Dockerfile
# syntax=docker/dockerfile:1
Expand Down Expand Up @@ -55,9 +54,9 @@ RUN <<EOT
EOT
```

## plone/plone-backend
## `plone/plone-backend`

Repository available at [https://github.com/plone/plone-backend/](https://github.com/plone/plone-backend/)
Repository available at https://github.com/plone/plone-backend/.

Installs the Plone 6 backend using a pip-based installation.
This approach makes it easier and faster to extend this image in your own project.
Expand Down Expand Up @@ -107,8 +106,8 @@ RUN <<EOT
EOT
```

## plone/plone-zeo
## `plone/plone-zeo`

Repository available at [https://github.com/plone/plone-zeo/](https://github.com/plone/plone-zeo/)
Repository available at https://github.com/plone/plone-zeo/.

Installs a ZEO database server.
Loading