// app/artist/[id]/page.tsx (React Server Component)
import { createSoundCloudServerClient } from "soundcloud-api-ts-next/server";
import { cookies } from "next/headers";
export default async function ArtistPage({ params }: { params: { id: string } }) {
const sc = await createSoundCloudServerClient({
clientId: process.env.SC_CLIENT_ID!,
clientSecret: process.env.SC_CLIENT_SECRET!,
getToken: () => cookies().get("sc_access_token")?.value,
});
const [user, tracks] = await Promise.all([
sc.client.users.getUser(params.id, { token: sc.token() }),
sc.client.users.getTracks(params.id, 10, { token: sc.token() }),
]);
return <ArtistView user={user} tracks={tracks} />;
}
Create a server-side SoundCloud API client for use in React Server Components, Route Handlers, and Server Actions.
This is a thin factory around
SoundCloudClientfromsoundcloud-api-ts. It optionally resolves a user access token viagetTokenso you can call authenticated endpoints (e.g./me) from server-rendered code without waterfalling through client-side hooks.The returned object exposes the raw
SoundCloudClientas.clientfor full API access, plus.token()for passing the resolved user token to authenticated calls.For common single-call patterns, prefer the standalone server helpers (getTrack, searchTracks, etc.) — they handle client credential token management and optional
next/cacheintegration automatically.