OpenWebUI/docs
1
0
Fork 0
mirror of https://github.com/open-webui/docs synced 2025-05-20 11:18:42 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Update development.md

Browse Source
This commit is contained in:
Silentoplayz 2025-04-10 16:25:57 -04:00
parent 185981dd96
commit 8dce0c4716
1 changed files with 67 additions and 63 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
docs/getting-started/advanced-topics/development.md
View File

@ -49,9 +49,11 @@ Let's get the user interface (what you see in your browser) up and running first
This command copies the `.env.example` file to a new file named `.env`. The `.env` file is where you'll configure environment variables for the frontend. This command copies the `.env.example` file to a new file named `.env`. The `.env` file is where you'll configure environment variables for the frontend.
- **Customize `.env`**: Open the `.env` file in your code editor (like VSCode). This file contains configuration variables for the frontend, such as API endpoints and other settings. For local development, the default settings in `.env.example` are usually sufficient to start with. However, you can customize them if needed. **Important:** Do not commit sensitive information to `.env` if you are contributing back to the repository. - **Customize `.env`**: Open the `.env` file in your code editor (like VSCode). This file contains configuration variables for the frontend, such as API endpoints and other settings. For local development, the default settings in `.env.example` are usually sufficient to start with. However, you can customize them if needed.
2. **Install Frontend Dependencies:** **Important:** Do not commit sensitive information to `.env` if you are contributing back to the repository.
1. **Install Frontend Dependencies:**
- **Navigate to the frontend directory:** If you're not already in the project root (`open-webui` directory), ensure you are there. - **Navigate to the frontend directory:** If you're not already in the project root (`open-webui` directory), ensure you are there.
```bash ```bash
@ -67,7 +69,7 @@ Let's get the user interface (what you see in your browser) up and running first
This command uses `npm` (Node Package Manager) to read the `package.json` file in the project root directory and download all the necessary JavaScript libraries and tools required for the frontend to run. This might take a few minutes depending on your internet connection. This command uses `npm` (Node Package Manager) to read the `package.json` file in the project root directory and download all the necessary JavaScript libraries and tools required for the frontend to run. This might take a few minutes depending on your internet connection.
3. **Start the Frontend Development Server:** 2. **Start the Frontend Development Server:**
```bash ```bash
npm run dev npm run dev
@ -92,13 +94,13 @@ For a smoother development experience, we **strongly recommend** using separate
VSCode's integrated terminal feature makes managing multiple terminals incredibly easy. Here's how to leverage it for frontend and backend separation: VSCode's integrated terminal feature makes managing multiple terminals incredibly easy. Here's how to leverage it for frontend and backend separation:
1. **Frontend Terminal (You likely already have this):** If you followed the Frontend Setup steps, you probably already have a terminal open in VSCode at the project root (`open-webui` directory) or within the `frontend` directory. This is where you'll run your frontend commands (`npm run dev`, etc.). Ensure you are in the `frontend` directory for the next steps if you are not already. 1. **Frontend Terminal (You likely already have this):** If you followed the Frontend Setup steps, you probably already have a terminal open in VSCode at the project root (`open-webui` directory). This is where you'll run your frontend commands (`npm run dev`, etc.). Ensure you are in the `open-webui` directory for the next steps if you are not already.
2. **Backend Terminal (Open a New One):** 2. **Backend Terminal (Open a New One):**
- In VSCode, go to **Terminal > New Terminal** (or use the shortcut `Ctrl+Shift+` on Windows/Linux or `Cmd+Shift+` on macOS). This will open a new integrated terminal panel. - In VSCode, go to **Terminal > New Terminal** (or use the shortcut `Ctrl+Shift+` on Windows/Linux or `Cmd+Shift+` on macOS). This will open a new integrated terminal panel.
- **Navigate to the `backend` directory:** In this *new* terminal, use the `cd backend` command to change the directory to the `backend` folder within your project. This ensures all backend-related commands are executed in the correct context. - **Navigate to the `backend` directory:** In this *new* terminal, use the `cd backend` command to change the directory to the `backend` folder within your project. This ensures all backend-related commands are executed in the correct context.
Now you have **two separate terminal instances within VSCode**: one for the frontend (likely in the `frontend` directory) and one specifically for the backend (inside the `backend` directory). You can easily switch between these terminals within VSCode to manage your frontend and backend processes independently. This setup is highly recommended for a cleaner and more efficient development workflow. Now you have **two separate terminal instances within VSCode**: one for the frontend (likely in the `open-webui` directory) and one specifically for the backend (inside the `backend` directory). You can easily switch between these terminals within VSCode to manage your frontend and backend processes independently. This setup is highly recommended for a cleaner and more efficient development workflow.
**Backend Setup Steps (in your *backend* terminal):** **Backend Setup Steps (in your *backend* terminal):**
@ -117,11 +119,13 @@ VSCode's integrated terminal feature makes managing multiple terminals incredibl
``` ```
- `conda create --name open-webui python=3.11`: This command creates a new Conda environment named `open-webui` using Python version 3.11. If you chose a different Python 3.11.x version, that's fine. - `conda create --name open-webui python=3.11`: This command creates a new Conda environment named `open-webui` using Python version 3.11. If you chose a different Python 3.11.x version, that's fine.
- `conda activate open-webui`: This command activates the newly created Conda environment. Once activated, your terminal prompt will usually change to indicate you are in the `open-webui` environment (e.g., it might show `(open-webui)` at the beginning of the line). **Make sure you activate the environment in your backend terminal before proceeding.** - `conda activate open-webui`: This command activates the newly created Conda environment. Once activated, your terminal prompt will usually change to indicate you are in the `open-webui` environment (e.g., it might show `(open-webui)` at the beginning of the line).
**Make sure you activate the environment in your backend terminal before proceeding.**
*(Using Conda is optional but strongly recommended for managing Python dependencies and avoiding conflicts.)* If you choose not to use Conda, ensure you are using Python 3.11 or higher and proceed to the next step, but be aware of potential dependency conflicts. *(Using Conda is optional but strongly recommended for managing Python dependencies and avoiding conflicts.)* If you choose not to use Conda, ensure you are using Python 3.11 or higher and proceed to the next step, but be aware of potential dependency conflicts.
3. **Install Backend Dependencies:** 1. **Install Backend Dependencies:**
- In your *backend* terminal (and with the Conda environment activated if you are using Conda), run: - In your *backend* terminal (and with the Conda environment activated if you are using Conda), run:
```bash ```bash
@ -130,7 +134,7 @@ VSCode's integrated terminal feature makes managing multiple terminals incredibl
This command uses `pip` (Python Package Installer) to read the `requirements.txt` file in the `backend` directory. `requirements.txt` lists all the Python libraries that the backend needs to run. `pip install` downloads and installs these libraries into your active Python environment (your Conda environment if you are using it, or your system-wide Python environment otherwise). The `-U` flag ensures you get the latest compatible versions of the libraries. This command uses `pip` (Python Package Installer) to read the `requirements.txt` file in the `backend` directory. `requirements.txt` lists all the Python libraries that the backend needs to run. `pip install` downloads and installs these libraries into your active Python environment (your Conda environment if you are using it, or your system-wide Python environment otherwise). The `-U` flag ensures you get the latest compatible versions of the libraries.
4. **Start the Backend Development Server:** 2. **Start the Backend Development Server:**
- In your *backend* terminal, run: - In your *backend* terminal, run:
```bash ```bash