diff --git a/src/config.yml b/src/config.yml
index 9d097dd..622269d 100644
--- a/src/config.yml
+++ b/src/config.yml
@@ -2,16 +2,24 @@ title: 'Hello World !!'
 subtitle: 'actually, I am a new pilot.'
 
 services:
-  cloud:
-    title: '/Cloud'
-    subtitle: 'Private Cloud Utilities'
-    icon: 'fas fa-cloud'
-    items:
-      nas:
-        title: 'NAS'
-        subtitle: 'Network Attached Storage'
-        icon: 'fas fa-hard-drive'
-        target: '_blank'
-        url: '/NAS'
-        type: 'hello'
-        keywords: 'cloud storage files'
+    cloud:
+        title: '/Cloud'
+        subtitle: 'Private Cloud Utilities'
+        icon: 'fas fa-cloud'
+        items:
+            nas:
+                title: 'NAS'
+                subtitle: 'Network Attached Storage'
+                icon: 'fas fa-hard-drive'
+                target: '_blank'
+                url: '/NAS'
+                keywords: 'cloud storage files'
+                type: prowlarr
+            pihole:
+                title: 'PiHole'
+                subtitle: 'A DNS Hole'
+                icon: 'fas fa-hard-drive'
+                target: '_blank'
+                url: '/pihole'
+                type: 'pihole'
+                keywords: 'cloud storage files'
diff --git a/src/hooks.server.ts b/src/hooks.server.ts
new file mode 100644
index 0000000..962e18c
--- /dev/null
+++ b/src/hooks.server.ts
@@ -0,0 +1,3 @@
+import { initServices } from '$lib/services/services';
+
+await initServices();
diff --git a/src/lib/services/generic/GenericServiceCard.svelte b/src/lib/services/generic/GenericServiceCard.svelte
deleted file mode 100644
index dcb3c40..0000000
--- a/src/lib/services/generic/GenericServiceCard.svelte
+++ /dev/null
@@ -1,9 +0,0 @@
-<script lang="ts">
-	import type { ServiceConfig } from '$lib/config';
-
-	export let data: ServiceConfig;
-</script>
-
-<div class="service-card">
-	<title>{data.title}</title>
-</div>
diff --git a/src/lib/services/pihole/+service.ts b/src/lib/services/pihole/+service.ts
new file mode 100644
index 0000000..14da7a3
--- /dev/null
+++ b/src/lib/services/pihole/+service.ts
@@ -0,0 +1,9 @@
+import { type ServiceHandler } from '../service';
+
+export const handle: ServiceHandler = ({ config }) => {
+	const data = {};
+	if (config.apikey != undefined) {
+		//TODO: fetch data
+	}
+	return { data, componentPath: 'pihole/PiHoleContent.svelte' };
+};
diff --git a/src/lib/services/pihole/PiHoleContent.svelte b/src/lib/services/pihole/PiHoleContent.svelte
new file mode 100644
index 0000000..11d70c1
--- /dev/null
+++ b/src/lib/services/pihole/PiHoleContent.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+	export const data = undefined;
+</script>
+
+<p>pihole status</p>
diff --git a/src/lib/services/prowlarr/+service.ts b/src/lib/services/prowlarr/+service.ts
new file mode 100644
index 0000000..561cf4e
--- /dev/null
+++ b/src/lib/services/prowlarr/+service.ts
@@ -0,0 +1,5 @@
+import type { ServiceHandler } from '../service';
+
+export const handle: ServiceHandler = () => {
+	return { data: {}, componentPath: 'prowlarr/ProwlarrContent.svelte' };
+};
diff --git a/src/lib/services/prowlarr/ProwlarrContent.svelte b/src/lib/services/prowlarr/ProwlarrContent.svelte
new file mode 100644
index 0000000..32b5022
--- /dev/null
+++ b/src/lib/services/prowlarr/ProwlarrContent.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+	export const data = undefined;
+</script>
+
+<p>Prowlarr content</p>
diff --git a/src/lib/services/service.ts b/src/lib/services/service.ts
index 6d09a3b..c344ccc 100644
--- a/src/lib/services/service.ts
+++ b/src/lib/services/service.ts
@@ -5,26 +5,7 @@ interface ServiceHandlerArgs {
 	config: ServiceConfig;
 }
 
