Summary  
This chapter demonstrates how to bind a form button to a server‐side action that accepts an identifier, executes a SQL DELETE operation, and revalidates the affected UI path. It covers creating the deleteInvoice function and wiring it into the interface via a form action.

General domain of usage  
Invoice management

Реалізація функціоналу видалення рахунку.

## Повернення до проєкту
Для використання Server Action для видалення рахунку обгорніть кнопку видалення у елемент `<form>` і передайте `id` до Server Action за допомогою функції `bind`:

Для завершення завдання створюється дія `deleteInvoice`.

Як бачите, ми не використовуємо `redirect()`, оскільки дія видалення викликається на сторінці `dashboard/invoices`.

Навчіться створювати сучасні високопродуктивні вебзастосунки з використанням Next.js. Налаштовуйте проєкти зі структурованими макетами, стилізацією та маршрутизацією для безшовної навігації. Ефективно отримуйте та відображайте дані, оптимізуючи рендеринг і продуктивність. Реалізуйте розширені функції, такі як пагінація, CRUD-операції та глобальний пошук для динамічних вебзастосунків. Розгортайте свої проєкти Next.js, підключайте їх до баз даних і додавайте автентифікацію для захисту даних користувачів.

Обговорення необхідних попередніх знань перед початком роботи з фреймворком Next.js, очікувань від курсу та проєктів, які будуть створені.

Ми налаштуємо проєкт, розглянемо способи додавання стилів до нашого застосунку та охопимо візуальні аспекти, такі як зображення, шрифти, сторінки й макети.

Дізнайтеся, як легко створювати та керувати новим поданням для вашого застосунку й здійснювати навігацію між усіма сторінками за допомогою вбудованої системи маршрутизації.

Розгортання додатка Next.js за допомогою облікових записів GitHub і Vercel. Додатково — налаштування бази даних для забезпечення додатка необхідними даними.

Розгляд способів отримання та чіткого й ефективного відображення даних для користувача.

Дізнайтеся, як впроваджувати сучасні веб-функції, такі як пагінація, CRUD-операції, глобальний пошук, валідація форм та інше.

Реалізація автентифікації у Next.js.

Видалення Елемента з Бази Даних

Повернення до проєкту

На практиці

Awesome!

Видалення Елемента з Бази Даних

Повернення до проєкту

На практиці