diff --git a/application/controllers/api/frontend/v1/Navigation.php b/application/controllers/api/frontend/v1/Navigation.php
new file mode 100644
index 000000000..6cbbbd385
--- /dev/null
+++ b/application/controllers/api/frontend/v1/Navigation.php
@@ -0,0 +1,101 @@
+<?php
+/**
+ * Copyright (C) 2024 fhcomplete.org
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+if (! defined('BASEPATH')) exit('No direct script access allowed');
+
+/**
+ * This controller operates between (interface) the JS (GUI) and the NavigationLib (back-end)
+ * Provides data to the ajax get calls about the filter
+ * This controller works with JSON calls on the HTTP GET or POST and the output is always JSON
+ */
+class Navigation extends FHCAPI_Controller
+{
+	const NAVIGATION_PAGE_PARAM = 'navigation_page'; // Navigation page parameter name
+
+	/**
+	 * Loads the NavigationLib where the used logic lies
+	 */
+	public function __construct()
+    {
+        parent::__construct([
+        	'menu' => self::PERM_LOGGED,
+        	'header' => self::PERM_LOGGED
+        ]);
+
+		$this->_loadNavigationLib(); // Loads the NavigationLib with parameters
+	}
+
+	//------------------------------------------------------------------------------------------------------------------
+	// Public methods
+
+	/**
+	 * This function creates the left Menu for each Page
+	 * @param NAVIGATION_PAGE_PARAM GET Parameter witch holds the currently called Page
+	 * @return JSON object with the Menu Entries
+	 */
+	public function menu()
+	{
+		$menuArray = $this->navigationlib->getMenuArray($this->input->get(self::NAVIGATION_PAGE_PARAM));
+
+		$this->terminateWithSuccess($menuArray);
+	}
+
+	/**
+	 * This function creates the Top Menu for each Page
+	 * @param NAVIGATION_PAGE_PARAM GET Parameter witch holds the currently called Page
+	 * @return JSON object with the Menu Entries
+	 */
+	public function header()
+	{
+		$headerArray = $this->navigationlib->getHeaderArray($this->input->get(self::NAVIGATION_PAGE_PARAM));
+
+		$this->terminateWithSuccess($headerArray);
+	}
+
+	//------------------------------------------------------------------------------------------------------------------
+	// Private methods
+
+	/**
+	 * Loads the NavigationLib with the NAVIGATION_PAGE_PARAM parameter
+	 * If the parameter NAVIGATION_PAGE_PARAM is not given then the execution of the controller is terminated and
+	 * an error message is printed
+	 */
+	private function _loadNavigationLib()
+	{
+		// If the parameter NAVIGATION_PAGE_PARAM is present in the HTTP GET or POST
+		if (isset($_GET[self::NAVIGATION_PAGE_PARAM]) || isset($_POST[self::NAVIGATION_PAGE_PARAM]))
+		{
+			// If it is present in the HTTP GET
+			if (isset($_GET[self::NAVIGATION_PAGE_PARAM]))
+			{
+				$navigationPage = $this->input->get(self::NAVIGATION_PAGE_PARAM); // is retrieved from the HTTP GET
+			}
+			elseif (isset($_POST[self::NAVIGATION_PAGE_PARAM])) // Else if it is present in the HTTP POST
+			{
+				$navigationPage = $this->input->post(self::NAVIGATION_PAGE_PARAM); // is retrieved from the HTTP POST
+			}
+
+			// Loads the NavigationLib that contains all the used logic
+			$this->load->library('NavigationLib', array(self::NAVIGATION_PAGE_PARAM => $navigationPage));
+		}
+		else // Otherwise an error will be written in the output
+		{
+			show_error('Parameter "' . self::NAVIGATION_PAGE_PARAM . '" not provided!');
+		}
+	}
+}
diff --git a/application/controllers/system/Navigation.php b/application/controllers/system/Navigation.php
index c3764b612..71ab1c81b 100644
--- a/application/controllers/system/Navigation.php
+++ b/application/controllers/system/Navigation.php
@@ -22,6 +22,7 @@ if (! defined('BASEPATH')) exit('No direct script access allowed');
  * This controller operates between (interface) the JS (GUI) and the NavigationLib (back-end)
  * Provides data to the ajax get calls about the filter
  * This controller works with JSON calls on the HTTP GET or POST and the output is always JSON
