diff --git a/app/(main)/user/[id]/page.tsx b/app/(main)/user/[id]/page.tsx
index 16c11ef..a26ba8c 100644
--- a/app/(main)/user/[id]/page.tsx
+++ b/app/(main)/user/[id]/page.tsx
@@ -15,7 +15,7 @@ import { notFound } from "next/navigation"
 
 export default async function UserProfilePage({ params }: { params: Promise<{ id: string }> }) {
   const { id } = await params
-  const user = getUserById(id)
+  const user = await getUserById(id)
 
   if (!user) {
     notFound()
diff --git a/lib/api/users.ts b/lib/api/users.ts
index 59d4b39..bd55a6a 100644
--- a/lib/api/users.ts
+++ b/lib/api/users.ts
@@ -1,4 +1,5 @@
 import { httpJson } from "@/lib/api/http"
+import { isApiError } from "@/lib/errors"
 import { mockUsers } from "@/lib/mock"
 import type { User } from "@/lib/types"
 
@@ -6,8 +7,13 @@ export function listUsers() {
   return mockUsers
 }
 
-export function getUserById(userId: string) {
-  return mockUsers.find((user) => user.id === userId)
+export async function getUserById(userId: string): Promise<User | undefined> {
+  try {
+    return await httpJson<User>(`/api/v1/users/${userId}`)
+  } catch (err) {
+    if (isApiError(err) && err.code === 404) return undefined
+    throw err
+  }
 }
 
 export async function getCurrentUserForLogin(): Promise<User> {