bonvi83 / laravel-api Goto Github PK

Continuiamo a lavorare sul codice dei giorni scorsi, ma in una nuova repo. L’esercizio di oggi è suddiviso in milestone ed è importante che ne seguiate l’ordine.

nome repo 1: laravel-api Aggiungiamo al nostro progetto Laravel una nuovo Api/ProjectController. Questo controller risponderà a delle richieste via API e si occuperà di restituire la lista dei progetti presenti nel database in formato json.

Testiamo la chiamata API tramite Postman e assicuriamoci di ricevere i dati correttamente.

nome repo 2: vite-boolfolio Iniziamo ad occuparci della parte front-office della nostra applicazione: creiamo un nuovo progetto Vue 3 con Vite e installiamo axios. Colleghiamo questo progetto ad una repo separata.

Nel componente principale della nostra Vue App facciamo una chiamata API all’endpoint costruito nel progetto Laravel (milestone 1) e recuperiamo tutti i progetti dal nostro back-end. Stampiamo in console i risultati e verifichiamo di ricevere i dati correttamente.

Creiamo un nuovo componente ProjectCard, che corrisponde ad una card per visualizzare un progetto. Utilizziamo questo componente per visualizzare tutti i progetti ricevuti tramite API.

Bonus: Gestire la paginazione dei risultati.

Consigli Per modificare il colore della topbar di vscode in progetti specifici:

1. CTRL + SHIFT + P
2. Selezionate "Preferences: Open Workbench Settings (JSON)"
3. Incollare il seguente codice:

{
  "workbench.colorCustomizations": {
    "titleBar.activeBackground": CODICE_COLORE,
    "titleBar.activeForeground": "#fff"
  }
}

Io uso il verde "#117F4E" per Vue ed il rosso "#AC3535" per Laravel, vanno inseriti al posto di CODICE_COLORE