Skip to content

Commit

Permalink
feat: add Strapi (blog + cms) (#82)
Browse files Browse the repository at this point in the history
* feat: adding postgresql to devcontainer for the blog backend
* feat: adding strapi from a base template
Updated gitignore to allow the .env.example file. Using a dedicated gitignore in the cms folder for Strapi-specific stuff

* fix: fixing devcontainer
* feat: nextjs blog from sample
* feat: starting work on the azd integration
* feat: adding postgresql for the cms db
* fix: eslint issues
* chore: package-lock updates
* chore: cleanup for package-lock from bringing new projects in
* fix: env var in the postgres compose setup
* fix: generating the default db as blog not postgres
* fix: missing ignore for the strapi build cache
* fix: scripts for swa emulator to run blog
* chore: debugging launch for blog
* chore: removing blog from swa cli
* fix: removing the linked backends as nextjs hybrid doesn't use that,  API backends are disabled
* feat: moving blog from swa to container apps
* fix: moving away from SSG aspects due to Azure/azure-dev#1270
* fix: parameters for blog deployment
* fix: setting the module path for the azd things to deploy
* fix: removing package-lock from dockerfile as it doesn't exist due to workspaces
* fix: improving the outputs and naming of services to be more predictable
* fix: name of container apps service is lifted up to variable
This makes it easier to pass in as an argument using a params file

* fix: the params and individual service deployment of the CMS
* fix: individual service deployment of the blog frontend
* chore: remove website package
Website has been moved to a dedicated repo, this is cleanup of it

* chore: removing old SWA deployment action
* feat: adding azure storage strapi provider
* fix: refactoring the bicep files for deployment
- Changing `blog-cms` to just `cms` due to Azure/azure-dev#1290
- Adding more parameters to the cms deployment file that are the secrets
- moving serviceName tokenisation to the container-apps file rather than main, to make it consistent
- Fixing the service name for the portal

* fix: storage account path needs to be added to nextjs for next/image to work
* fix: variables not set properly for CMS setup
* fix: version of strapi azure storage plugin set
* fix: Missing flag in the env sample file
* fix: moving from domains to routePatterns for next/image
This means we don't need to know the storage account domain name, making the deployment more flexible

* chore: addressing package-lock after merge
* chore: adding readme guide for setting up blog
* fix: simplifying the password to avoid problems with yaml encoding
* chore: added section to readme for non-devcontainer usage
* fix: adding max retries to getting cosmos cert
* fix: forgot to update the database password on the service
* chore: fixing some package versions
* fix: incrementing vars in bash
* chore: improving the docs for devcontainer usage
Setting host requirements for the devcontainer

* chore: line endings are fun
* chore: reverting gitattributes to see if that fixes line endings
* fix: forcing ts/tsx to be lf line endings to avoid problems with linting on Windows
* chore(cms): update local dev guide

Co-authored-by: Wassim Chegham <github@wassim.dev>
  • Loading branch information
aaronpowell and manekinekko committed Jan 18, 2023
1 parent 46bc0c9 commit b66a2d7
Show file tree
Hide file tree
Showing 103 changed files with 39,111 additions and 16,590 deletions.
7 changes: 7 additions & 0 deletions .devcontainer/devcontainer.json
Expand Up @@ -54,5 +54,12 @@
"ghcr.io/devcontainers/features/node:1": {
"version": "latest"
}
},

// at least 8gb of RAM is needed due to the CosmosDB container
"hostRequirements": {
"cpus": 4,
"memory": "8gb",
"storage": "32gb"
}
}
26 changes: 25 additions & 1 deletion .devcontainer/docker-compose.yml
Expand Up @@ -18,7 +18,15 @@ services:
entrypoint: /usr/local/share/docker-init.sh
command: sleep infinity

network_mode: service:cosmos
environment:
DATABASE_HOST: pg
DATABASE_USERNAME: postgres
DATABASE_PASSWORD: AzureRocks
DATABASE_NAME: blog
links:
- pg
- cosmos

cosmos:
container_name: cosmos-contoso-real-estate
image: mcr.microsoft.com/cosmosdb/linux/azure-cosmos-emulator:latest
Expand All @@ -30,3 +38,19 @@ services:
volumes:
# Forwards the local Docker socket to the container.
- /var/run/docker.sock:/var/run/docker-host.sock
pg:
image: postgres:latest
restart: always
environment:
POSTGRES_PASSWORD: AzureRocks
POSTGRES_DB: blog
volumes:
- pgdata:/var/lib/postgresql/data
healthcheck:
test: [ "CMD-SHELL", "pg_isready -U postgres" ]
interval: 5s
timeout: 5s
retries: 5

volumes:
pgdata:
14 changes: 11 additions & 3 deletions .devcontainer/post-setup.sh
Expand Up @@ -4,12 +4,20 @@ set -euxo pipefail

ipAddress=https://$(docker inspect cosmos-contoso-real-estate -f '{{range .NetworkSettings.Networks}}{{.IPAddress}}{{end}}'):8081

