Ben Abderrahmen Mohamed Aminem-amine-bar.hashnode.dev·Dec 8, 2024Exploring Next.js Server ActionsNext.js has always been a strong framework for building full-stack apps, and with the introduction of server actions in version 13.4, it has become even more powerful.So, what are server actions?Server actions are asynchronous functions executed on t...80 readsJavaScript
Rishi Bakshirishibakshi.hashnode.dev·Oct 9, 2024The Biggest Mistake You’re Making with Next.js Server Actions: Silent ThreatOne of the critical mistakes I learned in my Next.js journey is failing to validate and protect server actions. Server actions in Next.js can expose post routes, which can be vulnerable if not properly secured. When using server actions, it's essenti...10 likesYou Don't Know Next.jsNext.js
Moniquectrlaltmonique.hashnode.dev·Aug 27, 2024How to Use React Hook Form + Zod with Next.js Server ActionsHandling form validations natively in React can be cumbersome and time-consuming—something you’ve probably experienced firsthand. Fortunately, by using React Hook Form and Zod together, you can streamline this process and kiss your struggles goodbye....react-hook-form
woodstockwoodstock.hashnode.dev·Jul 30, 2024Next.js에서 캐시 재검증을 통한 데이터 동기화 방법문제 상황 최근 프로젝트에서 사용자가 팔로우/언팔로우 버튼을 클릭할 때, 프로필 정보가 즉시 업데이트되지 않고 페이지를 새로고침해야만 변경 사항이 반영되는 문제가 발생했다. 이 문제는 사용자 경험을 저하시킬 수 있으므로, 팔로우/언팔로우 후에 프로필 정보가 즉시 반영되도록 개선이 필요했다. 문제 원인 문제의 원인은 팔로우/언팔로우 버튼을 클릭했을 때, 팔로우 상태가 변경된 후 서버 사이드에서 데이터를 다시 가져와 클라이언트로 반영하지 않았기 ...NextJScache revalidation
K I R A Nkir4n.hashnode.dev·Jul 23, 2024Efficient Type-Safe Server Actions in Next.js with ZSATL;DR: Discover how to implement type-safe server actions in your Next.js application using zsa or next-safe-action. This guide focuses on zsa, offering a clear approach to integrating type safety, validation, and error handling. Introduction to Type...205 readszsa
Dave Grayyesdavidgray.com·Jun 25, 2024Next.js Server Actions with next-safe-actionTLDR: Add type safe and validated server actions to your Next.js App Router project with next-safe-action. Next.js Server Actions Server Actions are asynchronous functions executed on the server in Next.js. They are defined with the "use server" dire...27 readsNext.js
Abiola Bakareiamstarcode.hashnode.dev·Apr 25, 2024Validate data in both Server Actions and Client in NextJs using Zod and React-Hook-FormsServer Actions, introduced in Next.js version 14, are a convenient way to create functions that execute exclusively on the server side offering several advantages such as security, performance etc. Building robust applications often requires data val...Next.js
Mazedul Islamblog.mazedulislam.com·Apr 1, 2024Full featured form using NextJS Server ActionsWe are going to build a contact form using Nextjs and Server Actions. When the user submit the form it should send an email to your personal email account. Bootstrap The Project Generate a new Nextjs project and accept all the default settings, then...307 readsNext.js
Dantuffstuff9.hashnode.dev·Aug 27, 2023Using Context and State in Next.js Server ComponentsIntroduction: The Problem at Hand The Context API allows sharing values across the component tree without explicitly passing them as props. However, the introduction of React's Server Components, has thrown a wrench into the mix. Server components pr...8 likes·1.1K readsReact
Amaljithamaljith.hashnode.dev·Aug 19, 2023Implementing ReactJS new useOptimistic Hook and Next.js 13.4 Server Actions for Optimistic UI.The useOptimistic hook provides a way to implement optimistic updates in your application. These Optimistic updates enhance the user experience by making the app appear more responsive to the user by displaying instant results on the front end. Even ...10 likes·261 readsReact