Lektion 6 von 6
Projekt: das Dashboard
Das Muster jeder modernen App: asynchrone Daten laden, aggregieren, dann die Oberfläche rendern — genau das macht ein Dashboard.
fetchStats() simuliert die API. Ihre KPIs: Summe mit reduce, bestes Element per Vergleich, Liste gerendert mit createElement oder insertAdjacentHTML.
async function load() {
const stats = await fetchStats();
const total = stats.visits.reduce((a, v) => a + v, 0);
}🎯 Aufgabe
Mit den Daten von fetchStats() (vorgegeben): 1) Schreiben Sie in #kpi-visits die Summe der Besuche (760, via reduce); 2) schreiben Sie in #kpi-top den Namen des Users mit dem besten xp (Pixel); 3) fügen Sie in die Liste #users ein <li> pro User mit Name und xp ein. Alles in einer async-Funktion, die beim Laden aufgerufen wird.
PRO-Lektion
Dieses fortgeschrittene Kapitel gehört zu CodeAge PRO. Schalte es frei, um dein Abenteuer fortzusetzen.
PRO entdecken →