+ * TODO(chris): deprecated
  */
 class Navigation extends FHC_Controller
 {
diff --git a/public/js/api/fhcapifactory.js b/public/js/api/fhcapifactory.js
index e0ea89211..2d3308e9f 100644
--- a/public/js/api/fhcapifactory.js
+++ b/public/js/api/fhcapifactory.js
@@ -1,7 +1,26 @@
+/**
+ * Copyright (C) 2024 fhcomplete.org
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
 import search from "./search.js";
 import phrasen from "./phrasen.js";
+import navigation from "./navigation.js";
 
 export default {
     search,
-    phrasen
+    phrasen,
+    navigation
 };
diff --git a/public/js/api/navigation.js b/public/js/api/navigation.js
new file mode 100644
index 000000000..05006331f
--- /dev/null
+++ b/public/js/api/navigation.js
@@ -0,0 +1,32 @@
+/**
+ * Copyright (C) 2024 fhcomplete.org
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program.  If not, see <https://www.gnu.org/licenses/>.
+ */
+
+export default {
+	getHeader(navigation_page) {
+		return this.$fhcApi.get(
+			'/api/frontend/v1/navigation/header',
+			{ navigation_page }
+		);
+	},
+	getMenu: function(navigation_page) {
+		return this.$fhcApi.get(
+			'/api/frontend/v1/navigation/menu',
+			{ navigation_page }
+		);
+	}
+};
+
diff --git a/public/js/components/navigation/API.js b/public/js/components/navigation/API.js
index 3e862a02c..8e2c66a7c 100644
--- a/public/js/components/navigation/API.js
+++ b/public/js/components/navigation/API.js
@@ -21,7 +21,7 @@ import {CoreRESTClient} from '../../RESTClient.js';
 const CORE_NAVIGATION_CMPT_TIMEOUT = 5000;
 
 /**
- *
+ * TODO(chris): deprecated
  */
 export const CoreNavigationAPIs = {
 	/**
diff --git a/public/js/components/navigation/Navigation.js b/public/js/components/navigation/Navigation.js
index 3b32fd38c..6bcd9baf5 100644
--- a/public/js/components/navigation/Navigation.js
+++ b/public/js/components/navigation/Navigation.js
@@ -1,5 +1,5 @@
 /**
- * Copyright (C) 2022 fhcomplete.org
+ * Copyright (C) 2024 fhcomplete.org
  *
  * This program is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License as published by
@@ -15,8 +15,6 @@
  * along with this program.  If not, see <https://www.gnu.org/licenses/>.
  */
 
-import {CoreNavigationAPIs} from './API.js';
-import {CoreRESTClient} from '../../RESTClient.js';
 import {CoreFetchCmpt} from '../../components/Fetch.js';
 
 /**
@@ -30,12 +28,12 @@ export const CoreNavigationCmpt = {
 		addHeaderMenuEntries: Object, // property used to add new header menu entries from another app/component
 		addSideMenuEntries: Object, // property used to add new side menu entries from another app/component
 		hideTopMenu: Boolean,
-                leftNavCssClasses: {
-                    type: String,
-                    default: 'navbar navbar-left-side'
-                }
+		leftNavCssClasses: {
+			type: String,
+			default: 'navbar navbar-left-side'
+		}
 	},
-	data: function() {
+	data() {
 		return {
 			headerMenu: {}, // header menu entries
 			sideMenu: {} // side menu entries
@@ -45,61 +43,63 @@ export const CoreNavigationCmpt = {
 		/**
 		 *
 		 */
-		headerMenuEntries: function() {
+		headerMenuEntries() {
 			//
+			let hm = this.headerMenu ? {...this.headerMenu} : {};
 			if (this.headerMenu != null && this.addHeaderMenuEntries != null && Object.keys(this.addHeaderMenuEntries).length > 0)
 			{
-				this.headerMenu[this.addHeaderMenuEntries.description] = this.addHeaderMenuEntries;
+				hm[this.addHeaderMenuEntries.description] = this.addHeaderMenuEntries;
 			}
-			return this.headerMenu;
+			return hm;
 		},
 		/**
 		 *
 		 */
-		sideMenuEntries: function() {
+		sideMenuEntries() {
 			//
+			let sm = this.sideMenu ? {...this.sideMenu} : {};
 			if (this.sideMenu != null && this.addSideMenuEntries != null && Object.keys(this.addSideMenuEntries).length > 0)
 			{
-				this.sideMenu[this.addSideMenuEntries.description] = this.addSideMenuEntries;
+				sm[this.addSideMenuEntries.description] = this.addSideMenuEntries;
 			}
-			return this.sideMenu;
+			return sm;
 		}
 	},
 	methods: {
 		/**
 		 *
 		 */
-		getNavigationPage: function() {
+		getNavigationPage() {
 			return FHC_JS_DATA_STORAGE_OBJECT.called_path + "/" + FHC_JS_DATA_STORAGE_OBJECT.called_method;
 		},
 		/**
 		 *
 		 */
-		fetchCmptApiFunctionHeader: function() {
-			return CoreNavigationAPIs.getHeader(this.getNavigationPage());
+		fetchCmptApiFunctionHeader() {
+			return this.$fhcApi.factory.navigation.getHeader(this.getNavigationPage());
 		},
 		/**
 		 *
 		 */
-		fetchCmptApiFunctionSideMenu: function() {
-			return CoreNavigationAPIs.getMenu(this.getNavigationPage());
+		fetchCmptApiFunctionSideMenu() {
+			return this.$fhcApi.factory.navigation.getMenu(this.getNavigationPage());
 		},
 		/**
 		 *
 		 */
-		fetchCmptDataFetchedHeader: function(data) {
-			if (CoreRESTClient.hasData(data)) this.headerMenu = CoreRESTClient.getData(data);
+		fetchCmptDataFetchedHeader(data) {
+			this.headerMenu = data || {};
 		},
 		/**
 		 *
 		 */
-		fetchCmptDataFetchedMenu: function(data) {
-			if (CoreRESTClient.hasData(data)) this.sideMenu = CoreRESTClient.getData(data);
+		fetchCmptDataFetchedMenu(data) {
+			this.sideMenu = data || {};
 		},
 		/**
 		 *
 		 */
-		getDataBsToggle: function(header) {
+		getDataBsToggle(header) {
 			return !header.children ? null : 'dropdown';
 		}
 	},