diff --git a/env/client.ts b/env/client.ts
index c9690d29e..678173613 100644
--- a/env/client.ts
+++ b/env/client.ts
@@ -1,8 +1,8 @@
 import { createEnv } from "@t3-oss/env-nextjs"
-// import { z } from "zod";
+import { z } from "zod"
 
 export const env = createEnv({
-  client: {},
+  client: { NEXT_PUBLIC_PORT: z.string().optional() },
   emptyStringAsUndefined: true,
-  runtimeEnv: {},
+  runtimeEnv: { NEXT_PUBLIC_PORT: process.env.PORT },
 })
diff --git a/lib/trpc/Provider.tsx b/lib/trpc/Provider.tsx
index 53bfd03d0..1c61c6885 100644
--- a/lib/trpc/Provider.tsx
+++ b/lib/trpc/Provider.tsx
@@ -3,7 +3,7 @@
 import { useState } from "react"
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query"
 import { httpBatchLink } from "@trpc/client"
-
+import { env } from "@/env/client"
 import { api } from "./client"
 import { transformer } from "@/server/transformer"
 
@@ -15,7 +15,7 @@ function initializeTrpcClient() {
         /**
          * This is locally in Next.js
          */
-        url: "http://localhost:3000/api/trpc",
+        url: `http://localhost:${env.NEXT_PUBLIC_PORT}/api/trpc`,
       }),
     ],
   })