Sfida: Recuperare e Visualizzare Dati
Concentriamoci ora sul prossimo componente, LatestInvoices. Il suo scopo è visualizzare le ultime cinque fatture, ordinate cronologicamente per data.
Potresti pensare che ottenere questo risultato con JavaScript sia semplice. Tuttavia, man mano che l'app cresce e i dati aumentano, è preferibile gestire l'ordinamento e la limitazione delle fatture utilizzando SQL. Questo approccio evita di sovraccaricare il frontend con calcoli non necessari.
Per esaminare la funzione fetchLatestInvoices, visita app/lib/data.ts.
Ritorno al Progetto
Utilizzeremo la funzione fetchLatestInvoices nella pagina della dashboard per recuperare le fatture più recenti e visualizzarle tramite il componente LatestInvoices.
Ricorda di visitare app/ui/dashboard/latest-invoices.tsx e di decommentare l'interfaccia utente fornita.
Sfida
Ora, hai l'opportunità di recuperare i dati e presentare le informazioni all'utente.
Principalmente, è presente un componente Card nella pagina della dashboard. Il tuo compito è importare la funzione fetchCardData, che fornisce:
numberOfSellers;numberOfInvoices;totalFulfilledInvoices;totalAwaitingInvoices.
In base ai dati recuperati, decommenta il componente Card corrispondente.
Risultato
In Pratica
Grazie per i tuoi commenti!
Chieda ad AI
Chieda ad AI
Chieda pure quello che desidera o provi una delle domande suggerite per iniziare la nostra conversazione
Awesome!
Completion rate improved to 2.08Sfida: Recuperare e Visualizzare Dati
Scorri per mostrare il menu
Concentriamoci ora sul prossimo componente, LatestInvoices. Il suo scopo è visualizzare le ultime cinque fatture, ordinate cronologicamente per data.
Potresti pensare che ottenere questo risultato con JavaScript sia semplice. Tuttavia, man mano che l'app cresce e i dati aumentano, è preferibile gestire l'ordinamento e la limitazione delle fatture utilizzando SQL. Questo approccio evita di sovraccaricare il frontend con calcoli non necessari.
Per esaminare la funzione fetchLatestInvoices, visita app/lib/data.ts.
Ritorno al Progetto
Utilizzeremo la funzione fetchLatestInvoices nella pagina della dashboard per recuperare le fatture più recenti e visualizzarle tramite il componente LatestInvoices.
Ricorda di visitare app/ui/dashboard/latest-invoices.tsx e di decommentare l'interfaccia utente fornita.
Sfida
Ora, hai l'opportunità di recuperare i dati e presentare le informazioni all'utente.
Principalmente, è presente un componente Card nella pagina della dashboard. Il tuo compito è importare la funzione fetchCardData, che fornisce:
numberOfSellers;numberOfInvoices;totalFulfilledInvoices;totalAwaitingInvoices.
In base ai dati recuperati, decommenta il componente Card corrispondente.
Risultato
In Pratica
Grazie per i tuoi commenti!
