Code Explainers

Code explainers tagged #server-actions

javascript 
'use client';
 
import { useState, useTransition, useRef, useEffect, useCallback } from 'react';
import { loadMorePosts } from '@/app/actions/posts';

Infinite scroll with Server Actions in Next.js

infinite-scroll intersection-observer server-actions
Intermediate 8 steps
javascript 
'use client';
 
import { useOptimistic, useTransition } from 'react';
import { toggleLike } from '@/app/actions/likes';

Optimistic like buttons in Next.js

optimistic-ui react-hooks server-actions
Intermediate 7 steps
javascript 
'use server'
 
import { z } from 'zod'
import { redirect } from 'next/navigation'

How a Next.js Server Action validates a form

server-actions form-validation zod
Intermediate 7 steps
javascript 
'use server'
 
import { revalidatePath } from 'next/cache'
import { redirect } from 'next/navigation'

How a Next.js Server Action updates a post

server-actions authorization validation
Intermediate 7 steps