attempts=0
maxAttempts=10
# Try to get the emulator cert in a loop
until sudo curl -ksf "${ipAddress}/_explorer/emulator.pem" -o '/usr/local/share/ca-certificates/emulator.crt'; do
until (sudo curl -ksf "${ipAddress}/_explorer/emulator.pem" -o '/usr/local/share/ca-certificates/emulator.crt') || ($attempts -eq $maxAttempts); do
echo "Downloading cert from $ipAddress"
sleep 1
attempts=$((attempts+1))
done

sudo update-ca-certificates
if [ $attempts -eq $maxAttempts ]; then
echo Failed to retrive the CosmosDB certificate. Ensure the container is running and then re-execute this script
else
sudo update-ca-certificates

echo "CosmosDB=AccountEndpoint=$ipAddress/;AccountKey=C2y6yDjf5/R+ob0N8A7Cgv30VRDJIWEHLM+4QDU5DE2nQ9nDuVTqobD4b8mGGyPMbIZnqyMsEcaGQy67XIw/Jw=="
fi

echo "CosmosDB=AccountEndpoint=$ipAddress/;AccountKey=C2y6yDjf5/R+ob0N8A7Cgv30VRDJIWEHLM+4QDU5DE2nQ9nDuVTqobD4b8mGGyPMbIZnqyMsEcaGQy67XIw/Jw=="
5 changes: 4 additions & 1 deletion .gitattributes
@@ -1 +1,4 @@
*.sh text eol=lf
* text=auto
*.sh text eol=lf
*.ts text eol=lf
*.tsx text eol=lf
1 change: 1 addition & 0 deletions .gitignore
Expand Up @@ -40,6 +40,7 @@ jspm_packages/
# dotenv environment variable files
.env
.env.*
!.env.example

# Next.js build output
.next
Expand Down
24 changes: 24 additions & 0 deletions .vscode/launch.json
Expand Up @@ -39,6 +39,24 @@
"request": "launch",
"preLaunchTask": "npm: test",
"url": "http://localhost:9876/debug.html"
},
{
"name": "blog: frontend",
"request": "launch",
"runtimeArgs": ["run-script", "dev"],
"runtimeExecutable": "npm",
"skipFiles": ["<node_internals>/**"],
"type": "node",
"cwd": "${workspaceFolder}/packages/blog"
},
{
"name": "blog: backend",
"request": "launch",
"runtimeArgs": ["run-script", "develop"],
"runtimeExecutable": "npm",
"skipFiles": ["<node_internals>/**"],
"type": "node",
"cwd": "${workspaceFolder}/packages/blog-cms"
}
],
"inputs": [
Expand All @@ -47,5 +65,11 @@
"type": "command",
"command": "azure-dev.commands.getDotEnvFilePath"
}
],
"compounds": [
{
"name": "blog: all",
"configurations": ["blog: backend", "blog: frontend"]
}
]
}
112 changes: 112 additions & 0 deletions README-scenario-3.md
@@ -0,0 +1,112 @@
This document will guide you through the prerequisites and commands necessary to setup and preview the portal project, locally on your computer.

## Prerequisites

