From 1fd13a74ad3f7ea8af450e1dd4c1fe1127d7c4c2 Mon Sep 17 00:00:00 2001 From: jacobHu Date: Wed, 30 Apr 2025 16:43:03 +0800 Subject: [PATCH] add readme --- devbox/cli/readme.md | 51 ++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 51 insertions(+) create mode 100644 devbox/cli/readme.md diff --git a/devbox/cli/readme.md b/devbox/cli/readme.md new file mode 100644 index 0000000..4d10387 --- /dev/null +++ b/devbox/cli/readme.md @@ -0,0 +1,51 @@ +# DevBox Frontend Development Environment (with Nginx Reverse Proxy) + +This document explains how to use the `devbox` script to set up a local development environment containing two frontend applications (Vue3 and Nuxt) with Nginx reverse proxy. + +## Purpose + +In standard development workflow, `pnpm run dev` launches two frontend applications simultaneously: + +1. **Vue3 Application (freeleaps):** Listens on `http://localhost:5173` inside the container by default. +2. **Nuxt Application (nuxt-front):** Listens on `http://localhost:3001` inside the container with base URL set to `/home/`. + +To access both applications through a **single port** from outside the container, we introduced Nginx as a reverse proxy. + +## Nginx Configuration + +Nginx runs inside the `devbox` container and routes requests to the correct internal frontend application based on the access path. + +* **Configuration File Location:** + * During init_compile_env initialization, the script looks for `/home/devbox/freeleaps/frontend/devbox_nginx.conf`. + * If found, this file will be copied to `/etc/nginx/nginx.conf` inside the container. +* **Proxy Rules:** + * Requests to `http://:/` will be proxied to `http://localhost:5173/` (Vue3 app) inside the container. + * Requests to `http://:/home/` will be proxied to `http://localhost:3001/home/` (Nuxt app) inside the container. + +## Port Configuration + +You can configure relevant ports through `devbox` command parameters: + +* **`--devbox-nginx-port `:** + * Specifies the port on the **host machine** for accessing the Nginx reverse proxy. + * **Default: `8888`**. + * This is the port you'll use to access frontend applications from your browser. + +## Git Branch Selection + +During environment initialization, you can specify which Git branch to check out: + +* **Interactive Mode:** + When running `./devbox`, the script will prompt you to enter a branch name (defaults to `main`). + +The script will attempt to check out the specified branch. If checkout fails (e.g., remote branch doesn't exist), it will fall back to the `main` branch. + +## Accessing Applications + +After successful environment startup, access the applications from your **host machine** browser: + +* **Vue3 Application:** `http://localhost:/` (e.g.: `http://localhost:8888/`) +* **Nuxt Application:** `http://localhost:/home/` (e.g.: `http://localhost:8888/home/`) + +Where `` is the port specified via `--devbox-nginx-port`, defaulting to `8888`. +