Next.JS with Sanity CMS – Serverless Blog App (w/ Vercel)
Next.JS with Sanity CMS – Serverless Blog App (w/ Vercel), available at $64.99, has an average rating of 4.25, with 84 lectures, based on 281 reviews, and has 2659 subscribers.
You will learn about Use the latest Next/React features (getStaticProps, getStaticPaths, getServerSideProps) Create statically generated web apps Deploy Serverless Apps Integrate Sanity CMS This course is ideal for individuals who are Starting developers curious to learn Next JS/React with Sanity CMS or Experienced developers looking to learn new features of Next JS or Developers looking for an easy way to integrate and deploy their own CMS It is particularly useful for Starting developers curious to learn Next JS/React with Sanity CMS or Experienced developers looking to learn new features of Next JS or Developers looking for an easy way to integrate and deploy their own CMS.
Enroll now: Next.JS with Sanity CMS – Serverless Blog App (w/ Vercel)
Summary
Title: Next.JS with Sanity CMS – Serverless Blog App (w/ Vercel)
Price: $64.99
Average Rating: 4.25
Number of Lectures: 84
Number of Published Lectures: 84
Number of Curriculum Items: 84
Number of Published Curriculum Objects: 84
Original Price: €139.99
Quality Status: approved
Status: Live
What You Will Learn
- Use the latest Next/React features (getStaticProps, getStaticPaths, getServerSideProps)
- Create statically generated web apps
- Deploy Serverless Apps
- Integrate Sanity CMS
Who Should Attend
- 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
Target Audiences
- 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
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.
Course Curriculum
Chapter 1: Introduction
Lecture 1: Introduction
Lecture 2: Course tips
Chapter 2: Project Setup
Lecture 1: Section Introduction
Lecture 2: Init Next App
Lecture 3: Sanity Studio App
Lecture 4: React Bootstrap Integration
Lecture 5: Separation of Navbar
Lecture 6: Absolute path to files
Lecture 7: Page layout
Chapter 3: Starting with Sanity
Lecture 1: Section Introduction
Lecture 2: Sanity Types
Lecture 3: Sanity client
Lecture 4: Get blogs
Lecture 5: Blog fields & display blogs
Lecture 6: Under the hood
Lecture 7: Date and image
Lecture 8: Authors
Lecture 9: Display author
Lecture 10: Sanity validation
Lecture 11: Fonts + minor styling improvements
Lecture 12: Link and detail page
Lecture 13: Get blog data
Lecture 14: getStaticPaths function
Lecture 15: getStaticPaths part 2
Lecture 16: Blog detail page layout
Chapter 4: Sanity Blog Features
Lecture 1: Section Introduction
Lecture 2: Sanity content and Image
Lecture 3: Sanity content and Code
Lecture 4: packageLock
Lecture 5: Blog content
Lecture 6: Code stylings
Lecture 7: Image improvements
Lecture 8: More about images
Lecture 9: Cropping of images
Lecture 10: Image position
Lecture 11: Apply image position
Chapter 5: Blog List View & Client fetching
Lecture 1: Section Introduction
Lecture 2: Filtering view start
Lecture 3: Filtering working
Lecture 4: Font awesome
Lecture 5: List item data
Lecture 6: useSWR
Lecture 7: Api route to get blogs
Lecture 8: Update
Lecture 9: Get blogs from api
Lecture 10: Ordering
Chapter 6: Pagination & Date Sorting
Lecture 1: Section Introduction
Lecture 2: swr Pagination
Lecture 3: Button to load
Lecture 4: Passing offset
Lecture 5: Fetch more blogs
Lecture 6: Fix fetching more blogs
Lecture 7: Date filtering icon
Lecture 8: Sorting by date
Lecture 9: Fix sorting by date
Lecture 10: Blank image
Lecture 11: Blank list item
Lecture 12: Moment and cover image
Chapter 7: Fallback & Preview + Theme Feature
Lecture 1: Section Introduction
Lecture 2: Fallback
Lecture 3: Theme provider
Lecture 4: Apply theme
Lecture 5: Toggler
Lecture 6: Sanity preview
Lecture 7: Preview api route
Lecture 8: Get preview to page
Lecture 9: Get preview data
Lecture 10: Exit preview
Lecture 11: Fix issue to display preview data
Chapter 8: Deployment
Lecture 1: Section Introduction
Lecture 2: Sanity studio to Github
Lecture 3: Sanity deployment
Lecture 4: Sanity studio testing
Lecture 5: Deployment of Blog
Lecture 6: Fixing preview in production
Lecture 7: Revalidate Changes
Lecture 8: Unstable revalidate
Lecture 9: Styling Improvements
Lecture 10: Pagination improvements
Lecture 11: Preview fix
Lecture 12: Testing
Lecture 13: End of the course
Chapter 9: Updates
Lecture 1: Note
Lecture 2: Pagination
Instructors
-
Eincode by Filip Jerga
Online Education -
Filip Jerga
Software Engineer
Rating Distribution
- 1 stars: 2 votes
- 2 stars: 3 votes
- 3 stars: 24 votes
- 4 stars: 76 votes
- 5 stars: 176 votes
Frequently Asked Questions
How long do I have access to the course materials?
You can view and review the lecture materials indefinitely, like an on-demand channel.
Can I take my courses with me wherever I go?
Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!
You may also like
- Top 10 Video Editing Courses to Learn in November 2024
- Top 10 Music Production Courses to Learn in November 2024
- Top 10 Animation Courses to Learn in November 2024
- Top 10 Digital Illustration Courses to Learn in November 2024
- Top 10 Renewable Energy Courses to Learn in November 2024
- Top 10 Sustainable Living Courses to Learn in November 2024
- Top 10 Ethical AI Courses to Learn in November 2024
- Top 10 Cybersecurity Fundamentals Courses to Learn in November 2024
- Top 10 Smart Home Technology Courses to Learn in November 2024
- Top 10 Holistic Health Courses to Learn in November 2024
- Top 10 Nutrition And Diet Planning Courses to Learn in November 2024
- Top 10 Yoga Instruction Courses to Learn in November 2024
- Top 10 Stress Management Courses to Learn in November 2024
- Top 10 Mindfulness Meditation Courses to Learn in November 2024
- Top 10 Life Coaching Courses to Learn in November 2024
- Top 10 Career Development Courses to Learn in November 2024
- Top 10 Relationship Building Courses to Learn in November 2024
- Top 10 Parenting Skills Courses to Learn in November 2024
- Top 10 Home Improvement Courses to Learn in November 2024
- Top 10 Gardening Courses to Learn in November 2024