Problem
src/config/api.js was created to centralize API configuration
but has three issues that make it broken and unused:
1. process.env is not supported in Vite
The file uses process.env.APP_SERVER_PORT to read the server
port. Vite uses import.meta.env so this always returns
undefined and falls back to 3001, ignoring any env variable.
2. Hardcoded localhost base URL
The base URL is hardcoded to http://localhost:3001. This breaks
outside local development in production or staging, the browser
ends up calling the developer's own machine instead of the actual
server.
3. The config file is dead code
Dashboard.jsx calls the backend using native fetch() directly.
Jobs.jsx calls the backend using axios directly. Neither file
imports or uses api.js making the config file pointless.
Proposed Fix
- Replace hardcoded localhost with relative path
/api so it works
in dev (Vite proxy) and production (Nginx) without any changes
- Create a single axios instance and export it from
api.js
- Refactor
Dashboard.jsx and Jobs.jsx to import and use the
centralized axios instance instead of calling fetch/axios directly
Problem
src/config/api.jswas created to centralize API configurationbut has three issues that make it broken and unused:
1.
process.envis not supported in ViteThe file uses
process.env.APP_SERVER_PORTto read the serverport. Vite uses
import.meta.envso this always returnsundefinedand falls back to3001, ignoring any env variable.2. Hardcoded localhost base URL
The base URL is hardcoded to
http://localhost:3001. This breaksoutside local development in production or staging, the browser
ends up calling the developer's own machine instead of the actual
server.
3. The config file is dead code
Dashboard.jsxcalls the backend using nativefetch()directly.Jobs.jsxcalls the backend usingaxiosdirectly. Neither fileimports or uses
api.jsmaking the config file pointless.Proposed Fix
/apiso it worksin dev (Vite proxy) and production (Nginx) without any changes
api.jsDashboard.jsxandJobs.jsxto import and use thecentralized axios instance instead of calling fetch/axios directly