SPA kasutades AngularJS-i



See blogipostitus on lühike sissejuhatus SPA ehitamiseks AngularJS-i abil. See proovib teid varustada teabega, mis on vajalik SPA-komponentide lisamiseks rakendustesse.

Tänapäeval on AngularJS-ist saanud üks populaarsemaid arendusraamistikke peamiselt tänu oma võimele aidata arendajatel hõlpsasti luua ühe lehe rakendusi (SPA). Traditsioonilistes veebirakendustes algatab klient (brauser) serveriga suhtluskanali lehe taotlemisega. Server vastab päringu töötlemisega ja lehe HTML-i kliendile tagasi saatmisega. Kui kasutaja soovib uut lehte, saadab server teise HTML-lehe. Isegi kui klient palub väikest muudatust, öelge põhiandmetega vorm, peab server kogu lehe uuesti laadima ja kliendile tagasi saatma.

HTML ja Ajaxi taotlused

Rakenduses Single Page Applications laaditakse kogu leht ühe kaadrina ja järgneva suhtluse teostab server Ajaxi päringute abil. Brauser peab värskendama ainult seda osa lehest, mis on muutunud, ja pole vaja kogu lehte uuesti laadida iga kord, kui kasutaja esitab uue taotluse.
Kuna SPA-lähenemine vähendab serveri poolt kasutaja päringutele vastamiseks kuluvat aega, töötavad veebirakendused kiiremini, kasutavad vähem arvutusvõimsust ja võimaldavad kasutajaliidese (UI) arendajatel luua atraktiivsemaid ja väledamaid veebilehti.





Shelli lehtede loomine

SPA üksikleht viitab kestlehele, mis vastab päringutele HTML-i, CSS-i või JavaScripti kujul. Kooreleht renderdatakse asünkroonselt HTML-iga, välistades vajaduse edasi-tagasi serverisse liikumise järele. Kooreleht vajab ainult viidet AngularJS JavaScripti teegile ja ng-view direktiivile (virtuaalne konteiner, mis võimaldab kasutajaliidese arendajatel vaadete vahel vahetada), et öelda AngularJS-ile, kus sisulehed tuleb shellilehel renderdada.
Samal „ühel” lehel võimaldab AngularJS arendajatel pakkuda mitu URL-is sisalduvat vaadet. Erinevad vaatekomplektid võivad ilmuda üksteise järel samal kestal ja iga vaade laaditakse dünaamiliselt, kui kasutaja lehte sirvib.

SPA-using-AngularJS-multiple-views



Sisseehitatud AngularJS direktiiv - ng-app - võimaldab arendajatel rakenduse initsialiseerida, lisades võimaluse lisada ka kolmandate osapoolte direktiive. Teisalt võimaldab ng-mudeli direktiiv lisada mällu andmeid siduvaid väljendeid. Heitke pilk siia:

mida hoiatus javascriptis teeb

Ülemaailmselt on arendajad kasutusele võtnud SPA AngularJS-i abil ja suure tõenäosusega püsib see suundumus mõnda aega.



Kas teil on meile küsimus? Palun mainige seda kommentaaride jaotises ja võtame teiega ühendust.

Seonduvad postitused: Edukas veebiarenduse karjäär koos AngularJS-iga