Kaip įgyvendinamas CRUD?
sobes.tech AI
Atsakymas iš AI
CRUD reiškia sukurti, skaityti, atnaujinti, ištrinti. Tai pagrindinės operacijos, kurios atliekamos su duomenimis.
Create (Sukurti): Siųsti užklausą su POST metodu į galinį tašką, kad būtų sukurtas naujas išteklius. Užklausos kūnas dažniausiai turi naujo objekto duomenis.
// Pavyzdžiai naudojant Fetch API
fetch('/api/items', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ name: 'New Item' }),
})
.then(response => response.json())
.then(data => console.log('Sukurtas:', data));
Read (Skaityti): Siųsti užklausą su GET metodu:
- Visų išteklių skaitymas: GET užklausa pagrindiniam kolekcijos galiniam taškui.
- Konkretų išteklių skaitymas: GET užklausa su ištekliaus identifikatoriumi.
// Skaityti visus
fetch('/api/items')
.then(response => response.json())
.then(data => console.log('Visi elementai:', data));
// Skaityti konkretų
fetch('/api/items/123')
.then(response => response.json())
.then(data => console.log('Elementas 123:', data));
Update (Atnaujinti): Siųsti užklausą su PUT arba PATCH metodu į ištekliaus galinį tašką su identifikatoriumi:
- PUT: visiškai pakeisti esamą išteklių.
- PATCH: dalinis atnaujinimas.
// Atnaujinti (PUT)
fetch('/api/items/123', {
method: 'PUT',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ name: 'Updated Item' }),
})
.then(response => response.json())
.then(data => console.log('Atnaujinta:', data));
// Dalinis atnaujinimas (PATCH)
fetch('/api/items/123', {
method: 'PATCH',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ description: 'New Description' }),
})
.then(response => response.json())
.then(data => console.log('Pakeista:', data));
Delete (Ištrinti): Siųsti užklausą su DELETE metodu į ištekliaus galinį tašką su identifikatoriumi:
fetch('/api/items/123', {
method: 'DELETE',
})
.then(response => {
if (response.ok) {
console.log('Sėkmingai ištrinta');
} else {
console.error('Ištrynimas nepavyko');
}
});
Sąsaja su REST API:
CRUD operacijos glaudžiai susijusios su REST (Representational State Transfer) principais, kur HTTP metodai naudojami šiems veiksmams atlikti:
| CRUD | HTTP metodas |
|---|---|
| Create | POST |
| Read | GET |
| Update | PUT/PATCH |
| Delete | DELETE |
Frontend'e CRUD įgyvendinimas apima šių HTTP užklausų siuntimą į backend API ir gautų atsakymų apdorojimą. Dažnai naudojamos HTTP bibliotekos (pvz., Axios, Fetch API) ir karkasai/bibliotekos būsenos ir UI valdymui (pvz., React, Vue, Angular).