diff --git a/web-app/src/hooks.server.ts b/web-app/src/hooks.server.ts
index 4e24146..b30a999 100644
--- a/web-app/src/hooks.server.ts
+++ b/web-app/src/hooks.server.ts
@@ -1,5 +1,5 @@
 import { redirect } from "@sveltejs/kit";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 
 export const handle = async ({ event, resolve }) => {
   if (!event.url.pathname.startsWith("/api/")) {
diff --git a/web-app/src/lib/server/utils.ts b/web-app/src/lib/server/utils.ts
new file mode 100644
index 0000000..09ecf6f
--- /dev/null
+++ b/web-app/src/lib/server/utils.ts
@@ -0,0 +1,3 @@
+import { dev } from "$app/environment";
+
+export const API_BASE_PREFIX = dev ? "http://localhost:3000" : `${process.env.ORIGIN}/api`;
diff --git a/web-app/src/lib/utils.ts b/web-app/src/lib/utils.ts
index 80c9929..1ef2bc6 100644
--- a/web-app/src/lib/utils.ts
+++ b/web-app/src/lib/utils.ts
@@ -113,7 +113,7 @@ export const md = markdownit({
   md.core.ruler.push("header_sections", addSections);
 });
 
-export const handleImagePaste = async (event: ClipboardEvent) => {
+export const handleImagePaste = async (event: ClipboardEvent, API_BASE_PREFIX: string) => {
   const clipboardItems = Array.from(event.clipboardData?.items || []);
   const file = clipboardItems.find((item) => item.type.startsWith("image/"));
 
@@ -145,6 +145,3 @@ export const handleImagePaste = async (event: ClipboardEvent) => {
 
   return newContent;
 };
-
-export const API_BASE_PREFIX = dev ? "http://localhost:3000" : `${import.meta.env.PUBLIC_ORIGIN}/api`;
-export const NGINX_BASE_PREFIX = dev ? "http://localhost:18000" : "";
diff --git a/web-app/src/routes/(anonymous)/login/+page.server.ts b/web-app/src/routes/(anonymous)/login/+page.server.ts
index 283c479..ce6245c 100644
--- a/web-app/src/routes/(anonymous)/login/+page.server.ts
+++ b/web-app/src/routes/(anonymous)/login/+page.server.ts
@@ -1,5 +1,5 @@
 import type { Actions } from "./$types";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 
 export const actions: Actions = {
   default: async ({ request, cookies, fetch }) => {
diff --git a/web-app/src/routes/(anonymous)/register/+page.server.ts b/web-app/src/routes/(anonymous)/register/+page.server.ts
index 82cd079..37fd576 100644
--- a/web-app/src/routes/(anonymous)/register/+page.server.ts
+++ b/web-app/src/routes/(anonymous)/register/+page.server.ts
@@ -1,5 +1,5 @@
 import type { Actions } from "./$types";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 
 export const actions: Actions = {
   default: async ({ request, fetch }) => {
diff --git a/web-app/src/routes/(authenticated)/+page.server.ts b/web-app/src/routes/(authenticated)/+page.server.ts
index d896d21..3c8679b 100644
--- a/web-app/src/routes/(authenticated)/+page.server.ts
+++ b/web-app/src/routes/(authenticated)/+page.server.ts
@@ -1,5 +1,5 @@
 import type { Actions, PageServerLoad } from "./$types";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 
 export const load: PageServerLoad = async ({ fetch, cookies, url, locals }) => {
   const searchQuery = url.searchParams.get("website_search_query");
diff --git a/web-app/src/routes/(authenticated)/account/+page.server.ts b/web-app/src/routes/(authenticated)/account/+page.server.ts
index 2177733..8630ac0 100644
--- a/web-app/src/routes/(authenticated)/account/+page.server.ts
+++ b/web-app/src/routes/(authenticated)/account/+page.server.ts
@@ -1,5 +1,5 @@
 import type { Actions, PageServerLoad } from "./$types";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 
 export const load: PageServerLoad = async ({ locals }) => {
   return {
diff --git a/web-app/src/routes/(authenticated)/website/[websiteId]/+layout.server.ts b/web-app/src/routes/(authenticated)/website/[websiteId]/+layout.server.ts
index b07969b..bcacb84 100644
--- a/web-app/src/routes/(authenticated)/website/[websiteId]/+layout.server.ts
+++ b/web-app/src/routes/(authenticated)/website/[websiteId]/+layout.server.ts
@@ -1,5 +1,5 @@
 import type { LayoutServerLoad } from "./$types";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 import { error } from "@sveltejs/kit";
 
 export const load: LayoutServerLoad = async ({ params, fetch, cookies }) => {
diff --git a/web-app/src/routes/(authenticated)/website/[websiteId]/+page.server.ts b/web-app/src/routes/(authenticated)/website/[websiteId]/+page.server.ts
index 9da5bbf..9e64d84 100644
--- a/web-app/src/routes/(authenticated)/website/[websiteId]/+page.server.ts
+++ b/web-app/src/routes/(authenticated)/website/[websiteId]/+page.server.ts
@@ -1,5 +1,5 @@
 import type { Actions, PageServerLoad } from "./$types";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 
 export const load: PageServerLoad = async ({ params, fetch, cookies, url }) => {
   const globalSettingsData = await fetch(
@@ -39,7 +39,8 @@ export const load: PageServerLoad = async ({ params, fetch, cookies, url }) => {
   return {
     globalSettings,
     header,
-    footer
+    footer,
+    API_BASE_PREFIX
   };
 };
 
diff --git a/web-app/src/routes/(authenticated)/website/[websiteId]/+page.svelte b/web-app/src/routes/(authenticated)/website/[websiteId]/+page.svelte
index de55ef1..fb018ef 100644
--- a/web-app/src/routes/(authenticated)/website/[websiteId]/+page.svelte
+++ b/web-app/src/routes/(authenticated)/website/[websiteId]/+page.svelte
@@ -5,7 +5,6 @@
   import SuccessOrError from "$lib/components/SuccessOrError.svelte";
   import type { ActionData, PageServerData } from "./$types";
   import Modal from "$lib/components/Modal.svelte";
-  import { API_BASE_PREFIX } from "$lib/utils";
 
   const { data, form } = $props<{ data: PageServerData; form: ActionData }>();
 
@@ -19,7 +18,7 @@
   };
 
   const handlePaste = async (event: ClipboardEvent) => {
-    const newContent = await handleImagePaste(event);
+    const newContent = await handleImagePaste(event, data.API_BASE_PREFIX);
     previewContent = newContent;
   };
 </script>
@@ -72,7 +71,7 @@
         {#if data.globalSettings.favicon_image}
           <Modal id="preview-favicon-global-{data.globalSettings.website_id}" text="Preview">
             <img
-              src={`${API_BASE_PREFIX}/rpc/retrieve_file?id=${data.globalSettings.favicon_image}`}
+              src={`${data.API_BASE_PREFIX}/rpc/retrieve_file?id=${data.globalSettings.favicon_image}`}
               alt=""
             />
           </Modal>
@@ -125,7 +124,10 @@
         </label>
         {#if data.header.logo_image}
           <Modal id="preview-logo-header-{data.header.website_id}" text="Preview">
-            <img src={`${API_BASE_PREFIX}/rpc/retrieve_file?id=${data.header.logo_image}`} alt="" />
+            <img
+              src={`${data.API_BASE_PREFIX}/rpc/retrieve_file?id=${data.header.logo_image}`}
+              alt=""
+            />
           </Modal>
         {/if}
       </div>
diff --git a/web-app/src/routes/(authenticated)/website/[websiteId]/articles/+page.server.ts b/web-app/src/routes/(authenticated)/website/[websiteId]/articles/+page.server.ts
index cfaa6e2..fa27ced 100644
--- a/web-app/src/routes/(authenticated)/website/[websiteId]/articles/+page.server.ts
+++ b/web-app/src/routes/(authenticated)/website/[websiteId]/articles/+page.server.ts
@@ -1,5 +1,5 @@
 import type { Actions, PageServerLoad } from "./$types";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 
 export const load: PageServerLoad = async ({ params, fetch, cookies, url, parent, locals }) => {
   const searchQuery = url.searchParams.get("article_search_query");
diff --git a/web-app/src/routes/(authenticated)/website/[websiteId]/articles/[articleId]/+page.server.ts b/web-app/src/routes/(authenticated)/website/[websiteId]/articles/[articleId]/+page.server.ts
index e5efe15..d1fc13b 100644
--- a/web-app/src/routes/(authenticated)/website/[websiteId]/articles/[articleId]/+page.server.ts
+++ b/web-app/src/routes/(authenticated)/website/[websiteId]/articles/[articleId]/+page.server.ts
@@ -1,5 +1,5 @@
 import type { Actions, PageServerLoad } from "./$types";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 
 export const load: PageServerLoad = async ({ parent, params, cookies, fetch }) => {
   const articleData = await fetch(`${API_BASE_PREFIX}/article?id=eq.${params.articleId}`, {
@@ -14,7 +14,7 @@ export const load: PageServerLoad = async ({ parent, params, cookies, fetch }) =
   const article = await articleData.json();
   const { website } = await parent();
 
-  return { website, article };
+  return { website, article, API_BASE_PREFIX };
 };
 
 export const actions: Actions = {
diff --git a/web-app/src/routes/(authenticated)/website/[websiteId]/articles/[articleId]/+page.svelte b/web-app/src/routes/(authenticated)/website/[websiteId]/articles/[articleId]/+page.svelte
index f6aff4f..642509d 100644
--- a/web-app/src/routes/(authenticated)/website/[websiteId]/articles/[articleId]/+page.svelte
+++ b/web-app/src/routes/(authenticated)/website/[websiteId]/articles/[articleId]/+page.svelte
@@ -5,7 +5,7 @@
   import SuccessOrError from "$lib/components/SuccessOrError.svelte";
   import type { ActionData, PageServerData } from "./$types";
   import Modal from "$lib/components/Modal.svelte";
-  import { API_BASE_PREFIX, handleImagePaste } from "$lib/utils";
+  import { handleImagePaste } from "$lib/utils";
 
   const { data, form } = $props<{ data: PageServerData; form: ActionData }>();
 
@@ -19,7 +19,7 @@
   };
 
   const handlePaste = async (event: ClipboardEvent) => {
-    const newContent = await handleImagePaste(event);
+    const newContent = await handleImagePaste(event, data.API_BASE_PREFIX);
     previewContent = newContent;
   };
 </script>
@@ -86,7 +86,7 @@
         {#if data.article.cover_image}
           <Modal id="preview-cover-article-{data.article.id}" text="Preview">
             <img
-              src={`${API_BASE_PREFIX}/rpc/retrieve_file?id=${data.article.cover_image}`}
+              src={`${data.API_BASE_PREFIX}/rpc/retrieve_file?id=${data.article.cover_image}`}
               alt=""
             />
           </Modal>
diff --git a/web-app/src/routes/(authenticated)/website/[websiteId]/collaborators/+page.server.ts b/web-app/src/routes/(authenticated)/website/[websiteId]/collaborators/+page.server.ts
index ed782b6..863b0d9 100644
--- a/web-app/src/routes/(authenticated)/website/[websiteId]/collaborators/+page.server.ts
+++ b/web-app/src/routes/(authenticated)/website/[websiteId]/collaborators/+page.server.ts
@@ -1,5 +1,5 @@
 import type { Actions, PageServerLoad } from "./$types";
-import { API_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 
 export const load: PageServerLoad = async ({ parent, params, fetch, cookies }) => {
   const { website, home } = await parent();
diff --git a/web-app/src/routes/(authenticated)/website/[websiteId]/publish/+page.server.ts b/web-app/src/routes/(authenticated)/website/[websiteId]/publish/+page.server.ts
index a6eee6f..9799910 100644
--- a/web-app/src/routes/(authenticated)/website/[websiteId]/publish/+page.server.ts
+++ b/web-app/src/routes/(authenticated)/website/[websiteId]/publish/+page.server.ts
@@ -2,12 +2,13 @@ import { readFile, mkdir, writeFile } from "node:fs/promises";
 import { join } from "node:path";
 import { md } from "$lib/utils";
 import type { Actions, PageServerLoad } from "./$types";
-import { API_BASE_PREFIX, NGINX_BASE_PREFIX } from "$lib/utils";
+import { API_BASE_PREFIX } from "$lib/server/utils";
 import { render } from "svelte/server";
 import BlogIndex from "$lib/templates/blog/BlogIndex.svelte";
 import BlogArticle from "$lib/templates/blog/BlogArticle.svelte";
 import DocsIndex from "$lib/templates/docs/DocsIndex.svelte";
 import DocsEntry from "$lib/templates/docs/DocsEntry.svelte";
+import { dev } from "$app/environment";
 
 export const load: PageServerLoad = async ({ params, fetch, cookies }) => {
   const websiteOverviewData = await fetch(
@@ -26,7 +27,7 @@ export const load: PageServerLoad = async ({ params, fetch, cookies }) => {
 
   generateStaticFiles(websiteOverview);
 
-  const websitePreviewUrl = `${NGINX_BASE_PREFIX}/previews/${websiteOverview.id}/index.html`;
+  const websitePreviewUrl = `${dev ? "http://localhost:18000" : ""}/previews/${websiteOverview.id}/index.html`;
 
   return {
     websiteOverview,