Hur vi bygger modern e-handel som en SPA

Jag heter Alexander Järnehall, frontendutvecklare på Cloud Nine och frontend techlead för Vålamagasinets nya e-handel. När vi fick i uppdrag att bygga en ny e-handel på Litiums plattform för Vålamagasinet, en butik i Uppsala som specialiserar sig på designmöbler, funderade vi över hur vi kunde modernisera våra framtida e-handelslösningar.

Vi har tidigare byggt e-handel för bland annat sportvarumärket Casall och Fredells Byggvaruhus på Litiums plattform, men vi kände att tiden var mogen för att utmana vårt tillvägagångssätt och bygga Vålamagasinets nya e-handel som en Single Page Application (SPA).

En Single Page Application är en webbplats där gränssnittet uppdateras automatiskt utan att ladda om sidan när användaren interagerar med sajten. På en traditionell webbplats laddas en helt ny sidstruktur (HTML) hem varje gång användaren klickar på en länk och byter sida på webbplatsen. Alla statiska element som finns på varje sida, som till exempel sidans header, navigering och footer, är oftast precis likadana som den tidigare sidan, vilket betyder att vi laddar hem information vi redan har i onödan.

På en webbplats som är byggd som en Single Page Application laddar vi endast hem den information som ska visas på den nya sidan, och ändrar sedan de delar av gränssnittet som faktiskt förändras från den föregående sidan automatiskt, utan att göra en sidomladdning.

I praktiken innebär det att när du surfar på Vålamagasinets nya webbplats (när den lanseras), och klickar på en produkt på en kategorisida, kommer du in på produktsidan och kan läsa om produkten så fort du klickar på länken, även om du sitter på en långsam uppkoppling.

Vi på Cloud Nine är så nöjda med resultatet att vi redan har flera nya e-handelslösningar i pipeline som just nu byggs på samma teknik.

Alexander