diff --git a/vitallink/frontend/dashboard/src/App.jsx b/vitallink/frontend/dashboard/src/App.jsx
index d3b602b..3713c07 100644
--- a/vitallink/frontend/dashboard/src/App.jsx
+++ b/vitallink/frontend/dashboard/src/App.jsx
@@ -4,7 +4,7 @@ import PatientDetailModal from './PatientDetailModal';  // ADD THIS IMPORT
 
 const { Activity, AlertCircle, Clock, Users, Bell, Heart, Thermometer, Wind, CheckCircle, UserX } = LucideIcons;
 
-const API_BASE = 'http://${window.location.hostname}:8000';
+const API_BASE = `http://${window.location.hostname}:8000`;
 
 function App() {
   const [patients, setPatients] = useState([]);
diff --git a/vitallink/frontend/dashboard/src/PatientDetailModal.jsx b/vitallink/frontend/dashboard/src/PatientDetailModal.jsx
index f3a64e8..7d0bc03 100644
--- a/vitallink/frontend/dashboard/src/PatientDetailModal.jsx
+++ b/vitallink/frontend/dashboard/src/PatientDetailModal.jsx
@@ -2,7 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer, ReferenceLine } from 'recharts';
 import { X, TrendingUp, TrendingDown, Activity, Heart, Wind, Thermometer } from 'lucide-react';
 
-const API_BASE = 'http://${window.location.hostname}:8000';
+const API_BASE = `http://${window.location.hostname}:8000`;
 
 const PatientDetailModal = ({ patient, onClose }) => {
   const [vitalsHistory, setVitalsHistory] = useState([]);
diff --git a/vitallink/frontend/kiosk/src/App.jsx b/vitallink/frontend/kiosk/src/App.jsx
index 5b0938b..2f0d84a 100644
--- a/vitallink/frontend/kiosk/src/App.jsx
+++ b/vitallink/frontend/kiosk/src/App.jsx
@@ -3,7 +3,7 @@ import { AlertCircle, CheckCircle, Clock, User } from 'lucide-react';
 import Keyboard from "react-simple-keyboard";
 import "react-simple-keyboard/build/css/index.css";
 
-const API_BASE = 'http://${window.location.hostname}:8000';
+const API_BASE = `http://${window.location.hostname}:8000`;
 
 function App() {
   const [step, setStep] = useState('welcome');