Какво е CRUD?

CRUD е абревиатура, която описва основните операции, изпълнявани върху данните:

• Create (Създаване): Добавяне на нови данни.
• Read (Четене): Получаване на съществуващи данни.
• Update (Обновяване): Промяна на съществуващи данни.
• Delete (Изтриване): Изтриване на данни.

В frontend разработката тези операции често съответстват на HTTP методите при взаимодействие с бекенда чрез API:

CRUD операция	HTTP метод	Описание
Create	POST	Изпращане на данни за създаване.
Read	GET	Заявка за данни.
Update	PUT / PATCH	Изпращане на данни за актуализация.
Delete	DELETE	Заявка за изтриване на данни.

Пример за реализация във frontend с JavaScript за взаимодействие с REST API:

// Предположим, че имаме обект user и искаме да го създадем на сървъра
fetch('/api/users', {
  method: 'POST', // Създаване
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({ name: 'Нов потребител', email: 'nov.potrebitel@primer.com' }),
})
  .then(response => response.json())
  .then(data => console.log('Потребител създаден:', data))
  .catch(error => console.error('Грешка при създаване на потребител:', error));

// Пример за четене на данни
fetch('/api/users/1') // За потребител с ID 1
  .then(response => response.json())
  .then(data => console.log('Данни за потребителя:', data))
  .catch(error => console.error('Грешка при получаване на потребителя:', error));

// Пример за актуализация на данни
fetch('/api/users/1', {
  method: 'PUT', // Актуализиране
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({ name: 'Обновен потребител' }),
})
  .then(response => response.json())
  .then(data => console.log('Потребител обновен:', data))
  .catch(error => console.error('Грешка при обновяване на потребителя:', error));

// Пример за изтриване на данни
fetch('/api/users/1', {
  method: 'DELETE', // Изтриване
})
  .then(response => {
    if (response.ok) {
      console.log('Потребител изтрит');
    } else {
      console.error('Грешка при изтриване на потребителя:', response.status);
    }
  })
  .catch(error => console.error('Грешка при изтриване на потребителя:', error));