diff --git a/.docker/web/.env_web b/.docker/web/.env_web
index 36cbb394..76dcfcb9 100644
--- a/.docker/web/.env_web
+++ b/.docker/web/.env_web
@@ -2,8 +2,11 @@
 NEXT_DB_NAME="squid"
 NEXT_DB_USER="appuser"
 NEXT_DB_PASS="appuser"
-NEXT_DB_HOST="localhost"
+NEXT_DB_HOST="api"
 NEXT_DB_PORT=23798
 
 # SQUID
-NEXT_SHIBUYA_GQL_ENDPOINT="http://localhost:4350/graphql"
+NEXT_SHIBUYA_GQL_ENDPOINT="http://api:4350/graphql"
+
+# DOCS
+NEXT_PUBLIC_DOCS_URL="http://localhost:3001"
diff --git a/README.md b/README.md
index 2e836481..adb31aed 100644
--- a/README.md
+++ b/README.md
@@ -34,7 +34,7 @@ To run the web app along with the Squid node, follow these steps:
 - If you prefer running the app without a local Squid node, you can do the following:
 
   1. Open the .env file.
-  2. Modify the NEXT_SHIBUYA_GQL_ENDPOINT variable to the provided test node.
+  2. Modify the NEXT_SHIBUYA_GQL_ENDPOINT variable to the provided test node, and also remove the NEXT_PUBLIC_DOCS_URL as the app will automatically redirect to the hosted docs page.
 
   ```
   NEXT_SHIBUYA_GQL_ENDPOINT="http://18.118.77.170:4350/graphql"
diff --git a/src/components/layout/TopBar.tsx b/src/components/layout/TopBar.tsx
index 45e36f69..228ec09f 100644
--- a/src/components/layout/TopBar.tsx
+++ b/src/components/layout/TopBar.tsx
@@ -4,6 +4,7 @@ import Image from "next/image";
 import Link from "next/link";
 
 import { ConnectButton } from "@/components/ModalWalletProvider/ConnectButton";
+import { DOCS_URL } from "@/config/app";
 import { ROUTES } from "@/config/routes";
 
 export function TopBar({
@@ -24,7 +25,7 @@ export function TopBar({
               height={50}
             />
           </Link>
-          <Link href="https://docs.xsigners.io/" target="_blank" rel="noopener">
+          <Link href={DOCS_URL} target="_blank" rel="noopener">
             <Typography
               variant="caption"
               color="primary"
diff --git a/src/config/app.ts b/src/config/app.ts
index 60a4749a..fdfcfe9c 100644
--- a/src/config/app.ts
+++ b/src/config/app.ts
@@ -2,3 +2,6 @@ export const IS_DEVELOPMENT =
   process.env.NODE_ENV === ("development" as string) ||
   process.env.NEXT_PUBLIC_VERCEL_ENV === "preview" ||
   process.env.NEXT_PUBLIC_VERCEL_ENV === "development";
+
+export const DOCS_URL =
+  process.env.NEXT_PUBLIC_DOCS_URL || "https://docs.xsigners.io/";