website/docs: updated Frontend development environment contributor docs (#16731)

* updated Frontend development environment contributor docs 

Updated the docs on how to start the frontend project. 

clarifying  how to override the docker-compose.yml and starting the front-end project for the first time.

Signed-off-by: Josh Martin <joshmartin@reprogrammed.software>

* Update website/docs/developer-docs/setup/frontend-dev-environment.md

Co-authored-by: Dewi Roberts <dewi@goauthentik.io>
Signed-off-by: Josh Martin <joshmartin5001@gmail.com>

---------

Signed-off-by: Josh Martin <joshmartin@reprogrammed.software>
Signed-off-by: Josh Martin <joshmartin5001@gmail.com>
Co-authored-by: Dewi Roberts <dewi@goauthentik.io>
This commit is contained in:
Josh Martin
2025-09-16 08:57:12 -05:00
committed by GitHub
parent 04023265a6
commit e9fa7ad16b

View File

@@ -44,7 +44,7 @@ Depending on platform, some native dependencies might be required. On macOS, run
GIT_BUILD_HASH="dev"
```
4. Create a Docker Compose override to mount the local configuration file (`local.env.yml`) and ESBuild's output directory (`web`).
4. Create a Docker Compose override file (`docker-compose.override.yml`) in the same directory as the `docker-compose.yml`. This will override the volume configurations for the local configuration file (`local.env.yml`) and mount the directory for the frontend code (`web`) into the docker containers. By creating this file in the root of the repository, Docker will automatically mount the web files generated by the build process. The `local.env.yml` mount is optional, but allows you to override the default configuration.
```yaml title="docker-compose.override.yml"
services:
@@ -54,22 +54,14 @@ Depending on platform, some native dependencies might be required. On macOS, run
- ./local.env.yml:/local.env.yml
```
By creating this file in the root of the repository, Docker will automatically mount the web files generated by the build process. The `local.env.yml` mount is optional, but allows you to override the default configuration.
5. From the cloned repository root, install the front-end dependencies using NPM.
```shell
cd web
npm ci
```
6. From the cloned repository root, run the front-end build script.
5. From the repository root, run the front-end build script. This will install the npm packages needed to run the frontend project and start the project in watch mode.
```shell
make node-install
make web-watch
```
7. In a new terminal, navigate to the cloned repository root and start the backend containers with Docker Compose.
6. In a new terminal, navigate to the cloned repository root and start the backend containers with Docker Compose.
```shell
docker compose up