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

Add support for working SSL certificate using mkcert #292

Merged
merged 2 commits into from
Jul 17, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -24,3 +24,6 @@
.Trashes
ehthumbs.db
Thumbs.db

# Ignore Jetbrains IDE files
.idea/
6 changes: 3 additions & 3 deletions docker-compose.yml
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ services:
- "80:80"
- "443:443"
volumes:
- cert_data:/etc/nginx/certs
- ./local/certs:/etc/nginx/certs
- /var/run/docker.sock:/tmp/docker.sock:ro
- ./local/docker/nginx-proxy/conf.d/custom.conf:/etc/nginx/conf.d/custom.conf

Expand All @@ -31,9 +31,10 @@ services:
image: ghcr.io/xwp/vip-site-template--mkcert:1.0.0
build: ./local/docker/mkcert
volumes:
- cert_data:/root/.local/share/mkcert
- ./local/certs:/root/.local/share/mkcert
command: sh -c 'test -f "${DEV_URL:-local.wpenv.net}.crt" || mkcert -cert-file "${DEV_URL:-local.wpenv.net}.crt" -key-file "${DEV_URL:-local.wpenv.net}.key" "${DEV_URL:-local.wpenv.net}" "*.${DEV_URL:-local.wpenv.net}"'


# Sync VIP MySQL container and it's configurations - https://github.com/Automattic/vip-cli/blob/549a45a37bc254a39dba9ed23ac88174a35aa1da/assets/dev-env.lando.template.yml.ejs#L74-L75
db:
image: mysql:8.0
Expand Down Expand Up @@ -112,6 +113,5 @@ services:

volumes:
db_data:
cert_data:
webgrind_data:
elasticsearch_data:
2 changes: 2 additions & 0 deletions local/certs/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
*
!.gitignore
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
"node": "^18"
},
"scripts": {
"install-cert": "CAROOT=./local/certs mkcert -install",
"preinstall": "composer install",
"prepare": "git config core.hooksPath ./local/git-hooks",
"lint": "npm-run-all lint-*",
Expand Down
18 changes: 12 additions & 6 deletions readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ Site setup, development environment and deploy tooling for [WordPress VIP](https

We suggest using [Homebrew](https://brew.sh) on macOS or [Chocolatey](https://chocolatey.org) for Windows to install the project dependencies.

brew install git [email protected] composer node@18 mkcert
brew install git [email protected] composer node@18 mkcert nss
brew install --cask docker


Expand Down Expand Up @@ -99,7 +99,7 @@ Consider using a dedicated GitHub [machine user](https://docs.github.com/en/get-

1. Clone this repository:

git clone [email protected]:wpcomvip/devgo-vip.git
git clone [email protected]:xwp/vip-site-template.git devgo-vip

2. Move into the project directory:

Expand All @@ -109,21 +109,25 @@ Consider using a dedicated GitHub [machine user](https://docs.github.com/en/get-

npm install

4. Start the development environment using Docker:
4. Install ssl certificate to add the certificate authority of the development environment [`local/data/mkcert/rootCA.pem`](local/data/mkcert/rootCA.pem) to the trusted list on your computer. Alternatively, [configure it manually](https://support.apple.com/guide/keychain-access/add-certificates-to-a-keychain-kyca2431/mac).

npm run install-cert

5. Start the development environment using Docker:

npm run start

and `npm run stop` to stop the virtual environment at any time. Run `npm run start-debug` to start the environment in debug mode where all output from containers is displayed. Run `npm run stop-all` to stop all active Docker containers in case you're running into port conflicts.

5. Install the local WordPress multisite environment:
6. Install the local WordPress multisite environment:

npm run setup

with the configuration from `local/public/wp-cli.yml`.

6. Visit [local.wpenv.net](https://local.wpenv.net) to view the development environment. WordPress username `devgo` and password `devgo`.
7. Visit [local.wpenv.net](https://local.wpenv.net) to view the development environment. WordPress username `devgo` and password `devgo`.

7. Visit [mail.local.wpenv.net](https://mail.local.wpenv.net) to view all emails sent by WordPress.
8. Visit [mail.local.wpenv.net](https://mail.local.wpenv.net) to view all emails sent by WordPress.

The local development environment uses a self-signed SSL sertificate for HTTPS so the "Your connection is not private" error can be ignored to visit the site.

Expand Down Expand Up @@ -199,6 +203,8 @@ We use `npm` as the canonical task runner for things like linting files and crea

- `npm run vip` to run [VIP CLI](https://wpvip.com/documentation/vip-go/vip-cli/) commands on staging and production environments.

- `npm run install-cert` to mark the self-signed SSL certificate authority (under [`local/certs/rootCA.pem`](local/certs/rootCA.pem)) for the local development environment as trusted. Make sure [`mkcert` is installed on your computer](#install-dependencies). This command is required to avoid the "Your connection is not private" error when visiting the site. Stop the local environment before running this command and restart the browser/tab after installing the certificate and starting the environment again.


## Deployments 🚀

Expand Down