diff --git a/frontend/src/main.rs b/frontend/src/main.rs
index 61c1c19..dfc36e6 100644
--- a/frontend/src/main.rs
+++ b/frontend/src/main.rs
@@ -29,6 +29,30 @@ pub enum Route {
     NotFound,
 }
 
+pub struct APIEndpoints {}
+
+impl APIEndpoints {
+    pub fn get_base() -> String {
+        std::env::var("BASE_URL").unwrap_or("http://127.0.0.1:8000/api/v1".into())
+    }
+
+    pub fn get_dirs() -> String {
+        format!("{}/get", Self::get_base())
+    }
+
+    pub fn get_configs(dir_name: &str) -> String {
+        format!("{}/get/{}", Self::get_base(), dir_name)
+    }
+
+    pub fn generate() -> String {
+        format!("{}/generate", Self::get_base())
+    }
+
+    pub fn get_contents(dir_name: &str, file_name: &str) -> String {
+        format!("{}/get/{}/{}", Self::get_base(), dir_name, file_name)
+    }
+}
+
 #[derive(Properties, PartialEq)]
 pub struct NavProps {
     #[prop_or("".into())]
@@ -63,7 +87,7 @@ fn navbar(props: &NavProps) -> Html {
                 if has_dir {
                     <li class={
                         match props.currrent_route.clone() {
-                            Route::Configs{dir_name} if dir_name == props.currrent_dir.to_string() => classes_active,
+                            Route::Configs{dir_name} if dir_name == props.currrent_dir => classes_active,
                             _ => classes_inactive,
                         }
                     }><Link<Route> to={Route::Configs{dir_name: props.currrent_dir.to_string()}}>{ props.currrent_dir.clone() }</Link<Route>></li>
@@ -86,11 +110,10 @@ fn directories() -> Html {
         let dirs = dirs.clone();
         let message = message.clone();
         Callback::from(move |_| {
-            let url = "http://127.0.0.1:8000/api/v1/get/";
             let dirs = dirs.clone();
             let message = message.clone();
             spawn_local(async move {
-                match Request::get(url).send().await {
+                match Request::get(APIEndpoints::get_dirs().as_ref()).send().await {
                     Ok(response) if response.ok() => match response.json::<Vec<String>>().await {
                         Ok(mut json) => {
                             json.sort();
@@ -109,7 +132,6 @@ fn directories() -> Html {
         let get_dirs = get_dirs.clone();
         use_effect_with((), move |_| {
             get_dirs.emit(());
-            ()
         });
     }
 
@@ -164,7 +186,7 @@ fn configs(props: &ConfigsProps) -> Html {
         let configs = configs.clone();
         let message = message.clone();
         Callback::from(move |_| {
-            let url = format!("http://127.0.0.1:8000/api/v1/get/{}", dir_name.clone());
+            let url = APIEndpoints::get_configs(dir_name.clone().as_str());
             let configs = configs.clone();
             let message = message.clone();
             spawn_local(async move {
@@ -186,7 +208,6 @@ fn configs(props: &ConfigsProps) -> Html {
         let get_configs_clone = get_configs.clone();
         use_effect_with((), move |_| {
             get_configs_clone.emit(());
-            ()
         });
     }
 
@@ -242,11 +263,8 @@ fn config(props: &ConfigProps) -> Html {
     let get_contents = {
         let contents = contents.clone();
         Callback::from(move |_| {
-            let url = format!(
-                "http://127.0.0.1:8000/api/v1/get/{}/{}",
-                dir_name.clone(),
-                file_name.clone()
-            );
+            let url =
+                APIEndpoints::get_contents(dir_name.clone().as_str(), file_name.clone().as_str());
             let contents = contents.clone();
             spawn_local(async move {
                 match Request::get(&url).send().await {
@@ -265,7 +283,6 @@ fn config(props: &ConfigProps) -> Html {
         let get_contents_clone = get_contents.clone();
         use_effect_with((), move |_| {
             get_contents_clone.emit(());
-            ()
         });
     }
 
@@ -321,12 +338,11 @@ fn generate(props: &GenerateProps) -> Html {
                 common_name: config_name.clone().to_string(),
             };
             let json_payload = serde_json::to_string(&request_body).unwrap();
-            let url = "http://127.0.0.1:8000/api/v1/generate/";
             let result = result.clone();
             let done = done.clone();
             let error = error.clone();
             spawn_local(async move {
-                match Request::post(url)
+                match Request::post(APIEndpoints::generate().as_str())
                     .header("Content-Type", "application/json")
                     .body(json_payload)
                     .unwrap()