Recenze Vue Storefront – Vše, co potřebujete vědět

Budoucnost je tady!

Dobře, na chvíli všeho nech a poslouchej. Představte si bezplatnou aplikaci elektronického obchodu, která by mohla výrazně zlepšit uživatelskou zkušenost vašeho internetového obchodu a také hodnocení SEO. A revolutionární systém, který je tak flexibilní, že jej lze pohodlně provozovat na jakémkoli backendu elektronického obchodu.

Trochu úsek, co myslíte?

Ano, vím, jak to zní, protože jsem tam byl také. Tedy alespoň do té doby, než jsem nakonec vyzkoušel tuhle šílenou věc, které říkají Progressive Web Apps, nebo zkráceně PWA.

Nyní existují dobré důvody, proč se podniky stále více zamilují do PWA. Všechny je brzy odhalím. Prozatím mi však dovolte představit konkrétní aplikaci, která vám pomůže pochopit celý koncept využití PWA.

Už jste někdy slyšeli o Vue Storefront?

Je to nová aplikace pro elektronický obchod, ale její architektura se neblíží tomu, na co jsme již zvyklí. A tady je dohoda – Vue Storefront je zatím největší a nejúplnější PWA.

Co to ale znamená pro elektronický obchod?

Tento Vue Storefront recenze odhaluje vše, co potřebujete vědět – co to sakra je progresivní webová aplikace, jak je s tím vším propojena Vue Storefront, plus samozřejmě její doprovodné funkce a možnosti elektronického obchodování.

Co je progresivní webová aplikace? 

Pamatuj, když jsme řekli mobil se sotva rozjíždí? Ukázalo se, že jsme celou dobu měli pravdu. A tady je důkaz.

Mobil byl na prvním místě a následně nám představil mobilní aplikace. Postupem času se aplikace začaly slučovat s PC a webovými platformami, protože vývojáři pokračovali ve vylepšování uživatelského zážitku, aby byl bezproblémovější.

Zvýšený pokrok ve všech těchto oblastech nás nyní posunul na pokraj skutečného revolutiontový elektronický obchod. Takže, jinými slovy, vítejte ve věku PWA.

Progresivní webová aplikace nyní nabízí to nejlepší z obou světů – webové i mobilní aplikace. Přesněji řečeno, PWA je postaven na typických webových technologiích, přičemž některé z nejnovějších funkcí javascriptu fungují jako koření. Konečným výsledkem je webová aplikace, která svou celkovou intuitivností velmi připomíná nativní aplikaci pro iOS nebo Android.

Podívat se na tento Starbucks webové stránky. Všimli jste si něčeho neobvykle zvláštního ve srovnání s běžnými webovými stránkami? Nyní jej zkuste načíst znovu, ale z mobilního telefonu.

Zdá se, že se chová jako nativní aplikace, že? Hladké, bezproblémové a překvapivě rychlé. No, právě tam je síla PWA.

A jak to souvisí s elektronickým obchodem?

Dobře, zvažte toto. Progresivní webové aplikace obvykle uchovávají data uživatelského zařízení a stažené soubory v mezipaměti. To v podstatě znamená, že data jsou k dispozici okamžitě, jakmile jsou ze zařízení vzneseny požadavky.

A nejlepší část? Můžete se vsadit, že načítání stránek je vždy super rychlé, i když máte co do činění s extrémně nízkou rychlostí internetu.

Celý framework zajišťuje servisní pracovník, který v podstatě funguje jako most mezi serverem a aplikací. Ke zpracování požadavku proto využívá data, která již byla uložena v mezipaměti zařízení, a současně vše synchronizuje s odpovídajícími daty serveru.

Pak kvůli jednoduchému souboru JSON známému jako Manifest webové aplikace, Progresivní webové aplikace se normálně zobrazují na celou obrazovku, aby poskytovaly trvale pohlcující zážitek. Tato malá funkce v podstatě spolupracuje s vaším prohlížečem a nasměruje jej k zobrazení webové aplikace prostřednictvím stejného rozhraní jako aplikace pro chytré telefony.

A to není vše. Pracovníci služby mezipaměti v kombinaci s rozhraními Push API a pokročilou technologií prohlížeče umožnili instalovat PWA přímo na domovskou obrazovku vašeho zařízení. V důsledku toho jej můžete používat i poté, co vaše zařízení přejde do režimu offline. Kromě toho mohou PWA také přijímat oznámení push.

