Articles

Joel Varty Article

The Headless Holodeck: Joel Varty of Agility CMS on Warp-Speed Demos, AI, and the Next Generation of CMS

matt-garrepy

<hr /> If screen legend Eric Roberts is sometimes known as the “Busiest Actor in Hollywood” (he's racked up over 700 credits in film and TV), then <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/">Agility CMS</a> CTO <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/playing-to-win-in-the-headless-cms-game-interview-with-joel-varty-cto-at-agility">Joel Varty</a> has a valid claim as “The Busiest Man in the CMS industry.”Seriously. This year, Joel has released comprehensive video playlists on <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/vartys-videos-a-ctos-take-on-nextjs">Next.js</a> and <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/vartys-videos-all-about-composable">composable content</a>. Now, he’s back to complete the trilogy with this latest YouTube series, <a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/playlist?list=PLEI81bLU4t-uQbH7IZOLUvShAqKGhTlFA">Next-Level Dev: AI Meets Code</a>. We've got an exclusive wrap on this new edition, and you can watch all the videos below. We've even pulled some of Joel's Oscar-worthy quotes from each installment. Just for fun. So grab your popcorn, put away your DVD copy of Runaway Train, and prepare for a blockbuster knowledge drop. <h3 id="video-1:-building-a-vs-code-component-from-a-screenshot">Video 1: Building a VS Code Component from a Screenshot</h3>This is an <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/a-gathering-of-content-champions-heres-why-cms-connect-25-was-super-in-every-way">award-winning</a> video. Literally.Joel opens with his <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/a-gathering-of-content-champions-heres-why-cms-connect-25-was-super-in-every-way">CMS Connect 25</a>, CMS Idol-winning demo. Within the Agility <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/product/headless-cms">headless CMS</a> platform – and in six swift minutes – Joel shows:<ul><li>How starting in your codebase (instead of the CMS) saves time.</li><li>The way AI assistants like Claude read your existing project patterns and build components to match.</li><li>Why this approach makes hard-to-visualize use cases simple and fast to deliver.</li></ul> Fun Joel quote: “I don’t even know what this is.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=-Kh9eU1gWaU">Watch Building a VS Code Component from a Screenshot here</a>:<figure class="media"><div data-oembed-url="https://www.youtube.com/watch?v=-Kh9eU1gWaU"><div style="position:relative;padding-bottom:100%;height:0;padding-bottom:56.2493%"><iframe src="https://www.youtube.com/embed/-Kh9eU1gWaU" style="position:absolute;width:100%;height:100%;top:0;left:0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe></div></div></figure><h3 id="video-2:-can-you-code-ai-with-agility-cms?">Video 2: Can You Code AI with Agility CMS?</h3>Think of this as a longer, code-first expansion of the first video.Joel wires Agility CMS into a <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/starters/nextjs">Next.js</a> site, starting code-first. He covers what the AI-assisted workflow looks like and why it matters for developer efficiency and editor usability. He also breaks down:<ul><li>Reverse workflows by taking a React component and letting AI convert it into an Agility CMS component without a manual boilerplate.</li><li>Using AI to add elements like dark mode support, consistent container spacing, and scroll-triggered effects.</li><li>Letting AI scaffold so <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/product/developers">developers</a> can focus on testing, code reviews, accessibility, and performance.</li></ul> Fun Joel quote: “I’m going to go boom.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=Xtq-SgVbP_I\">Watch Can You Code AI with Agility CMS? here</a>:<figure class="media"><div data-oembed-url="https://www.youtube.com/watch?v=Xtq-SgVbP_I"><div style="position:relative;padding-bottom:100%;height:0;padding-bottom:56.2493%"><iframe src="https://www.youtube.com/embed/Xtq-SgVbP_I" style="position:absolute;width:100%;height:100%;top:0;left:0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe></div></div></figure><h3 id="video-3:-oops!-no-dark-mode?-let’s-fix-it-together">Video 3: Oops! No Dark Mode? Let’s Fix it Together</h3>Joel shipped a hero component without dark mode.But fear not! AI to the rescue! Joel uses an AI agent to retrofit the component properly. Not only does he cover what to change, but also why the pattern matters for consistency across the site. He also dives into:<ul><li>Aligning spacing, tones, and dark-mode behavior with existing components.</li><li>Best practices for reviewing diffs and safely accepting changes.</li><li>How to iterate fast and make small manual edits where needed.</li></ul> Fun Joel quote: “It looks like it’s doing a bunch of stuff. Then it undid some stuff.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=5fl7avmXx3k">Watch Oops! No Dark Mode? Let’s Fix it Together here</a>:<figure class="media"><div data-oembed-url="https://www.youtube.com/watch?v=5fl7avmXx3k"><div style="position:relative;padding-bottom:100%;height:0;padding-bottom:56.2493%"><iframe src="https://www.youtube.com/embed/5fl7avmXx3k" style="position:absolute;width:100%;height:100%;top:0;left:0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe></div></div></figure><h3 id="video-4:-watch-me-build-a-carousel-with-ai,-mcp,-and-next.js">Video 4: Watch Me Build a Carousel with AI, MCP, and Next.js</h3>This is a bigger, hands-on video. Joel installs the <a target="_blank" rel="noopener noreferrer" href="https://github.com/cdejongfiero/agility-cms-mcp-server">Agility MCP (Model Context Protocol) server</a>, explains what MCP is, and shows how a code-first + AI approach accelerates modeling and implementation while maintaining Next.js conventions. You’ll also see:<ul><li>How to go from a simple <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/products/figma">Figma</a> sketch to a carousel component model and item content model using AI.</li><li>Correct <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/products/nextjs">Next.js</a> routing and file naming.</li><li>The developer’s job to craft precise AI prompts, review diffs, run tests, and enforce performance.</li></ul> Fun Joel quote: “Here’s my quote, unquote design. I am not a designer.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=7SgX8Yx39YQ">Watch Watch Me Build a Carousel with AI, MCP, and Next.js here</a>:<figure class="media"><div data-oembed-url="https://www.youtube.com/watch?v=7SgX8Yx39YQ"><div style="position:relative;padding-bottom:100%;height:0;padding-bottom:56.2493%"><iframe src="https://www.youtube.com/embed/7SgX8Yx39YQ" style="position:absolute;width:100%;height:100%;top:0;left:0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe></div></div></figure><h3 id="video-5:-github-copilot-vs-cursor-vs-claude:-the-ultimate-ai-coding-showdown">Video 5: GitHub Copilot vs Cursor vs Claude: The Ultimate AI Coding Showdown</h3>The last video in the series is the big, winner-take-all battle.Joel compares <a target="_blank" rel="noopener noreferrer" href="https://github.com/features/copilot">GitHub Copilot,</a> <a target="_blank" rel="noopener noreferrer" href="https://www.anthropic.com/claude-code">Claude Code (CLI)</a>, and <a target="_blank" rel="noopener noreferrer" href="https://cursor.com/en">Cursor</a> by adding personalization to a Next.js background hero using Agility CMS. He also covers:<ul><li>The exact fields and list requirements for personalization.</li><li>How this exercise was set up, executed, and validated.</li><li>How developers ensure quality within AI scaffolding.</li></ul>Who takes it? You’ll have to watch. Fun Joel quote: “It’s not working. No, it’s not working. That did not work.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=_tJQC_CHXYY">Watch GitHub Copilot vs Cursor vs Claude: The Ultimate AI Coding Showdown here</a>:<figure class="media"><div data-oembed-url="https://www.youtube.com/watch?v=_tJQC_CHXYY"><div style="position:relative;padding-bottom:100%;height:0;padding-bottom:56.2493%"><iframe src="https://www.youtube.com/embed/_tJQC_CHXYY" style="position:absolute;width:100%;height:100%;top:0;left:0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe></div></div></figure><h3 id="the-post-credits-scene:-the-repeatable-loop">The Post-Credits Scene: The Repeatable Loop</h3>Whether intended or accidental, Joel’s series showcases that AI won’t replace developers. And maybe that’s the point.Each episode in Joel’s series sort of reinforces the same loop:<ol><li>Developers Start: It’s dev intent, through things like prompts, that drive the work. </li><li>AI Scaffolds: It drafts the boring parts.</li><li>Developers Stay Accountable: For things like naming, accessibility, performance, and overall quality.</li></ol>In <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/blog/i-taught-a-little-and-learned-a-lot-at-cms-connect-25">Joel’s recap of CMS Connect 25</a>, he pointed out that for AI experimentation, nobody has “cracked the code” on a singular, best way to do it. But in Next Level Dev: AI Meets Code, he may have found a workable formula where dev input and AI output are given equal consideration and craft.We’ll see. Until then, we're looking forward to the next installment of Varty’s Videos. <hr /><h4 style="text-align:center" id="looking-for-guidance-on-agility?-talk-to-an-expert.">Looking for guidance on Agility? <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/contact">Talk to an expert.</a></h4><hr /><h3 id="upcoming-events">Upcoming Events</h3> <img style="width:31.61%" src="https://cmscritic.com/ms-content/uploads/2025/08/storyblok-joyconf-2025-logo.jpg" /><h4 id="storyblok-joyconf-2025"><a target="_blank" rel="noopener noreferrer" href="https://joyconf.storyblok.com/">Storyblok JoyConf 2025</a></h4>October 14-15, 2025 – Amsterdam, Netherlands November 4, 2025 – New York, NY November 6, 2025 – Los Angeles, CAJoin us at JoyConf 2025, where the future of content meets the people shaping it. Built for developers, marketers, and digital innovators, this free conference goes way beyond product updates or yet another strategy playbook. It’s where you’ll get inspired, get real, and get connected – to ideas, to the community, and to what’s possible when you build joyfully. Whether you're building lightning-fast frontends or launching cross-channel campaigns, this is where content becomes connection and collaboration becomes second nature. Come for the talks. Stay for the community. Leave with joy. <a target="_blank" rel="noopener noreferrer" href="https://joyconf.storyblok.com/">Save your spot.</a> <img style="width:28.9%" src="https://cmscritic.com/ms-content/uploads/2025/08/sitecore-symposium-2025.jpg" /><h4 id="sitecore-symposium-2025"><a target="_blank" rel="noopener noreferrer" href="https://symposium.sitecore.com/">Sitecore Symposium 2025</a></h4>November 3-5, 2025 – Orlando, FLAt Sitecore Symposium, you’ll learn how to meet your customers where they are – across channels, moments, and touchpoints that didn’t exist a year ago. You’ll hear how the boldest brands in the world are transforming content into outcomes and creating experiences that are fast, relevant, and human. Join 1,500 marketers, digital leaders, and technologists in Orlando to see what’s possible when personalization scales, AI accelerates creativity, and trust becomes your competitive edge. This is the Third Wave of the Internet. And this is your moment to lead in it. <a target="_blank" rel="noopener noreferrer" href="https://symposium.sitecore.com/">Get your tickets today.</a> <img style="width:31.44%" src="https://cmscritic.com/ms-content/uploads/2025/08/cms-kickoff-2026-logo.png" alt="" /><h4 id="cms-kickoff-2026"><a target="_blank" rel="noopener noreferrer" href="https://www.boye-co.com/conferences/cmskickoff26">CMS Kickoff 2026</a></h4>January 13-14, 2026 – St. Petersburg, FLMeet industry leaders at our fourth annual CMS Kickoff – the industry's premier global CMS event. Similar to a traditional kickoff, we reflect on recent trends and share stories from the frontlines. Additionally, we will delve into the current happenings and shed light on the future. Prepare for an unparalleled in-person CMS conference experience that will equip you to move things forward. This is an exclusive event – space is limited, <a target="_blank" rel="noopener noreferrer" href="https://www.boye-co.com/conferences/cmskickoff26">so secure your tickets today.</a>

Varty’s Videos: Where AI Meets Code

cms-critic-staff

<hr /> <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/">Agility CMS</a> Chief Technical Officer <a target="_blank" rel="noopener noreferrer" href="https://www.linkedin.com/in/joelvarty/">Joel Varty</a> is back again with another YouTube video series. <a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/playlist?list=PLEI81bLU4t-sv8RtZZjsqFg28owfEigWK">Composable Architecture 101</a> is a five-part series that looks at the core elements of <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/product/composable-content-management">composable content</a> creation.Composable has always been a critical tool and capability. But the true power and benefit of composable is now being realized, fully and completely. Some <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/the-deep-dish-on-composable-6-tasty-takeaways-from-the-mach-alliances-2025-conference">key takeaways from “The Composable Conference” in April</a> confirm this, especially the observation that composable continues to deliver even as user preferences change.Joel’s video series is the perfect starting point for novices new to the world of composable to veterans looking to strengthen their composable knowledge. <h3 id="video-1:-what-is-composable-architecture?">Video 1: What is Composable Architecture?</h3>Joel kicks things off by introducing the basics of composable with his trademark friendly, engaging, and easy-to-understand manner. Not only does he cover the what of composable, but also the why. He also breaks down:<ul><li>His criteria for true composability</li><li>How composable is the best fit for your particular use case</li><li>How composable helps with today’s and tomorrow’s technology needs</li></ul>Interesting Thing Joel Says to Watch Out For: “I like to think of it as a piece of pie.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=r80uhCCALY4&amp;list=PLEI81bLU4t-sv8RtZZjsqFg28owfEigWK&amp;index=6">Watch: What is Composable Architecture?</a><figure class="image image-style-align-center image_resized" style="width:80.07%"><img src="https://cmscritic.com/ms-content/uploads/2025/07/image-1752860523411.png" /></figure> <h3 id="video-2:-how-does-a-composable-architecture-save-you-money?">Video 2: How Does a Composable Architecture Save You Money?</h3>The second video looks at the question everyone asks about everything: how does this save me money? When it comes to composable, Joel returns to his pie analogy and compares composable to traditional DXP and tells you:<ul><li>The hidden, oft-forgotten costs of a traditional DXP</li><li>Why time-to-market is just as important as dollars spent</li><li>What to look out for to lower the cost of composable</li></ul>Interesting Thing Joel Says to Watch Out For: “In all my experience, I have never seen a traditional DXP where the way that they do CMS is the absolute best way.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=5XGBms1hdsI&amp;list=PLEI81bLU4t-sv8RtZZjsqFg28owfEigWK&amp;index=4">Watch: How Does a Composable Architecture Save You Money?</a><h3 id="video-3:-how-to-kickstart-your-composable-architecture">Video 3: How to Kickstart Your Composable Architecture</h3>The third video looks at what element pretty much every composable stack will need: a <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/product/headless-cms">headless CMS</a>. From there, he continues his traditional DXP vs. composable comparison. He also provides his kickstart recommendations, and yes, the pie is back. You’ll also learn:<ul><li>Why <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/starters">framework</a> flexibility matters</li><li>The concept of “building outwards”</li><li>What costs a lot, takes forever, and how to avoid it</li></ul>Interesting Thing Joel Says to Watch Out For: “I’m from Agility, so I’d love for you to use Agility CMS.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=E80x-YHp9FE&amp;list=PLEI81bLU4t-sv8RtZZjsqFg28owfEigWK&amp;index=4">Watch: How to Kickstart Your Composable Architecture</a><figure class="image image-style-align-center image_resized" style="width:79.8%"><img src="https://cmscritic.com/ms-content/uploads/2025/07/image-1752860555725.png" /></figure><h3 id="video-4:-how-to-switch-your-website-to-composable-the-easy-way!">Video 4: How to Switch Your Website to Composable the Easy Way!</h3>The fourth of five looks at how an <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/blog/recapping-the-incremental-approach-a-story-about-urgency-agility-and-a-canadian-rock-classic">incremental approach</a>, starting with the website, is the way to go when transitioning from a traditional DXP to a modern composable architecture. Joel also explains why headless CMS is the foundation of it all. Joel also talks about:<ul><li>Using modern routing via <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/blog/website-behind-a-cdn">CDN</a> to bridge old and new systems</li><li>The three benefits of partnering with composable vendors</li><li>Additional composable components to utilize and when</li></ul>Interesting Thing Joel Says to Watch Out For: “Whatever your motives are, there’s a way to work around that using an incremental way.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=w3rXSSXPXHI&amp;list=PLEI81bLU4t-sv8RtZZjsqFg28owfEigWK&amp;index=2">Watch: How to Switch Your Website to Composable the Easy Way!</a><h3 id="video-5:-are-you-making-these-composable-mistakes?">Video 5: Are You Making These Composable Mistakes?</h3>The pie is back. In the final video of the series, Joel identifies the biggest pitfalls associated with a composable strategy. This video is all about setting yourself up for sustained success, especially as things like growing technical complexity come into play. You’ll also learn:<ul><li>Why there’s more to the term “future-proof” than meets the eye</li><li>How to identify and prevent vendor cost sprawl</li><li>Best practices to always keep in mind</li></ul>Interesting Thing Joel Says to Watch Out For: “It can hit you all at once if you try to do too much all at once.”<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=qcn_g0oCo-Y&amp;list=PLEI81bLU4t-sv8RtZZjsqFg28owfEigWK&amp;index=1">Watch: Are You Making These Composable Mistakes?</a><figure class="image image-style-align-center image_resized" style="width:80.86%"><img src="https://cmscritic.com/ms-content/uploads/2025/07/image-1752860585776.png" /></figure><h3 id="other-composable-resources">Other Composable Resources</h3>Check out these additional composable resources from CMS Critic and Agility CMS:<h4 id="from-cms-critic">From CMS Critic</h4><ul><li><a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/machtales-voices-from-the-composable-conference-with-jina-zohori-of-agility-cms">MACHtales: Voices from “The Composable Conference” with Jina Zohori of Agility CMS</a></li><li><a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/hungry-for-composable-new-research-shows-a-growing-appetite-for-mach-technologies">Hungry for Composable? New Research Shows a Growing Appetite for MACH Technologies</a></li></ul><h4 id="from-agility-cms">From Agility CMS</h4><ul><li><a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/blog/what-is-composable-architecture">What is Composable Architecture?</a></li><li><a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/product/composable-content-management">Composable Content Management with Agility CMS</a></li></ul><h3 id="composable-goes-from-“uh,-what-does-that-mean?”-to-“oh!-now-i-get-it!”">Composable Goes from “Uh, What Does That Mean?” to “Oh! Now I Get It!”</h3>The concept of composable could be daunting. But Joel’s <a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/playlist?list=PLEI81bLU4t-sv8RtZZjsqFg28owfEigWK">Composable Architecture 101</a> series starts with the basics and gradually works its way up. The content may grow in complexity, but Joel’s grounded delivery makes it easy for anyone to follow along. Brew a nice cup of coffee or tea. Grab a bagel or a donut. Or a slice of pie. And discover why composable is so critical in <a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/playlist?list=PLEI81bLU4t-sv8RtZZjsqFg28owfEigWK">Composable Architecture 101</a>. <hr /><h4 style="text-align:center" id="looking-for-guidance-on-agility?-talk-to-an-expert.">Looking for guidance on Agility? <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/contact">Talk to an expert.</a></h4><hr /> <h3 id="upcoming-events">Upcoming Events</h3> <img style="width:31.83%" src="https://cmscritic.com/ms-content/uploads/2025/01/cms-connect-2025-logo.png" alt="" /><h4 id="cms-connect-25"><a target="_blank" rel="noopener noreferrer" href="https://www.boye-co.com/conferences/cmsconnect25">CMS Connect 25</a></h4>August 5-6, 2025 – Montreal, CanadaSee Agility CMS at the second annual summer edition of our signature global conference dedicated to the content management community! CMS Connect will be held again in beautiful Montreal, Canada, and feature a unique blend of masterclasses, insightful talks, interactive discussions, impactful learning sessions, and authentic networking opportunities. Join vendors, agencies, and customers from across our industry as we engage and collaborate around the future of content management – and hear from the top thought leaders at the only vendor-neutral, in-person conference exclusively focused on CMS. Space is limited for this event, <a target="_blank" rel="noopener noreferrer" href="https://www.boye-co.com/conferences/cmsconnect25">so book your seats today.</a>

Varty’s Videos: All About Composable

<hr /> <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/">Agility CMS</a> Chief Technical Officer <a target="_blank" rel="noopener noreferrer" href="https://www.linkedin.com/in/joelvarty/">Joel Varty</a> just wrapped up his first YouTube video series, <a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=UGoA-Jt52_c&amp;list=PLEI81bLU4t-uzsIOt1iaykzI4ZSsNQ9ao&amp;pp=gAQB">Building with Next.js and Headless CMS</a>. It’s an 8-part series looking at the power of <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/starters/nextjs">Next.js</a> when paired with Agility CMS. Next.js and <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/product/headless-cms">headless CMS</a> go hand-in-glove to help <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/product/developers">developers</a> build fast, scalable, and dynamic websites. Joel’s video series walks you through integrating Agility CMS with Next.js, examining essential topics such as previewing, creating components, caching, authenticating, and more.Watch the Full Series: <a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=UGoA-Jt52_c&amp;list=PLEI81bLU4t-uzsIOt1iaykzI4ZSsNQ9ao&amp;pp=gAQB">Building with Next.js and Headless CMS on YouTube</a>  <figure class="media"><div data-oembed-url="https://www.youtube.com/watch?v=UGoA-Jt52_c&amp;list=PLEI81bLU4t-uzsIOt1iaykzI4ZSsNQ9ao"><div style="position:relative;padding-bottom:100%;height:0;padding-bottom:56.2493%"><iframe src="https://www.youtube.com/embed/UGoA-Jt52_c" style="position:absolute;width:100%;height:100%;top:0;left:0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe></div></div></figure><h3 id="the-what-and-why-of-next.js-">The What and Why of Next.js </h3> <h4 id="the-what-">The What </h4>Next.js was developed in 2016 by <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/partners/integrations/vercel">Vercel</a> as an open-source, <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/blog/react-cms">React</a>-based JavaScript framework. It enables server-side rendering (SSR), static site generation (SSG), and incremental static regeneration (ISR) to optimize performance and <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/solutions/modern-websites-and-seo">search engine optimization (SEO)</a>. In other words: Next.js decides the best way to show content based on how data is fetched from pages: <ul><li>SSG prepares pages ahead of time. </li><li>SSR generates them on demand. </li><li>ISR generates them statically at first, but then incrementally updates them as changes happen in the CMS. </li></ul>All these options reduce the work a visitor’s browser must do. This makes the browsing experience smoother and more efficient.  <h4 id="the-why-">The Why </h4>Both developers and marketers benefit from Next.js: <figure class="table"><table><tbody><tr><td>Developers</td><td>Marketers</td></tr><tr><td><ul><li>API Routes </li><li>Incremental Static Regeneration (ISR) </li><li>File-Based Routing </li><li>Optimized Performance </li><li>Seamless Vercel Integration</li></ul></td><td><ul><li>Fast loading speed for high-performance sites </li><li>SEO-friendliness for easy content indexing </li><li>Greater content control via headless integration </li><li>Supports <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/solutions/content-hub-and-omnichannnel-deployments">omnichannel</a> marketing activities </li><li>Real-time previews and publishing</li></ul></td></tr></tbody></table></figure>Marketing websites benefit from fast-loading, SEO-rich content. E-commerce platforms can take advantage of dynamic product pages using ISR. With Next.js and a headless CMS, your content becomes omnipresent – meaning it’s ready for websites, apps, digital signage, and beyond. <h3 id="joel’s-key-takeaway-">Joel’s Key Takeaway </h3>If there’s one thing Joel wants you to take away from <a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=UGoA-Jt52_c&amp;list=PLEI81bLU4t-uzsIOt1iaykzI4ZSsNQ9ao&amp;pp=gAQB">Building with Next.js and Headless CMS</a>, it’s this (in his own words): “As a modern web framework, Next.js is the leader when it comes to building actual production sites for customers. A front-end developer with React skills can really level up their game by following along with this series. I see it as an opportunity for someone to take their career to a whole new level.” <h3 id="next.js-makes-a-difference-">Next.js Makes a Difference </h3>React is powerful. But by itself, it doesn’t offer SSR, SSG, ISR, SEO, or many other amazing acronyms. Next.js fills in those gaps and transforms React into a full-featured web framework. From there, Next.js: <ul><li>Spans developer and marketing needs: Developers can build quickly while content teams manage content effectively – without stepping on each other’s toes.  </li><li>Future-proofs your tech stack: Next.js works with <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/resources/guide/introduction-to-jamstack">Jamstack</a> and deploys on platforms like Vercel or <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/partners/integrations/netlify">Netlify</a>. It’s flexible and adaptable, meaning you aren’t “locked in” to, well, anything. </li><li>Powers better web experiences: Build faster, more accessible, and more scalable websites and apps without wrestling the framework.  </li></ul><h3 id="get-your-popcorn-ready-">Get Your Popcorn Ready </h3>Joel has been a mainstay within the industry for 20 years. He’s known for his engaging and insightful <a target="_blank" rel="noopener noreferrer" href="https://agilitycms.com/resources/events">webinars</a>. And his ability to craft dad jokes out of thin air borders on the supernatural. All that to say, you’re going to learn quite a bit – and get some unexpected chuckles too – when you check out <a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/watch?v=UGoA-Jt52_c&amp;list=PLEI81bLU4t-uzsIOt1iaykzI4ZSsNQ9ao&amp;pp=gAQB">Building with Next.js and Headless CMS</a>.  <hr /><h4 style="text-align:center" id="looking-for-guidance-on-agility?-talk-to-an-expert.">Looking for guidance on Agility? <a target="_blank" rel="noopener noreferrer" href="https://cmscritic.com/contact">Talk to an expert.</a></h4><hr /> <h3 id="upcoming-events">Upcoming Events</h3> <img style="width:24.53%" src="https://cmscritic.com/ms-content/uploads/2025/03/image-1742910054704.png" /><h4 id="the-composable-conference-2025"><a target="_blank" rel="noopener noreferrer" href="https://machalliance.org/events/composable-conference-25">The Composable Conference 2025</a></h4>April 22-24 – Chicago, USAExperience the future of composable and MACH principles in “The Windy City” and dive even deeper into the innovative world of MACH architecture and its benefits for your business. Building on the momentum of MACH THREE, this conference will provide your teams with the expert, impartial guidance needed to craft a winning transformation strategy and leverage the latest advancements in automation and Al to maximize efficiency and drive your organization forward. This event is ideal for executives, business leaders, technologists, and everyone in between who is looking to harness the power of composable. <a target="_blank" rel="noopener noreferrer" href="https://machalliance.org/events/composable-conference-25">Secure your spot today.</a> <img style="width:30.46%" src="https://cmscritic.com/ms-content/uploads/2024/11/cms-summit-25.png" alt="" /><h4 id="cms-summit-25"><a target="_blank" rel="noopener noreferrer" href="https://www.boye-co.com/conferences/cmssummit25">CMS Summit 25</a></h4>May 13-14, 2025 – Frankfurt, GermanyDon't miss the first European edition of our prestigious international conference dedicated to the global content management community! CMS Summit 25 will bring together top-notch speakers, our renowned learning format, and engaging social events. Hear from leading practitioners like Deutsche Bahn, Dr. Oetker, and more – and join customers, agencies, and CMS vendors as we discuss current trends and what's ahead for the content and digital experience fields. Connect and network at the only vendor-neutral, in-person conference focused on CMS. Space is limited for this exclusive event, <a target="_blank" rel="noopener noreferrer" href="https://www.boye-co.com/conferences/cmssummit25">so book your seats today.</a> <img style="width:31.83%" src="https://cmscritic.com/ms-content/uploads/2025/01/cms-connect-2025-logo.png" alt="" /><h4 id="cms-connect-25"><a target="_blank" rel="noopener noreferrer" href="https://www.boye-co.com/conferences/cmsconnect25">CMS Connect 25</a></h4>August 5-6, 2025 – Montreal, CanadaWe are delighted to present the second annual summer edition of our signature global conference dedicated to the content management community! CMS Connect will be held again in beautiful Montreal, Canada, and feature a unique blend of masterclasses, insightful talks, interactive discussions, impactful learning sessions, and authentic networking opportunities. Join vendors, agencies, and customers from across our industry as we engage and collaborate around the future of content management – and hear from the top thought leaders at the only vendor-neutral, in-person conference exclusively focused on CMS. Space is limited for this event, <a target="_blank" rel="noopener noreferrer" href="https://www.boye-co.com/conferences/cmsconnect25">so book your seats today.</a>

Varty’s Videos: A CTO’s Take on Next.js

Best Video Experience

Give your audience the best video experience

#000000

Explore a wide range of informative articles on Joel Varty, insights, and industry updates. Stay informed and ahead of the curve with our diverse collection of news and posts covering the latest trends and developments in the industry

News

The Headless Holodeck: Joel Varty of Agility CMS on Warp-Speed Demos, AI, and the Next Generation of CMS

Varty’s Videos: Where AI Meets Code

Varty’s Videos: All About Composable

Varty’s Videos: A CTO’s Take on Next.js

Give your audience the best video experience