vaccination-system@0.0.0 dev
concurrently "npm run server" "npm run client"
(node:11780) [DEP0060] DeprecationWarning: The util._extend API is deprecated. Please use Object.assign() instead.
(Use node --trace-deprecation ... to show where the warning was created)
[0]
[0] > vaccination-system@0.0.0 server
[0] > cd server && node server.js
[0]
[1]
[1] > vaccination-system@0.0.0 client
[1] > vite
[1]
[1]
[1] VITE v4.5.14 ready in 664 ms
[1]
[1] ➜ Local: http://localhost:5173/
[1] ➜ Network: use --host to expose
[0] node:events:496
[0] throw er; // Unhandled 'error' event
[0] ^
[0]
[0] Error: listen EADDRINUSE: address already in use :::3000
[0] at Server.setupListenHandle [as _listen2] (node:net:1937:16)
[0] at listenInCluster (node:net:1994:12)
[0] at Server.listen (node:net:2099:7)
[0] at Function.listen (C:\Users\pc\Desktop\vaccination-system (1)\server\node_modules\express\lib\application.js:635:24)
[0] at Object.<anonymous> (C:\Users\pc\Desktop\vaccination-system (1)\server\server.js:50:5)
[0] at Module._compile (node:internal/modules/cjs/loader:1554:14)
[0] at Object..js (node:internal/modules/cjs/loader:1706:10)
[0] at Module.load (node:internal/modules/cjs/loader:1289:32)
[0] at Function._load (node:internal/modules/cjs/loader:1108:12)
[0] at TracingChannel.traceSync (node:diagnostics_channel:322:14)
[0] Emitted 'error' event on Server instance at:
[0] at emitErrorNT (node:net:1973:8)
[0] at process.processTicksAndRejections (node:internal/process/task_queues:90:21) {
[0] code: 'EADDRINUSE',
[0] errno: -4091,
[0] syscall: 'listen',
[0] address: '::',
[0] port: 3000
[0] }
[0]
[0] Node.js v22.14.0
[0] npm run server exited with code 1
The error shows that port 3000 is already in use, but there's also an issue with the server configuration. Let me fix this for you:
Quick Fix Steps
Step 1: Kill Processes Using the Ports
On Windows:
# Find processes using port 5000 and 3000
netstat -ano | findstr :5000
netstat -ano | findstr :3000
# Kill the process (replace <PID> with actual process ID)
taskkill /PID <PID> /FOn Mac/Linux:
# Kill processes on ports 5000 and 3000
sudo lsof -ti:5000 | xargs kill -9
sudo lsof -ti:3000 | xargs kill -9Step 2: Check Your .env File
Make sure your server/.env file has:
MONGODB_URI=your_mongodb_uri_here
JWT_SECRET=your_jwt_secret_here
PORT=5000
NODE_ENV=developmentStep 3: Restart the Application
# Stop any running processes (Ctrl+C)
# Then restart
npm run devAlternative: Use Different Ports
If you can't kill the processes, change the ports:
Option 1: Change Backend Port
In server/.env:
PORT=5001In vite.config.js:
proxy: {
"/api": {
target: "http://localhost:5001", // Changed from 5000 to 5001
changeOrigin: true,
},
},Option 2: Change Frontend Port
In vite.config.js:
server: {
port: 3001, // Changed from 5173 to 3001
proxy: {
"/api": {
target: "http://localhost:5000",
changeOrigin: true,
},
},
},Expected Output
After fixing, you should see:
[0] ✅ Connected to MongoDB
[0] 🚀 Server is running on port 5000
[0] 📍 API available at: http://localhost:5000/api
[0] 🏥 Health check: http://localhost:5000/api/health
[1]
[1] VITE v4.5.14 ready in 664 ms
[1]
[1] ➜ Local: http://localhost:5173/
[1] ➜ Network: use --host to exposeTest the Fix
- Check backend health:
Visit:
http://localhost:5000/api/health - Check frontend:
Visit:
http://localhost:5173 - Test API connection: The frontend should load without errors
The port conflict should now be resolved! 🎉
I can see the issue! Tailwind CSS is not loading at all - you're seeing raw HTML without any styling. Let me fix this step by step:
Fix Steps
Step 1: Stop the Server
# Press Ctrl+C to stop the current serverStep 2: Clean Install Dependencies
# Remove node_modules and package-lock.json
rm -rf node_modules package-lock.json
# Install dependencies
npm install
# Install Tailwind CSS specifically
npm install -D tailwindcss postcss autoprefixer
# Initialize Tailwind (this will overwrite the config if needed)
npx tailwindcss init -pStep 3: Verify File Structure
Make sure you have these files:
- ✅
src/index.css(with @import statements) - ✅
src/main.jsx(importing index.css) - ✅
tailwind.config.js - ✅
postcss.config.js - ✅
vite.config.js
Step 4: Restart the Development Server
npm run devStep 5: Check for the Green Test Box
After restarting, you should see:
- ✅ A green box in the top-right corner saying "Tailwind CSS is working!"
- ✅ Beautiful blue gradient background on the homepage
- ✅ Styled navigation bar
- ✅ Proper button styling
If Still Not Working
Check Browser Console
- Open browser developer tools (F12)
- Look for CSS-related errors
- Check if
index.cssis being loaded
Manual Verification
- Check if
src/index.cssexists and has the @import statements - Verify
src/main.jsximports./index.css - Ensure Tailwind config file exists
Alternative Quick Fix
If the above doesn't work, try this simpler approach:
# Create a new Tailwind setup
npm uninstall tailwindcss postcss autoprefixer
npm install -D tailwindcss@latest postcss@latest autoprefixer@latest
npx tailwindcss init -pThe styling should now work perfectly! You should see the beautiful blue gradient background and all the proper styling. 🎨✨
AggregateError [ECONNREFUSED]:
[1] at internalConnectMultiple (node:net:1139:18)
[1] at afterConnectMultiple (node:net:1712:7)
[1] 4:45:23 PM [vite] http proxy error: /api/auth/me
[1] AggregateError [ECONNREFUSED]:
[1] at internalConnectMultiple (node:net:1139:18)
[1] at afterConnectMultiple (node:net:1712:7)