Track
Content-driven web application foundations
13
Lessons
1: Building content-editable websites
1
Task
Sanity powers content operations beyond a single website or application, while Next.js focuses on best-in-class content delivery. Combine them into a powerful modern stack to build content-driven experiences.
2: Create a new Next.js 15 application
5
Tasks
Create a new, clean Next.js application with a few opinionated choices for TypeScript and Tailwind CSS.
3: Create a new Sanity project
9
Tasks
Create a new free Sanity project from the command line and automatically install Sanity Studio configuration files into your Next.js project.
4: The next-sanity toolkit
2
Tasks
Unpack next-sanity, the all-in-one Sanity toolkit for "live by default," production-grade content-driven Next.js applications.
5: Query content with GROQ
3
Tasks
Organize and author queries for your content with best-practice conventions.
6: Generate TypeScript Types
4
Tasks
Add Type-safety to your project and reduce the likelihood that you will write code that produces errors.
7: Fetch Sanity Content
8
Tasks
Query for your content using Sanity Client, a library compatible with the Next.js cache and React Server Components for modern, integrated data fetching.
8: Git-based workflows
14
Tasks
Version control, collaborate on, and deploy your Next.js application by storing it in a Git repository.
9: Go live on Vercel
8
Tasks
Publish your web application to the world. Vercel's hosting and Next.js are made for one another, so it just makes sense to put them together for this project.
10: Displaying images
9
Tasks
Sanity stores your image assets, learn how both the Sanity CDN and Next.js's Image component help optimize rendering them.
11: Block content and rich text
7
Tasks
Put the power of Portable Text to work for rendering simple formatted text up to complex block objects.
12: Build up the blog
14
Tasks
With all the basics in place, let's blow out our blog front end into something more visually impressive.
13: Fundamentals quiz
A quick test of everything you've learned through this course.