Hádej co? Google je od začátku v popředí progresivních webových aplikací spolu s Mozillou a Microsoftem.

A poté, co celou věc znovu a znovu testovali na mnoha projektech, dospěli k tomuto závěru o progresivních webových aplikacích:

• Jsou spolehliví– PWA se mohou extrémně rychle načítat i ve špatných síťových podmínkách díky tomu, že jejich servisní pracovníci předem ukládají kritické zdroje do mezipaměti.
• Jsou rychlí - PWA jsou obdivuhodně responsive když s nimi komunikujete. Důsledně udržují ostré animace a plynulé posouvání.
• Jsou poutavé –Uživatelská zkušenost je zde bezpochyby velmi pohlcující. PWA se v prohlížeči chovají jako nativní mobilní aplikace a lze je snadno vložit na domovskou obrazovku. Navíc, pokud potřebujete znovu zapojit uživatele, kteří používají vaše PWA, můžete vždy odeslat oznámení push.

Jedna společnost, která tyto výhody viděla na vlastní kůži, je Tinder Dříve byla jejich průměrná doba načítání aplikace 11.91 sekund. Ale po představení verze PWA, která byla o 90 % lehčí než jejich nativní aplikace pro Android, se doba načítání výrazně snížila. A v důsledku toho jejich úrovně zapojení uživatelů poměrně výrazně vzrostly.

Pokud vás to nepřesvědčí, možná Uber příběh bude. Využitím výkonu PWA byla společnost schopna přijít s aplikací, která má skvělé rychlosti načítání i na 2G. A jeho odpovídající doba načítání? No, jejich 50kb PWA se trvale dokáže načíst za méně než 3 sekundy.

Sotva jsme tady poškrábali povrch. Je jich mnohem víc příběhy úspěchu ze široké škály značek. To vše díky revolutIonární schopnosti progresivních webových aplikací.

To znamená, že nyní pojďme k praktické části.

Takže, co přesně je Vue Storefront?

Recenze Vue Storefront – přehled

Vue Storefront, pro začátek, je open-source progresivní webová aplikace vyvinutá pro online podniky. Jejím hlavním cílem je pomoci digitálním obchodníkům a podnikům zvýšit úroveň zákaznické zkušenosti.

Naštěstí k používání Vue Storefront nepotřebujete specializovaný systém elektronického obchodu. Vzhledem k tomu, že celý jeho rámec je postaven pomocí architektury Headless, měli byste být schopni nastavit vlastní integraci backendu. To ve zkratce znamená, že Vue Storefront je holisticky flexibilní aplikace schopná integrace s jakoukoli platformou elektronického obchodu a slouží jako front-end.

Zatím jej vývojáři integrovali s Magento, Spree Commerce, Sylius a Shopify, Vue Storefront Core Team v úzké spolupráci s týmem Shopware vyvinul nativní integraci Shopware PWA a Vue Storefront se stává klíčovou součástí commercetools Accelerator jako doporučený open-source frontend pro commercetools a člen MACH Alliance – skupiny technologické společnosti založené společnostmi commercetools, Contentstack, EPAM Systems a Valtech – k šíření znalostí o potenciálu bezhlavé technologie.

A vzhledem k tomu, že je podporováno více než 70 oficiální partneři, více než 100 živých projektů rozsáhlá komunita více než 3000 vývojáři, můžete očekávat, že další integrace budou spuštěny velmi brzy. Zdá se, že Vue Storefront teprve začíná.

Ale na druhou stranu, i když je jejich míra inovací chvályhodná, nemusíte čekat, až tým Vue Storefront přijde s integrací pro vaši současnou platformu elektronického obchodu. Toto PWA je zásadně zakódováno Vue.js, a spoléhá na to Elastickýsearch pro jeho databázi, stejně jako Node.js, pokud jde o server-API.

Pokud jste ostřílený vývojář, myslím, že už můžete říct, že nastavení nového front-endu by nemělo být vůbec žádnou výzvou. Ale v případě jakýchkoli potíží, Vue Storefront přichází s mnoha návody a komplexní podpůrnou dokumentací. To vše můžete použít k tomu, abyste zjistili, jak vyladit jeho open-source kód.

Pokud to zní jako něco, co byste chtěli udělat, Vue Storefront je přístupný na GitHub. A zajímavé je, že zatím na platformě přilákal více než 7,000 XNUMX hvězd.

Dobře, vůbec to není špatné. Ale co přesně si obchodníci užívají Vue Storefront? Má skutečně funkce, které by mohly posunout vaše podnikání na další úroveň?

