+
+
\ No newline at end of file
diff --git a/src/components/InfoCard.astro b/src/components/InfoCard.astro
index c20608c..1a49aaf 100644
--- a/src/components/InfoCard.astro
+++ b/src/components/InfoCard.astro
@@ -4,6 +4,9 @@
About
+
+ Collections
+
Contact
diff --git a/src/content/transcripts/155.md b/src/content/transcripts/155.md
index 7e8414e..213dc74 100644
--- a/src/content/transcripts/155.md
+++ b/src/content/transcripts/155.md
@@ -1,4 +1,4 @@
-**Intro:** [00:00:00] Welcome to Syntax. Welcome to a brand new episode of the
+[00:00:00] **Intro:** Welcome to Syntax. Welcome to a brand new episode of the
Front End Happy Hour podcast. Welcome to this week's JS Party. Live from Ship
Shape Studios, this is Whiskey Web and Whatnot. With your hosts, Robbie the
Wagner, and me, Charles William Carpenter III. That's right Charles. We drink
diff --git a/src/data/collections.ts b/src/data/collections.ts
new file mode 100644
index 0000000..4727b35
--- /dev/null
+++ b/src/data/collections.ts
@@ -0,0 +1,235 @@
+export interface Collection {
+ slug: string;
+ title: string;
+ subtitle?: string;
+ description?: string;
+ color?: string;
+ episodeSlugs: string[];
+}
+
+export const collections: Collection[] = [
+ {
+ slug: 'building-with-llms',
+ title: 'Building with LLMs',
+ subtitle: 'Essential Tools and Frameworks for Agentic Workflows',
+ description:
+ 'Explore the tools, frameworks, and techniques for building applications with large language models and creating agentic workflows.',
+ episodeSlugs: [
+ 'wtf-is-mcp-w-david-cramer',
+ 'open-source-agents-and-the-next-ai-wave-w-angie-jones',
+ 'mcp-security-framework-fatigue-and-ai-agents-with-will-johnson-presented-by-coderabbit',
+ 'doing-one-thing-exceptionally-well-coderabbits-approach-to-ai-code-review',
+ 'will-frameworks-survive-web-development-in-an-ai-driven-world-w-typecraft-and-robert-jackson',
+ 'hot-takes-developer-relations-and-ai-with-rizel-scarlett',
+ 'secrets-of-a-javascript-guru-natalia-venditto-on-ai-graphql-and-more',
+ 'your-terminal-is-getting-smarter-with-ben-holmes',
+ 'agents-of-chaos-whiskey-experiments-and-the-future-of-ides',
+ 'the-piano-man-of-state-machines-w-david-k-piano',
+ 'machine-learning-in-javascript-remix-plus-netlify-and-why-dx-engineers-matter-with-charlie-gerard',
+ 'unlocking-the-secrets-of-ai-in-tech-with-april-yoho',
+ 'opensauced-developer-advocacy-and-ai-with-brian-douglas',
+ 'frameworks-ai-and-the-complexities-of-the-gig-economy',
+ 'twitter-open-source-algorithm-home-labs-and-chat-gpt-vs-bard',
+ 'vibe-podcasting-app-rewrites-ai-assistants-pbjs-and-more',
+ 'tailwind-4-deepseek-ai-and-the-end-of-the-old-web',
+ 'will-ai-kill-the-joy-of-coding',
+ 'ai-vs-human-the-future-of-job-interviews-with-taylor-desseyn',
+ 'advent-of-whiskey-coding-advent-calendars-and-the-strangest-ai-projects',
+ 'advent-of-whiskey-state-of-js-chatgpt-and-browser-apis',
+ 'bearded-talks-on-beardless-hosts-vscode-sidebars-ai-and-graphql-with-kelly-vaughn',
+ 'from-ai-deep-dives-to-giblets-and-fig-wasps-with-ken-wheeler',
+ 'coding-languages-ai-and-the-evolution-of-game-development-with-philip-winston',
+ 'advent-of-whiskey-testing-the-hype-of-chatgpt-gitlab-and-holiday-trivia'
+ ]
+ },
+ {
+ slug: 'css',
+ title: 'CSS',
+ subtitle: 'Styling, Frameworks, and Modern CSS Techniques',
+ description:
+ 'Dive deep into CSS, Tailwind, styling frameworks, and modern techniques for building beautiful, responsive web interfaces.',
+ episodeSlugs: [
+ 'is-css-a-programming-language-w-kevin-powell',
+ 'tailwind-css-headless-ui-and-powerlifting-with-adam-wathan',
+ 'creating-codepen-tackling-tailwind-and-keeping-it-simple-with-chris-coyier',
+ 'should-you-learn-tailwind-before-css-w-bree-hall',
+ 'the-beauty-of-remix-falling-for-tailwind-and-why-nfts-are-a-scam-with-kent-c-dodds',
+ 'is-cereal-soup-the-fg-scale-and-js-vs-css-with-adam-argyle',
+ 'the-piano-man-of-state-machines-w-david-k-piano',
+ 'rust-is-overrated-w-naman-goel',
+ 'front-end-adventures-with-bad-at-css-david-east-and-adam-argyle',
+ 'whiskey-web-and-whatnot-100th-episode-round-table-with-chris-coyier-scott-tolinski-tracy-lee-and-wes-bos',
+ 'leveraging-css-web-design-and-gaming-ui-with-adam-argyle',
+ 'throwback-frameworks-tailwind-fandom-and-css-with-jhey-tompkins',
+ 'hot-takes-remix-and-nextjs-with-chance-strickland',
+ 'cracking-the-podcasting-code-with-andrew-lisowski-and-justin-bennett',
+ 'learning-angular-leadership-opportunities-and-google-culture-with-sarah-drasner',
+ 'from-faang-to-fired-the-illusion-of-stability-in-big-tech-w-adam-argyle',
+ 'features-of-astro-20-challenge-of-material-ui-and-cleanse-diets',
+ 'developer-communities-career-growth-and-front-end-hot-takes-with-madison-kanna',
+ 'from-javascript-to-php-josh-cirres-unexpected-dev-journey',
+ 'a-very-merry-descent-into-holiday-madness',
+ 'prioritizing-the-team-over-the-tool-with-jason-lengstorf',
+ 'html-shadowbanning-and-open-source-buyouts',
+ 'hot-takes-web-technologies-and-learning-to-code-with-ken-wheeler',
+ 'tech-careers-hot-takes-and-wix-with-emmy-cao-and-yoav-abrahami',
+ 'self-taught-engineering-boot-camps-and-veganism-with-welch-canavan',
+ 'tech-stacks-building-apps-and-gaming-nostalgia-with-david-cramer',
+ 'web-browsers-level-up-tutorials-and-sentry-with-scott-tolinski',
+ 'why-svelte-might-just-outdo-react-rich-harris-unveils-shocking-comparisons',
+ 'open-source-payload-and-sim-racing-with-james-mikrut',
+ 'spooky-scary-css'
+ ]
+ },
+ {
+ slug: 'typescript',
+ title: 'TypeScript',
+ subtitle: 'Type Safety, Modern JavaScript, and Developer Experience',
+ description:
+ 'Learn about TypeScript, type systems, adopting TypeScript in existing projects, and improving developer experience with better tooling.',
+ episodeSlugs: [
+ 'the-case-for-adopting-typescript-with-josh-goldberg',
+ 'bringing-types-to-ember-with-chris-krycho',
+ 'typescript-react-and-api-issues-with-matt-pocock',
+ 'from-react-miami-to-fly-fishing-diving-deep-with-theprimeagen-and-friends',
+ 'a-framework-for-ember-typescript-with-james-c-davis',
+ 'rust-is-overrated-w-naman-goel',
+ 'tech-talk-social-media-use-and-netflix-with-the-primeagen',
+ 'prioritizing-the-team-over-the-tool-with-jason-lengstorf',
+ 'runspired-vs-chris-manson-on-solving-the-number-one-open-source-maintainer-dilemma',
+ 'the-piano-man-of-state-machines-w-david-k-piano',
+ 'a11y-hour-with-crystal-preston-watson',
+ 'balancing-legacy-code-content-creation-and-career-growth-with-the-primeagen',
+ 'ember-vs-react-jamstack-and-holes-in-the-hiring-process-with-chris-manson',
+ 'npm-worms-rubygems-coups-trust-issues-in-open-source',
+ 'will-frameworks-survive-web-development-in-an-ai-driven-world-w-typecraft-and-robert-jackson',
+ 'alternatives-to-relay-the-graphql-stack-and-adulthood-with-charles-lowell-and-taras-mankovski',
+ 'should-you-learn-tailwind-before-css-w-bree-hall',
+ 'from-faang-to-fired-the-illusion-of-stability-in-big-tech-w-adam-argyle',
+ 'is-cereal-soup-the-fg-scale-and-js-vs-css-with-adam-argyle',
+ 'how-to-make-a-podcast-worth-listening-to-with-dan-blumberg',
+ 'live-from-that-conf-web-frameworks-and-developer-experience-with-james-quick',
+ 'spooky-scary-css',
+ 'stop-fixing-things-that-arent-broken',
+ 'a11y-hour-with-mark-steadman',
+ 'the-release-of-nuxt-3-with-daniel-roe',
+ 'embracing-new-tech-javascript-and-the-w3wc-nft-launch',
+ 'upgrade-your-lifestyle-from-the-ballmer-peak-to-high-tech-toilet-seats',
+ 'why-svelte-might-just-outdo-react-rich-harris-unveils-shocking-comparisons',
+ 'the-future-of-ember-and-modern-build-tools-with-chris-manson',
+ 'static-dynamic-generative-whats-next-for-the-web-w-guillermo-rauch'
+ ]
+ },
+ {
+ slug: 'testing',
+ title: 'Testing',
+ subtitle: 'Test-Driven Development, E2E Testing, and Quality Assurance',
+ description:
+ 'Explore testing strategies, tools like Cypress and Playwright, TDD practices, and how to build confidence in your code through comprehensive testing.',
+ episodeSlugs: [
+ 'css-trig-cypress-and-software-testing-alternatives',
+ 'mystery-makers-monday-testing-and-graphql',
+ 'a11y-hour-with-mark-steadman',
+ 'the-release-of-nuxt-3-with-daniel-roe',
+ 'matt-johnson-when-web3-is-worth-it-and-learning-to-lead',
+ 'embracing-new-tech-javascript-and-the-w3wc-nft-launch',
+ 'the-future-of-ember-and-modern-build-tools-with-chris-manson',
+ 'a11y-hour-with-crystal-preston-watson',
+ 'privacy-cyber-crime-stories-and-tech-with-jack-rhysider',
+ 'from-the-rickhouse-why-svelte-might-just-outdo-react-w-rich-harris',
+ 'tech-rants-supporting-open-source-and-great-tv-shows',
+ 'pnpm-algorithms-and-angular',
+ 'from-react-miami-to-fly-fishing-diving-deep-with-theprimeagen-and-friends',
+ 'the-right-way-to-nft-blockchain-and-making-your-mark-in-the-digital-marketplace-with-juan-palomino',
+ 'typescript-react-and-api-issues-with-matt-pocock',
+ 'flagging-features-and-dropping-beats-with-ben-rometsch',
+ 'from-faang-to-fired-the-illusion-of-stability-in-big-tech-w-adam-argyle',
+ 'tech-conferences-remote-work-and-the-intersection-of-ai-and-web-design-with-clark-sell',
+ 'shepherdjs-the-future-of-open-source-capitalism-and-corporate-responsibility',
+ 'spooky-scary-css',
+ 'a11y-hour-with-eric-bailey',
+ 'tailwind-twitter-wars-and-the-state-of-js',
+ 'npm-worms-rubygems-coups-trust-issues-in-open-source',
+ 'are-developers-overthinking-everything-w-bdougie',
+ 'tech-talk-social-media-use-and-netflix-with-the-primeagen',
+ 'nextjss-speed-vs-redwoodjss-strength-the-web-development-drama-you-cant-ignore',
+ 'inclusive-experiences-in-react-applications-championing-neurodivergent-accessibility-w-amera-white',
+ 'secrets-of-a-javascript-guru-natalia-venditto-on-ai-graphql-and-more',
+ 'dial-up-is-dead-long-live-adam-argyle',
+ 'a-very-merry-descent-into-holiday-madness'
+ ]
+ },
+ {
+ slug: 'accessibility',
+ title: 'Accessibility',
+ subtitle: 'Building Inclusive Web Experiences for Everyone',
+ description:
+ 'Learn about web accessibility, ARIA, screen readers, WCAG guidelines, and how to create inclusive experiences that work for all users.',
+ episodeSlugs: [
+ 'a11y-hour-with-mark-steadman',
+ 'a11y-hour-with-crystal-preston-watson',
+ 'a11y-hour-with-amber-hinds',
+ 'a11y-hour-with-eric-bailey',
+ 'is-cereal-soup-the-fg-scale-and-js-vs-css-with-adam-argyle',
+ 'rust-is-overrated-w-naman-goel',
+ 'solidjs-the-framework-creating-a-buzz-with-dan-jutan',
+ 'inclusive-experiences-in-react-applications-championing-neurodivergent-accessibility-w-amera-white',
+ 'work-life-balance-react-and-why-accessibility-is-everything-with-melanie-sumner',
+ 'why-svelte-might-just-outdo-react-rich-harris-unveils-shocking-comparisons',
+ 'htmx-open-source-retro-tech-and-dev-tools-with-carson-gross',
+ 'dial-up-is-dead-long-live-adam-argyle',
+ 'leveraging-css-web-design-and-gaming-ui-with-adam-argyle',
+ 'why-you-cant-skip-the-fundamentals-w-henri-helvetica',
+ 'tailwind-css-headless-ui-and-powerlifting-with-adam-wathan',
+ 'hot-takes-developer-relations-and-ai-with-rizel-scarlett',
+ 'coding-languages-ai-and-the-evolution-of-game-development-with-philip-winston',
+ 'vibe-podcasting-app-rewrites-ai-assistants-pbjs-and-more',
+ 'talkshop-show-w-macho-man-randy-standards',
+ 'html-accessibility-package-managers-and-the-whiskey-web-and-whatnot-nft',
+ 'nextjs-12-react-vs-svelte-and-the-future-of-frameworks-with-wes-bos',
+ 'getting-lost-in-git-and-goodbye-tsc',
+ 'features-of-astro-20-challenge-of-material-ui-and-cleanse-diets',
+ 'twitter-open-source-algorithm-home-labs-and-chat-gpt-vs-bard',
+ 'hot-takes-tanstack-and-open-source-with-tanner-linsley'
+ ]
+ },
+ {
+ slug: 'ai-ml',
+ title: 'AI & Machine Learning',
+ subtitle: 'Artificial Intelligence, ML Models, and Data Science',
+ description:
+ 'Explore artificial intelligence, machine learning, neural networks, and how AI is transforming web development and software engineering.',
+ episodeSlugs: [
+ 'tech-talk-typescript-and-empowering-engineers-with-shaundai-person',
+ 'the-piano-man-of-state-machines-w-david-k-piano',
+ 'from-faang-to-fired-the-illusion-of-stability-in-big-tech-w-adam-argyle',
+ 'empowering-black-women-in-tech-shaundais-insightful-discussion-on-self-promotion-and-career-growth',
+ 'dial-up-is-dead-long-live-adam-argyle',
+ 'a11y-hour-with-eric-bailey',
+ 'are-developers-overthinking-everything-w-bdougie',
+ 'tech-talk-social-media-use-and-netflix-with-the-primeagen',
+ 'tailwind-css-headless-ui-and-powerlifting-with-adam-wathan',
+ 'exploring-open-source-and-solidjs-with-ryan-carniato',
+ 'is-cereal-soup-the-fg-scale-and-js-vs-css-with-adam-argyle',
+ 'why-most-developers-overcomplicate-everything-w-aaron-francis',
+ 'from-react-miami-to-fly-fishing-diving-deep-with-theprimeagen-and-friends',
+ 'fathers-day-drinking-w-typecraft',
+ 'understanding-whiskey-with-prime-barrels-michael-nagdi',
+ 'the-one-rye-to-rule-them-all-w-kendall-miller-rishi-malik',
+ 'is-cracker-barrel-a-js-framework',
+ 'a-very-merry-descent-into-holiday-madness',
+ 'whiskey-web-and-whatnot-100th-episode-round-table-with-chris-coyier-scott-tolinski-tracy-lee-and-wes-bos',
+ 'front-end-adventures-with-bad-at-css-david-east-and-adam-argyle',
+ 'tech-stacks-building-apps-and-gaming-nostalgia-with-david-cramer',
+ 'will-ai-kill-the-joy-of-coding',
+ 'how-to-build-a-career-when-the-rules-keep-changing-w-taylor-desseyn-jason-torres',
+ 'from-frontend-to-backend-lane-wagners-journey-to-bootdev',
+ 'building-a-better-web-open-source-simplicity-and-speed-with-jason-lengstorf',
+ 'creating-codepen-tackling-tailwind-and-keeping-it-simple-with-chris-coyier',
+ 'hughes-belle-of-bedford-ember-and-whatnot-w-robert-jackson-rwjblue',
+ 'typecraft-typescript-vim-foodie-youtube-linux-and-more',
+ 'why-you-cant-skip-the-fundamentals-w-henri-helvetica',
+ 'prioritizing-the-team-over-the-tool-with-jason-lengstorf'
+ ]
+ }
+];
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index f14d496..5597b18 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -43,6 +43,7 @@ const description = Astro.props.description ?? starpodConfig.description;
+
@@ -62,8 +63,8 @@ const description = Astro.props.description ?? starpodConfig.description;
-
-
+
+
({
+ params: { slug: collection.slug },
+ props: { collection }
+ }));
+}
+
+const { collection } = Astro.props;
+const allEpisodes = await getAllEpisodes();
+
+// Filter episodes that belong to this collection and sort newest-first
+const collectionEpisodes = allEpisodes
+ .filter((episode) => collection.episodeSlugs.includes(episode.episodeSlug))
+ .sort((a, b) => b.published - a.published);
+
+// Find current collection index for pagination
+const currentIndex = collections.findIndex((c) => c.slug === collection.slug);
+const prevCollection = currentIndex > 0 ? collections[currentIndex - 1] : null;
+const nextCollection = currentIndex < collections.length - 1 ? collections[currentIndex + 1] : null;
+
+const title = `${collection.title} - ${show.title}`;
+const canonicalURL = new URL(`/collections/${collection.slug}`, Astro.url);
+---
+
+{heading}
--
+
- {bullet} ; + return ( +
- + {bullet} + + ); }) }
-
{
bullets.map((bullet) => {
- return
{price} / - - per episode + + {period}
+
++ {collection.title} +
+ + {collection.subtitle && ( ++ {collection.subtitle} +
+ )} + + {collection.description && ( +{collection.description}
+ )} + + {collectionEpisodes.length > 0 ? ( +
+
+ ) : (
+
+
+ )}
+
+ {/* Pagination Navigation */}
+ {(prevCollection || nextCollection) && (
+ + No episodes found in this collection. Please check the collection + configuration. +
+
+ {prevCollection && (
+
+
+
+ )}
+
+
+
+ )}
+
+ {nextCollection && (
+
+
+ + Previous +
++ {prevCollection.title} +
+ {prevCollection.description && ( ++ {prevCollection.description} +
+ )} +
+
+
+ )}
+ + Next +
++ {nextCollection.title} +
+ {nextCollection.description && ( ++ {nextCollection.description} +
+ )} +
+
++ Collections +
+ ++ Curated collections of episodes organized by topic. +
+ +
+ {collectionsWithEpisodes.map((collection) => (
+
+
+
+
+
+ {collection.latestEpisodes.length > 0 ? (
+
+
+ {collection.latestEpisodes.map((episode, index) => (
+ 
+ ))}
+
+ ) : (
+
+ No episodes
+
+ )}
+
+
+ + {collection.title} +
+ {collection.description && ( +{collection.description}
+ )} +
+
+
+ ))}
+ + {collection.episodeSlugs.length}{' '} + {collection.episodeSlugs.length === 1 ? 'episode' : 'episodes'} +
+
+
- Sponsor {title} + {title} is a top 10% podcast
-- Want to dazzle a crowd of tech nerds and whiskey connoisseurs? Throw your - brand into the mix! Our listeners love innovation, good banter, and a - stiff drink—so get in on the fun and make some magic happen. Stay classy, - sponsor. +
+ Sponsorships provide multi-channel exposure across Audio, Video, and Social Media.
-
-
+ + We blend technical depth with premium lifestyle content, covering web + development, software architecture, and fine whiskey. Our audience is a bunch of tech nerds; Engineering Managers, Software Architects, Web Developers, and Backend Engineers. +
+ ++ We're offering shared access to a {currentYear} tech audience through all the most + popular channels. +
- Your overall ad reach + Reach
-Listener Metrics
- -
+
- 1,000
+ 0K+
- listeners per episode
+ Monthly Impressions
- 15,000
+ 0-0K
- listeners per 90 days
+
+ Monthly Downloads Per Episode
+
-
+
diff --git a/src/styles/global.css b/src/styles/global.css
index b5922c8..721188d 100644
--- a/src/styles/global.css
+++ b/src/styles/global.css
@@ -86,3 +86,9 @@ footer:has(+ #audio-player .player) {
@utility section-heading-underlined {
@apply section-heading dark:border-dark-border border-b pb-4;
}
+
+@supports (grid-template-rows: subgrid) {
+ .collections-grid {
+ grid-auto-rows: minmax(0, auto);
+ }
+}
- Top Listeners By Location -
+Top Listeners By Location
-
- {
- countries.map((country) => {
- return (
+
+
+
\ No newline at end of file
diff --git a/src/pages/sponsor/success.astro b/src/pages/sponsor/success.astro
new file mode 100644
index 0000000..eec681e
--- /dev/null
+++ b/src/pages/sponsor/success.astro
@@ -0,0 +1,36 @@
+---
+import Layout from '../../layouts/Layout.astro';
+---
+
+
+ {
+ countries.map((country) => (
+ <>
+
+
{country.percentage}%
- );
- })
- }
+
+ ))
+ }
+
+
+
+
+
+
+
+
+
+ + A 3-month partnership delivers{' '} + + 200,000+ targeted impressions. + +
++ Unlike ephemeral ads, our host-read sponsorships are baked into the + content, providing evergreen value that continues to drive + awareness and conversions long after the episode airs. +
+
+
+
+
+
+ Or… maybe you have an idea? +
+ ++ We're down to chat about it. +
+ ++ Whiskey Web and Whatnot, +
++ , + , & + +
+
++ Thank You for Sponsoring! +
+ ++ Your sponsorship has been successfully processed. We'll be in touch shortly + to coordinate your ad placement and get you set up. +
+ ++ Check your email for confirmation and next steps. If you have any questions, + feel free to contact us. +
+ + +