Operacje CRUD

6.1 Wprowadzenie do CRUD

CRUD to akronim oznaczający cztery podstawowe operacje, które można wykonywać na danych: tworzenie (Create), odczyt (Read), aktualizacja (Update) i usuwanie (Delete). Te operacje są fundamentalne dla pracy z bazami danych i stanowią podstawę większości aplikacji webowych.

Co to jest CRUD?

• Create (Tworzenie): operacja tworzenia służy do dodawania nowych rekordów do bazy danych. Pozwala to wprowadzać nowe dane do systemu.
• Read (Odczyt): operacja odczytu służy do pobierania danych z bazy danych. Umożliwia użytkownikom zapytania i przegląd istniejących informacji.
• Update (Aktualizacja): operacja aktualizacji służy do zmiany istniejących rekordów w bazie danych. Umożliwia edytowanie i korygowanie danych.
• Delete (Usuwanie): operacja usuwania służy do usuwania rekordów z bazy danych. Umożliwia to usuwanie niepotrzebnych lub przestarzałych danych.

Metody HTTP dla operacji CRUD

W kontekście web developmentu operacje CRUD często wykonywane są przy użyciu zapytań HTTP do API. Różne metody HTTP odpowiadają różnym operacjom CRUD:

• POST: używany do tworzenia nowych zasobów.
• GET: używany do odczytywania (pobierania) zasobów.
• PUT i PATCH: używane do aktualizacji istniejących zasobów. PUT zazwyczaj do pełnej zamiany zasobu, podczas gdy PATCH — do częściowej aktualizacji.
• DELETE: używany do usuwania zasobów.

Dlaczego potrzebne są operacje CRUD?

Operacje CRUD są podstawą pracy z danymi w aplikacjach webowych. Pozwalają deweloperom implementować podstawowe funkcjonalności, takie jak tworzenie kont użytkowników, edytowanie profili, przeglądanie danych i usuwanie rekordów. Te operacje również zapewniają interakcję między klientem a serwerem, umożliwiając transfer danych i komend.

Nowoczesne narzędzia do wykonywania operacji CRUD

Współczesne aplikacje webowe często wykorzystują różne narzędzia i biblioteki do wykonywania operacji CRUD przez API:

• Fetch API: wbudowany w przeglądarkę sposób wykonywania zapytań HTTP, oparty na promesach.
• Axios: popularna biblioteka do wykonywania zapytań HTTP, oferująca wygodne i zaawansowane API.

Te narzędzia pomagają deweloperom łatwo i efektywnie wykonywać operacje CRUD, zapewniając elastyczność i prostotę integracji z różnymi API serwera.

6.2 Korzystanie z Fetch

Przeanalizujmy korzystanie z Fetch do wykonywania operacji CRUD.

Tworzenie (Create):

const createData = async (data) => {
  const response = await fetch('https://jsonplaceholder.typicode.com/posts', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(data)
  });
  const result = await response.json();
  console.log('Created:', result);
};

createData({ title: 'foo', body: 'bar', userId: 1 });

Odczyt (Read):

const readData = async (id) => {
  const response = await fetch(`https://jsonplaceholder.typicode.com/posts/${id}`);
  const result = await response.json();
  console.log('Read:', result);
};

readData(1);

Aktualizacja (Update):

const updateData = async (id, data) => {
  const response = await fetch(`https://jsonplaceholder.typicode.com/posts/${id}`, {
    method: 'PUT',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify(data)
  });
  const result = await response.json();
  console.log('Updated:', result);
};

updateData(1, { title: 'foo', body: 'bar', userId: 1 });

Usuwanie (Delete):

const deleteData = async (id) => {
  const response = await fetch(`https://jsonplaceholder.typicode.com/posts/${id}`, {
    method: 'DELETE'
  });
  if (response.ok) {
    console.log('Deleted:', id);
  } else {
    console.error('Failed to delete:', id);
  }
};

deleteData(1);

6.3 Korzystanie z Axios

Przeanalizujmy korzystanie z Axios do wykonywania operacji CRUD.

Tworzenie (Create):

const axios = require('axios');

const createData = async (data) => {
  try {
    const response = await axios.post('https://jsonplaceholder.typicode.com/posts', data);
    console.log('Created:', response.data);
  } catch (error) {
    console.error('Error creating data:', error);
  }
};

createData({ title: 'foo', body: 'bar', userId: 1 });

Odczyt (Read):

const readData = async (id) => {
  try {
    const response = await axios.get(`https://jsonplaceholder.typicode.com/posts/${id}`);
    console.log('Read:', response.data);
  } catch (error) {
    console.error('Error reading data:', error);
  }
};

readData(1);

Aktualizacja (Update):

const updateData = async (id, data) => {
  try {
    const response = await axios.put(`https://jsonplaceholder.typicode.com/posts/${id}`, data);
    console.log('Updated:', response.data);
  } catch (error) {
    console.error('Error updating data:', error);
  }
};

updateData(1, { title: 'foo', body: 'bar', userId: 1 });

Usuwanie (Delete):

const deleteData = async (id) => {
  try {
    const response = await axios.delete(`https://jsonplaceholder.typicode.com/posts/${id}`);
    if (response.status === 200) {
      console.log('Deleted:', id);
    }
  } catch (error) {
    console.error('Error deleting data:', error);
  }
};

deleteData(1);

6.4 Porady dotyczące użycia CRUD

Porady dotyczące użycia operacji CRUD przez API:

1. Obsługa błędów: zawsze obsługuj możliwe błędy przy wykonywaniu zapytań HTTP. Używaj bloków try...catch lub metod catch do obsługi błędów.
2. Walidacja danych: przed wysłaniem danych na serwer upewnij się, że są w odpowiednim formacie.
3. Uwierzytelnianie i autoryzacja: pracując z chronionymi zasobami upewnij się, że prawidłowo obsługujesz uwierzytelnianie i autoryzację, na przykład dodając tokeny dostępu do nagłówków zapytań.
4. Paginacja i filtrowanie: przy pobieraniu dużych ilości danych używaj parametrów zapytań do paginacji i filtrowania danych.
5. Cache'owanie: dla poprawienia wydajności możesz cache'ować często zapytywane dane.