Add ui proxy docs (#5459)

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
Co-authored-by: Robert Kaussow <mail@thegeeklab.de>
This commit is contained in:
qwerty287 2025-08-25 16:57:59 +02:00 committed by GitHub
parent ac9101cf89
commit 15d26639f9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 18 additions and 0 deletions

View file

@ -13,6 +13,15 @@ Testing UI changes would require us to rebuild the UI after each adjustment to t
Start the UI server locally with [hot-reloading](https://stackoverflow.com/a/41429055/8461267) by running: `pnpm start`. To enable the forwarding of requests to the UI server you have to enable the dev-proxy inside the Woodpecker server by adding `WOODPECKER_DEV_WWW_PROXY=http://localhost:8010` to your `.env` file. Start the UI server locally with [hot-reloading](https://stackoverflow.com/a/41429055/8461267) by running: `pnpm start`. To enable the forwarding of requests to the UI server you have to enable the dev-proxy inside the Woodpecker server by adding `WOODPECKER_DEV_WWW_PROXY=http://localhost:8010` to your `.env` file.
After starting the Woodpecker server as explained in the [debugging](./01-getting-started.md#debugging-woodpecker) section, you should now be able to access the UI under [http://localhost:8000](http://localhost:8000). After starting the Woodpecker server as explained in the [debugging](./01-getting-started.md#debugging-woodpecker) section, you should now be able to access the UI under [http://localhost:8000](http://localhost:8000).
### Usage with remote server
If you would like to test your UI changes on a "real-world" Woodpecker server which probably has more complex data than local test instances, you can run `pnpm start` with these environment variables:
- `VITE_DEV_PROXY`: your server URL, for example `https://ci.woodpecker-ci.org`
- `VITE_DEV_USER_SESS_COOKIE`: the value `user_sess` cookie in your browser
Then, open the UI at `http://localhost:8010`.
## Tools and frameworks ## Tools and frameworks
The following list contains some tools and frameworks used by the Woodpecker UI. For some points we added some guidelines / hints to help you developing. The following list contains some tools and frameworks used by the Woodpecker UI. For some points we added some guidelines / hints to help you developing.

View file

@ -13,6 +13,15 @@ Testing UI changes would require us to rebuild the UI after each adjustment to t
Start the UI server locally with [hot-reloading](https://stackoverflow.com/a/41429055/8461267) by running: `pnpm start`. To enable the forwarding of requests to the UI server you have to enable the dev-proxy inside the Woodpecker server by adding `WOODPECKER_DEV_WWW_PROXY=http://localhost:8010` to your `.env` file. Start the UI server locally with [hot-reloading](https://stackoverflow.com/a/41429055/8461267) by running: `pnpm start`. To enable the forwarding of requests to the UI server you have to enable the dev-proxy inside the Woodpecker server by adding `WOODPECKER_DEV_WWW_PROXY=http://localhost:8010` to your `.env` file.
After starting the Woodpecker server as explained in the [debugging](./01-getting-started.md#debugging-woodpecker) section, you should now be able to access the UI under [http://localhost:8000](http://localhost:8000). After starting the Woodpecker server as explained in the [debugging](./01-getting-started.md#debugging-woodpecker) section, you should now be able to access the UI under [http://localhost:8000](http://localhost:8000).
### Usage with remote server
If you would like to test your UI changes on a "real-world" Woodpecker server which probably has more complex data than local test instances, you can run `pnpm start` with these environment variables:
- `VITE_DEV_PROXY`: your server URL, for example `https://ci.woodpecker-ci.org`
- `VITE_DEV_USER_SESS_COOKIE`: the value `user_sess` cookie in your browser
Then, open the UI at `http://localhost:8010`.
## Tools and frameworks ## Tools and frameworks
The following list contains some tools and frameworks used by the Woodpecker UI. For some points we added some guidelines / hints to help you developing. The following list contains some tools and frameworks used by the Woodpecker UI. For some points we added some guidelines / hints to help you developing.