Up and Running with Cloudinary’s Next Starter Kit

Cloudinary released a Next.js Starter Kit, create-cloudinary-next, that scaffolds a media-driven Next.js application with Cloudinary integration, including environment setup, official components, and MCP servers and skills for AI coding assistants. The kit includes a new Next.js skill developed from user research to help agentic tooling succeed with Cloudinary and catch common errors.

Back in April, we released https://cloudinary.com/blog/web-app-create-cloudinary-react our React Starter Kit https://github.com/cloudinary-devs/create-cloudinary-react . The React Starter Kit allows you to type one command in the terminal, answer a few questions, and scaffold out a complete, Cloudinary-powered React application, hooked up to all of Cloudinary's latest and greatest tooling for agentic coding workflows. Today we're releasing a sequel https://github.com/cloudinary-devs/create-cloudinary-next : npx create-cloudinary-next If you're spinning up a fresh, media-driven Next.js https://nextjs.org application, we think typing those 26 characters into your terminal and hitting return is the best way to start.Here's a quick example of the kind of app this allows you to quickly prototype. What does the Next Starter Kit actually do? First, it asks you a few questions about your Cloudinary account and development environment. If you don't have the necessary prerequisites in place, it'll guide you through the process of creating them. Once you do, it records your answers in specific environment variables, configuring your app to work with your Cloudinary account. Then, it runs create-next-app https://nextjs.org/docs/app/api-reference/cli/create-next-app , installing Next.js and spinning up a working Next app using our starter template https://github.com/cloudinary-devs/create-cloudinary-next-template . The template includes our Next.js library and demonstrates use of our official Next.js components for upload and delivery, and suggests a handful of prompts to get you started building. Last, depending which AI coding assistants you told the Starter Kit that you were using during setup, it configures and installs the relevant Cloudinary MCP servers https://github.com/cloudinary/mcp-servers and skills https://github.com/cloudinary-devs/skills where your assistants can find them. The end result is a running Next.js app that can upload and deliver media from your Cloudinary account using our official Next.js components https://cloudinary.com/documentation/nextjs integration use , and a development environment primed for prompting. The heart and soul of the agentic story here is our new Next.js skill https://github.com/cloudinary-devs/skills/tree/main/skills/cloudinary-next . The skill is the result of a mountain of user research. Late last year, my colleague Raya Straus spent weeks talking to users, poring over support tickets and error logs, and soliciting reviews from internal experts. The result is a bunch of advice about how to be successful when using Cloudinary generally and our Next.js library specifically, distilled into an installable skill. When paired with our existing documentation https://github.com/cloudinary-devs/skills/tree/main/skills/cloudinary-docs and transformation https://github.com/cloudinary-devs/skills/tree/main/skills/cloudinary-transformations skills, it helps agentic tooling succeed with Cloudinary and catch common errors. We're excited to launch the skill alongside the Starter Kit, and to keep iterating on both based on automated evals and feedback from users like you. So if you're prototyping or building a new media-driven Next.js app, start here: npx create-cloudinary-next And please, let us know what you think in the comments Cloudinary ❤️ developers | |---| | Ready to level up your media workflow? Start using Cloudinary for free and build better visual experiences today. | | 👉 |