-export type ServiceHandler = (input: Partial<ServiceHandlerArgs>) => {
+export type ServiceHandler = (input: ServiceHandlerArgs) => {
 	data: Record<string, unknown>;
 	componentPath: string;
 };
-
-const services: Record<string, [ServiceHandler, string]> = {};
-
-export function registerService(type: string, handler: ServiceHandler) {
-	services[type] = [handler, type];
-}
-
-export function getService(type: string): [ServiceHandler, string] {
-	const handler = services[type];
-	if (handler == undefined) {
-		return [
-			() => {
-				return { data: {}, componentPath: 'generic/GenericServiceCard.svelte' };
-			},
-			'generic'
-		];
-	}
-	return handler;
-}
diff --git a/src/lib/services/services.ts b/src/lib/services/services.ts
new file mode 100644
index 0000000..9e75b32
--- /dev/null
+++ b/src/lib/services/services.ts
@@ -0,0 +1,33 @@
+import type { ServiceHandler } from './service';
+
+const services: Record<string, [ServiceHandler, string]> = {};
+
+function registerService(type: string, handler: ServiceHandler) {
+	services[type] = [handler, type];
+}
+
+export function getService(type: string): [ServiceHandler, string] {
+	const handler = services[type];
+	if (handler == undefined) {
+		return [
+			() => {
+				return { data: {}, componentPath: '' };
+			},
+			''
+		];
+	}
+	return handler;
+}
+
+export async function initServices() {
+	const services = import.meta.glob('/src/lib/services/**/+service.ts');
+
+	for (const [path, load] of Object.entries(services)) {
+		const { handle } = (await load()) as any;
+		if (handle == undefined) {
+			continue;
+		}
+		const typeName = path.slice(18, -12);
+		registerService(typeName, handle);
+	}
+}
diff --git a/src/routes/+page.server.ts b/src/routes/+page.server.ts
index 00b15f2..b1339a7 100644
--- a/src/routes/+page.server.ts
+++ b/src/routes/+page.server.ts
@@ -3,7 +3,7 @@ import { config, stripPrivateFields, type Config, type ServiceConfig } from '$li
 import type { PageServerLoad } from './$types';
 import * as yml from 'js-yaml';
 import { readFile } from 'fs/promises';
-import { getService } from '$lib/services/service';
+import { getService } from '$lib/services/services';
 
 async function reloadConfig(): Promise<Config> {
 	if (dev) {
@@ -34,6 +34,7 @@ export const load: PageServerLoad = async ({ fetch, depends }) => {
 			const clientService = clientGroup.items[service] as ServiceConfig;
 
 			const [handler, type] = getService(serverService.type || '');
+
 			clientService.type = type;
 			Object.assign(clientService, handler({ fetch, config: serverService }));
 		}
diff --git a/src/routes/+page.ts b/src/routes/+page.ts
index 7979d63..c546c8b 100644
--- a/src/routes/+page.ts
+++ b/src/routes/+page.ts
@@ -12,18 +12,23 @@ export const load: PageLoad = async ({ data }) => {
 		);
 		for (const s of services) {
 			const service = data.config.services[group].items[s];
-
-			if (components[service.type || 'generic'] != undefined) {
+			if (service.componentPath == '' || service.type == '') {
+				delete service.componentPath;
 				continue;
 			}
 
-			const path =
-				'../lib/services/' + (service.componentPath || 'generic/GenericServiceCard.svelte');
+			const componentType = service.type || '';
+			if (components[componentType] != undefined) {
+				continue;
+			}
+
+			const path = '../lib/services/' + service.componentPath;
+
 			const module = await import(/* @vite-ignore */ path);
 
-			components[service.type || 'generic'] = module.default;
+			components[componentType] = module.default;
 
-			delete service.componentPath;
+			//service.componentPath = undefined;
 		}
 	}