Dovolte mi na to odpovědět tím, že vás provedu různými atributy Vue Storefront.

Recenze Vue Storefront – hlavní funkce

User Experience

Pěkně popořádku. Vzhledem k tomu, že hlavním cílem je zde uživatelská zkušenost, jak přesně funguje rozhraní Vue Storefront?

Jedna věc, kterou můžete od Vue Storefront očekávat, je prolomit bariéru zařízení. Vzhledem k tomu, že se jedná o webovou aplikaci, měli byste být schopni ji spustit a spustit na jakémkoli zařízení. To znamená, že Vue Storefront eliminuje problém vývoje více nativních aplikací pro každý operační systém zařízení.

Dalším problémem, který můžete vyřešit prostřednictvím Vue Storefront, je objemnost nativních aplikací. Aplikace pro Android, iOS a PC jsou den ode dne těžší s každou novou funkcí, kterou vývojáři představí. Proto jsou aktualizace aplikací notoricky známé tím, že zabírají více místa v paměti.

S Vue Storefront je to ale skoro jako bychom se vrátili do doby aplikací pro Symbian. Ve srovnání s nativními aplikacemi využívá mnohem méně dat.

A nejlepší na tom je, že zákazník vašeho obchodu nemusí nic stahovat. K nativnímu prostředí mohou přistupovat přímo prostřednictvím svých webových prohlížečů.

Ve skutečnosti ani nemusí být online. Vue Storefront umožňuje jim pohodlně nakupovat, i když jsou jejich zařízení offline.

Pak získejte toto. Přestože se váš web elektronického obchodu chová jako nativní aplikace, Google jej stále považuje za web. Váš internetový obchod tedy bude samozřejmě odpovídajícím způsobem indexován, stejně jako ostatní běžné stránky.

A tady je ta věc. Je pravděpodobné, že váš web bude mít oproti jiným běžným webům obrovskou výhodu v hodnocení, protože Google má tendenci upřednostňovat weby s vysokou rychlostí načítání. Navíc stojí za zmínku, že vyhledávače stále častěji přecházejí na indexování zaměřené na mobily.

Když už jsme u toho, skvělá doba načítání znamená větší provoz. Pravděpodobně jste si již všimli, že nízká rychlost načítání webových stránek způsobuje vysokou míru okamžitého opuštění, protože internetoví spotřebitelé neradi čekají. Se zvýšeným provozem byste proto měli být schopni dlouhodobě zlepšit svůj celkový konverzní poměr.

Další taktikou, kterou můžete použít, abyste to ještě více podpořili, je zasílání oznámení push. Vue Storefront vám umožní udržet vaše potenciální zákazníky v kontaktu tím, že s nimi budete komunikovat prostřednictvím push zpráv. Toho můžete využít k pořádání propagačních akcí a také křížového prodeje a dalšího prodeje různých produktů.

Začínáme

Tým za Vue Storefront zdánlivě začal s Magento protože je to dnes jedna z největších platforem elektronického obchodu na světě. Navíc je to open-source systém, který kombinuje skvělé funkce s neomezenou flexibilitou. To je důvod, proč se ve skutečnosti podniky a podniky mimořádně připojují Magento rozjetého vlaku.

Pokud jste jedním z mnoha, můžete začít hned s využitím Vue Storefront's Magento aplikace. Proces však není tak jednoduchý, jak si možná představujete.

Zpočátku se musíte spolehnout na workshopy, které naplánují svůj projekt podle toho. To znamená specifikovat nejen rozsah vašeho projektu, ale také odpovídající rozpočet a čas.

Pak následuje proof of concept a jeho cílem je potvrdit dopad, který má Vue Storefront na vaše podnikání. V důsledku toho možná budete muset spustit krátkou instanci souboru Vue Storefront při provádění různých testů uživatelské zkušenosti.

To by se samo o sobě mohlo ukázat jako docela užitečné, když potřebujete přesvědčit zúčastněné strany, aby do aplikace investovali. Navíc také získáte příležitost činit informovaná rozhodnutí o nadcházejícím zavedení na základě toho, jak uživatelé reagují na novou verzi obchodu.

Celkově vzato, důkaz konceptu by vám měl trvat několik týdnů – možná maximálně 4-6. Poté pomocí nashromážděných dat můžete přistoupit k implementaci plné verze PWA vašeho webu elektronického obchodu pomocí Vue Storefront. A jak čas plyne, můžete postupně pracovat na základním otevřeném zdrojovém kódu, abyste přizpůsobili své podnikání neustále se měnícím potřebám trhu.

