Übung und Herausforderung: Daten Abrufen
Konzentrieren wir uns auf die nächste Komponente, LatestInvoices. Ihr Zweck ist es, die letzten fünf Rechnungen anzuzeigen, die chronologisch nach Datum sortiert sind.
Man könnte denken, dass dies mit JavaScript einfach zu erreichen ist. Wenn die App jedoch wächst und mehr Daten erscheinen, ist es vorzuziehen, das Sortieren und Begrenzen der Rechnungen mit SQL zu handhaben. Dieser Ansatz verhindert, dass das Frontend mit unnötigen Berechnungen überlastet wird.
Um die Funktion fetchLatestInvoices zu inspizieren, besuchen Sie bitte app/lib/data.ts.
Zurück zum Projekt
Wir werden die Funktion fetchLatestInvoices auf der Dashboard-Seite verwenden, um die neuesten Rechnungen abzurufen und sie mit der LatestInvoices-Komponente anzuzeigen.
Vergessen Sie nicht, app/ui/dashboard/latest-invoices.tsx zu besuchen und die bereitgestellte Benutzeroberfläche zu entkommentieren.
Herausforderung
Jetzt ist es Ihre Chance, die Daten abzurufen und die Informationen dem Benutzer zu präsentieren.
Hauptsächlich haben wir eine Card-Komponente auf der Dashboard-Seite. Ihre Aufgabe ist es, die Funktion fetchCardData zu importieren, die bereitstellt:
numberOfSellers;numberOfInvoices;totalFulfilledInvoices;totalAwaitingInvoices.
Basierend auf den abgerufenen Daten, kommentieren Sie die entsprechende Card-Komponente aus.
Ergebnis
In der Praxis
Danke für Ihr Feedback!
Fragen Sie AI
Fragen Sie AI
Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen
What does the fetchLatestInvoices function return?
How do I uncomment the UI in latest-invoices.tsx?
Can you explain how the LatestInvoices component works?
Awesome!
Completion rate improved to 2.08Übung und Herausforderung: Daten Abrufen
Swipe um das Menü anzuzeigen
Konzentrieren wir uns auf die nächste Komponente, LatestInvoices. Ihr Zweck ist es, die letzten fünf Rechnungen anzuzeigen, die chronologisch nach Datum sortiert sind.
Man könnte denken, dass dies mit JavaScript einfach zu erreichen ist. Wenn die App jedoch wächst und mehr Daten erscheinen, ist es vorzuziehen, das Sortieren und Begrenzen der Rechnungen mit SQL zu handhaben. Dieser Ansatz verhindert, dass das Frontend mit unnötigen Berechnungen überlastet wird.
Um die Funktion fetchLatestInvoices zu inspizieren, besuchen Sie bitte app/lib/data.ts.
Zurück zum Projekt
Wir werden die Funktion fetchLatestInvoices auf der Dashboard-Seite verwenden, um die neuesten Rechnungen abzurufen und sie mit der LatestInvoices-Komponente anzuzeigen.
Vergessen Sie nicht, app/ui/dashboard/latest-invoices.tsx zu besuchen und die bereitgestellte Benutzeroberfläche zu entkommentieren.
Herausforderung
Jetzt ist es Ihre Chance, die Daten abzurufen und die Informationen dem Benutzer zu präsentieren.
Hauptsächlich haben wir eine Card-Komponente auf der Dashboard-Seite. Ihre Aufgabe ist es, die Funktion fetchCardData zu importieren, die bereitstellt:
numberOfSellers;numberOfInvoices;totalFulfilledInvoices;totalAwaitingInvoices.
Basierend auf den abgerufenen Daten, kommentieren Sie die entsprechende Card-Komponente aus.
Ergebnis
In der Praxis
Danke für Ihr Feedback!
