Documentație / IDE-ul

Harta fullstack

Leagă fiecare apel HTTP din front-end de endpoint-ul din back-end care îl servește, te lasă să navighezi între ele și te avertizează când o modificare strică contractul.

Harta fullstack leagă apelurile HTTP din front-end-ul tău de endpoint-urile din back-end. Astfel vezi ce apeluri nu au endpoint, ce endpoint-uri nu folosește nimeni și ce s-ar strica la o modificare.

Deschiderea

Unelte › Harta fullstack. Nu are scurtătură implicită; o găsești și cu Ctrl+Shift+A.

Harta are nevoie de ambele părți. Merge oricare dintre aceste variante:

  • două foldere rădăcină în același spațiu de lucru;
  • cele două proiecte deschise în vizualizarea împărțită;
  • un singur proiect care are și front-end, și back-end.

Dacă există o singură parte, Yuli îți cere să adaugi celălalt proiect în spațiul de lucru sau să îl deschizi în vizualizarea împărțită.

Filtre

Filtru Arată
Toate Întreaga hartă.
Cu apeluri Endpoint-urile pe care le folosește front-end-ul.
Apeluri fără endpoint Apeluri din front-end fără endpoint în back-end: probabil erori.
Endpoint-uri nefolosite Endpoint-uri pe care nu le folosește niciun apel din front-end.
Contract Contractul dintre cele două părți.
Sarcini fullstack Sarcini care ating în același timp front-end-ul și back-end-ul.

Fiecare legătură are un grad de încredere. Le poți păstra doar pe cele cu ≥ 70 % sau ≥ 90 %.

De la Apasă Ajungi la
Un apel HTTP din front-end Ctrl+Clic sau F12 Metoda din back-end care îl servește
Un endpoint din back-end Ctrl+Clic Utilizări din frontend

Deasupra fiecărui endpoint, o linie (CodeLens) spune „n utilizări din frontend”. Deasupra unui apel fără endpoint vei vedea „⚠ fără endpoint în backend”.

Contractul

La salvare, Yuli verifică dacă modificarea strică vreun apel din cealaltă parte. Dacă da, vei vedea asta în panoul Probleme și într-un avertisment.

În Modificări IA, modificările agentului afișează un card „Contract fullstack: n apeluri din frontend s-ar strica” înainte să le aplici.

Ce detectează

Back-end

Spring MVC și WebFlux, JAX-RS și Struts.

Front-end

Tip Clienți
Nativi fetch și XMLHttpRequest
Biblioteci axios, ky, ofetch, jQuery
Framework-uri HttpClient din Angular, SWR, React Query
Generați Clienți OpenAPI generați (TypeScript, JavaScript, Vue, Svelte)

Vezi și REST Client și diagrame și Navigare.