diff --git a/apps/web/src/api/charts.ts b/apps/web/src/api/charts.ts
index 9d88b8b0..39ff3cce 100644
--- a/apps/web/src/api/charts.ts
+++ b/apps/web/src/api/charts.ts
@@ -7,7 +7,7 @@ export const getScrobblesChart = () => {
 
 export const getSongChart = async (uri: string) => {
   const response = await axios.get(
-    `${API_URL}/public/scrobbleschart?songuri=${uri}`
+    `${API_URL}/xrpc/app.rocksky.charts.getScrobblesChart?songuri=${uri}`
   );
   if (response.status !== 200) {
     return [];
@@ -17,7 +17,7 @@ export const getSongChart = async (uri: string) => {
 
 export const getArtistChart = async (uri: string) => {
   const response = await axios.get(
-    `${API_URL}/public/scrobbleschart?artisturi=${uri}`
+    `${API_URL}/xrpc/app.rocksky.charts.getScrobblesChart?artisturi=${uri}`
   );
   if (response.status !== 200) {
     return [];
@@ -27,7 +27,7 @@ export const getArtistChart = async (uri: string) => {
 
 export const getAlbumChart = async (uri: string) => {
   const response = await axios.get(
-    `${API_URL}/public/scrobbleschart?albumuri=${uri}`
+    `${API_URL}/xrpc/app.rocksky.charts.getScrobblesChart?albumuri=${uri}`
   );
   if (response.status !== 200) {
     return [];
@@ -37,7 +37,7 @@ export const getAlbumChart = async (uri: string) => {
 
 export const getProfileChart = async (did: string) => {
   const response = await axios.get(
-    `${API_URL}/public/scrobbleschart?did=${did}`
+    `${API_URL}/xrpc/app.rocksky.charts.getScrobblesChart?did=${did}`
   );
   if (response.status !== 200) {
     return [];
diff --git a/apps/web/src/api/index.ts b/apps/web/src/api/index.ts
new file mode 100644
index 00000000..48c81b89
--- /dev/null
+++ b/apps/web/src/api/index.ts
@@ -0,0 +1,6 @@
+import axios from "axios";
+import { API_URL } from "../consts";
+
+export const client = axios.create({
+  baseURL: API_URL,
+});
diff --git a/apps/web/src/api/profile.ts b/apps/web/src/api/profile.ts
index 050b8f0e..84428cec 100644
--- a/apps/web/src/api/profile.ts
+++ b/apps/web/src/api/profile.ts
@@ -8,7 +8,10 @@ export const getProfileByDid = async (did: string) => {
 };
 
 export const getProfileStatsByDid = async (did: string) => {
-  const response = await axios.get(`${API_URL}/users/${did}/stats`);
+  const response = await axios.get(
+    `${API_URL}/xrpc/app.rocksky.stats.getStats`,
+    { params: { did } }
+  );
   return response.data;
 };
 
@@ -18,7 +21,8 @@ export const getRecentTracksByDid = async (
   size = 10
 ): Promise<Scrobble[]> => {
   const response = await axios.get<Scrobble[]>(
-    `${API_URL}/users/${did}/scrobbles?size=${size}&offset=${offset}`
+    `${API_URL}/users/${did}/scrobbles`,
+    { params: { size, offset } }
   );
   return response.data;
 };
diff --git a/apps/web/src/hooks/useChart.tsx b/apps/web/src/hooks/useChart.tsx
index 8a2699ae..81654b81 100644
--- a/apps/web/src/hooks/useChart.tsx
+++ b/apps/web/src/hooks/useChart.tsx
@@ -1,40 +1,47 @@
 import { useQuery } from "@tanstack/react-query";
-import axios from "axios";
 import useSWR from "swr";
-import { getArtistChart, getSongChart } from "../api/charts";
+import { client } from "../api";
+import {
+  getAlbumChart,
+  getArtistChart,
+  getProfileChart,
+  getSongChart,
+} from "../api/charts";
 import { API_URL } from "../consts";
 
 export const useScrobblesChartQuery = () =>
   useQuery({
     queryKey: ["scrobblesChart"],
-    queryFn: () =>
-      fetch(`${API_URL}/public/scrobbleschart`, {
-        method: "GET",
-      }).then((res) => res.json()),
+    queryFn: () => client.get("/xrpc/app.rocksky.charts.getScrobblesChart"),
+    select: ({ data }) => data.scrobbles || [],
   });
 
 export const useSongChartQuery = (uri: string) =>
   useQuery({
     queryKey: ["songChart", uri],
     queryFn: () => getSongChart(uri),
+    select: (data) => data.scrobbles || [],
   });
 
 export const useArtistChartQuery = (uri: string) =>
   useQuery({
     queryKey: ["artistChart", uri],
     queryFn: () => getArtistChart(uri),
+    select: (data) => data.scrobbles || [],
   });
 
 export const useAlbumChartQuery = (uri: string) =>
   useQuery({
     queryKey: ["albumChart", uri],
-    queryFn: () => getArtistChart(uri),
+    queryFn: () => getAlbumChart(uri),
+    select: (data) => data.scrobbles || [],
   });
 
 export const useProfileChartQuery = (did: string) =>
   useQuery({
     queryKey: ["profileChart", did],
-    queryFn: () => getArtistChart(did),
+    queryFn: () => getProfileChart(did),
+    select: (data) => data.scrobbles || [],
   });
 
 function useChart() {
@@ -43,50 +50,57 @@ function useChart() {
       method: "GET",
     }).then((res) => res.json());
 
-  const { data: scrobblesChart } = useSWR("/public/scrobbleschart", fetcher);
+  const { data: scrobblesChart } = useSWR(
+    "/xrpc/app.rocksky.charts.getScrobblesChart",
+    fetcher
+  );
 
   const getScrobblesChart = () => {
-    return scrobblesChart || [];
+    return scrobblesChart?.scrobbles || [];
   };
 
   const getSongChart = async (uri: string) => {
-    const response = await axios.get(
-      `${API_URL}/public/scrobbleschart?songuri=${uri}`
+    const response = await client.get(
+      "/xrpc/app.rocksky.charts.getScrobblesChart",
+      { params: { songuri: uri } }
     );
     if (response.status !== 200) {
       return [];
     }
-    return response.data;
+    return response.data.scrobbles;
   };
 
   const getArtistChart = async (uri: string) => {
-    const response = await axios.get(
-      `${API_URL}/public/scrobbleschart?artisturi=${uri}`
+    const response = await client.get(
+      "/xrpc/app.rocksky.charts.getScrobblesChart",
+      { params: { artisturi: uri } }
     );
     if (response.status !== 200) {
       return [];
     }
-    return response.data;
+    return response.data.scrobbles;
   };
 
   const getAlbumChart = async (uri: string) => {
-    const response = await axios.get(
-      `${API_URL}/public/scrobbleschart?albumuri=${uri}`
+    const response = await client.get(
+      "/xrpc/app.rocksky.charts.getScrobblesChart",
+      { params: { albumuri: uri } }
     );
     if (response.status !== 200) {
       return [];
     }
-    return response.data;
+    return response.data.scrobbles;
   };
 
   const getProfileChart = async (did: string) => {
-    const response = await axios.get(
-      `${API_URL}/public/scrobbleschart?did=${did}`
+    const response = await client.get(
+      "/xrpc/app.rocksky.charts.getScrobblesChart",
+      { params: { did } }
     );
     if (response.status !== 200) {
       return [];
     }
-    return response.data;
+    return response.data.scrobbles;
   };
 
   return {
diff --git a/apps/web/src/hooks/useFeed.tsx b/apps/web/src/hooks/useFeed.tsx
index da49ee6d..826b4a8c 100644
--- a/apps/web/src/hooks/useFeed.tsx
+++ b/apps/web/src/hooks/useFeed.tsx
@@ -1,15 +1,16 @@
 import { useQuery } from "@tanstack/react-query";
+import { client } from "../api";
 import { getFeedByUri } from "../api/feed";
-import { API_URL } from "../consts";
 
-export const useFeedQuery = (size = 114) =>
+export const useFeedQuery = (limit = 114) =>
   useQuery({
     queryKey: ["feed"],
     queryFn: () =>
-      fetch(`${API_URL}/public/scrobbles?size=${size}`, {
-        method: "GET",
-      }).then((res) => res.json()),
+      client.get("/xrpc/app.rocksky.scrobble.getScrobbles", {
+        params: { limit },
+      }),
     refetchInterval: 5000,
+    select: (res) => res.data.scrobbles || [],
   });
 
 export const useFeedByUriQuery = (uri: string) =>
diff --git a/apps/web/src/hooks/useNowPlaying.tsx b/apps/web/src/hooks/useNowPlaying.tsx
index 362ff632..f9b2fd82 100644
--- a/apps/web/src/hooks/useNowPlaying.tsx
+++ b/apps/web/src/hooks/useNowPlaying.tsx
@@ -1,27 +1,29 @@
 import { useQuery } from "@tanstack/react-query";
-import { API_URL } from "../consts";
+import { client } from "../api";
 
 export type NowPlayings = {
   id: string;
   title: string;
   artist: string;
-  album_art: string;
-  artist_uri?: string;
+  albumArt: string;
+  artistUri?: string;
   uri: string;
   avatar: string;
   handle: string;
   did: string;
-  created_at: string;
-  track_id: string;
-  track_uri: string;
+  createdAt: string;
+  trackId: string;
+  trackUri: string;
 }[];
 
 export const useNowPlayingsQuery = () =>
-  useQuery<NowPlayings>({
+  useQuery({
     queryKey: ["now-playings"],
     queryFn: () =>
-      fetch(`${API_URL}/now-playings?size=7`, {
-        method: "GET",
-      }).then((res) => res.json()),
+      client.get<{ nowPlayings: NowPlayings }>(
+        "/xrpc/app.rocksky.feed.getNowPlayings",
+        { params: { size: 7 } }
+      ),
     refetchInterval: 5000,
+    select: (res) => res.data.nowPlayings || [],
   });
diff --git a/apps/web/src/pages/home/nowplayings/NowPlayings.tsx b/apps/web/src/pages/home/nowplayings/NowPlayings.tsx
index 46a5c7f9..f21db423 100644
--- a/apps/web/src/pages/home/nowplayings/NowPlayings.tsx
+++ b/apps/web/src/pages/home/nowplayings/NowPlayings.tsx
@@ -94,15 +94,15 @@ function NowPlayings() {
     id: string;
     title: string;
     artist: string;
-    album_art: string;
-    artist_uri?: string;
+    albumArt: string;
+    artistUri?: string;
     uri: string;
     avatar: string;
     handle: string;
     did: string;
-    created_at: string;
-    track_id: string;
-    track_uri: string;
+    createdAt: string;
+    trackId: string;
+    trackUri: string;
   } | null>(null);
   const [currentIndex, setCurrentIndex] = useState(0);
   const [progress, setProgress] = useState(0);
@@ -211,7 +211,7 @@ function NowPlayings() {
                   </div>
                 </Link>
                 <span className="ml-[10px] text-[15px] text-[var(--color-text-muted)]">
-                  {dayjs.utc(currentlyPlaying?.created_at).local().fromNow()}
+                  {dayjs.utc(currentlyPlaying?.createdAt).local().fromNow()}
                 </span>
               </div>
             </ModalHeader>
@@ -225,26 +225,26 @@ function NowPlayings() {
                   )}
                 </div>
                 <div className="flex flex-col items-center flex-1">
-                  {currentlyPlaying?.track_uri && (
+                  {currentlyPlaying?.trackUri && (
                     <Link
-                      to={`/${currentlyPlaying?.track_uri.split("at://")[1]}`}
+                      to={`/${currentlyPlaying?.trackUri.split("at://")[1]}`}
                     >
                       <Cover
-                        src={currentlyPlaying?.album_art}
+                        src={currentlyPlaying?.albumArt}
                         key={currentlyPlaying?.id}
                       />
                     </Link>
                   )}
-                  {currentlyPlaying?.track_uri && (
+                  {currentlyPlaying?.trackUri && (
                     <Link
-                      to={`/${currentlyPlaying?.track_uri.split("at://")[1]}`}
+                      to={`/${currentlyPlaying?.trackUri.split("at://")[1]}`}
                     >
                       <TrackTitle>{currentlyPlaying?.title}</TrackTitle>
                     </Link>
                   )}
-                  {!currentlyPlaying?.track_uri && (
+                  {!currentlyPlaying?.trackUri && (
                     <Cover
-                      src={currentlyPlaying?.album_art}
+                      src={currentlyPlaying?.albumArt}
                       key={currentlyPlaying?.id}
                     />
                   )}
@@ -261,10 +261,10 @@ function NowPlayings() {
                 </div>
               </div>
 
-              {!currentlyPlaying?.track_uri && (
+              {!currentlyPlaying?.trackUri && (
                 <TrackTitle>{currentlyPlaying?.title}</TrackTitle>
               )}
-              <Link to={`/${currentlyPlaying?.artist_uri?.split("at://")[1]}`}>
+              <Link to={`/${currentlyPlaying?.artistUri?.split("at://")[1]}`}>
                 <TrackArtist>{currentlyPlaying?.artist}</TrackArtist>
               </Link>
             </ModalBody>
diff --git a/turbo.json b/turbo.json
index 0b06b54b..33307573 100644
--- a/turbo.json
+++ b/turbo.json
@@ -14,6 +14,14 @@
         "./dist/**"
       ]
     },
+    "build:prod": {
+      "dependsOn": [
+        "^build:prod"
+      ],
+      "outputs": [
+        "./dist/**"
+      ]
+    },
     "dev": {
       "persistent": true,
       "cache": false