Next.JS with Sanity CMS - Serverless Blog App (w/ Vercel)
What you'll learn
- Use the latest Next/React features (getStaticProps, getStaticPaths, getServerSideProps)
- Create statically generated web apps
- Deploy Serverless Apps
- Integrate Sanity CMS
Requirements
- Basics in programming and JS required!
- Basic knowledge of React JS
Description
What is Sanity?
Sanity is the platform for structured content. With Sanity, you can manage your text, images, and other media with APIs. You can also use the open-source single-page application Sanity Studio to set up an editing environment that you can customize quickly. With Sanity, you have access to many APIs, libraries, and tools that helps you leverage the benefits of having all your content available as a single source of truth. This article will quickly walk you through some central concepts, giving you a head start.
What is Next JS?
Next, JS is React framework that provides infrastructure and simple development experience for server-side rendered(SSR) applications.
An intuitive page-based routing system (with support for dynamic routes)
Pre-rendering, both static generation (SSG) and server-side rendering (SSR) are supported on a per-page basis
About the main project
We will start with integrating an immaculate application layout I have prepared for you. We will follow the latest practices of React and Next JS. This means we will utilize hook functions as much as possible.
After the initial layout and pages are created, we will start preparing actual data in Sanity Studio. I will explain to you the basics of Sanity, and we will prepare two types of documents - Blogs and Authors.
We will specify various fields describing our data, for example, "Code Blocks," "Images," and many others.
After data is fetched, we will display blogs on our application pages. You will learn how to process images and apply stylings to code blocks.
Later in the course, you will learn how to apply different filtering options to the application view, paginate items, and manage to sort the data. You will learn how to use the provider and consumer/concept, which we will use to control our application's light and dark theme.
Next, we will talk about the Preview feature. The preview feature will allow it to display draft blog data before they are published into production.
We will deploy our application into the Vercel platform at the end of the course. The application will be statically optimized and super fast.
Thank you for your time, and I hope to see you in the course.
Who this course is for:
- Starting developers curious to learn Next JS/React with Sanity CMS
- Experienced developers looking to learn new features of Next JS
- Developers looking for an easy way to integrate and deploy their own CMS
Featured review
Instructors
- 4.5 Instructor Rating
- 5,631 Reviews
- 51,829 Students
- 28 Courses
At Eincode, our mission is to deliver the best online learning experience for our audience.
We specialize in creating high-quality content, with programming concepts brought to life through real-world projects. Whether you're exploring web development or mobile app creation, Eincode is your trusted resource for comprehensive and practical programming guides.
If you're seeking complete, in-depth courses to enhance your skills, Eincode has you covered.
Our instructor, Filip Jerga, is dedicated to sharing his expertise and regularly publishes courses designed to help you achieve your coding goals.
- 4.5 Instructor Rating
- 6,847 Reviews
- 66,865 Students
- 30 Courses
Hi, I’m Filip Jerga, an experienced software engineer and freelance developer with a Master’s degree in Artificial Intelligence. Over the years, I’ve worked on a wide range of technologies and projects, from C++ development for ultrasound devices to building modern mobile and web applications using React and Angular.
My career has equipped me with deep technical expertise and a passion for teaching. I take pride in explaining programming concepts in a clear, detailed, and engaging way, making them accessible to learners of all levels. I invite you to join my course, where I’ve dedicated great effort to delivering hands-on, practical insights into web and software development.