Explore Server Actions in Next.js 13 through a comprehensive tutorial on implementing CRUD operations and server mutations. Learn various methods to invoke async server actions, utilize progressively enhanced forms, and understand the concept of server mutations. Discover how to set up a project, create server actions with different props, implement progressive enhancement, and handle navigation issues. Gain insights into optimistic updates using useOptimistic and explore practical examples of addTodo, deleteTodo, and updateTodo server actions. Perfect for developers looking to enhance their Next.js skills and leverage the power of server-side rendering in web applications.
Server Actions in Next.js - Nextjs 13 Server Mutations
Overview
Syllabus
Intro
Welcome
Getting Started
What Do Server Actions Provide?
Project Setup & Config
Server Action with action prop
Ways to Invoke a Server Action
addTodo Server Action
What is Progressive Enhancement?
Progressive Enhancement Example
Server Action with formAction prop
Server Mutations definition
deleteTodo & updateTodo Server Actions
Server Action with startTransition
Server Mutation Navigation Issue
Fix for the Navigation Issue
useOptimistic for Optimistic Updates
Taught by
Dave Gray
Related Courses
-
Build a Twitter Clone with the Next.js App Router and Supabase
-
Mutating Data in Next.js - Mutations with Nextjs 13
-
Learn Next.js 13 With This One Project
-
The Best Way to Fetch Data from an API in React - SWR Preload & Optimistic UI
-
Next.js Data Fetching, Dynamic Routes & Metadata - Nextjs 13
-
Build Modern Next 14 Server-Side App with Server Actions, Infinite Scroll and Framer Motion Animations
