> ## Documentation Index
> Fetch the complete documentation index at: https://backstage.spotify.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Videos

> Watch video tutorials and demos covering Portal features including Plugin Studio, AiKA, Software Catalog, Soundcheck, and more.

export const VideoCard = ({title, description, url}) => {
  const [isModalOpen, setIsModalOpen] = useState(false);
  const getYouTubeVideoId = input => {
    const patterns = [/(?:youtube\.com\/watch\?v=|youtu\.be\/|youtube\.com\/embed\/)([^&?/\s]+)/];
    for (const pattern of patterns) {
      const match = input.match(pattern);
      if (match && match[1]) {
        return match[1];
      }
    }
    return null;
  };
  const videoId = getYouTubeVideoId(url);
  const embedUrl = videoId ? `https://www.youtube.com/embed/${videoId}` : url;
  return <>
      <div onClick={() => setIsModalOpen(true)} className="group flex flex-col h-full px-10 py-6 rounded-2xl border-2 border-black/10 dark:border-white/10 bg-white dark:bg-white/10 backdrop-blur-md transition-all duration-300 ease-in-out hover:-translate-y-1 hover:shadow-lg shadow-sm hover:border-[#1ed760] dark:hover:border-white cursor-pointer mb-6">
        <Icon icon="play" iconType="solid" size="32" color="#1ED760" />
        <h2 className="text-2xl font-semibold text-[#1c1c1c] dark:text-white leading-snug m-0 my-4">
          {title}
        </h2>

        <p className="mb-0 line-clamp-3">{description}</p>
      </div>

      {isModalOpen && <div className="video-overlay fixed inset-0 bg-black/80 backdrop-blur-sm z-[9999] flex items-center justify-center p-4" onClick={() => setIsModalOpen(false)}>
          <div className="relative w-full max-w-5xl bg-[#1c1c1c] rounded-2xl shadow-2xl overflow-hidden" onClick={e => e.stopPropagation()}>
            <button onClick={() => setIsModalOpen(false)} className="absolute top-4 right-4 z-10 w-10 h-10 rounded-full bg-black/50 hover:bg-black/70 text-white flex items-center justify-center transition-colors duration-200" aria-label="Close modal">
              <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
              </svg>
            </button>

            <div className="relative pt-[56.25%]">
              <iframe className="absolute top-0 left-0 w-full h-full border-0" src={embedUrl} title={title} allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen />
            </div>
          </div>
        </div>}
    </>;
};

Explore our collection of video tutorials and demos to help you get the most out of Spotify Portal for Backstage.

<Columns cols={3} className="gap-y-2">
  <VideoCard title="Portal Plugin Studio: Build Custom Plugins in Minutes" description="Learn how to build custom Spotify Portal plugins in minutes with Portal Plugin Studio's intuitive interface" url="https://youtu.be/shQX00bBLGM?si=7T8JujarX-DeTggM" />

  <VideoCard title="Agentic AiKA" description="Learn how agentic AiKA solves complex problems through autonomous reasoning and specialized tool integration capabilities" url="https://youtu.be/zLSSCTB3VIY?si=b3Z3FO8anSd5YdDB" />

  <VideoCard title="AiKA MCP Support & Agentic Workflows" description="Learn how AiKA's MCP server support and agentic workflows enhance your development experience in Portal" url="https://youtu.be/pOv4hvAu4kY?si=WYcLfqzbzKXDrIic" />

  <VideoCard title="Software Catalog: Your Single Source of Truth" description="Learn how Software Catalog creates a unified, searchable home for all your software and cloud resources" url="https://youtu.be/qyet8hPKrcQ?si=j3ZD-GHsOBzRuSAe" />

  <VideoCard title="TechDocs: Engineering Documentation That Actually Works" description="Learn how TechDocs creates a home for clear, accessible, and current engineering documentation in Portal" url="https://youtu.be/-uKljwTZomw?si=25VDvkk4Z1F3ym0s" />

  <VideoCard title="Search: One Search Bar for Your Entire Engineering Organization" description="Learn how Portal Search becomes your single gateway to everything in your engineering organization and tools" url="https://youtu.be/wQjI5i9Hww8?si=iTezePo60n0-1us2" />

  <VideoCard title="Soundcheck: Tech Insights" description="Learn how Soundcheck Insights transforms engineering leadership by consolidating tech health data into actionable insights" url="https://youtu.be/5sDh15auNfE?si=-tkq7D-xpslnpQ3z" />

  <VideoCard title="Audit Logs" description="Learn how Portal Audit Logs records who did what, when, and where — capturing RBAC changes, config updates, and scaffolder executions through a secure, queryable API" url="https://youtu.be/ny7ZPnXuGfI?si=NXihXj59giOHS0ut" />

  <VideoCard title="Portal Scaffolder" description="Learn how Portal Scaffolder provides an end-to-end in-Portal experience for discovering, creating, editing, publishing, and running Software Templates" url="https://youtu.be/EGjL0Eoe31E?si=RqsE42jdB3EY3F_a" />
</Columns>

## Talks & Presentations

<Columns cols={2} className="gap-y-2">
  <VideoCard title="Coding is no longer the constraint: Scaling devex to teams and agents at Spotify" description="Spotify's Chief Architect shares how they built Honk, a background coding agent, integrated it with Fleetshift and Backstage, and discovered that the standardization powering effective teams also powers effective agents" url="https://www.youtube.com/watch?v=zFslvuvYifQ" />

  <VideoCard title="Let's Talk Agentic Development | Spotify x Anthropic Live" description="Learn more about how we empower Claude with our internal development platforms, Backstage and Fleet Management" url="https://www.youtube.com/watch?v=fHDGQHr_agg" />

  <VideoCard title="Leveraging Internal Knowledge: Building AiKA at Spotify" description="Learn how AiKA's flexible API allows engineers to ingest custom knowledge and tailor solutions for teams" url="https://youtu.be/FEy2lhe6CM8?si=BsNAf7R45eGftG_m" />

  <VideoCard title="Automating the component maintenance - Fleet management at Spotify" description="Learn how Spotify manages software at scale and maintains a large number of components efficiently" url="https://youtu.be/PFkvKSXkW3Y?si=UiN86jkP-P1aKAni" />
</Columns>