- [VS Code](https://code.visualstudio.com/)
- You can use any other editor of choice but this guide will assume you are using VS Code
- [VS Code Dev Containers](https://code.visualstudio.com/docs/remote/containers)
- This will allow you to run the project in a containerized environment

## Project Structure

Within the `packages` folder, you will find the two projects that make up this scenario:

- `blog-cms` - The Strapi CMS
- `blog` - The Next.js frontend

## Local Development

_Note: This scenario has been optimised for use with [VS Code Remote Containers](https://code.visualstudio.com/docs/remote/containers), and contains definitions to setup the PostgreSQL database that Strapi uses, and this guide makes the assumption that you will use the dev container._

### Install the required Node.js packages

The repo is a monorepo, and thus contains all the components from all the scenarios. To support this [npm workspaces](https://docs.npmjs.com/cli/using-npm/workspaces) has been configured, and as a result, all scenarios packages will be installed.

To install all packages required run the following command:

```bash
npm install --workspaces
```

_Note: The devcontainer will automatically execute this command on creation, but you can execute it manually if you wish to see the installation happen._

### Starting Strapi

Strapi requires environment variables to provide the various JWT secrets. A sample of the `.env` file can be found at `packages/blog-cms/.env.example` which contains default values for all the required environment variables. Copy this file to `packages/blog-cms/.env`:

```bash
cp packages/blog-cms/.env.example packages/blog-cms/.env
```

_Note: You don't need to set the PostgreSQL environment variables, as these are set in the dev container definition._

To start the Strapi CMS, run the following command:

```bash
npm run develop --workspace blog-cms
```

Strapi will then be running at [`http://localhost:1337/admin`](http://localhost:1337/admin).

_Note: On first run, sample data will be loaded into the database, but you will need to setup an admin user, following the guide on the admin portal._

### Starting Next.js

To start the Next.js application, run the following command:

```bash
npm run dev --workspace blog
```

The Next.js application will then be running at [`http://localhost:3000`](http://localhost:3000).

### Local development without using the devcontainer

If you do not wish to use the use the devcontainer for local development there are some additional steps that need to be undertaken.

A PostgreSQL database is required by Strapi, so one will need to be provisioned. If you are provisioning a PostgreSQL database on WSL (using Ubuntu), please follow these steps:

- Update the package list: `sudo apt update`
- Install PostgreSQL: `sudo apt install postgresql`
- Confirm that PostgreSQL is active and running `sudo systemctl status postgresql`
- Confirm that PostgreSQL is accepting connections `sudo -u postgres psql`

Next, create the database:
- Switch to the `postgres` system user account: `sudo su - postgres`
- Then access the PostgreSQL shell: `psql`
- Create a user for Strapi: `CREATE USER strapi WITH PASSWORD 'strapi';`
- Create a database for Strapi: `CREATE DATABASE strapi;`
- Grant privileges to the user: `GRANT ALL PRIVILEGES ON DATABASE strapi TO strapi;`
- Then quite the PostgreSQL shell: `\q`
- Restart the PostgreSQL service: `sudo systemctl restart postgresql`

_Note: If you are using a different system, please follow the [PostgreSQL installation guide](https://www.postgresql.org/download/)._

Once the PostgreSQL cluster is up and running and the database is created, the following additional environment variables will need to be provided, either in the `.env` file or globally:

```
DATABASE_HOST= <localhost or IP of your PostgreSQL server>
DATABASE_USERNAME=strapi
DATABASE_PASSWORD=strapi
DATABASE_NAME=strapi
```

_Note: The database provided in `DATABASE_NAME` will need to exist on the server before starting Strapi_

Also, please install the following dependencies:

- Install `azd`

- `azd` is use to provision, manage and deploy the applicaton to Azure. Follow the [install guide for your OS](https://learn.microsoft.com/azure/developer/azure-developer-cli/install-azd)
- Note: `azd` is not required if you wish to only rely on GitHub Actions or Azure Pipelines to deploy using the provided CI/CD pipelines

- Install Node.js
- It is encouraged that a Node.js version manager, such as [nvm](https://nvm.sh), is used as a `.nvmrc` file is provided to specify the version of Node.js that is required

### Running in GitHub Codespaces

An alternative way to run the environment is using [GitHub Codespaces](https://github.com/codespaces), which will use the devcontainer definition, but create a remote containerised environment, rather than running the environment locally.

_Note: GitHub Codespaces is a paid component of GitHub. Review [the GitHub Codespaces billing](https://docs.github.com/en/billing/managing-billing-for-github-codespaces/about-billing-for-github-codespaces) before using it._

To run in GitHub Codespaces, the machine will need at least 4 CPUs and 8GB of memory, which is defined in the [`devcontainer.json`](./.devcontainer/devcontainer.json) file, to ensure all the services are started.
13 changes: 6 additions & 7 deletions README.md
Expand Up @@ -2,12 +2,12 @@

### Projects

| Project | Location | Description | Branch | Build Status |
| ------- | -------------------------------------- | ----------- | ------ | ------------ |
| Portal | [packages/portal](./packages/portal) | | TODO | TODO |
| API | [packages/api](./packages/api) | | TODO | TODO |
| Blog | [packages/blog](./packages/blog) | | TODO | TODO |
| Testing | [packages/testing](./packages/testing) | | TODO | TODO |
| Project | Location | Description | Branch | Build Status |
| ------- | -------------------------------------- | ---------------------------- | ------ | ------------ |
| Portal | [packages/portal](./packages/portal) | | TODO | TODO |
| API | [packages/api](./packages/api) | | TODO | TODO |
| Blog | [packages/blog](./packages/blog) | [Docs](README-scenario-3.md) | TODO | TODO |
| Testing | [packages/testing](./packages/testing) | | TODO | TODO |

### Prerequisites for local development

Expand Down Expand Up @@ -191,7 +191,6 @@ If you have any feature requests, issues, or areas for improvement, please [file

If you have any feature requests, issues, or areas for improvement, please [file an issue](https://github.com/Azure/static-web-apps-cli/issues). To keep up-to-date, ask questions, or share suggestions, join our [GitHub Discussions](https://github.com/Azure/static-web-apps/discussions).


## Want to help?

Want to file a bug, contribute some code, or improve the documentation? Excellent! Read up on our guidelines for [contributing](./CONTRIBUTING.md) and then check out one of our issues in the list: [community-help](https://github.com/contoso-real-estate/contoso-real-estate/issues).
11 changes: 11 additions & 0 deletions azure.yaml
Expand Up @@ -12,3 +12,14 @@ services:
project: packages/portal
language: ts
host: staticwebapp
module: app/web

cms:
project: packages/blog-cms
host: containerapp
module: app/blog-cms

blog:
project: packages/blog
host: containerapp
module: app/blog

0 comments on commit b66a2d7

Please sign in to comment.