Quickstart

Quickstart

To get started with Spotted and the Spotify Web API, follow these steps:

Cards

This is a Card

Interesting content you want to highlight.

Another Card

Another interesting content you want to highlight.

Internationalization Configure Starlight to support multiple languages.

Assides

Careful!

Other content is also supported in asides.

// A code snippet, for example.
console.log("Hello, world!");

Badges

Primary Danger Success Caution Tip Default

Code

Console.WriteLine('Hello, world!');

FileTree

• Directorysrc

  • Directorycomponents

    • Header.astro an important file
    • Title.astro
    • .env

Steps

1. Import the component into your MDX file:

   import { Steps } from "@astrojs/starlight/components";

2. Wrap <Steps> around your ordered list items.

Tabs

Some stars:

Orion

Bellatrix, Rigel, Betelgeuse

Gemini

Pollux, Castor A, Castor B

Some exoplanets:

Orion

HD 34445 b, Gliese 179 b, Wasp-82 b

Gemini

Pollux b, HAT-P-24b, HD 50554 b

Mermaid

graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;

1. Create a Spotify App

1. Go to the Spotify Developer Dashboard.
2. Log in with your Spotify account.
3. Click “Create An App” and fill in the required details.
4. After the app is created, note down your Client ID and Client Secret — you’ll need these to authenticate.

---

2. Authenticate with OAuth 2.0 Client Credentials Flow

Most SDKs require you to exchange your client credentials for an access token. Here’s an example in Node.js using node-fetch:

const fetch = require("node-fetch");
const client_id = "YOUR_CLIENT_ID"; // Replace with your Client ID
const client_secret = "YOUR_CLIENT_SECRET"; // Replace with your Client Secret

async function getAccessToken() {
  const response = await fetch("https://accounts.spotify.com/api/token", {
    method: "POST",
    headers: {
      Authorization:
        "Basic " +
        Buffer.from(client_id + ":" + client_secret).toString("base64"),
      "Content-Type": "application/x-www-form-urlencoded",
    },
    body: "grant_type=client_credentials",
  });

  const data = await response.json();
  return data.access_token;
}

---

3. Make a Request: List New Releases

Once you have an access token, you can query the API. Here’s how to list new album releases:

async function listNewReleases() {
  const token = await getAccessToken();

  const response = await fetch(
    "https://api.spotify.com/v1/browse/new-releases",
    {
      headers: {
        Authorization: `Bearer ${token}`,
      },
    },
  );

  const data = await response.json();
  console.log(data.albums.items.map((album) => album.name));
}

listNewReleases();

---

That’s it! You’ve authenticated and fetched a list of new albums from Spotify using the Spotted API. For more advanced usage, check the rest of the documentation or explore the available SDKs!