How To Dev

Introduction NextJS Server Actions is a powerful feature that allows you to perform data mutations directly on the server without having to create API Routes manually. Distinguishing between Routes Handle and Server Actions Similarities: Both are code defined on the Server Both can be used in Server components and Client components Differences: Use Routes Handle if you need to call APIs from outside such as from partners or mobile Use Server Actions for internal CRUD processing operations The outstanding advantages of Server Actions compared to Routes Handle include: Tight integration with Form: Works smoothly with the action attribute of HTML forms. Progressive Enhancement: The application can still function basically even when JavaScript has not finished loading or is disabled. Security: Automatically protects against CSRF attacks and keeps sensitive processing logic on the server side. Code simplification: Reduces boilerplate code when connecting between Client and Server. When...

Introduction CSRF (Cross-Site Request Forgery) is a type of attack targeting user sessions. Attackers trick the victim's browser into sending requests (accompanied by identification cookies) to websites where they are logged in without permission. To prevent CSRF, we have 3 main strategies: Method 1 : Check Origin / Referer headers Check if the Origin or Referer header matches the server domain. If they differ, block them immediately at the NextJS Proxy layer before forwarding to the server. Method 2 : Configure SameSite for Cookies When setting cookies for the client, you must set the SameSite=Strict or SameSite=Lax attribute. In this case, if the request originates from a different website, the browser will refuse to attach the Cookie, NextJS receives an empty request and will return a 401 Unauthorized error. Method 3 : Use CSRF Token Require the client to send a Token (generated randomly for each user or using JWT) in the Header. Since a fake site cannot have this token, the out...