Let's focus on CRUD operations. Previously, we have been just reading data from the server and showing it to the user. Now, let's shift our focus to creating, updating, and deleting data. All of this we will do for the invoices page.

Theory

Before diving into implementation let's consider such term as Server Actions in Next.js

Server Actions let you run special code directly on the server. Instead of creating complicated ways to change your data, you can use these actions.

Why are Server Actions important?

Web applications need to be secure, as they can be attacked differently. Server Actions help a lot with security. They use various techniques like special requests, coded messages, strict checks, and restrictions to keep your app safe from attacks, protect your data, and ensure that only authorized people can access it.

How do we use forms with Server Actions?

We can make forms that use Server Actions. In simple terms, we put a special code in the form to tell it what action to take. This action automatically gets the data we put into the form.