CINXE.COM

<!DOCTYPE html><html lang="en"><head><meta charSet="utf-8"/><meta name="viewport" content="width=device-width, initial-scale=1"/><link rel="preload" href="/_next/static/media/a34f9d1faa5f3315-s.p.woff2" as="font" crossorigin="" type="font/woff2"/><link rel="stylesheet" href="/_next/static/css/933c6f782897b379.css" crossorigin="" data-precedence="next"/><link rel="preload" href="/_next/static/chunks/webpack-0d86c6ee39f56284.js" as="script" fetchPriority="low" crossorigin=""/><script src="/_next/static/chunks/fd9d1056-0c5e6aafc398dd49.js" async="" crossorigin=""></script><script src="/_next/static/chunks/864-3d47b83f5aa5c3ee.js" async="" crossorigin=""></script><script src="/_next/static/chunks/main-app-8f13c08947745519.js" async="" crossorigin=""></script><title>Learn something new with GraphQL, every week | GraphQL WTF</title><meta name="description" content="Screencasts teaching you how to build apps and backends with GraphQL."/><meta name="next-size-adjust"/><script src="/_next/static/chunks/polyfills-c67a75d1b6f99dc8.js" crossorigin="" noModule=""></script></head><body class="__variable_36bd41"><header class="max-w-7xl mx-auto p-6 md:py-10 z-50 relative"><nav class="flex items-center justify-between" aria-label="Global"><div class="flex lg:flex-1"><a class="-m-1.5 p-1.5 text-black" href="/"><span class="sr-only">graphql.wtf</span><img alt="GraphQL WTF" loading="lazy" width="265" height="60" decoding="async" data-nimg="1" class="h-9 w-auto fill-current" style="color:transparent" src="/_next/static/media/logo.b455edfe.svg"/></a></div><div class="flex lg:hidden"><button type="button" class="-m-2.5 inline-flex items-center justify-center rounded-md p-2.5 text-gray-700"><span class="sr-only">Open main menu</span><svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" class="h-6 w-6"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"></path></svg></button></div><div class="hidden lg:flex lg:gap-x-12"><a class="text-sm font-semibold leading-6 text-black hover:text-primary" href="/">Free Episodes</a><a class="text-sm font-semibold leading-6 text-black hover:text-primary" href="/training">Training</a><a class="text-sm font-semibold leading-6 text-black hover:text-primary" href="/about">About</a></div><div class="hidden space-x-6 lg:flex lg:flex-1 lg:justify-end"></div></nav><div style="position:fixed;top:1px;left:1px;width:1px;height:0;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;display:none"></div></header><div class="px-6 lg:px-8 relative z-20"><div class="mx-auto max-w-3xl py-24 space-y-6"><div class="text-center"><h1 class="text-4xl font-bold tracking-tight text-black sm:text-6xl">All Episodes</h1><p class="mt-6 text-lg leading-8 text-black/50">Screencasts teaching you how to build the best GraphQL backends</p></div></div><div class="mx-auto max-w-5xl"><div class="grid grid-cols-1 gap-6 md:gap-y-12 md:grid-cols-2 lg:grid-cols-3"><article><a class="group h-full flex flex-col" href="/episodes/94-graphql-with-astro-content-layer"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Astro Content Layer with GraphQL" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F94-graphql-with-astro-content-layer.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F94-graphql-with-astro-content-layer.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F94-graphql-with-astro-content-layer.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F94-graphql-with-astro-content-layer.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F94-graphql-with-astro-content-layer.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F94-graphql-with-astro-content-layer.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F94-graphql-with-astro-content-layer.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F94-graphql-with-astro-content-layer.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F94-graphql-with-astro-content-layer.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Astro Content Layer with GraphQL</p><p class="text-sm text-black">Learn how to use Astro's content layer with GraphQL to fetch content from a CMS.</p></div><div class=""><p class="text-sm font-medium text-black/50">15 Aug 2024</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/93-graphql-explorer-by-inigo"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Explorer" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F93-graphql-explorer-by-inigo.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F93-graphql-explorer-by-inigo.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F93-graphql-explorer-by-inigo.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F93-graphql-explorer-by-inigo.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F93-graphql-explorer-by-inigo.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F93-graphql-explorer-by-inigo.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F93-graphql-explorer-by-inigo.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F93-graphql-explorer-by-inigo.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F93-graphql-explorer-by-inigo.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Explorer</p><p class="text-sm text-black">Explorer emphasizes workflow efficiency, incorporating advanced tracing tools and a unified interface for managing queries.</p></div><div class=""><p class="text-sm font-medium text-black/50">22 May 2024</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/92-graphql-tada"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="gql.tada" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F92-graphql-tada.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F92-graphql-tada.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F92-graphql-tada.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F92-graphql-tada.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F92-graphql-tada.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F92-graphql-tada.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F92-graphql-tada.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F92-graphql-tada.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F92-graphql-tada.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">gql.tada</p><p class="text-sm text-black">A new type-safe developer experience GraphQL developers.</p></div><div class=""><p class="text-sm font-medium text-black/50">17 Jan 2024</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/91-protect-graphql-apis-with-unkey"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Protect GraphQL APIs with Unkey" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F91-protect-graphql-apis-with-unkey.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F91-protect-graphql-apis-with-unkey.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F91-protect-graphql-apis-with-unkey.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F91-protect-graphql-apis-with-unkey.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F91-protect-graphql-apis-with-unkey.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F91-protect-graphql-apis-with-unkey.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F91-protect-graphql-apis-with-unkey.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F91-protect-graphql-apis-with-unkey.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F91-protect-graphql-apis-with-unkey.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Protect GraphQL APIs with Unkey</p><p class="text-sm text-black">Learn how to use the GraphQL Yoga Plugin system to protect requests using API keys with Unkey.</p></div><div class=""><p class="text-sm font-medium text-black/50">16 Oct 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/90-interview-with-graphql-expert-laurin-quast"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Interview with Laurin Quast" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F90-interview-with-graphql-expert-laurin-quast.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F90-interview-with-graphql-expert-laurin-quast.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F90-interview-with-graphql-expert-laurin-quast.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F90-interview-with-graphql-expert-laurin-quast.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F90-interview-with-graphql-expert-laurin-quast.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F90-interview-with-graphql-expert-laurin-quast.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F90-interview-with-graphql-expert-laurin-quast.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F90-interview-with-graphql-expert-laurin-quast.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F90-interview-with-graphql-expert-laurin-quast.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Interview with Laurin Quast</p><p class="text-sm text-black">Learn more about Laurin, GraphQL Envelop and Yoga in this interview.</p></div><div class=""><p class="text-sm font-medium text-black/50">7 Sept 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/89-graphql-list-query-naming-conventions"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL list query naming conventions" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F89-graphql-list-query-naming-conventions.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F89-graphql-list-query-naming-conventions.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F89-graphql-list-query-naming-conventions.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F89-graphql-list-query-naming-conventions.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F89-graphql-list-query-naming-conventions.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F89-graphql-list-query-naming-conventions.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F89-graphql-list-query-naming-conventions.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F89-graphql-list-query-naming-conventions.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F89-graphql-list-query-naming-conventions.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL list query naming conventions</p><p class="text-sm text-black">Let's talk about some of the most common ways you can name list queries.</p></div><div class=""><p class="text-sm font-medium text-black/50">31 Jul 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/88-why-not-just-use-fetch-with-graphql"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Why not just use fetch with GraphQL?" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F88-why-not-just-use-fetch-with-graphql.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F88-why-not-just-use-fetch-with-graphql.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F88-why-not-just-use-fetch-with-graphql.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F88-why-not-just-use-fetch-with-graphql.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F88-why-not-just-use-fetch-with-graphql.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F88-why-not-just-use-fetch-with-graphql.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F88-why-not-just-use-fetch-with-graphql.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F88-why-not-just-use-fetch-with-graphql.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F88-why-not-just-use-fetch-with-graphql.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Why not just use fetch with GraphQL?</p><p class="text-sm text-black">My reaction video to a recent Reddit question on what's the point of GraphQL client libraries over fetch.</p></div><div class=""><p class="text-sm font-medium text-black/50">17 Jul 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/87-graphql-jit"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL JIT" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F87-graphql-jit.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F87-graphql-jit.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F87-graphql-jit.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F87-graphql-jit.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F87-graphql-jit.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F87-graphql-jit.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F87-graphql-jit.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F87-graphql-jit.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F87-graphql-jit.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL JIT</p><p class="text-sm text-black">Execute and compile highly optimized code with GraphQL JIT.</p></div><div class=""><p class="text-sm font-medium text-black/50">7 Jul 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/86-graphql-analytics-and-security-with-inigo"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Analytics and Security with Inigo" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F86-graphql-analytics-and-security-with-inigo.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F86-graphql-analytics-and-security-with-inigo.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F86-graphql-analytics-and-security-with-inigo.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F86-graphql-analytics-and-security-with-inigo.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F86-graphql-analytics-and-security-with-inigo.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F86-graphql-analytics-and-security-with-inigo.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F86-graphql-analytics-and-security-with-inigo.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F86-graphql-analytics-and-security-with-inigo.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F86-graphql-analytics-and-security-with-inigo.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Analytics and Security with Inigo</p><p class="text-sm text-black">Contextualized analytics for any GraphQL API.</p></div><div class=""><p class="text-sm font-medium text-black/50">26 Jun 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Tools every frontend developer should be using with GraphQL in 2023" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Tools every frontend developer should be using with GraphQL in 2023</p><p class="text-sm text-black">Check my recommended top 5 tools you should be using as a frontend developer in 2023 when working with GraphQL.</p></div><div class=""><p class="text-sm font-medium text-black/50">29 May 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/84-nextjs-graphql-yoga-route-handler"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Next.js Route Handler with Yoga" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F84-nextjs-graphql-yoga-route-handler.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F84-nextjs-graphql-yoga-route-handler.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F84-nextjs-graphql-yoga-route-handler.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F84-nextjs-graphql-yoga-route-handler.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F84-nextjs-graphql-yoga-route-handler.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F84-nextjs-graphql-yoga-route-handler.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F84-nextjs-graphql-yoga-route-handler.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F84-nextjs-graphql-yoga-route-handler.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F84-nextjs-graphql-yoga-route-handler.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Next.js Route Handler with Yoga</p><p class="text-sm text-black">Create your own GraphQL Yoga route handler with Next App Router.</p></div><div class=""><p class="text-sm font-medium text-black/50">22 May 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/83-automate-deploying-graphql-apis-to-cloudflare-workers"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Automate deploying GraphQL APIs to Cloudflare Workers" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F83-automate-deploying-graphql-apis-to-cloudflare-workers.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F83-automate-deploying-graphql-apis-to-cloudflare-workers.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F83-automate-deploying-graphql-apis-to-cloudflare-workers.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F83-automate-deploying-graphql-apis-to-cloudflare-workers.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F83-automate-deploying-graphql-apis-to-cloudflare-workers.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F83-automate-deploying-graphql-apis-to-cloudflare-workers.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F83-automate-deploying-graphql-apis-to-cloudflare-workers.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F83-automate-deploying-graphql-apis-to-cloudflare-workers.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F83-automate-deploying-graphql-apis-to-cloudflare-workers.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Automate deploying GraphQL APIs to Cloudflare Workers</p><p class="text-sm text-black">Deploy your GraphQL Yoga server automatically to Cloudflare Workers using GitHub Actions.</p></div><div class=""><p class="text-sm font-medium text-black/50">24 Apr 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/82-type-safe-graphql-resolvers-with-garph"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Type-safe GraphQL resolvers with garph" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F82-type-safe-graphql-resolvers-with-garph.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F82-type-safe-graphql-resolvers-with-garph.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F82-type-safe-graphql-resolvers-with-garph.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F82-type-safe-graphql-resolvers-with-garph.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F82-type-safe-graphql-resolvers-with-garph.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F82-type-safe-graphql-resolvers-with-garph.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F82-type-safe-graphql-resolvers-with-garph.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F82-type-safe-graphql-resolvers-with-garph.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F82-type-safe-graphql-resolvers-with-garph.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Type-safe GraphQL resolvers with garph</p><p class="text-sm text-black">Write resolvers without the codegen and debugging. Infer types with code-first GraphQL schemas.</p></div><div class=""><p class="text-sm font-medium text-black/50">17 Apr 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/81-graphql-voyager"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Voyager" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F81-graphql-voyager.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F81-graphql-voyager.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F81-graphql-voyager.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F81-graphql-voyager.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F81-graphql-voyager.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F81-graphql-voyager.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F81-graphql-voyager.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F81-graphql-voyager.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F81-graphql-voyager.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Voyager</p><p class="text-sm text-black">Interact and explore your Graph with GraphQL Voyager.</p></div><div class=""><p class="text-sm font-medium text-black/50">13 Mar 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/80-masked-email-directive-with-redwoodjs"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Masked Email Directive with RedwoodJS" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F80-masked-email-directive-with-redwoodjs.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F80-masked-email-directive-with-redwoodjs.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F80-masked-email-directive-with-redwoodjs.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F80-masked-email-directive-with-redwoodjs.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F80-masked-email-directive-with-redwoodjs.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F80-masked-email-directive-with-redwoodjs.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F80-masked-email-directive-with-redwoodjs.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F80-masked-email-directive-with-redwoodjs.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F80-masked-email-directive-with-redwoodjs.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Masked Email Directive with RedwoodJS</p><p class="text-sm text-black">Create a custom directive using Redwood to mask emails for user profiles.</p></div><div class=""><p class="text-sm font-medium text-black/50">6 Mar 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/79-graphql-over-http"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL over HTTP" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F79-graphql-over-http.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F79-graphql-over-http.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F79-graphql-over-http.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F79-graphql-over-http.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F79-graphql-over-http.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F79-graphql-over-http.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F79-graphql-over-http.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F79-graphql-over-http.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F79-graphql-over-http.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL over HTTP</p><p class="text-sm text-black">In this video, we'll explore GraphQL over HTTP Specification, and how we can audit GraphQL APIs to ensure compliance.</p></div><div class=""><p class="text-sm font-medium text-black/50">27 Feb 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/78-graphql-network-inspector"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Network Inspector" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F78-graphql-network-inspector.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F78-graphql-network-inspector.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F78-graphql-network-inspector.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F78-graphql-network-inspector.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F78-graphql-network-inspector.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F78-graphql-network-inspector.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F78-graphql-network-inspector.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F78-graphql-network-inspector.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F78-graphql-network-inspector.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Network Inspector</p><p class="text-sm text-black">Inspecting GraphQL requests doesn't have to be difficult. This Chrome extension makes it a breeze.</p></div><div class=""><p class="text-sm font-medium text-black/50">20 Feb 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/77-graphql-error-handling"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Input Error Handling" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F77-graphql-error-handling.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F77-graphql-error-handling.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F77-graphql-error-handling.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F77-graphql-error-handling.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F77-graphql-error-handling.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F77-graphql-error-handling.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F77-graphql-error-handling.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F77-graphql-error-handling.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F77-graphql-error-handling.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Input Error Handling</p><p class="text-sm text-black">Handle input errors with GraphQL using types, and soon to be "@oneOf" directive.</p></div><div class=""><p class="text-sm font-medium text-black/50">13 Feb 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/76-generate-persisted-documents-with-graphql-code-generator"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Generate Persisted Documents with GraphQL Code Generator" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F76-generate-persisted-documents-with-graphql-code-generator.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F76-generate-persisted-documents-with-graphql-code-generator.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F76-generate-persisted-documents-with-graphql-code-generator.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F76-generate-persisted-documents-with-graphql-code-generator.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F76-generate-persisted-documents-with-graphql-code-generator.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F76-generate-persisted-documents-with-graphql-code-generator.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F76-generate-persisted-documents-with-graphql-code-generator.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F76-generate-persisted-documents-with-graphql-code-generator.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F76-generate-persisted-documents-with-graphql-code-generator.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Generate Persisted Documents with GraphQL Code Generator</p><p class="text-sm text-black">Automatically persist GraphQL operations to JSON with the client preset plugin.</p></div><div class=""><p class="text-sm font-medium text-black/50">6 Feb 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/75-refresh-nextjs-page-server-state"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Refresh Next.js 13 server state after GraphQL mutation" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F75-refresh-nextjs-page-server-state.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F75-refresh-nextjs-page-server-state.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F75-refresh-nextjs-page-server-state.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F75-refresh-nextjs-page-server-state.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F75-refresh-nextjs-page-server-state.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F75-refresh-nextjs-page-server-state.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F75-refresh-nextjs-page-server-state.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F75-refresh-nextjs-page-server-state.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F75-refresh-nextjs-page-server-state.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Refresh Next.js 13 server state after GraphQL mutation</p><p class="text-sm text-black">Learn how to refresh Next.js page server state when GraphQL mutations occur.</p></div><div class=""><p class="text-sm font-medium text-black/50">30 Jan 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/74-graphql-persisted-queries"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="What ar GraphQL Persisted Queries?" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F74-graphql-persisted-queries.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F74-graphql-persisted-queries.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F74-graphql-persisted-queries.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F74-graphql-persisted-queries.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F74-graphql-persisted-queries.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F74-graphql-persisted-queries.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F74-graphql-persisted-queries.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F74-graphql-persisted-queries.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F74-graphql-persisted-queries.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">What ar GraphQL Persisted Queries?</p><p class="text-sm text-black">A quick look at what it means to use persisted queries with GraphQL.</p></div><div class=""><p class="text-sm font-medium text-black/50">23 Jan 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/73-the-graphql-scalar-specification"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Custom GraphQL Scalars Specification" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F73-the-graphql-scalar-specification.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F73-the-graphql-scalar-specification.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F73-the-graphql-scalar-specification.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F73-the-graphql-scalar-specification.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F73-the-graphql-scalar-specification.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F73-the-graphql-scalar-specification.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F73-the-graphql-scalar-specification.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F73-the-graphql-scalar-specification.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F73-the-graphql-scalar-specification.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Custom GraphQL Scalars Specification</p><p class="text-sm text-black">GraphQL now has an official home for Scalars.</p></div><div class=""><p class="text-sm font-medium text-black/50">16 Jan 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/72-graphql-yoga-3-with-cloudflare-workers"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Yoga 3 with Cloudflare Workers" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F72-graphql-yoga-3-with-cloudflare-workers.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F72-graphql-yoga-3-with-cloudflare-workers.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F72-graphql-yoga-3-with-cloudflare-workers.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F72-graphql-yoga-3-with-cloudflare-workers.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F72-graphql-yoga-3-with-cloudflare-workers.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F72-graphql-yoga-3-with-cloudflare-workers.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F72-graphql-yoga-3-with-cloudflare-workers.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F72-graphql-yoga-3-with-cloudflare-workers.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F72-graphql-yoga-3-with-cloudflare-workers.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Yoga 3 with Cloudflare Workers</p><p class="text-sm text-black">Build and deploy GraphQL Yoga to the Edge with Cloudflare Workers.</p></div><div class=""><p class="text-sm font-medium text-black/50">9 Jan 2023</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/71-graphql-with-hoppscotch"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL with Hoppscotch" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F71-graphql-with-hoppscotch.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F71-graphql-with-hoppscotch.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F71-graphql-with-hoppscotch.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F71-graphql-with-hoppscotch.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F71-graphql-with-hoppscotch.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F71-graphql-with-hoppscotch.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F71-graphql-with-hoppscotch.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F71-graphql-with-hoppscotch.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F71-graphql-with-hoppscotch.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL with Hoppscotch</p><p class="text-sm text-black">Hoppscotch is a desktop and browser based app that you can use to make GraphQL requests. You can save requests for later with collections, use variables, browse documentation, and more.</p></div><div class=""><p class="text-sm font-medium text-black/50">5 Dec 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/70-fresh"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Fresh" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F70-fresh.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F70-fresh.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F70-fresh.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F70-fresh.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F70-fresh.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F70-fresh.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F70-fresh.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F70-fresh.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F70-fresh.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Fresh</p><p class="text-sm text-black">Fresh is a web framework built with Deno that's very fast. Learn how query and mutate data using Fresh handlers.</p></div><div class=""><p class="text-sm font-medium text-black/50">28 Nov 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/69-building-graphql-ui-with-retool"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Building GraphQL UI with Retool" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F69-building-graphql-ui-with-retool.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F69-building-graphql-ui-with-retool.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F69-building-graphql-ui-with-retool.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F69-building-graphql-ui-with-retool.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F69-building-graphql-ui-with-retool.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F69-building-graphql-ui-with-retool.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F69-building-graphql-ui-with-retool.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F69-building-graphql-ui-with-retool.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F69-building-graphql-ui-with-retool.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Building GraphQL UI with Retool</p><p class="text-sm text-black">Query and mutate data with a GraphQL backend using pre-built components by Retool.</p></div><div class=""><p class="text-sm font-medium text-black/50">21 Nov 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/68-graphql-yoga-3-and-expressjs"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Yoga 3 and ExpressJS" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F68-graphql-yoga-3-and-expressjs.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F68-graphql-yoga-3-and-expressjs.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F68-graphql-yoga-3-and-expressjs.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F68-graphql-yoga-3-and-expressjs.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F68-graphql-yoga-3-and-expressjs.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F68-graphql-yoga-3-and-expressjs.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F68-graphql-yoga-3-and-expressjs.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F68-graphql-yoga-3-and-expressjs.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F68-graphql-yoga-3-and-expressjs.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Yoga 3 and ExpressJS</p><p class="text-sm text-black">Create a GraphQL server with the new GraphQL Yoga 3 and ExpressJS.</p></div><div class=""><p class="text-sm font-medium text-black/50">14 Nov 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/67-the-new-graphql-code-generator-client-preset"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="The new GraphQL Code Generator Client Preset" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F67-the-new-graphql-code-generator-client-preset.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F67-the-new-graphql-code-generator-client-preset.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F67-the-new-graphql-code-generator-client-preset.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F67-the-new-graphql-code-generator-client-preset.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F67-the-new-graphql-code-generator-client-preset.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F67-the-new-graphql-code-generator-client-preset.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F67-the-new-graphql-code-generator-client-preset.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F67-the-new-graphql-code-generator-client-preset.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F67-the-new-graphql-code-generator-client-preset.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">The new GraphQL Code Generator Client Preset</p><p class="text-sm text-black">Learn how to setup and configure the new GraphQL Code Generator Client Preset.</p></div><div class=""><p class="text-sm font-medium text-black/50">7 Nov 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/66-graphql-with-nextjs-13-server-components"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL with Next.js 13 Server Components" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F66-graphql-with-nextjs-13-server-components.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F66-graphql-with-nextjs-13-server-components.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F66-graphql-with-nextjs-13-server-components.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F66-graphql-with-nextjs-13-server-components.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F66-graphql-with-nextjs-13-server-components.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F66-graphql-with-nextjs-13-server-components.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F66-graphql-with-nextjs-13-server-components.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F66-graphql-with-nextjs-13-server-components.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F66-graphql-with-nextjs-13-server-components.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL with Next.js 13 Server Components</p><p class="text-sm text-black">Fetch data from a GraphQL backend using Next.js 13 server components.</p></div><div class=""><p class="text-sm font-medium text-black/50">31 Oct 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/65-graphql-middleware-with-yoga"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Middleware with Yoga" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F65-graphql-middleware-with-yoga.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F65-graphql-middleware-with-yoga.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F65-graphql-middleware-with-yoga.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F65-graphql-middleware-with-yoga.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F65-graphql-middleware-with-yoga.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F65-graphql-middleware-with-yoga.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F65-graphql-middleware-with-yoga.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F65-graphql-middleware-with-yoga.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F65-graphql-middleware-with-yoga.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Middleware with Yoga</p><p class="text-sm text-black">Run code before or after any resolver is invoked by using GraphQL middleware.</p></div><div class=""><p class="text-sm font-medium text-black/50">24 Oct 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/64-rate-limiting-with-graphql-yoga"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Rate Limiting with GraphQL Yoga" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F64-rate-limiting-with-graphql-yoga.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F64-rate-limiting-with-graphql-yoga.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F64-rate-limiting-with-graphql-yoga.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F64-rate-limiting-with-graphql-yoga.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F64-rate-limiting-with-graphql-yoga.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F64-rate-limiting-with-graphql-yoga.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F64-rate-limiting-with-graphql-yoga.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F64-rate-limiting-with-graphql-yoga.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F64-rate-limiting-with-graphql-yoga.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Rate Limiting with GraphQL Yoga</p><p class="text-sm text-black">Learn how to rate limit on a per-user basis with GraphQL Yoga and Envelop.</p></div><div class=""><p class="text-sm font-medium text-black/50">17 Oct 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/63-using-graphql-code-generator-with-graphql-request"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Using GraphQL Code Generator with GraphQL Request" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F63-using-graphql-code-generator-with-graphql-request.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F63-using-graphql-code-generator-with-graphql-request.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F63-using-graphql-code-generator-with-graphql-request.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F63-using-graphql-code-generator-with-graphql-request.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F63-using-graphql-code-generator-with-graphql-request.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F63-using-graphql-code-generator-with-graphql-request.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F63-using-graphql-code-generator-with-graphql-request.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F63-using-graphql-code-generator-with-graphql-request.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F63-using-graphql-code-generator-with-graphql-request.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Using GraphQL Code Generator with GraphQL Request</p><p class="text-sm text-black">Learn how to types with the GraphQL Request library, and generate types using GraphQL Code Generator for GraphQL operations.</p></div><div class=""><p class="text-sm font-medium text-black/50">10 Oct 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/62-set-context-with-apollo-client"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Set Context with Apollo Client" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F62-set-context-with-apollo-client.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F62-set-context-with-apollo-client.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F62-set-context-with-apollo-client.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F62-set-context-with-apollo-client.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F62-set-context-with-apollo-client.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F62-set-context-with-apollo-client.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F62-set-context-with-apollo-client.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F62-set-context-with-apollo-client.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F62-set-context-with-apollo-client.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Set Context with Apollo Client</p><p class="text-sm text-black">Learn how to create Apollo Client middleware for updating request headers sent to your API using React context.</p></div><div class=""><p class="text-sm font-medium text-black/50">4 Oct 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/61-custom-rest-directive-with-graphql-tools"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Build a REST directive with GraphQL Tools" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F61-custom-rest-directive-with-graphql-tools.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F61-custom-rest-directive-with-graphql-tools.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F61-custom-rest-directive-with-graphql-tools.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F61-custom-rest-directive-with-graphql-tools.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F61-custom-rest-directive-with-graphql-tools.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F61-custom-rest-directive-with-graphql-tools.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F61-custom-rest-directive-with-graphql-tools.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F61-custom-rest-directive-with-graphql-tools.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F61-custom-rest-directive-with-graphql-tools.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Build a REST directive with GraphQL Tools</p><p class="text-sm text-black">Learn how to build a custom @rest directive with GraphQL Tools to resolve data from a JSON API.</p></div><div class=""><p class="text-sm font-medium text-black/50">26 Sept 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/60-code-first-graphql-with-pothos"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Code-first GraphQL with Pothos" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F60-code-first-graphql-with-pothos.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F60-code-first-graphql-with-pothos.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F60-code-first-graphql-with-pothos.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F60-code-first-graphql-with-pothos.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F60-code-first-graphql-with-pothos.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F60-code-first-graphql-with-pothos.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F60-code-first-graphql-with-pothos.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F60-code-first-graphql-with-pothos.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F60-code-first-graphql-with-pothos.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Code-first GraphQL with Pothos</p><p class="text-sm text-black">Learn to build a GraphQL schema with Pothos using the "code-first" approach.</p></div><div class=""><p class="text-sm font-medium text-black/50">19 Sept 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/59-graphql-explorer-plugin-with-graphiql"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Explorer Plugin with GraphiQL" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F59-graphql-explorer-plugin-with-graphiql.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F59-graphql-explorer-plugin-with-graphiql.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F59-graphql-explorer-plugin-with-graphiql.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F59-graphql-explorer-plugin-with-graphiql.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F59-graphql-explorer-plugin-with-graphiql.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F59-graphql-explorer-plugin-with-graphiql.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F59-graphql-explorer-plugin-with-graphiql.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F59-graphql-explorer-plugin-with-graphiql.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F59-graphql-explorer-plugin-with-graphiql.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Explorer Plugin with GraphiQL</p><p class="text-sm text-black">Learn how to use the new plugin ecosystem with GraphiQL to install GraphQL Explorer. Execute GraphQL operations with a click!</p></div><div class=""><p class="text-sm font-medium text-black/50">12 Sept 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/58-graphql-queries-and-mutations-with-react-swr"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Queries and Mutations with useSWR" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F58-graphql-queries-and-mutations-with-react-swr.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F58-graphql-queries-and-mutations-with-react-swr.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F58-graphql-queries-and-mutations-with-react-swr.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F58-graphql-queries-and-mutations-with-react-swr.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F58-graphql-queries-and-mutations-with-react-swr.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F58-graphql-queries-and-mutations-with-react-swr.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F58-graphql-queries-and-mutations-with-react-swr.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F58-graphql-queries-and-mutations-with-react-swr.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F58-graphql-queries-and-mutations-with-react-swr.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Queries and Mutations with useSWR</p><p class="text-sm text-black">Learn how to use SWR with GraphQL to query and mutate data. Also use the internal mutate method provided by SWR to update specific SWR values.</p></div><div class=""><p class="text-sm font-medium text-black/50">5 Sept 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/57-working-with-graphiql-2"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Working with GraphiQL 2" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F57-working-with-graphiql-2.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F57-working-with-graphiql-2.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F57-working-with-graphiql-2.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F57-working-with-graphiql-2.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F57-working-with-graphiql-2.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F57-working-with-graphiql-2.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F57-working-with-graphiql-2.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F57-working-with-graphiql-2.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F57-working-with-graphiql-2.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Working with GraphiQL 2</p><p class="text-sm text-black">Learn how to perform GraphQL operations, variables, headers, view documentation, merge fragments, and more with GraphiQL 2.</p></div><div class=""><p class="text-sm font-medium text-black/50">29 Aug 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/56-graphql-yoga-subscriptions-with-redis"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Yoga Subscriptions with Redis" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F56-graphql-yoga-subscriptions-with-redis.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F56-graphql-yoga-subscriptions-with-redis.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F56-graphql-yoga-subscriptions-with-redis.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F56-graphql-yoga-subscriptions-with-redis.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F56-graphql-yoga-subscriptions-with-redis.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F56-graphql-yoga-subscriptions-with-redis.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F56-graphql-yoga-subscriptions-with-redis.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F56-graphql-yoga-subscriptions-with-redis.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F56-graphql-yoga-subscriptions-with-redis.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Yoga Subscriptions with Redis</p><p class="text-sm text-black">Use Redis with Yoga for managing the GraphQL Subscriptions PubSub bus.</p></div><div class=""><p class="text-sm font-medium text-black/50">22 Aug 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/55-graphql-armor"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Secure APIs with GraphQL Armor" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F55-graphql-armor.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F55-graphql-armor.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F55-graphql-armor.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F55-graphql-armor.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F55-graphql-armor.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F55-graphql-armor.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F55-graphql-armor.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F55-graphql-armor.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F55-graphql-armor.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Secure APIs with GraphQL Armor</p><p class="text-sm text-black">Secure your API with customizable security middleware built for almost any JavaScript based GraphQL engine.</p></div><div class=""><p class="text-sm font-medium text-black/50">15 Aug 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/54-graphql-live-queries"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Live Queries" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F54-graphql-live-queries.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F54-graphql-live-queries.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F54-graphql-live-queries.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F54-graphql-live-queries.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F54-graphql-live-queries.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F54-graphql-live-queries.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F54-graphql-live-queries.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F54-graphql-live-queries.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F54-graphql-live-queries.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Live Queries</p><p class="text-sm text-black">Explore working with live in-memory GraphQL queries using Yoga, Envelop, and a custom execute function.</p></div><div class=""><p class="text-sm font-medium text-black/50">7 Aug 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/53-apollo-client-cache-data-normalization"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Apollo Client Cache Data Normalization" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F53-apollo-client-cache-data-normalization.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F53-apollo-client-cache-data-normalization.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F53-apollo-client-cache-data-normalization.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F53-apollo-client-cache-data-normalization.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F53-apollo-client-cache-data-normalization.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F53-apollo-client-cache-data-normalization.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F53-apollo-client-cache-data-normalization.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F53-apollo-client-cache-data-normalization.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F53-apollo-client-cache-data-normalization.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Apollo Client Cache Data Normalization</p><p class="text-sm text-black">Explore the Apollo DevTools to explore how data is normalized, and stored in the client cache.</p></div><div class=""><p class="text-sm font-medium text-black/50">1 Aug 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/52-graphql-subscriptions-with-server-sent-events"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Subscriptions with Server Sent Events" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F52-graphql-subscriptions-with-server-sent-events.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F52-graphql-subscriptions-with-server-sent-events.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F52-graphql-subscriptions-with-server-sent-events.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F52-graphql-subscriptions-with-server-sent-events.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F52-graphql-subscriptions-with-server-sent-events.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F52-graphql-subscriptions-with-server-sent-events.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F52-graphql-subscriptions-with-server-sent-events.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F52-graphql-subscriptions-with-server-sent-events.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F52-graphql-subscriptions-with-server-sent-events.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Subscriptions with Server Sent Events</p><p class="text-sm text-black">Learn how to subscribe, and post to PubSub topics using GraphQL Subscriptions, Server Sent Events, and GraphQL Yoga.</p></div><div class=""><p class="text-sm font-medium text-black/50">25 Jul 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/51-graphql-to-postman-collection-with-graphman"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL to Postman collection with GraphMan" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F51-graphql-to-postman-collection-with-graphman.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F51-graphql-to-postman-collection-with-graphman.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F51-graphql-to-postman-collection-with-graphman.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F51-graphql-to-postman-collection-with-graphman.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F51-graphql-to-postman-collection-with-graphman.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F51-graphql-to-postman-collection-with-graphman.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F51-graphql-to-postman-collection-with-graphman.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F51-graphql-to-postman-collection-with-graphman.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F51-graphql-to-postman-collection-with-graphman.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL to Postman collection with GraphMan</p><p class="text-sm text-black">Learn how you can quickly create a Postman, or Insomnia collection from your GraphQL API using GraphMan.</p></div><div class=""><p class="text-sm font-medium text-black/50">18 Jul 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/50-what-is-graphql"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="What is GraphQL?" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F50-what-is-graphql.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F50-what-is-graphql.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F50-what-is-graphql.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F50-what-is-graphql.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F50-what-is-graphql.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F50-what-is-graphql.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F50-what-is-graphql.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F50-what-is-graphql.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F50-what-is-graphql.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">What is GraphQL?</p><p class="text-sm text-black">Let's talk about what GraphQL is, and can what it can do, with Kirupa Chinnathambi (Product Manager at Google).</p></div><div class=""><p class="text-sm font-medium text-black/50">11 Jul 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/49-generate-typescript-types-from-graphql"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Generate TypeScript Types from GraphQL" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F49-generate-typescript-types-from-graphql.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F49-generate-typescript-types-from-graphql.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F49-generate-typescript-types-from-graphql.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F49-generate-typescript-types-from-graphql.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F49-generate-typescript-types-from-graphql.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F49-generate-typescript-types-from-graphql.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F49-generate-typescript-types-from-graphql.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F49-generate-typescript-types-from-graphql.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F49-generate-typescript-types-from-graphql.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Generate TypeScript Types from GraphQL</p><p class="text-sm text-black">Automatically generate types for your local or remote GraphQL schema, and operations for better type-safety.</p></div><div class=""><p class="text-sm font-medium text-black/50">4 Jul 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/48-graphql-yoga-cloudflare-workers-kv"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Yoga with Cloudflare Workers KV" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F48-graphql-yoga-cloudflare-workers-kv.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F48-graphql-yoga-cloudflare-workers-kv.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F48-graphql-yoga-cloudflare-workers-kv.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F48-graphql-yoga-cloudflare-workers-kv.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F48-graphql-yoga-cloudflare-workers-kv.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F48-graphql-yoga-cloudflare-workers-kv.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F48-graphql-yoga-cloudflare-workers-kv.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F48-graphql-yoga-cloudflare-workers-kv.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F48-graphql-yoga-cloudflare-workers-kv.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Yoga with Cloudflare Workers KV</p><p class="text-sm text-black">Build a GraphQL server at the edge with Cloudflare Workers, and KV for edge key/value storage.</p></div><div class=""><p class="text-sm font-medium text-black/50">27 Jun 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/47-operation-field-permissions-with-envelop"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Operation field permissions with Envelop" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F47-operation-field-permissions-with-envelop.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F47-operation-field-permissions-with-envelop.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F47-operation-field-permissions-with-envelop.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F47-operation-field-permissions-with-envelop.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F47-operation-field-permissions-with-envelop.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F47-operation-field-permissions-with-envelop.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F47-operation-field-permissions-with-envelop.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F47-operation-field-permissions-with-envelop.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F47-operation-field-permissions-with-envelop.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Operation field permissions with Envelop</p><p class="text-sm text-black">Allow or deny GraphQL operations based on how you configure GraphQL server context using the Envelop plugin system.</p></div><div class=""><p class="text-sm font-medium text-black/50">20 Jun 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/46-graphql-mesh-extended-types"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Mesh Extended Types" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F46-graphql-mesh-extended-types.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F46-graphql-mesh-extended-types.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F46-graphql-mesh-extended-types.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F46-graphql-mesh-extended-types.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F46-graphql-mesh-extended-types.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F46-graphql-mesh-extended-types.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F46-graphql-mesh-extended-types.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F46-graphql-mesh-extended-types.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F46-graphql-mesh-extended-types.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Mesh Extended Types</p><p class="text-sm text-black">Learn how to extend types from one GraphQL API to resolve the data provided by another, using GraphQL Mesh.</p></div><div class=""><p class="text-sm font-medium text-black/50">13 Jun 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/45-the-graph-client"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="The Graph Client" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F45-the-graph-client.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F45-the-graph-client.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F45-the-graph-client.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F45-the-graph-client.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F45-the-graph-client.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F45-the-graph-client.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F45-the-graph-client.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F45-the-graph-client.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F45-the-graph-client.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">The Graph Client</p><p class="text-sm text-black">Generate a fully typed SDK automatically to query the Ethereum network using The Graph Client.</p></div><div class=""><p class="text-sm font-medium text-black/50">6 Jun 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/44-working-with-graphiql"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Working with GraphiQL" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F44-working-with-graphiql.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F44-working-with-graphiql.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F44-working-with-graphiql.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F44-working-with-graphiql.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F44-working-with-graphiql.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F44-working-with-graphiql.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F44-working-with-graphiql.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F44-working-with-graphiql.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F44-working-with-graphiql.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Working with GraphiQL</p><p class="text-sm text-black">Explore how to work with GraphiQL to explore documentation, perform operations, tabs, prettify operations, variables, request headers, and more.</p></div><div class=""><p class="text-sm font-medium text-black/50">30 May 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/43-schema-or-code-first-graphql"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Schema-first or code-first GraphQL" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F43-schema-or-code-first-graphql.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F43-schema-or-code-first-graphql.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F43-schema-or-code-first-graphql.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F43-schema-or-code-first-graphql.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F43-schema-or-code-first-graphql.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F43-schema-or-code-first-graphql.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F43-schema-or-code-first-graphql.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F43-schema-or-code-first-graphql.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F43-schema-or-code-first-graphql.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Schema-first or code-first GraphQL</p><p class="text-sm text-black">Getting started with GraphQL doesn't always mean you need to write your schema by hand. Instead you can use code-first tools to define both your type definitions and resolvers.</p></div><div class=""><p class="text-sm font-medium text-black/50">23 May 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/42-graphql-nullability"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Nullability" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F42-graphql-nullability.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F42-graphql-nullability.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F42-graphql-nullability.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F42-graphql-nullability.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F42-graphql-nullability.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F42-graphql-nullability.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F42-graphql-nullability.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F42-graphql-nullability.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F42-graphql-nullability.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Nullability</p><p class="text-sm text-black">Learn how to define nullable and non-nullable fields your GraphQL schema with the schema-first approach.</p></div><div class=""><p class="text-sm font-medium text-black/50">15 May 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/41-typed-document-node"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Typed Document Node" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F41-typed-document-node.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F41-typed-document-node.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F41-typed-document-node.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F41-typed-document-node.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F41-typed-document-node.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F41-typed-document-node.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F41-typed-document-node.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F41-typed-document-node.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F41-typed-document-node.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Typed Document Node</p><p class="text-sm text-black">Generate a DocumentNode automatically for GraphQL operations, and the typescript signature it represents for better use with GraphQL clients.</p></div><div class=""><p class="text-sm font-medium text-black/50">9 May 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/40-batching-with-dataloader"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Batching with DataLoader" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F40-batching-with-dataloader.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F40-batching-with-dataloader.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F40-batching-with-dataloader.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F40-batching-with-dataloader.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F40-batching-with-dataloader.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F40-batching-with-dataloader.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F40-batching-with-dataloader.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F40-batching-with-dataloader.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F40-batching-with-dataloader.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Batching with DataLoader</p><p class="text-sm text-black">Reduce overloading your database by batching requests. Discover how to instantiate, and share dataloaders through server context, and pass request headers to your dataloader.</p></div><div class=""><p class="text-sm font-medium text-black/50">2 May 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/39-graphql-mutations-and-input-types"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Mutations and Input Types" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F39-graphql-mutations-and-input-types.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F39-graphql-mutations-and-input-types.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F39-graphql-mutations-and-input-types.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F39-graphql-mutations-and-input-types.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F39-graphql-mutations-and-input-types.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F39-graphql-mutations-and-input-types.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F39-graphql-mutations-and-input-types.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F39-graphql-mutations-and-input-types.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F39-graphql-mutations-and-input-types.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Mutations and Input Types</p><p class="text-sm text-black">Avoid bloating mutations with arguments, and instead opt to use input types you can extend over time. Explore naming conventions for input types, how to define them, and use them with variables.</p></div><div class=""><p class="text-sm font-medium text-black/50">25 Apr 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/38-documenting-your-graphql-sdl-with-descriptions"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Documenting your GraphQL SDL with Descriptions" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F38-documenting-your-graphql-sdl-with-descriptions.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F38-documenting-your-graphql-sdl-with-descriptions.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F38-documenting-your-graphql-sdl-with-descriptions.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F38-documenting-your-graphql-sdl-with-descriptions.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F38-documenting-your-graphql-sdl-with-descriptions.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F38-documenting-your-graphql-sdl-with-descriptions.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F38-documenting-your-graphql-sdl-with-descriptions.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F38-documenting-your-graphql-sdl-with-descriptions.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F38-documenting-your-graphql-sdl-with-descriptions.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Documenting your GraphQL SDL with Descriptions</p><p class="text-sm text-black">Add descriptions to your GraphQL schema to provide a better developer experience for consumers of your API. Descriptions also support markdown, so you format text, add links to further documentation, and more.</p></div><div class=""><p class="text-sm font-medium text-black/50">18 Apr 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/37-svelte-graphql-and-kitql"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Svelte, GraphQL, and KitQL" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F37-svelte-graphql-and-kitql.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F37-svelte-graphql-and-kitql.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F37-svelte-graphql-and-kitql.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F37-svelte-graphql-and-kitql.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F37-svelte-graphql-and-kitql.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F37-svelte-graphql-and-kitql.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F37-svelte-graphql-and-kitql.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F37-svelte-graphql-and-kitql.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F37-svelte-graphql-and-kitql.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Svelte, GraphQL, and KitQL</p><p class="text-sm text-black">KitQL automatically generates Svelte stores for all of your GraphQL operations, and manages caching data between the client, and server. Optimistically update mutations with patching, and more.</p></div><div class=""><p class="text-sm font-medium text-black/50">11 Apr 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/36-graphql-yoga-2"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Yoga 2" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F36-graphql-yoga-2.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F36-graphql-yoga-2.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F36-graphql-yoga-2.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F36-graphql-yoga-2.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F36-graphql-yoga-2.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F36-graphql-yoga-2.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F36-graphql-yoga-2.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F36-graphql-yoga-2.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F36-graphql-yoga-2.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Yoga 2</p><p class="text-sm text-black">It's time to relax with GraphQL Yoga. In this video we'll explore how easy it is to get started building a GraphQL Server with GraphQL Yoga. Featuring Subscriptions, Error Masking, and Plugins.</p></div><div class=""><p class="text-sm font-medium text-black/50">4 Apr 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/35-context-with-response-cache-plugin"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Context with Response Cache Plugin" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F35-context-with-response-cache-plugin.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F35-context-with-response-cache-plugin.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F35-context-with-response-cache-plugin.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F35-context-with-response-cache-plugin.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F35-context-with-response-cache-plugin.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F35-context-with-response-cache-plugin.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F35-context-with-response-cache-plugin.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F35-context-with-response-cache-plugin.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F35-context-with-response-cache-plugin.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Context with Response Cache Plugin</p><p class="text-sm text-black">Enable or disable caching, and/or prevent leaking sensitive data with other users using the context argument for the Envelop plugin "Response Cache".</p></div><div class=""><p class="text-sm font-medium text-black/50">28 Mar 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/34-response-cache-plugin-with-envelop"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Response Cache Plugin with Envelop" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F34-response-cache-plugin-with-envelop.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F34-response-cache-plugin-with-envelop.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F34-response-cache-plugin-with-envelop.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F34-response-cache-plugin-with-envelop.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F34-response-cache-plugin-with-envelop.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F34-response-cache-plugin-with-envelop.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F34-response-cache-plugin-with-envelop.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F34-response-cache-plugin-with-envelop.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F34-response-cache-plugin-with-envelop.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Response Cache Plugin with Envelop</p><p class="text-sm text-black">Skip the GraphQL execution phase with the response cache plugin for Envelop. Set TTL for types and fields, as well as cache results in-memory, or with your own KV store.</p></div><div class=""><p class="text-sm font-medium text-black/50">21 Mar 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/33-lazy-queries-with-apollo-client"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Execute lazy queries with React Apollo Client" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F33-lazy-queries-with-apollo-client.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F33-lazy-queries-with-apollo-client.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F33-lazy-queries-with-apollo-client.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F33-lazy-queries-with-apollo-client.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F33-lazy-queries-with-apollo-client.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F33-lazy-queries-with-apollo-client.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F33-lazy-queries-with-apollo-client.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F33-lazy-queries-with-apollo-client.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F33-lazy-queries-with-apollo-client.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Execute lazy queries with React Apollo Client</p><p class="text-sm text-black">Execute GraphQL queries in response to events made by your application using the useLazyQuery hook.</p></div><div class=""><p class="text-sm font-medium text-black/50">14 Mar 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/32-graphql-caching-with-graphcdn"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Caching with GraphCDN" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F32-graphql-caching-with-graphcdn.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F32-graphql-caching-with-graphcdn.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F32-graphql-caching-with-graphcdn.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F32-graphql-caching-with-graphcdn.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F32-graphql-caching-with-graphcdn.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F32-graphql-caching-with-graphcdn.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F32-graphql-caching-with-graphcdn.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F32-graphql-caching-with-graphcdn.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F32-graphql-caching-with-graphcdn.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Caching with GraphCDN</p><p class="text-sm text-black">Make your GraphQL API faster with caching using GraphCDN. Monitor API health with error monitoring, and alerts, as well as analytics for operations made to your endpoint.</p></div><div class=""><p class="text-sm font-medium text-black/50">7 Mar 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/31-type-safe-graphql-server-context"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Type safe GraphQL server context" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F31-type-safe-graphql-server-context.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F31-type-safe-graphql-server-context.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F31-type-safe-graphql-server-context.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F31-type-safe-graphql-server-context.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F31-type-safe-graphql-server-context.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F31-type-safe-graphql-server-context.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F31-type-safe-graphql-server-context.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F31-type-safe-graphql-server-context.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F31-type-safe-graphql-server-context.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Type safe GraphQL server context</p><p class="text-sm text-black">Add type safety to your GraphQL server context with GraphQL Code Generator plugin "TypeScript Resolvers".</p></div><div class=""><p class="text-sm font-medium text-black/50">28 Feb 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/30-graphql-error-handling-with-union-types"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Error Handling with Union Types" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F30-graphql-error-handling-with-union-types.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F30-graphql-error-handling-with-union-types.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F30-graphql-error-handling-with-union-types.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F30-graphql-error-handling-with-union-types.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F30-graphql-error-handling-with-union-types.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F30-graphql-error-handling-with-union-types.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F30-graphql-error-handling-with-union-types.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F30-graphql-error-handling-with-union-types.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F30-graphql-error-handling-with-union-types.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Error Handling with Union Types</p><p class="text-sm text-black">Implement better error handling with GraphQL by using the Type System.</p></div><div class=""><p class="text-sm font-medium text-black/50">21 Feb 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/29-apollo-client-3-with-graphql-code-generator"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Apollo Client 3 with GraphQL Code Generator" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F29-apollo-client-3-with-graphql-code-generator.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F29-apollo-client-3-with-graphql-code-generator.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F29-apollo-client-3-with-graphql-code-generator.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F29-apollo-client-3-with-graphql-code-generator.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F29-apollo-client-3-with-graphql-code-generator.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F29-apollo-client-3-with-graphql-code-generator.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F29-apollo-client-3-with-graphql-code-generator.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F29-apollo-client-3-with-graphql-code-generator.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F29-apollo-client-3-with-graphql-code-generator.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Apollo Client 3 with GraphQL Code Generator</p><p class="text-sm text-black">Automatically generate code for Apollo Client 3 hooks with GraphQL Code Generator using operations stored inside of your codebase.</p></div><div class=""><p class="text-sm font-medium text-black/50">14 Feb 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/28-graphql-schema-mocking-with-graphql-tools"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Schema Mocking with GraphQL Tools" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F28-graphql-schema-mocking-with-graphql-tools.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F28-graphql-schema-mocking-with-graphql-tools.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F28-graphql-schema-mocking-with-graphql-tools.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F28-graphql-schema-mocking-with-graphql-tools.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F28-graphql-schema-mocking-with-graphql-tools.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F28-graphql-schema-mocking-with-graphql-tools.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F28-graphql-schema-mocking-with-graphql-tools.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F28-graphql-schema-mocking-with-graphql-tools.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F28-graphql-schema-mocking-with-graphql-tools.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Schema Mocking with GraphQL Tools</p><p class="text-sm text-black">Build faster frontends with mocking. Enable frontend teams to focus on building functionality and UI without waiting for the backend implementation.</p></div><div class=""><p class="text-sm font-medium text-black/50">7 Feb 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/27-remote-graphql-schema-introspection-codegen"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Remote GraphQL Schema Introspection Codegen" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F27-remote-graphql-schema-introspection-codegen.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F27-remote-graphql-schema-introspection-codegen.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F27-remote-graphql-schema-introspection-codegen.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F27-remote-graphql-schema-introspection-codegen.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F27-remote-graphql-schema-introspection-codegen.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F27-remote-graphql-schema-introspection-codegen.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F27-remote-graphql-schema-introspection-codegen.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F27-remote-graphql-schema-introspection-codegen.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F27-remote-graphql-schema-introspection-codegen.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Remote GraphQL Schema Introspection Codegen</p><p class="text-sm text-black">Automatically introspect your stitched GraphQL schemas endpoints, and use the results to execute requests to remote schemas.</p></div><div class=""><p class="text-sm font-medium text-black/50">31 Jan 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/26-type-safe-resolvers-with-graphql-code-generator"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Type safe resolvers with GraphQL Code Generator" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F26-type-safe-resolvers-with-graphql-code-generator.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F26-type-safe-resolvers-with-graphql-code-generator.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F26-type-safe-resolvers-with-graphql-code-generator.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F26-type-safe-resolvers-with-graphql-code-generator.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F26-type-safe-resolvers-with-graphql-code-generator.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F26-type-safe-resolvers-with-graphql-code-generator.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F26-type-safe-resolvers-with-graphql-code-generator.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F26-type-safe-resolvers-with-graphql-code-generator.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F26-type-safe-resolvers-with-graphql-code-generator.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Type safe resolvers with GraphQL Code Generator</p><p class="text-sm text-black">Detect errors while building your GraphQL API at build time instead of runtime with TypeScript. Also learn how to use resolver maps to separate database/GraphQL types.</p></div><div class=""><p class="text-sm font-medium text-black/50">24 Jan 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/25-graphql-introspection"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Introspection" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F25-graphql-introspection.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F25-graphql-introspection.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F25-graphql-introspection.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F25-graphql-introspection.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F25-graphql-introspection.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F25-graphql-introspection.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F25-graphql-introspection.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F25-graphql-introspection.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F25-graphql-introspection.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Introspection</p><p class="text-sm text-black">Learn about the built-in GraphQL introspection system, and how you can find out more about the schema using GraphQL queries.</p></div><div class=""><p class="text-sm font-medium text-black/50">17 Jan 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/24-graphql-yoga"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Yoga" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F24-graphql-yoga.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F24-graphql-yoga.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F24-graphql-yoga.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F24-graphql-yoga.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F24-graphql-yoga.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F24-graphql-yoga.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F24-graphql-yoga.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F24-graphql-yoga.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F24-graphql-yoga.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Yoga</p><p class="text-sm text-black">Fully-featured GraphQL Server with focus on easy setup, performance and great developer experience.</p></div><div class=""><p class="text-sm font-medium text-black/50">10 Jan 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/23-merge-resolvers-with-graphql-tools"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Merge Resolvers with GraphQL Tools" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F23-merge-resolvers-with-graphql-tools.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F23-merge-resolvers-with-graphql-tools.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F23-merge-resolvers-with-graphql-tools.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F23-merge-resolvers-with-graphql-tools.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F23-merge-resolvers-with-graphql-tools.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F23-merge-resolvers-with-graphql-tools.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F23-merge-resolvers-with-graphql-tools.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F23-merge-resolvers-with-graphql-tools.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F23-merge-resolvers-with-graphql-tools.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Merge Resolvers with GraphQL Tools</p><p class="text-sm text-black">Load and merge GraphQL resolvers from multiple files using GraphQL Tools.</p></div><div class=""><p class="text-sm font-medium text-black/50">3 Jan 2022</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/22-graphql-schema-file-loading-with-graphql-tools"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL schema file loading with GraphQL Tools" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F22-graphql-schema-file-loading-with-graphql-tools.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F22-graphql-schema-file-loading-with-graphql-tools.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F22-graphql-schema-file-loading-with-graphql-tools.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F22-graphql-schema-file-loading-with-graphql-tools.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F22-graphql-schema-file-loading-with-graphql-tools.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F22-graphql-schema-file-loading-with-graphql-tools.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F22-graphql-schema-file-loading-with-graphql-tools.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F22-graphql-schema-file-loading-with-graphql-tools.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F22-graphql-schema-file-loading-with-graphql-tools.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL schema file loading with GraphQL Tools</p><p class="text-sm text-black">Load GraphQL schema from a single file, or multiple using the GraphQL File Loader.</p></div><div class=""><p class="text-sm font-medium text-black/50">27 Dec 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/21-detect-breaking-graphql-schema-changes-with-github-actions"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Detect breaking GraphQL schema changes with GitHub Actions" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F21-detect-breaking-graphql-schema-changes-with-github-actions.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F21-detect-breaking-graphql-schema-changes-with-github-actions.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F21-detect-breaking-graphql-schema-changes-with-github-actions.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F21-detect-breaking-graphql-schema-changes-with-github-actions.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F21-detect-breaking-graphql-schema-changes-with-github-actions.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F21-detect-breaking-graphql-schema-changes-with-github-actions.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F21-detect-breaking-graphql-schema-changes-with-github-actions.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F21-detect-breaking-graphql-schema-changes-with-github-actions.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F21-detect-breaking-graphql-schema-changes-with-github-actions.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Detect breaking GraphQL schema changes with GitHub Actions</p><p class="text-sm text-black">Learn how to configure a GitHub Action to automatically detect breaking schema changes when new Pull Requests are opened.</p></div><div class=""><p class="text-sm font-medium text-black/50">20 Dec 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/20-graphql-context-argument"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Context Argument" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F20-graphql-context-argument.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F20-graphql-context-argument.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F20-graphql-context-argument.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F20-graphql-context-argument.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F20-graphql-context-argument.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F20-graphql-context-argument.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F20-graphql-context-argument.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F20-graphql-context-argument.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F20-graphql-context-argument.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Context Argument</p><p class="text-sm text-black">Learn how to use the context argument to share things like database connections, dataloaders, and more across requests.</p></div><div class=""><p class="text-sm font-medium text-black/50">13 Dec 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/19-metered-graphql-api-usage-billing-with-stripe"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Metered GraphQL API usage billing with Stripe" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F19-metered-graphql-api-usage-billing-with-stripe.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F19-metered-graphql-api-usage-billing-with-stripe.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F19-metered-graphql-api-usage-billing-with-stripe.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F19-metered-graphql-api-usage-billing-with-stripe.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F19-metered-graphql-api-usage-billing-with-stripe.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F19-metered-graphql-api-usage-billing-with-stripe.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F19-metered-graphql-api-usage-billing-with-stripe.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F19-metered-graphql-api-usage-billing-with-stripe.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F19-metered-graphql-api-usage-billing-with-stripe.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Metered GraphQL API usage billing with Stripe</p><p class="text-sm text-black">Charge users of your GraphQL API per request with Stripe's metered billing.</p></div><div class=""><p class="text-sm font-medium text-black/50">6 Dec 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/18-remix-graphql"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Remix + GraphQL Request" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F18-remix-graphql.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F18-remix-graphql.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F18-remix-graphql.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F18-remix-graphql.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F18-remix-graphql.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F18-remix-graphql.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F18-remix-graphql.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F18-remix-graphql.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F18-remix-graphql.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Remix + GraphQL Request</p><p class="text-sm text-black">Discover how to fetch data on the server with Remix loaders, and link between pages using the Remix Web Framework.</p></div><div class=""><p class="text-sm font-medium text-black/50">29 Nov 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/17-graphql-union-types-and-graphql-tools"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Union Types and GraphQL Tools" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F17-graphql-union-types-and-graphql-tools.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F17-graphql-union-types-and-graphql-tools.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F17-graphql-union-types-and-graphql-tools.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F17-graphql-union-types-and-graphql-tools.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F17-graphql-union-types-and-graphql-tools.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F17-graphql-union-types-and-graphql-tools.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F17-graphql-union-types-and-graphql-tools.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F17-graphql-union-types-and-graphql-tools.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F17-graphql-union-types-and-graphql-tools.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Union Types and GraphQL Tools</p><p class="text-sm text-black">Learn how to define a GraphQL Union Type using GraphQL Tools.</p></div><div class=""><p class="text-sm font-medium text-black/50">22 Nov 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/16-graphql-helix-api-route-with-nextjs"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Helix API Route with Next.js" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F16-graphql-helix-api-route-with-nextjs.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F16-graphql-helix-api-route-with-nextjs.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F16-graphql-helix-api-route-with-nextjs.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F16-graphql-helix-api-route-with-nextjs.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F16-graphql-helix-api-route-with-nextjs.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F16-graphql-helix-api-route-with-nextjs.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F16-graphql-helix-api-route-with-nextjs.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F16-graphql-helix-api-route-with-nextjs.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F16-graphql-helix-api-route-with-nextjs.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Helix API Route with Next.js</p><p class="text-sm text-black">We'll use utility functions from GraphQL Helix to process requests inside our API route made from the Next.js frontend.</p></div><div class=""><p class="text-sm font-medium text-black/50">15 Nov 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/15-graphql-mesh-sdk-with-nextjs"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Mesh SDK with Next.js" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F15-graphql-mesh-sdk-with-nextjs.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F15-graphql-mesh-sdk-with-nextjs.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F15-graphql-mesh-sdk-with-nextjs.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F15-graphql-mesh-sdk-with-nextjs.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F15-graphql-mesh-sdk-with-nextjs.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F15-graphql-mesh-sdk-with-nextjs.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F15-graphql-mesh-sdk-with-nextjs.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F15-graphql-mesh-sdk-with-nextjs.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F15-graphql-mesh-sdk-with-nextjs.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Mesh SDK with Next.js</p><p class="text-sm text-black">Combine multiple GraphQL Mesh sources as a single GraphQL API, and extend types from one source to include another. Then generate a SDK that can be used on the server to fetch data for a Next.js page.</p></div><div class=""><p class="text-sm font-medium text-black/50">8 Nov 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/14-graphql-query-depth-limiting-with-express"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Query Depth Limiting with Express" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F14-graphql-query-depth-limiting-with-express.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F14-graphql-query-depth-limiting-with-express.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F14-graphql-query-depth-limiting-with-express.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F14-graphql-query-depth-limiting-with-express.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F14-graphql-query-depth-limiting-with-express.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F14-graphql-query-depth-limiting-with-express.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F14-graphql-query-depth-limiting-with-express.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F14-graphql-query-depth-limiting-with-express.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F14-graphql-query-depth-limiting-with-express.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Query Depth Limiting with Express</p><p class="text-sm text-black">Learn how to add validation rules to Express GraphQL to set a depth limit on queries.</p></div><div class=""><p class="text-sm font-medium text-black/50">1 Nov 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/13-graphql-fragments"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Fragments" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F13-graphql-fragments.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F13-graphql-fragments.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F13-graphql-fragments.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F13-graphql-fragments.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F13-graphql-fragments.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F13-graphql-fragments.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F13-graphql-fragments.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F13-graphql-fragments.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F13-graphql-fragments.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Fragments</p><p class="text-sm text-black">Learn how to work with GraphQL Fragments inside Queries and Mutations together with variables, and nested fragments.</p></div><div class=""><p class="text-sm font-medium text-black/50">25 Oct 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/12-graphql-remote-schema-stitching"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Remote Schema Stitching" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F12-graphql-remote-schema-stitching.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F12-graphql-remote-schema-stitching.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F12-graphql-remote-schema-stitching.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F12-graphql-remote-schema-stitching.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F12-graphql-remote-schema-stitching.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F12-graphql-remote-schema-stitching.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F12-graphql-remote-schema-stitching.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F12-graphql-remote-schema-stitching.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F12-graphql-remote-schema-stitching.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Remote Schema Stitching</p><p class="text-sm text-black">Stitch together remote APIs using GraphQL Tools, and delegate requests across schemas.</p></div><div class=""><p class="text-sm font-medium text-black/50">18 Oct 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/11-express-graphql-mongodb"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Express GraphQL + MongoDB" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F11-express-graphql-mongodb.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F11-express-graphql-mongodb.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F11-express-graphql-mongodb.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F11-express-graphql-mongodb.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F11-express-graphql-mongodb.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F11-express-graphql-mongodb.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F11-express-graphql-mongodb.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F11-express-graphql-mongodb.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F11-express-graphql-mongodb.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Express GraphQL + MongoDB</p><p class="text-sm text-black">Resolve queries and mutations with MongoDB.</p></div><div class=""><p class="text-sm font-medium text-black/50">11 Oct 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/10-graphql-fetch-api"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL + Fetch API" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F10-graphql-fetch-api.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F10-graphql-fetch-api.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F10-graphql-fetch-api.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F10-graphql-fetch-api.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F10-graphql-fetch-api.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F10-graphql-fetch-api.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F10-graphql-fetch-api.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F10-graphql-fetch-api.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F10-graphql-fetch-api.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL + Fetch API</p><p class="text-sm text-black">Execute GraphQL queries and mutations using the fetch API.</p></div><div class=""><p class="text-sm font-medium text-black/50">4 Oct 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/9-include-skip-and-deprecated-graphql-directives"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="include, skip and deprecated GraphQL Directives" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F9-include-skip-and-deprecated-graphql-directives.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F9-include-skip-and-deprecated-graphql-directives.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F9-include-skip-and-deprecated-graphql-directives.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F9-include-skip-and-deprecated-graphql-directives.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F9-include-skip-and-deprecated-graphql-directives.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F9-include-skip-and-deprecated-graphql-directives.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F9-include-skip-and-deprecated-graphql-directives.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F9-include-skip-and-deprecated-graphql-directives.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F9-include-skip-and-deprecated-graphql-directives.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">include, skip and deprecated GraphQL Directives</p><p class="text-sm text-black">Learn how to work with @include, @skip, and @deprecated built-in GraphQL directives.</p></div><div class=""><p class="text-sm font-medium text-black/50">27 Sept 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/8-graphql-variables-with-queries-and-mutations"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Variables with Queries and Mutations" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F8-graphql-variables-with-queries-and-mutations.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F8-graphql-variables-with-queries-and-mutations.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F8-graphql-variables-with-queries-and-mutations.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F8-graphql-variables-with-queries-and-mutations.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F8-graphql-variables-with-queries-and-mutations.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F8-graphql-variables-with-queries-and-mutations.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F8-graphql-variables-with-queries-and-mutations.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F8-graphql-variables-with-queries-and-mutations.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F8-graphql-variables-with-queries-and-mutations.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Variables with Queries and Mutations</p><p class="text-sm text-black">Learn how to use GraphQL variables with your queries and mutations.</p></div><div class=""><p class="text-sm font-medium text-black/50">20 Sept 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/7-graphql-with-insomnia"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL with Insomnia" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F7-graphql-with-insomnia.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F7-graphql-with-insomnia.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F7-graphql-with-insomnia.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F7-graphql-with-insomnia.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F7-graphql-with-insomnia.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F7-graphql-with-insomnia.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F7-graphql-with-insomnia.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F7-graphql-with-insomnia.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F7-graphql-with-insomnia.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL with Insomnia</p><p class="text-sm text-black">Insomnia is open source, and offers a subscription service for teams to share and collaborate on designing APIs with Swagger, and share requests to APIs.</p></div><div class=""><p class="text-sm font-medium text-black/50">13 Sept 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/6-create-a-custom-scalar-type-for-email-address"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Create a custom Scalar Type for Email Address" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F6-create-a-custom-scalar-type-for-email-address.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F6-create-a-custom-scalar-type-for-email-address.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F6-create-a-custom-scalar-type-for-email-address.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F6-create-a-custom-scalar-type-for-email-address.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F6-create-a-custom-scalar-type-for-email-address.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F6-create-a-custom-scalar-type-for-email-address.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F6-create-a-custom-scalar-type-for-email-address.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F6-create-a-custom-scalar-type-for-email-address.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F6-create-a-custom-scalar-type-for-email-address.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Create a custom Scalar Type for Email Address</p><p class="text-sm text-black">We'll create a custom GraphQL Scalar for our email that is rfc822 compliant.</p></div><div class=""><p class="text-sm font-medium text-black/50">6 Sept 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/5-serverless-graphql-handler-with-vercel"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Serverless GraphQL handler with Vercel" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F5-serverless-graphql-handler-with-vercel.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F5-serverless-graphql-handler-with-vercel.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F5-serverless-graphql-handler-with-vercel.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F5-serverless-graphql-handler-with-vercel.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F5-serverless-graphql-handler-with-vercel.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F5-serverless-graphql-handler-with-vercel.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F5-serverless-graphql-handler-with-vercel.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F5-serverless-graphql-handler-with-vercel.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F5-serverless-graphql-handler-with-vercel.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Serverless GraphQL handler with Vercel</p><p class="text-sm text-black">Execute GraphQL queries and mutations inside a serverless function hosted by Vercel.</p></div><div class=""><p class="text-sm font-medium text-black/50">30 Aug 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/4-rename-graphql-fields-with-aliases"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Rename GraphQL fields with aliases" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F4-rename-graphql-fields-with-aliases.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F4-rename-graphql-fields-with-aliases.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F4-rename-graphql-fields-with-aliases.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F4-rename-graphql-fields-with-aliases.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F4-rename-graphql-fields-with-aliases.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F4-rename-graphql-fields-with-aliases.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F4-rename-graphql-fields-with-aliases.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F4-rename-graphql-fields-with-aliases.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F4-rename-graphql-fields-with-aliases.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Rename GraphQL fields with aliases</p><p class="text-sm text-black">Rename fields in responses, and request the same field with different arguments as new fields with GraphQL aliases.</p></div><div class=""><p class="text-sm font-medium text-black/50">23 Aug 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/3-authorization-with-graphql-shield"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Authorization with GraphQL Shield" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F3-authorization-with-graphql-shield.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F3-authorization-with-graphql-shield.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F3-authorization-with-graphql-shield.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F3-authorization-with-graphql-shield.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F3-authorization-with-graphql-shield.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F3-authorization-with-graphql-shield.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F3-authorization-with-graphql-shield.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F3-authorization-with-graphql-shield.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F3-authorization-with-graphql-shield.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Authorization with GraphQL Shield</p><p class="text-sm text-black">In this video we鈥檒l explore some of the logic and input rules that come with GraphQL Shield to protect against unwanted requests.</p></div><div class=""><p class="text-sm font-medium text-black/50">16 Aug 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/2-type-safe-graphql-queries-with-genql"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="Type safe GraphQL queries with genql" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F2-type-safe-graphql-queries-with-genql.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F2-type-safe-graphql-queries-with-genql.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F2-type-safe-graphql-queries-with-genql.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F2-type-safe-graphql-queries-with-genql.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F2-type-safe-graphql-queries-with-genql.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F2-type-safe-graphql-queries-with-genql.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F2-type-safe-graphql-queries-with-genql.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F2-type-safe-graphql-queries-with-genql.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F2-type-safe-graphql-queries-with-genql.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">Type safe GraphQL queries with genql</p><p class="text-sm text-black">Write type safe GraphQL queries with auto completion and type validation using genql.</p></div><div class=""><p class="text-sm font-medium text-black/50">9 Aug 2021</p></div></div></a></article><article><a class="group h-full flex flex-col" href="/episodes/1-graphql-mesh-as-a-gateway"><div class="flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform"><img alt="GraphQL Mesh as a Gateway" loading="lazy" decoding="async" data-nimg="fill" style="position:absolute;height:100%;width:100%;left:0;top:0;right:0;bottom:0;color:transparent" sizes="100vw" srcSet="/_next/image?url=%2Fepisodes%2F1-graphql-mesh-as-a-gateway.png&w=640&q=75 640w, /_next/image?url=%2Fepisodes%2F1-graphql-mesh-as-a-gateway.png&w=750&q=75 750w, /_next/image?url=%2Fepisodes%2F1-graphql-mesh-as-a-gateway.png&w=828&q=75 828w, /_next/image?url=%2Fepisodes%2F1-graphql-mesh-as-a-gateway.png&w=1080&q=75 1080w, /_next/image?url=%2Fepisodes%2F1-graphql-mesh-as-a-gateway.png&w=1200&q=75 1200w, /_next/image?url=%2Fepisodes%2F1-graphql-mesh-as-a-gateway.png&w=1920&q=75 1920w, /_next/image?url=%2Fepisodes%2F1-graphql-mesh-as-a-gateway.png&w=2048&q=75 2048w, /_next/image?url=%2Fepisodes%2F1-graphql-mesh-as-a-gateway.png&w=3840&q=75 3840w" src="/_next/image?url=%2Fepisodes%2F1-graphql-mesh-as-a-gateway.png&w=3840&q=75"/></div><div class="space-y-3 px-3 pt-3 flex flex-col justify-between flex-1"><div class="space-y-3"><p class="text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline">GraphQL Mesh as a Gateway</p><p class="text-sm text-black">GraphQL Mesh acts as a proxy to your existing APIs, and gives you the ultimate developer control over how data is retrieved. It doesn't matter if your API is GraphQL, gRPC, Swagger, Postgres, and non-typed APIs.</p></div><div class=""><p class="text-sm font-medium text-black/50">2 Aug 2021</p></div></div></a></article></div></div></div><div class="fixed inset-0 z-0 h-full w-full bg-[radial-gradient(#e5e7eb_1px,transparent_1px)] [background-size:16px_16px] [mask-image:radial-gradient(ellipse_50%_50%_at_50%_50%,#000_70%,transparent_100%)]"></div><footer class="relative z-30"><div class="mx-auto mt-6 max-w-xl overflow-hidden border-t border-black/10 px-6 py-20 md:mt-12 lg:mt-32 lg:px-8"><div class="mt-10 flex justify-center space-x-10"><a href="https://www.tiktok.com/@graphqlwtf" class="text-black/50 transition hover:text-black/100" target="_blank" rel="noopener noreferrer"><span class="sr-only">TikTok</span><svg fill="currentColor" viewBox="0 0 24 24" class="h-6 w-6" aria-hidden="true"><path d="M16 8.24537V15.5C16 19.0899 13.0899 22 9.5 22C5.91015 22 3 19.0899 3 15.5C3 11.9101 5.91015 9 9.5 9C10.0163 9 10.5185 9.06019 11 9.17393V12.3368C10.5454 12.1208 10.0368 12 9.5 12C7.567 12 6 13.567 6 15.5C6 17.433 7.567 19 9.5 19C11.433 19 13 17.433 13 15.5V2H16C16 4.76142 18.2386 7 21 7V10C19.1081 10 17.3696 9.34328 16 8.24537Z"></path></svg></a><a href="https://x.com/notrab" class="text-black/50 transition hover:text-black/100" target="_blank" rel="noopener noreferrer"><span class="sr-only">Twitter</span><svg fill="currentColor" viewBox="0 0 20 20" class="h-6 w-6" aria-hidden="true"><path d="M15.2033 1.875H17.9599L11.9374 8.75833L19.0224 18.125H13.4749L9.12992 12.4442L4.15826 18.125H1.39992L7.84159 10.7625L1.04492 1.875H6.73326L10.6608 7.0675L15.2033 1.875ZM14.2358 16.475H15.7633L5.90326 3.43833H4.26409L14.2358 16.475Z"></path></svg></a><a href="https://github.com/notrab" class="text-black/50 transition hover:text-black/100" target="_blank" rel="noopener noreferrer"><span class="sr-only">GitHub</span><svg fill="currentColor" viewBox="0 0 24 24" class="h-6 w-6" aria-hidden="true"><path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"></path></svg></a><a href="https://www.youtube.com/@notrab" class="text-black/50 transition hover:text-black/100" target="_blank" rel="noopener noreferrer"><span class="sr-only">YouTube</span><svg fill="currentColor" viewBox="0 0 24 24" class="h-6 w-6" aria-hidden="true"><path fill-rule="evenodd" d="M19.812 5.418c.861.23 1.538.907 1.768 1.768C21.998 8.746 22 12 22 12s0 3.255-.418 4.814a2.504 2.504 0 0 1-1.768 1.768c-1.56.419-7.814.419-7.814.419s-6.255 0-7.814-.419a2.505 2.505 0 0 1-1.768-1.768C2 15.255 2 12 2 12s0-3.255.417-4.814a2.507 2.507 0 0 1 1.768-1.768C5.744 5 11.998 5 11.998 5s6.255 0 7.814.418ZM15.194 12 10 15V9l5.194 3Z" clip-rule="evenodd"></path></svg></a></div><p class="mt-10 text-center text-xs leading-5 text-black/50">漏 2023 GraphQL WTF. A LaunchMade Product.</p></div></footer><script src="/_next/static/chunks/webpack-0d86c6ee39f56284.js" crossorigin="" async=""></script><script>(self.__next_f=self.__next_f||[]).push([0]);self.__next_f.push([2,null])</script><script>self.__next_f.push([1,"1:HL[\"/_next/static/media/a34f9d1faa5f3315-s.p.woff2\",\"font\",{\"crossOrigin\":\"\",\"type\":\"font/woff2\"}]\n2:HL[\"/_next/static/css/933c6f782897b379.css\",\"style\",{\"crossOrigin\":\"\"}]\n0:\"$L3\"\n"])</script><script>self.__next_f.push([1,"4:I{\"id\":6054,\"chunks\":[\"272:static/chunks/webpack-0d86c6ee39f56284.js\",\"971:static/chunks/fd9d1056-0c5e6aafc398dd49.js\",\"864:static/chunks/864-3d47b83f5aa5c3ee.js\"],\"name\":\"\",\"async\":false}\n6:I{\"id\":1729,\"chunks\":[\"272:static/chunks/webpack-0d86c6ee39f56284.js\",\"971:static/chunks/fd9d1056-0c5e6aafc398dd49.js\",\"864:static/chunks/864-3d47b83f5aa5c3ee.js\"],\"name\":\"\",\"async\":false}\n3:[[[\"$\",\"link\",\"0\",{\"rel\":\"stylesheet\",\"href\":\"/_next/static/css/933c6f782897b379.css\",\"precedence\":\"next\",\"crossOrigin\":\"\"}]],[\""])</script><script>self.__next_f.push([1,"$\",\"$L4\",null,{\"buildId\":\"WzAyh6Z0O-2BGDR2evepo\",\"assetPrefix\":\"\",\"initialCanonicalUrl\":\"/\",\"initialTree\":[\"\",{\"children\":[\"__PAGE__\",{}]},\"$undefined\",\"$undefined\",true],\"initialHead\":[false,\"$L5\"],\"globalErrorComponent\":\"$6\",\"children\":[null,\"$L7\",null]}]]\n"])</script><script>self.__next_f.push([1,"8:I{\"id\":7569,\"chunks\":[\"929:static/chunks/929-45f107726df16acb.js\",\"185:static/chunks/app/layout-5705818bbbb668f9.js\"],\"name\":\"Header\",\"async\":false}\n9:I{\"id\":1443,\"chunks\":[\"272:static/chunks/webpack-0d86c6ee39f56284.js\",\"971:static/chunks/fd9d1056-0c5e6aafc398dd49.js\",\"864:static/chunks/864-3d47b83f5aa5c3ee.js\"],\"name\":\"\",\"async\":false}\na:I{\"id\":8639,\"chunks\":[\"272:static/chunks/webpack-0d86c6ee39f56284.js\",\"971:static/chunks/fd9d1056-0c5e6aafc398dd49.js\",\"864:static/chunks/864-3d47b83f5aa5c3ee.js\"],\"nam"])</script><script>self.__next_f.push([1,"e\":\"\",\"async\":false}\nd:I{\"id\":3861,\"chunks\":[\"929:static/chunks/929-45f107726df16acb.js\",\"185:static/chunks/app/layout-5705818bbbb668f9.js\"],\"name\":\"Analytics\",\"async\":false}\n"])</script><script>self.__next_f.push([1,"7:[\"$\",\"html\",null,{\"lang\":\"en\",\"children\":[\"$\",\"body\",null,{\"className\":\"__variable_36bd41\",\"children\":[[\"$\",\"$L8\",null,{}],[\"$\",\"$L9\",null,{\"parallelRouterKey\":\"children\",\"segmentPath\":[\"children\"],\"loading\":\"$undefined\",\"loadingStyles\":\"$undefined\",\"hasLoading\":false,\"error\":\"$undefined\",\"errorStyles\":\"$undefined\",\"template\":[\"$\",\"$La\",null,{}],\"templateStyles\":\"$undefined\",\"notFound\":[[\"$\",\"title\",null,{\"children\":\"404: This page could not be found.\"}],[\"$\",\"div\",null,{\"style\":{\"fontFamily\":\"system-ui,\\\"Segoe UI\\\",Roboto,Helvetica,Arial,sans-serif,\\\"Apple Color Emoji\\\",\\\"Segoe UI Emoji\\\"\",\"height\":\"100vh\",\"textAlign\":\"center\",\"display\":\"flex\",\"flexDirection\":\"column\",\"alignItems\":\"center\",\"justifyContent\":\"center\"},\"children\":[\"$\",\"div\",null,{\"children\":[[\"$\",\"style\",null,{\"dangerouslySetInnerHTML\":{\"__html\":\"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}\"}}],[\"$\",\"h1\",null,{\"className\":\"next-error-h1\",\"style\":{\"display\":\"inline-block\",\"margin\":\"0 20px 0 0\",\"padding\":\"0 23px 0 0\",\"fontSize\":24,\"fontWeight\":500,\"verticalAlign\":\"top\",\"lineHeight\":\"49px\"},\"children\":\"404\"}],[\"$\",\"div\",null,{\"style\":{\"display\":\"inline-block\"},\"children\":[\"$\",\"h2\",null,{\"style\":{\"fontSize\":14,\"fontWeight\":400,\"lineHeight\":\"49px\",\"margin\":0},\"children\":\"This page could not be found.\"}]}]]}]}]],\"notFoundStyles\":[],\"childProp\":{\"current\":[\"$Lb\",\"$Lc\",null],\"segment\":\"__PAGE__\"},\"styles\":[]}],[\"$\",\"footer\",null,{\"className\":\"relative z-30\",\"children\":[\"$\",\"div\",null,{\"className\":\"mx-auto mt-6 max-w-xl overflow-hidden border-t border-black/10 px-6 py-20 md:mt-12 lg:mt-32 lg:px-8\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mt-10 flex justify-center space-x-10\",\"children\":[[\"$\",\"a\",\"TikTok\",{\"href\":\"https://www.tiktok.com/@graphqlwtf\",\"className\":\"text-black/50 transition hover:text-black/100\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"children\":[[\"$\",\"span\",null,{\"className\":\"sr-only\",\"children\":\"TikTok\"}],[\"$\",\"svg\",null,{\"fill\":\"currentColor\",\"viewBox\":\"0 0 24 24\",\"className\":\"h-6 w-6\",\"aria-hidden\":\"true\",\"children\":[\"$\",\"path\",null,{\"d\":\"M16 8.24537V15.5C16 19.0899 13.0899 22 9.5 22C5.91015 22 3 19.0899 3 15.5C3 11.9101 5.91015 9 9.5 9C10.0163 9 10.5185 9.06019 11 9.17393V12.3368C10.5454 12.1208 10.0368 12 9.5 12C7.567 12 6 13.567 6 15.5C6 17.433 7.567 19 9.5 19C11.433 19 13 17.433 13 15.5V2H16C16 4.76142 18.2386 7 21 7V10C19.1081 10 17.3696 9.34328 16 8.24537Z\"}]}]]}],[\"$\",\"a\",\"Twitter\",{\"href\":\"https://x.com/notrab\",\"className\":\"text-black/50 transition hover:text-black/100\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"children\":[[\"$\",\"span\",null,{\"className\":\"sr-only\",\"children\":\"Twitter\"}],[\"$\",\"svg\",null,{\"fill\":\"currentColor\",\"viewBox\":\"0 0 20 20\",\"className\":\"h-6 w-6\",\"aria-hidden\":\"true\",\"children\":[\"$\",\"path\",null,{\"d\":\"M15.2033 1.875H17.9599L11.9374 8.75833L19.0224 18.125H13.4749L9.12992 12.4442L4.15826 18.125H1.39992L7.84159 10.7625L1.04492 1.875H6.73326L10.6608 7.0675L15.2033 1.875ZM14.2358 16.475H15.7633L5.90326 3.43833H4.26409L14.2358 16.475Z\"}]}]]}],[\"$\",\"a\",\"GitHub\",{\"href\":\"https://github.com/notrab\",\"className\":\"text-black/50 transition hover:text-black/100\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"children\":[[\"$\",\"span\",null,{\"className\":\"sr-only\",\"children\":\"GitHub\"}],[\"$\",\"svg\",null,{\"fill\":\"currentColor\",\"viewBox\":\"0 0 24 24\",\"className\":\"h-6 w-6\",\"aria-hidden\":\"true\",\"children\":[\"$\",\"path\",null,{\"fillRule\":\"evenodd\",\"d\":\"M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z\",\"clipRule\":\"evenodd\"}]}]]}],[\"$\",\"a\",\"YouTube\",{\"href\":\"https://www.youtube.com/@notrab\",\"className\":\"text-black/50 transition hover:text-black/100\",\"target\":\"_blank\",\"rel\":\"noopener noreferrer\",\"children\":[[\"$\",\"span\",null,{\"className\":\"sr-only\",\"children\":\"YouTube\"}],[\"$\",\"svg\",null,{\"fill\":\"currentColor\",\"viewBox\":\"0 0 24 24\",\"className\":\"h-6 w-6\",\"aria-hidden\":\"true\",\"children\":[\"$\",\"path\",null,{\"fillRule\":\"evenodd\",\"d\":\"M19.812 5.418c.861.23 1.538.907 1.768 1.768C21.998 8.746 22 12 22 12s0 3.255-.418 4.814a2.504 2.504 0 0 1-1.768 1.768c-1.56.419-7.814.419-7.814.419s-6.255 0-7.814-.419a2.505 2.505 0 0 1-1.768-1.768C2 15.255 2 12 2 12s0-3.255.417-4.814a2.507 2.507 0 0 1 1.768-1.768C5.744 5 11.998 5 11.998 5s6.255 0 7.814.418ZM15.194 12 10 15V9l5.194 3Z\",\"clipRule\":\"evenodd\"}]}]]}]]}],[\"$\",\"p\",null,{\"className\":\"mt-10 text-center text-xs leading-5 text-black/50\",\"children\":\"漏 2023 GraphQL WTF. A LaunchMade Product.\"}]]}]}],[\"$\",\"$Ld\",null,{}]]}]}]\n"])</script><script>self.__next_f.push([1,"5:[[\"$\",\"meta\",\"0\",{\"charSet\":\"utf-8\"}],[\"$\",\"title\",\"1\",{\"children\":\"Learn something new with GraphQL, every week | GraphQL WTF\"}],[\"$\",\"meta\",\"2\",{\"name\":\"description\",\"content\":\"Screencasts teaching you how to build apps and backends with GraphQL.\"}],[\"$\",\"meta\",\"3\",{\"name\":\"viewport\",\"content\":\"width=device-width, initial-scale=1\"}],[\"$\",\"meta\",\"4\",{\"name\":\"next-size-adjust\"}]]\n"])</script><script>self.__next_f.push([1,"e:I{\"id\":4724,\"chunks\":[\"929:static/chunks/929-45f107726df16acb.js\",\"931:static/chunks/app/page-89f8779aac6e21ea.js\"],\"name\":\"\",\"async\":false}\nf:I{\"id\":6964,\"chunks\":[\"929:static/chunks/929-45f107726df16acb.js\",\"931:static/chunks/app/page-89f8779aac6e21ea.js\"],\"name\":\"Image\",\"async\":false}\n"])</script><script>self.__next_f.push([1,"c:[[\"$\",\"div\",null,{\"className\":\"px-6 lg:px-8 relative z-20\",\"children\":[[\"$\",\"div\",null,{\"className\":\"mx-auto max-w-3xl py-24 space-y-6\",\"children\":[\"$\",\"div\",null,{\"className\":\"text-center\",\"children\":[[\"$\",\"h1\",null,{\"className\":\"text-4xl font-bold tracking-tight text-black sm:text-6xl\",\"children\":\"All Episodes\"}],[\"$\",\"p\",null,{\"className\":\"mt-6 text-lg leading-8 text-black/50\",\"children\":\"Screencasts teaching you how to build the best GraphQL backends\"}]]}]}],[\"$\",\"div\",null,{\"className\":\"mx-auto max-w-5xl\",\"children\":[\"$\",\"div\",null,{\"className\":\"grid grid-cols-1 gap-6 md:gap-y-12 md:grid-cols-2 lg:grid-cols-3\",\"children\":[[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/94-graphql-with-astro-content-layer\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/94-graphql-with-astro-content-layer.png\",\"alt\":\"Astro Content Layer with GraphQL\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Astro Content Layer with GraphQL\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to use Astro's content layer with GraphQL to fetch content from a CMS.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"15 Aug 2024\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/93-graphql-explorer-by-inigo\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/93-graphql-explorer-by-inigo.png\",\"alt\":\"GraphQL Explorer\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Explorer\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Explorer emphasizes workflow efficiency, incorporating advanced tracing tools and a unified interface for managing queries.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"22 May 2024\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/92-graphql-tada\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/92-graphql-tada.png\",\"alt\":\"gql.tada\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"gql.tada\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"A new type-safe developer experience GraphQL developers.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"17 Jan 2024\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/91-protect-graphql-apis-with-unkey\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/91-protect-graphql-apis-with-unkey.png\",\"alt\":\"Protect GraphQL APIs with Unkey\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Protect GraphQL APIs with Unkey\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to use the GraphQL Yoga Plugin system to protect requests using API keys with Unkey.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"16 Oct 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/90-interview-with-graphql-expert-laurin-quast\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/90-interview-with-graphql-expert-laurin-quast.png\",\"alt\":\"Interview with Laurin Quast\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Interview with Laurin Quast\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn more about Laurin, GraphQL Envelop and Yoga in this interview.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"7 Sept 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/89-graphql-list-query-naming-conventions\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/89-graphql-list-query-naming-conventions.png\",\"alt\":\"GraphQL list query naming conventions\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL list query naming conventions\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Let's talk about some of the most common ways you can name list queries.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"31 Jul 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/88-why-not-just-use-fetch-with-graphql\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/88-why-not-just-use-fetch-with-graphql.png\",\"alt\":\"Why not just use fetch with GraphQL?\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Why not just use fetch with GraphQL?\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"My reaction video to a recent Reddit question on what's the point of GraphQL client libraries over fetch.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"17 Jul 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/87-graphql-jit\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/87-graphql-jit.png\",\"alt\":\"GraphQL JIT\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL JIT\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Execute and compile highly optimized code with GraphQL JIT.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"7 Jul 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/86-graphql-analytics-and-security-with-inigo\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/86-graphql-analytics-and-security-with-inigo.png\",\"alt\":\"GraphQL Analytics and Security with Inigo\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Analytics and Security with Inigo\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Contextualized analytics for any GraphQL API.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"26 Jun 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/85-tools-every-frontend-developer-should-be-using-with-graphql-in-2023.png\",\"alt\":\"Tools every frontend developer should be using with GraphQL in 2023\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Tools every frontend developer should be using with GraphQL in 2023\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Check my recommended top 5 tools you should be using as a frontend developer in 2023 when working with GraphQL.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"29 May 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/84-nextjs-graphql-yoga-route-handler\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/84-nextjs-graphql-yoga-route-handler.png\",\"alt\":\"Next.js Route Handler with Yoga\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Next.js Route Handler with Yoga\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Create your own GraphQL Yoga route handler with Next App Router.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"22 May 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/83-automate-deploying-graphql-apis-to-cloudflare-workers\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/83-automate-deploying-graphql-apis-to-cloudflare-workers.png\",\"alt\":\"Automate deploying GraphQL APIs to Cloudflare Workers\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Automate deploying GraphQL APIs to Cloudflare Workers\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Deploy your GraphQL Yoga server automatically to Cloudflare Workers using GitHub Actions.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"24 Apr 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/82-type-safe-graphql-resolvers-with-garph\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/82-type-safe-graphql-resolvers-with-garph.png\",\"alt\":\"Type-safe GraphQL resolvers with garph\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Type-safe GraphQL resolvers with garph\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Write resolvers without the codegen and debugging. Infer types with code-first GraphQL schemas.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"17 Apr 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/81-graphql-voyager\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/81-graphql-voyager.png\",\"alt\":\"GraphQL Voyager\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Voyager\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Interact and explore your Graph with GraphQL Voyager.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"13 Mar 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/80-masked-email-directive-with-redwoodjs\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/80-masked-email-directive-with-redwoodjs.png\",\"alt\":\"Masked Email Directive with RedwoodJS\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Masked Email Directive with RedwoodJS\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Create a custom directive using Redwood to mask emails for user profiles.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"6 Mar 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/79-graphql-over-http\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/79-graphql-over-http.png\",\"alt\":\"GraphQL over HTTP\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL over HTTP\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"In this video, we'll explore GraphQL over HTTP Specification, and how we can audit GraphQL APIs to ensure compliance.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"27 Feb 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/78-graphql-network-inspector\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/78-graphql-network-inspector.png\",\"alt\":\"GraphQL Network Inspector\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Network Inspector\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Inspecting GraphQL requests doesn't have to be difficult. This Chrome extension makes it a breeze.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"20 Feb 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/77-graphql-error-handling\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/77-graphql-error-handling.png\",\"alt\":\"GraphQL Input Error Handling\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Input Error Handling\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Handle input errors with GraphQL using types, and soon to be \\\"@oneOf\\\" directive.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"13 Feb 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/76-generate-persisted-documents-with-graphql-code-generator\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/76-generate-persisted-documents-with-graphql-code-generator.png\",\"alt\":\"Generate Persisted Documents with GraphQL Code Generator\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Generate Persisted Documents with GraphQL Code Generator\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Automatically persist GraphQL operations to JSON with the client preset plugin.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"6 Feb 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/75-refresh-nextjs-page-server-state\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/75-refresh-nextjs-page-server-state.png\",\"alt\":\"Refresh Next.js 13 server state after GraphQL mutation\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Refresh Next.js 13 server state after GraphQL mutation\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to refresh Next.js page server state when GraphQL mutations occur.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"30 Jan 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/74-graphql-persisted-queries\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/74-graphql-persisted-queries.png\",\"alt\":\"What ar GraphQL Persisted Queries?\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"What ar GraphQL Persisted Queries?\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"A quick look at what it means to use persisted queries with GraphQL.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"23 Jan 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/73-the-graphql-scalar-specification\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/73-the-graphql-scalar-specification.png\",\"alt\":\"Custom GraphQL Scalars Specification\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Custom GraphQL Scalars Specification\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"GraphQL now has an official home for Scalars.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"16 Jan 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/72-graphql-yoga-3-with-cloudflare-workers\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/72-graphql-yoga-3-with-cloudflare-workers.png\",\"alt\":\"GraphQL Yoga 3 with Cloudflare Workers\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Yoga 3 with Cloudflare Workers\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Build and deploy GraphQL Yoga to the Edge with Cloudflare Workers.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"9 Jan 2023\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/71-graphql-with-hoppscotch\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/71-graphql-with-hoppscotch.png\",\"alt\":\"GraphQL with Hoppscotch\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL with Hoppscotch\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Hoppscotch is a desktop and browser based app that you can use to make GraphQL requests. You can save requests for later with collections, use variables, browse documentation, and more.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"5 Dec 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/70-fresh\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/70-fresh.png\",\"alt\":\"Fresh\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Fresh\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Fresh is a web framework built with Deno that's very fast. Learn how query and mutate data using Fresh handlers.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"28 Nov 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/69-building-graphql-ui-with-retool\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/69-building-graphql-ui-with-retool.png\",\"alt\":\"Building GraphQL UI with Retool\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Building GraphQL UI with Retool\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Query and mutate data with a GraphQL backend using pre-built components by Retool.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"21 Nov 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/68-graphql-yoga-3-and-expressjs\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/68-graphql-yoga-3-and-expressjs.png\",\"alt\":\"GraphQL Yoga 3 and ExpressJS\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Yoga 3 and ExpressJS\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Create a GraphQL server with the new GraphQL Yoga 3 and ExpressJS.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"14 Nov 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/67-the-new-graphql-code-generator-client-preset\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/67-the-new-graphql-code-generator-client-preset.png\",\"alt\":\"The new GraphQL Code Generator Client Preset\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"The new GraphQL Code Generator Client Preset\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to setup and configure the new GraphQL Code Generator Client Preset.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"7 Nov 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/66-graphql-with-nextjs-13-server-components\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/66-graphql-with-nextjs-13-server-components.png\",\"alt\":\"GraphQL with Next.js 13 Server Components\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL with Next.js 13 Server Components\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Fetch data from a GraphQL backend using Next.js 13 server components.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"31 Oct 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/65-graphql-middleware-with-yoga\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/65-graphql-middleware-with-yoga.png\",\"alt\":\"GraphQL Middleware with Yoga\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Middleware with Yoga\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Run code before or after any resolver is invoked by using GraphQL middleware.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"24 Oct 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/64-rate-limiting-with-graphql-yoga\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/64-rate-limiting-with-graphql-yoga.png\",\"alt\":\"Rate Limiting with GraphQL Yoga\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Rate Limiting with GraphQL Yoga\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to rate limit on a per-user basis with GraphQL Yoga and Envelop.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"17 Oct 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/63-using-graphql-code-generator-with-graphql-request\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/63-using-graphql-code-generator-with-graphql-request.png\",\"alt\":\"Using GraphQL Code Generator with GraphQL Request\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Using GraphQL Code Generator with GraphQL Request\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to types with the GraphQL Request library, and generate types using GraphQL Code Generator for GraphQL operations.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"10 Oct 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/62-set-context-with-apollo-client\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/62-set-context-with-apollo-client.png\",\"alt\":\"Set Context with Apollo Client\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Set Context with Apollo Client\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to create Apollo Client middleware for updating request headers sent to your API using React context.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"4 Oct 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/61-custom-rest-directive-with-graphql-tools\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/61-custom-rest-directive-with-graphql-tools.png\",\"alt\":\"Build a REST directive with GraphQL Tools\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Build a REST directive with GraphQL Tools\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to build a custom @rest directive with GraphQL Tools to resolve data from a JSON API.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"26 Sept 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/60-code-first-graphql-with-pothos\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/60-code-first-graphql-with-pothos.png\",\"alt\":\"Code-first GraphQL with Pothos\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Code-first GraphQL with Pothos\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn to build a GraphQL schema with Pothos using the \\\"code-first\\\" approach.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"19 Sept 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/59-graphql-explorer-plugin-with-graphiql\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/59-graphql-explorer-plugin-with-graphiql.png\",\"alt\":\"GraphQL Explorer Plugin with GraphiQL\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Explorer Plugin with GraphiQL\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to use the new plugin ecosystem with GraphiQL to install GraphQL Explorer. Execute GraphQL operations with a click!\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"12 Sept 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/58-graphql-queries-and-mutations-with-react-swr\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/58-graphql-queries-and-mutations-with-react-swr.png\",\"alt\":\"GraphQL Queries and Mutations with useSWR\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Queries and Mutations with useSWR\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to use SWR with GraphQL to query and mutate data. Also use the internal mutate method provided by SWR to update specific SWR values.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"5 Sept 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/57-working-with-graphiql-2\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/57-working-with-graphiql-2.png\",\"alt\":\"Working with GraphiQL 2\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Working with GraphiQL 2\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to perform GraphQL operations, variables, headers, view documentation, merge fragments, and more with GraphiQL 2.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"29 Aug 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/56-graphql-yoga-subscriptions-with-redis\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/56-graphql-yoga-subscriptions-with-redis.png\",\"alt\":\"GraphQL Yoga Subscriptions with Redis\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Yoga Subscriptions with Redis\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Use Redis with Yoga for managing the GraphQL Subscriptions PubSub bus.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"22 Aug 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/55-graphql-armor\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/55-graphql-armor.png\",\"alt\":\"Secure APIs with GraphQL Armor\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Secure APIs with GraphQL Armor\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Secure your API with customizable security middleware built for almost any JavaScript based GraphQL engine.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"15 Aug 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/54-graphql-live-queries\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/54-graphql-live-queries.png\",\"alt\":\"GraphQL Live Queries\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Live Queries\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Explore working with live in-memory GraphQL queries using Yoga, Envelop, and a custom execute function.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"7 Aug 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/53-apollo-client-cache-data-normalization\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/53-apollo-client-cache-data-normalization.png\",\"alt\":\"Apollo Client Cache Data Normalization\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Apollo Client Cache Data Normalization\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Explore the Apollo DevTools to explore how data is normalized, and stored in the client cache.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"1 Aug 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/52-graphql-subscriptions-with-server-sent-events\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/52-graphql-subscriptions-with-server-sent-events.png\",\"alt\":\"GraphQL Subscriptions with Server Sent Events\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Subscriptions with Server Sent Events\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to subscribe, and post to PubSub topics using GraphQL Subscriptions, Server Sent Events, and GraphQL Yoga.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"25 Jul 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/51-graphql-to-postman-collection-with-graphman\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/51-graphql-to-postman-collection-with-graphman.png\",\"alt\":\"GraphQL to Postman collection with GraphMan\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL to Postman collection with GraphMan\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how you can quickly create a Postman, or Insomnia collection from your GraphQL API using GraphMan.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"18 Jul 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/50-what-is-graphql\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/50-what-is-graphql.png\",\"alt\":\"What is GraphQL?\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"What is GraphQL?\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Let's talk about what GraphQL is, and can what it can do, with Kirupa Chinnathambi (Product Manager at Google).\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"11 Jul 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/49-generate-typescript-types-from-graphql\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/49-generate-typescript-types-from-graphql.png\",\"alt\":\"Generate TypeScript Types from GraphQL\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Generate TypeScript Types from GraphQL\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Automatically generate types for your local or remote GraphQL schema, and operations for better type-safety.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"4 Jul 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/48-graphql-yoga-cloudflare-workers-kv\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/48-graphql-yoga-cloudflare-workers-kv.png\",\"alt\":\"GraphQL Yoga with Cloudflare Workers KV\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Yoga with Cloudflare Workers KV\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Build a GraphQL server at the edge with Cloudflare Workers, and KV for edge key/value storage.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"27 Jun 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/47-operation-field-permissions-with-envelop\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/47-operation-field-permissions-with-envelop.png\",\"alt\":\"Operation field permissions with Envelop\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Operation field permissions with Envelop\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Allow or deny GraphQL operations based on how you configure GraphQL server context using the Envelop plugin system.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"20 Jun 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/46-graphql-mesh-extended-types\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/46-graphql-mesh-extended-types.png\",\"alt\":\"GraphQL Mesh Extended Types\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Mesh Extended Types\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to extend types from one GraphQL API to resolve the data provided by another, using GraphQL Mesh.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"13 Jun 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/45-the-graph-client\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/45-the-graph-client.png\",\"alt\":\"The Graph Client\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"The Graph Client\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Generate a fully typed SDK automatically to query the Ethereum network using The Graph Client.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"6 Jun 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/44-working-with-graphiql\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/44-working-with-graphiql.png\",\"alt\":\"Working with GraphiQL\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Working with GraphiQL\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Explore how to work with GraphiQL to explore documentation, perform operations, tabs, prettify operations, variables, request headers, and more.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"30 May 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/43-schema-or-code-first-graphql\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/43-schema-or-code-first-graphql.png\",\"alt\":\"Schema-first or code-first GraphQL\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Schema-first or code-first GraphQL\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Getting started with GraphQL doesn't always mean you need to write your schema by hand. Instead you can use code-first tools to define both your type definitions and resolvers.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"23 May 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/42-graphql-nullability\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/42-graphql-nullability.png\",\"alt\":\"GraphQL Nullability\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Nullability\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to define nullable and non-nullable fields your GraphQL schema with the schema-first approach.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"15 May 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/41-typed-document-node\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/41-typed-document-node.png\",\"alt\":\"Typed Document Node\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Typed Document Node\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Generate a DocumentNode automatically for GraphQL operations, and the typescript signature it represents for better use with GraphQL clients.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"9 May 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/40-batching-with-dataloader\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/40-batching-with-dataloader.png\",\"alt\":\"Batching with DataLoader\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Batching with DataLoader\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Reduce overloading your database by batching requests. Discover how to instantiate, and share dataloaders through server context, and pass request headers to your dataloader.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"2 May 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/39-graphql-mutations-and-input-types\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/39-graphql-mutations-and-input-types.png\",\"alt\":\"GraphQL Mutations and Input Types\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Mutations and Input Types\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Avoid bloating mutations with arguments, and instead opt to use input types you can extend over time. Explore naming conventions for input types, how to define them, and use them with variables.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"25 Apr 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/38-documenting-your-graphql-sdl-with-descriptions\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/38-documenting-your-graphql-sdl-with-descriptions.png\",\"alt\":\"Documenting your GraphQL SDL with Descriptions\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Documenting your GraphQL SDL with Descriptions\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Add descriptions to your GraphQL schema to provide a better developer experience for consumers of your API. Descriptions also support markdown, so you format text, add links to further documentation, and more.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"18 Apr 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/37-svelte-graphql-and-kitql\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/37-svelte-graphql-and-kitql.png\",\"alt\":\"Svelte, GraphQL, and KitQL\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Svelte, GraphQL, and KitQL\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"KitQL automatically generates Svelte stores for all of your GraphQL operations, and manages caching data between the client, and server. Optimistically update mutations with patching, and more.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"11 Apr 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/36-graphql-yoga-2\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/36-graphql-yoga-2.png\",\"alt\":\"GraphQL Yoga 2\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Yoga 2\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"It's time to relax with GraphQL Yoga. In this video we'll explore how easy it is to get started building a GraphQL Server with GraphQL Yoga. Featuring Subscriptions, Error Masking, and Plugins.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"4 Apr 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/35-context-with-response-cache-plugin\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/35-context-with-response-cache-plugin.png\",\"alt\":\"Context with Response Cache Plugin\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Context with Response Cache Plugin\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Enable or disable caching, and/or prevent leaking sensitive data with other users using the context argument for the Envelop plugin \\\"Response Cache\\\".\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"28 Mar 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/34-response-cache-plugin-with-envelop\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/34-response-cache-plugin-with-envelop.png\",\"alt\":\"Response Cache Plugin with Envelop\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Response Cache Plugin with Envelop\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Skip the GraphQL execution phase with the response cache plugin for Envelop. Set TTL for types and fields, as well as cache results in-memory, or with your own KV store.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"21 Mar 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/33-lazy-queries-with-apollo-client\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/33-lazy-queries-with-apollo-client.png\",\"alt\":\"Execute lazy queries with React Apollo Client\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Execute lazy queries with React Apollo Client\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Execute GraphQL queries in response to events made by your application using the useLazyQuery hook.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"14 Mar 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/32-graphql-caching-with-graphcdn\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/32-graphql-caching-with-graphcdn.png\",\"alt\":\"GraphQL Caching with GraphCDN\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Caching with GraphCDN\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Make your GraphQL API faster with caching using GraphCDN. Monitor API health with error monitoring, and alerts, as well as analytics for operations made to your endpoint.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"7 Mar 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/31-type-safe-graphql-server-context\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/31-type-safe-graphql-server-context.png\",\"alt\":\"Type safe GraphQL server context\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Type safe GraphQL server context\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Add type safety to your GraphQL server context with GraphQL Code Generator plugin \\\"TypeScript Resolvers\\\".\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"28 Feb 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/30-graphql-error-handling-with-union-types\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/30-graphql-error-handling-with-union-types.png\",\"alt\":\"GraphQL Error Handling with Union Types\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Error Handling with Union Types\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Implement better error handling with GraphQL by using the Type System.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"21 Feb 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/29-apollo-client-3-with-graphql-code-generator\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/29-apollo-client-3-with-graphql-code-generator.png\",\"alt\":\"Apollo Client 3 with GraphQL Code Generator\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Apollo Client 3 with GraphQL Code Generator\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Automatically generate code for Apollo Client 3 hooks with GraphQL Code Generator using operations stored inside of your codebase.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"14 Feb 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/28-graphql-schema-mocking-with-graphql-tools\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/28-graphql-schema-mocking-with-graphql-tools.png\",\"alt\":\"GraphQL Schema Mocking with GraphQL Tools\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Schema Mocking with GraphQL Tools\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Build faster frontends with mocking. Enable frontend teams to focus on building functionality and UI without waiting for the backend implementation.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"7 Feb 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/27-remote-graphql-schema-introspection-codegen\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/27-remote-graphql-schema-introspection-codegen.png\",\"alt\":\"Remote GraphQL Schema Introspection Codegen\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Remote GraphQL Schema Introspection Codegen\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Automatically introspect your stitched GraphQL schemas endpoints, and use the results to execute requests to remote schemas.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"31 Jan 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/26-type-safe-resolvers-with-graphql-code-generator\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/26-type-safe-resolvers-with-graphql-code-generator.png\",\"alt\":\"Type safe resolvers with GraphQL Code Generator\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Type safe resolvers with GraphQL Code Generator\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Detect errors while building your GraphQL API at build time instead of runtime with TypeScript. Also learn how to use resolver maps to separate database/GraphQL types.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"24 Jan 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/25-graphql-introspection\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/25-graphql-introspection.png\",\"alt\":\"GraphQL Introspection\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Introspection\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn about the built-in GraphQL introspection system, and how you can find out more about the schema using GraphQL queries.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"17 Jan 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/24-graphql-yoga\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/24-graphql-yoga.png\",\"alt\":\"GraphQL Yoga\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Yoga\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Fully-featured GraphQL Server with focus on easy setup, performance and great developer experience.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"10 Jan 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/23-merge-resolvers-with-graphql-tools\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/23-merge-resolvers-with-graphql-tools.png\",\"alt\":\"Merge Resolvers with GraphQL Tools\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Merge Resolvers with GraphQL Tools\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Load and merge GraphQL resolvers from multiple files using GraphQL Tools.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"3 Jan 2022\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/22-graphql-schema-file-loading-with-graphql-tools\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/22-graphql-schema-file-loading-with-graphql-tools.png\",\"alt\":\"GraphQL schema file loading with GraphQL Tools\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL schema file loading with GraphQL Tools\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Load GraphQL schema from a single file, or multiple using the GraphQL File Loader.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"27 Dec 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/21-detect-breaking-graphql-schema-changes-with-github-actions\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/21-detect-breaking-graphql-schema-changes-with-github-actions.png\",\"alt\":\"Detect breaking GraphQL schema changes with GitHub Actions\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Detect breaking GraphQL schema changes with GitHub Actions\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to configure a GitHub Action to automatically detect breaking schema changes when new Pull Requests are opened.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"20 Dec 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/20-graphql-context-argument\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/20-graphql-context-argument.png\",\"alt\":\"GraphQL Context Argument\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Context Argument\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to use the context argument to share things like database connections, dataloaders, and more across requests.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"13 Dec 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/19-metered-graphql-api-usage-billing-with-stripe\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/19-metered-graphql-api-usage-billing-with-stripe.png\",\"alt\":\"Metered GraphQL API usage billing with Stripe\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Metered GraphQL API usage billing with Stripe\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Charge users of your GraphQL API per request with Stripe's metered billing.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"6 Dec 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/18-remix-graphql\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/18-remix-graphql.png\",\"alt\":\"Remix + GraphQL Request\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Remix + GraphQL Request\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Discover how to fetch data on the server with Remix loaders, and link between pages using the Remix Web Framework.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"29 Nov 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/17-graphql-union-types-and-graphql-tools\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/17-graphql-union-types-and-graphql-tools.png\",\"alt\":\"GraphQL Union Types and GraphQL Tools\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Union Types and GraphQL Tools\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to define a GraphQL Union Type using GraphQL Tools.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"22 Nov 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/16-graphql-helix-api-route-with-nextjs\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/16-graphql-helix-api-route-with-nextjs.png\",\"alt\":\"GraphQL Helix API Route with Next.js\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Helix API Route with Next.js\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"We'll use utility functions from GraphQL Helix to process requests inside our API route made from the Next.js frontend.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"15 Nov 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/15-graphql-mesh-sdk-with-nextjs\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/15-graphql-mesh-sdk-with-nextjs.png\",\"alt\":\"GraphQL Mesh SDK with Next.js\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Mesh SDK with Next.js\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Combine multiple GraphQL Mesh sources as a single GraphQL API, and extend types from one source to include another. Then generate a SDK that can be used on the server to fetch data for a Next.js page.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"8 Nov 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/14-graphql-query-depth-limiting-with-express\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/14-graphql-query-depth-limiting-with-express.png\",\"alt\":\"GraphQL Query Depth Limiting with Express\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Query Depth Limiting with Express\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to add validation rules to Express GraphQL to set a depth limit on queries.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"1 Nov 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/13-graphql-fragments\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/13-graphql-fragments.png\",\"alt\":\"GraphQL Fragments\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Fragments\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to work with GraphQL Fragments inside Queries and Mutations together with variables, and nested fragments.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"25 Oct 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/12-graphql-remote-schema-stitching\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/12-graphql-remote-schema-stitching.png\",\"alt\":\"GraphQL Remote Schema Stitching\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Remote Schema Stitching\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Stitch together remote APIs using GraphQL Tools, and delegate requests across schemas.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"18 Oct 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/11-express-graphql-mongodb\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/11-express-graphql-mongodb.png\",\"alt\":\"Express GraphQL + MongoDB\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Express GraphQL + MongoDB\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Resolve queries and mutations with MongoDB.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"11 Oct 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/10-graphql-fetch-api\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/10-graphql-fetch-api.png\",\"alt\":\"GraphQL + Fetch API\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL + Fetch API\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Execute GraphQL queries and mutations using the fetch API.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"4 Oct 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/9-include-skip-and-deprecated-graphql-directives\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/9-include-skip-and-deprecated-graphql-directives.png\",\"alt\":\"include, skip and deprecated GraphQL Directives\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"include, skip and deprecated GraphQL Directives\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to work with @include, @skip, and @deprecated built-in GraphQL directives.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"27 Sept 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/8-graphql-variables-with-queries-and-mutations\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/8-graphql-variables-with-queries-and-mutations.png\",\"alt\":\"GraphQL Variables with Queries and Mutations\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Variables with Queries and Mutations\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Learn how to use GraphQL variables with your queries and mutations.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"20 Sept 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/7-graphql-with-insomnia\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/7-graphql-with-insomnia.png\",\"alt\":\"GraphQL with Insomnia\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL with Insomnia\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Insomnia is open source, and offers a subscription service for teams to share and collaborate on designing APIs with Swagger, and share requests to APIs.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"13 Sept 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/6-create-a-custom-scalar-type-for-email-address\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/6-create-a-custom-scalar-type-for-email-address.png\",\"alt\":\"Create a custom Scalar Type for Email Address\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Create a custom Scalar Type for Email Address\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"We'll create a custom GraphQL Scalar for our email that is rfc822 compliant.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"6 Sept 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/5-serverless-graphql-handler-with-vercel\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/5-serverless-graphql-handler-with-vercel.png\",\"alt\":\"Serverless GraphQL handler with Vercel\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Serverless GraphQL handler with Vercel\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Execute GraphQL queries and mutations inside a serverless function hosted by Vercel.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"30 Aug 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/4-rename-graphql-fields-with-aliases\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/4-rename-graphql-fields-with-aliases.png\",\"alt\":\"Rename GraphQL fields with aliases\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Rename GraphQL fields with aliases\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Rename fields in responses, and request the same field with different arguments as new fields with GraphQL aliases.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"23 Aug 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/3-authorization-with-graphql-shield\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/3-authorization-with-graphql-shield.png\",\"alt\":\"Authorization with GraphQL Shield\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Authorization with GraphQL Shield\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"In this video we鈥檒l explore some of the logic and input rules that come with GraphQL Shield to protect against unwanted requests.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"16 Aug 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/2-type-safe-graphql-queries-with-genql\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/2-type-safe-graphql-queries-with-genql.png\",\"alt\":\"Type safe GraphQL queries with genql\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"Type safe GraphQL queries with genql\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"Write type safe GraphQL queries with auto completion and type validation using genql.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"9 Aug 2021\"}]}]]}]]}]}],[\"$\",\"article\",null,{\"children\":[\"$\",\"$Le\",null,{\"href\":\"/episodes/1-graphql-mesh-as-a-gateway\",\"className\":\"group h-full flex flex-col\",\"children\":[[\"$\",\"div\",null,{\"className\":\"flex aspect-video w-full items-center justify-center rounded-md bg-black relative overflow-hidden group-hover:scale-105 transition-transform\",\"children\":[\"$\",\"$Lf\",null,{\"src\":\"/episodes/1-graphql-mesh-as-a-gateway.png\",\"alt\":\"GraphQL Mesh as a Gateway\",\"fill\":true}]}],[\"$\",\"div\",null,{\"className\":\"space-y-3 px-3 pt-3 flex flex-col justify-between flex-1\",\"children\":[[\"$\",\"div\",null,{\"className\":\"space-y-3\",\"children\":[[\"$\",\"p\",null,{\"className\":\"text-lg font-semibold text-black transition group-hover:text-primary group-hover:underline\",\"children\":\"GraphQL Mesh as a Gateway\"}],[\"$\",\"p\",null,{\"className\":\"text-sm text-black\",\"children\":\"GraphQL Mesh acts as a proxy to your existing APIs, and gives you the ultimate developer control over how data is retrieved. It doesn't matter if your API is GraphQL, gRPC, Swagger, Postgres, and non-typed APIs.\"}]]}],[\"$\",\"div\",null,{\"className\":\"\",\"children\":[\"$\",\"p\",null,{\"className\":\"text-sm font-medium text-black/50\",\"children\":\"2 Aug 2021\"}]}]]}]]}]}]]}]}]]}],[\"$\",\"div\",null,{\"className\":\"fixed inset-0 z-0 h-full w-full bg-[radial-gradient(#e5e7eb_1px,transparent_1px)] [background-size:16px_16px] [mask-image:radial-gradient(ellipse_50%_50%_at_50%_50%,#000_70%,transparent_100%)]\"}]]\n"])</script><script>self.__next_f.push([1,"b:null\n"])</script></body></html>