SPA naudojant „AngularJS“

Šis tinklaraščio įrašas yra trumpas įvadas į SPA kūrimą naudojant „AngularJS“. Jame bandoma apsiginkluoti informacija, reikalinga norint įtraukti SPA komponentus į programas.

Šiandien „AngularJS“ tapo viena populiariausių kūrimo sistemų, visų pirma dėl savo sugebėjimo padėti kūrėjams lengvai kurti „Single Page Applications“ (SPA). Tradicinėse žiniatinklio programose klientas (naršyklė) inicijuoja ryšio kanalą su serveriu, paprašydamas puslapio. Serveris atsako apdorodamas užklausą ir išsiųsdamas puslapio HTML klientui atgal. Jei vartotojas prašo naujo puslapio, serveris siunčia kitą HTML puslapį. Net jei klientas prašo atlikti nedidelį pakeitimą, tarkim, formą su pagrindine informacija, serveris vėl turi įkelti visą puslapį ir išsiųsti atgal klientui.

HTML ir „Ajax“ užklausos

Vieno puslapio programose visas puslapis įkeliamas vienu kadru, o paskesnį ryšį serveris vykdo naudodamas „Ajax“ užklausas. Naršyklė turi atnaujinti tik pasikeitusią puslapio dalį ir nereikia kiekvieną kartą iš naujo įkelti viso puslapio, kai vartotojas pateikia naują užklausą.
Kadangi SPA metodas sutrumpina serverio užimamą laiką atsakant į vartotojų užklausas, žiniatinklio programos veikia greičiau, sunaudoja mažiau skaičiavimo galios ir leidžia „User Interface“ (UI) kūrėjams kurti patrauklesnius, judresnius tinklalapius.



„Shell“ puslapių kūrimas

SPA „vienas puslapis“ reiškia apvalkalo puslapį, kuris atsako į užklausas HTML, CSS ar „JavaScript“ forma. Korpuso puslapis asinchroniškai pateikiamas su HTML, todėl nebereikia keliauti pirmyn ir atgal į serverį. Korpuso puslapyje reikalinga tik nuoroda į „AngularJS JavaScript“ biblioteką ir „ng-view“ direktyva (virtualus konteineris, leidžiantis vartotojo sąsajos kūrėjams persijungti tarp rodinių), kad „AngularJS“ nurodytų, kur turinio puslapiai turi būti pateikti apvalkalo puslapyje.
Tame pačiame „viename“ puslapyje „AngularJS“ leidžia kūrėjams pateikti kelis rodinius, esančius tame pačiame URL. Tame pačiame apvalkalo puslapyje vienas po kito gali būti rodomi skirtingi rodinių rinkiniai, o kiekvienas rodinys dinamiškai įkraunamas, kai vartotojas slenka per puslapį.

SPA-using-AngularJS-multiple-views

Įtaisyta „AngularJS“ direktyva - „ng-app“ - leidžia kūrėjams inicijuoti programą, taip pat galima pridėti trečiųjų šalių direktyvas. Kita vertus, „ng-model“ direktyva leidžia į atmintį įtraukti duomenis surišančias išraiškas. Pažvelkite čia:

kaip atidaryti aws cli

Visame pasaulyje kūrėjai priėmė SPA naudodami „AngularJS“ ir, tikėtina, ši tendencija turėtų išlikti kurį laiką.

Turite mums klausimą? Prašau paminėti tai komentarų skiltyje ir mes su jumis susisieksime.

Susijusios žinutės: Sėkminga karjera žiniatinklio kūrime su „AngularJS“