Share
Enkelsidiga webbapplikationer - eller SPA, som de allmänt hänvisas till - blir snabbt de facto-standarden för webbapputveckling. Att en stor del av appen körs på en enda webbsida gör den väldigt intressant och tilltalande, och den snabba tillväxten av webbläsarfunktioner driver oss närmare på dagen när alla appar körs helt i webbläsaren.
Tekniskt sett är de flesta webbsidor redan sverige Det är komplexiteten hos en sida som skiljer en webbsida från en webbapp. Enligt min mening blir en sida en app när du innehåller arbetsflöden, CRUD-operationer och statlig hantering kring vissa uppgifter. Du arbetar med ett SPA när varje av dessa uppgifter äger rum på samma sida (med AJAX för klient / serverkommunikation, förstås).
Låt oss börja med denna gemensamma förståelse och dyka in i några av de viktigare saker som bör beaktas vid byggandet av SPA.
Det finns många punkter att tänka på innan du bygger en ny app. För att göra saken värre kan det expansiva webbutvecklingslandskapet skrämmande från början. Jag har varit i dessa oroliga skor, men lyckligtvis har de senaste åren kommit överens om de verktyg och tekniker som gör upplevelsen av applikationsutvecklingen så trevlig och produktiv som möjligt.
De flesta appar består av både klient- och serverns bitar; även om den här artikeln huvudsakligen fokuserar på en klientsidan av en app, kommer jag att ge några tips på serversidan mot slutet av den här artikeln.
Det finns en färgstark mix av teknik på klientsidan, samt flera bibliotek och praxis som möjliggör en produktiv apputveckling. Detta kan sammanfattas med följande ordmoln.
Jag kommer att expandera på var och en av punkterna ovan i följande avsnitt.
Det finns ett överflöd av ramverk att välja mellan. Här är bara en handfull av de mest populära:
Att välja ett ramverk är enkelt ett av de viktigaste alternativen du kommer att göra för din app. Visserligen vill du välja den bästa ramen för ditt team och din app. Var och en av de ovanstående ramarna innehåller MVC-designmönstret (i någon form eller annat). Som sådan är det ganska vanligt att referera till dem som MVC-ramar. Om vi var tvungna att beställa dessa ramar på en skala av komplexitet, inlärningskurva och funktionssats, från vänster till höger, det kan se ut:
Även om de är olikartade i deras genomförande och nivå av sofistikering, ger alla ovannämnda ramar några vanliga abstraktioner, såsom:
Bara titta på de senaste fem åren har det skett en explosiv tillväxt i bibliotek, verktyg och praxis.
Mer avancerade ramar, som CanJS, BatmanJS, EmberJS och AngularJS, utökar dessa grundläggande funktioner genom att ge stöd för automatiska databindande och klientsidemallar. Mallarna är databaserade och håller synningen synkroniserad med eventuella ändringar i modellen. Om du bestämmer dig för att välja ett avancerat ramverk, kommer du säkert att få mycket av funktionerna utan funktioner, men det förväntar dig också att du ska bygga din app på ett visst sätt.
Av alla tidigare listade ramar är Meteor den enda full stack-ramen. Det ger verktyg inte bara för utveckling av klientsidor, men det ger dig också en server-sida bit, via NodeJS, och end-to-end-modellsynkronisering via MongoDB. Det innebär att när du sparar en modell på klienten, fortsätter den automatiskt i MongoDB. Detta är ett fantastiskt alternativ om du kör en nodbackend och använder MongoDB för uthållighet.
Baserat på komplexiteten i din app bör du välja det ramverk som gör dig mest produktiva. Det kommer säkert att vara en inlärningskurva, men det är en engångsavgift som du betalar för utveckling av expressbanor. Var noga med att skära ut lite tid för att utvärdera dessa ramar, baserat på ett representativt användningsfall.
Notera: Om du vill lära dig mer om dessa ramar från deras skapare, lyssna på dessa videoklipp från ThroneJS.
De mest populära JavaScript-baserade templeringssystemen är Underscore mallar och Handlebars.
Några av de avancerade ramarna från föregående avsnitt erbjuder inbyggda templeringssystem.
EmberJS har till exempel inbyggt stöd för handtag. Men du måste överväga en templerande motor om du bestämmer dig för att använda en mager ram, till exempel Backbone. Underscore är en utmärkt utgångspunkt om du har begränsade krav på templering. Annars fungerar Handlebars bra för mer avancerade projekt. Det erbjuder också många inbyggda funktioner för mer expressiva mallar.
Om du upptäcker att du behöver ett stort antal mallar på kundsidan, kan du spara lite beräknatid genom att förbereda mallarna på servern. Förkompilering ger dig vanliga JavaScript-funktioner som du åberopar för att förbättra sidans laddningstid. Handlebars stöder förkompilering, vilket gör det värt dags och ansträngning att fullt ut utforska.
ExpressJS-användare kan även använda samma templerande motor på klienten som på servern, vilket ger dig nytta av att dela dina mallar mellan både klienten och servern.
Att använda en förprocessor kräver ett extra steg i din byggprocess.
JavaScript-kod läggs traditionellt till sidan, via >
Accentsconagua