Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/Minogar28/DIRECTORIO_UDC/llms.txt

Use this file to discover all available pages before exploring further.

Directorio UDC uses environment variables to control runtime behaviour — including the port the Express server binds to and the API base URL that the React frontend uses when making requests. Both the BACKEND and FRONTEND packages read from their own .env file, which you create locally and never commit to version control.

Backend Environment Variables

The Express backend reads environment variables directly from process.env at startup. The following variable is recognised:
VariableDescriptionDefault
PORTThe port the Express server listens on3000
You can override PORT inline when starting the server:
PORT=4000 node index.js
Or, more conveniently, create a .env file in the BACKEND directory. The BACKEND/.gitignore already excludes both node_modules and .env, so this file will never be accidentally committed:
PORT=3000
If you add a dotenv-compatible loader (such as the dotenv package) to the backend, the .env file is picked up automatically at startup. Without a loader, set variables in your shell or in your deployment platform’s environment settings.

Frontend Environment Variables

Vite exposes environment variables to the client bundle through import.meta.env. Only variables whose names are prefixed with VITE_ are injected into the browser bundle — all others remain server-side.
VariableDescriptionExample value
VITE_API_URLThe base URL of the Express backend APIhttp://localhost:3000
Create a .env file in the FRONTEND directory:
VITE_API_URL=http://localhost:3000
Then reference it anywhere in your React source:
const apiUrl = import.meta.env.VITE_API_URL
const response = await fetch(`${apiUrl}/api/spaces`)
Only variables prefixed with VITE_ are exposed to browser code. Never put secrets — API keys, database passwords, OAuth client secrets — in frontend .env files. They will be embedded in the JavaScript bundle and visible to anyone who opens DevTools.

Vite Modes

Vite has a built-in concept of modes that controls which .env file is loaded and how the bundle is optimised:
  • development mode is active when you run npm run dev. import.meta.env.DEV is true and source maps are enabled.
  • production mode is active when you run npm run build. import.meta.env.PROD is true, the bundle is minified, and dead-code elimination runs at full strength.
You can also create custom modes for staging or QA by adding .env.[mode] files (e.g. .env.staging) and passing --mode staging to the Vite CLI. The standard Vite built-in environment variables always available in your code are:
VariableValue
import.meta.env.MODE"development" or "production"
import.meta.env.DEVtrue in dev mode
import.meta.env.PRODtrue in production build
import.meta.env.BASE_URLThe base URL of the deployed app
Restart the Vite dev server after changing any .env file — Vite reads environment variables once at startup and does not hot-reload them. Simply stop the process with Ctrl+C and run npm run dev again.

Build docs developers (and LLMs) love