Wie werden die auf dem Client vorgenommenen Änderungen an den Server übertragen und in der Datenbank gespeichert?

In der Regel werden vom Benutzer in einer Webanwendung (auf dem Client) vorgenommene Änderungen an den Server gesendet, indem eine HTTP-Anfrage erfolgt.

Arten von HTTP-Anfragen:

• POST: Wird verwendet, um eine neue Ressource zu erstellen oder Daten zur Verarbeitung an den Server zu senden. Wird häufig für Formulardaten verwendet.
• PUT: Wird verwendet, um eine bestehende Ressource zu aktualisieren. Der vollständige Zustand der Ressource wird übertragen.
• PATCH: Wird verwendet, um eine Ressource teilweise zu aktualisieren. Es werden nur die geänderten Felder übertragen.
• DELETE: Wird verwendet, um eine Ressource zu löschen.

Beispiel für einen Datenfluss:

1. Der Benutzer gibt Daten in ein Formular auf der Webseite ein.
2. JavaScript auf der Client-Seite sammelt diese Daten (z.B. in einem JSON-Objekt).
3. Es wird eine HTTP-Anfrage (z.B. POST oder PUT) an einen bestimmten API-Endpunkt des Servers gesendet. Die Daten werden an den Anfragekörper angehängt.

   // Beispiel für das Senden von Daten an den Server mit fetch API
   const data = { username: 'newuser', email: 'newuser@example.com' };
   
   fetch('/api/users', {
     method: 'POST', // oder 'PUT', 'PATCH'
     headers: {
       'Content-Type': 'application/json',
       // Weitere Header, z.B. für Authentifizierung
     },
     body: JSON.stringify(data), // JavaScript-Objekt in JSON-String umwandeln
   })
   .then(response => response.json()) // Antwort des Servers in JSON parsen
   .then(data => {
     console.log('Erfolg:', data);
     // Verarbeitung der erfolgreichen Antwort
   })
   .catch((error) => {
     console.error('Fehler:', error);
     // Fehlerbehandlung
   });
   

4. Die Serveranwendung erhält die Anfrage, leitet sie an den entsprechenden Handler (Controller).
5. Der Controller extrahiert die Daten aus dem Anfragekörper.
6. Die Daten durchlaufen eine Validierung und Sanitisierung auf Serverseite, um Sicherheit und Korrektheit zu gewährleisten.
7. Die Business-Logik verarbeitet die empfangenen Daten (z.B. prüft die Einzigartigkeit des Benutzernamens, führt erforderliche Berechnungen durch).
8. Der Controller interagiert mit der Datenzugriffsebene (Data Access Layer - DAL) oder ORM (Object-Relational Mapper).
9. DAL/ORM generiert eine SQL-Anweisung oder verwendet Datenbankmethoden, um Daten in der entsprechenden Tabelle zu speichern, zu aktualisieren oder zu löschen.

   -- Beispiel SQL INSERT
   INSERT INTO users (username, email) VALUES ('newuser', 'newuser@example.com');
   
   -- Beispiel SQL UPDATE
   UPDATE users SET email = 'updated_email@example.com' WHERE username = 'newuser';
   

10. Die Datenbank führt die Operation aus und gibt das Ergebnis zurück (Erfolg oder Fehler).
11. DAL/ORM übergibt das Ergebnis an den Controller.
12. Der Controller erstellt eine Antwort für den Client (z.B. JSON mit Erfolgbestätigung, HTTP-Statuscode 200 OK, oder Fehler mit Statuscode 400 Bad Request, 500 Internal Server Error usw.).
13. Der Server sendet die Antwort an den Client.
14. JavaScript auf der Client-Seite verarbeitet die Antwort (z.B. zeigt eine Erfolgsmeldung, aktualisiert die UI oder zeigt einen Fehler an).

Verwendete Technologien hängen vom spezifischen Stack ab:

• Client: HTML, CSS, JavaScript (React, Angular, Vue.js usw.)
• Server: Frameworks (Node.js/Express, Python/Django/Flask, Ruby/Rails, Java/Spring, PHP/Laravel usw.)
• Datenbank: SQL (PostgreSQL, MySQL, SQL Server), NoSQL (MongoDB, Cassandra)

Der gesamte Prozess muss sicher sein (HTTPS, Authentifizierung, Autorisierung, Validierung) und mögliche Fehler in jedem Schritt behandeln.