Komponenty

Vue Storefront se dodává se dvěma různými typy komponent.

V základu máme Základní komponenty. Jsou postaveny na základních obchodních strukturách typických internetových obchodů. Svým způsobem vám tedy ušetří práci s vytvářením všeho od začátku.

To znamená, že základní komponenty mohou být přijaty tématy vašeho webu. Stačí jednoduše stylovat a definovat doprovodné značky HTML.

A když už jste u toho, všimnete si, že každá základní součást nabízí odlišné rozhraní, které můžete snadno přepracovat prostřednictvím svého motivu.

No, pokud jste připraveni na tento úkol, měli byste najít základní komponenty ve složce komponent každého modulu. Jakmile to uděláte, použijte je na svá témata jako mixiny.

Když už jsme u toho, vsadím se, že druhý typ součástek už jste asi uhodli. A ano, máte pravdu. Oni jsou Komponenty motivu, které představují rozvržení front-endu, které nakonec zobrazíte v aplikaci.

I když do tématu můžete umístit své vlastní specializované komponenty, nejsnazší metodou použití obchodní logiky je vždy využití základních komponent.

Motivy výkladní skříně

Přestože Vue Storefront nadále využívá předem navržená témata, nemusíte je vůbec používat. Místo toho si můžete vytvořit vlastní témata elektronického obchodu a poté je zkombinovat s hlavní obchodní logikou aplikace, abyste získali úplný zážitek z elektronického obchodu.

K tomu však budete potřebovat znalosti HTML a CSS. Nebo si jednoduše najměte zkušeného vývojáře, aby celý proces zvládl. Vue Storefront vám dokonce umožňuje dále upravovat jeho základní komponenty, pokud potřebujete.

Ale když se nad tím zamyslím, vytvoření vlastního motivu od nuly vypadá jako těžkopádný proces. Kromě, Vue Storefront přichází s vlastními pevnými tématy src/témata složka.

Nejnovější téma 2.0, byl například vytvořen pomocí Google UX Retail Playbook. To znamená dobře optimalizovanou uživatelskou zkušenost. Ale to není všechno. Vzhledem k tomu, že je dynamicky flexibilní, můžete jej vyladit mnoha různými způsoby a vytvořit si vlastní specializovaný design.

Funkce elektronického obchodu

Zde jsou některé z funkcí elektronického obchodu, které najdete na Vue Storefront:

• Procházení katalogu
• Procházení produktů
• Podpora správy katalogu
• Zákaznické účty
• Služby zákazníkům
• Řízení objednávek
• Marketingové propagace
• Analytika a reporting
• Search Engine Optimization
• Pokladna, platba a doprava

Recenze Vue Storefront – Ceny

Získání Vue Storefront nebude vás nic stát. Ani desetník. Náklady se začnou hromadit až v následujících fázích přizpůsobení.

Pokud nemáte zkušenosti s kódováním, budete nuceni najmout tým vývojářů, aby integrovali Vue Storefront s vaším webem elektronického obchodu a také vyladili jeho základní komponenty a témata.

Kdo by měl zvážit použití Vue Storefront? 

Nelze popřít, že Vue Storefront je a revolutiontový nástroj pro zlepšení uživatelské zkušenosti vašich zákazníků. A vzhledem k tomu, že se jedná o progresivní webovou aplikaci s otevřeným zdrojovým kódem, je k dispozici všem zdarma.

Problémem Vue Storefront je však proces implementace. Vložení aplikace do vašeho webu elektronického obchodu je technicky složitý proces, který vyžaduje náročné kódování. Rozhodně to není něco, co byste zvládli bez kódovacích dovedností.

Ale to není nic ve srovnání s výhodami PWA. Vue Storefront stojí za námahu. Můžete tedy zvážit najmutí zkušeného vývojáře, aby to provedl. Kromě toho z něj jeho architektura Headless dělá flexibilní aplikaci, kterou lze zabudovat do libovolného backendu platformy elektronického obchodu.

Celkově tedy Vue Storefront je pro všechny typy online podniků a podniků. Pokud provozujete web elektronického obchodu, tato progresivní webová aplikace stojí za zvážení, pokud chcete zlepšit celkovou zákaznickou zkušenost.

Je to od nás na ecommerce-platforms.com čisté konto. Teď k tobě - ​​jaké jsou tvé myšlenky?