Vue Storefront Review – Alles, was Sie wissen müssen

Die Zukunft ist hier!

Ok, lassen Sie für einen Moment alles stehen und liegen und hören Sie sich das an. Stellen Sie sich eine kostenlose E-Commerce-Anwendung vor, die die Benutzererfahrung und das SEO-Ranking Ihres Online-Shops drastisch verbessern könnte. Ein revolutionäres System, das so flexibel ist, dass es problemlos auf jedem E-Commerce-Backend ausgeführt werden kann.

Ein bisschen weit hergeholt, denkst du?

Ja, ich weiß, wie sich das anhört, weil ich auch dort war. Zumindest bis ich diese verrückte Sache ausprobiert habe, nennen sie Progressive Web Apps, kurz PWA.

Es gibt gute Gründe, warum sich Unternehmen zunehmend in PWA verlieben. Ich werde sie alle in Kürze enthüllen. Lassen Sie mich jedoch zunächst eine spezielle Anwendung vorstellen, die Ihnen hilft, das gesamte Konzept der Nutzung von PWA zu verstehen.

Schon mal was von Vue Storefront gehört?

Es ist eine neue E-Commerce-Anwendung, aber die Architektur entspricht in keinster Weise dem, was wir bereits gewohnt sind. Und hier ist der Deal - Vue Storefront ist die bisher größte und umfassendste PWA.

Aber was bedeutet das für den E-Commerce?

Dieses Vue-Schaufenster Die Überprüfung zeigt alles, was Sie brauchen, um zu wissen, was zum Teufel eine progressive Webanwendung ist, wie Vue Storefront mit all dem verbunden ist und natürlich auch die zugehörigen E-Commerce-Funktionen und -Funktionen.

Was ist eine progressive Web-App? 

Denken Sie daran, als wir sagten Handy fängt gerade erst an? Es stellte sich heraus, dass wir die ganze Zeit Recht hatten. Und hier ist der Beweis.

Mobile stand an erster Stelle und führte uns anschließend in mobile Apps ein. Mit der Zeit verschmolzen die Apps dann mit den PC- und Webplattformen, da die Entwickler das Benutzererlebnis weiter verbesserten, um es nahtloser zu gestalten.

Dank der zunehmenden Fortschritte in all diesen Bereichen stehen wir nun an der Schwelle zu einem wahrhaft revolutionären E-Commerce. Mit anderen Worten: Willkommen im Zeitalter der PWAs.

Jetzt bietet eine progressive Web-App das Beste aus beiden Welten - Web- und mobile Apps. Insbesondere basiert ein PWA auf typischen Webtechnologien, wobei einige der neuesten Javascript-Funktionen als Gewürz dienen. Das Endergebnis ist eine Webanwendung, deren Gesamtintuitivität einer nativen iOS- oder Android-App sehr nahe kommt.

Wirf einen Blick auf fehlen uns die Worte. Starbucks am Standort. Merken Sie etwas ungewöhnliches im Vergleich zu normalen Websites? Versuchen Sie nun erneut, es von Ihrem Mobiltelefon zu laden.

Es verhält sich scheinbar wie eine native App, oder? Reibungslos, nahtlos und erstaunlich schnell. Nun, genau das ist die Kraft von PWA.

Und wie ist das für den E-Commerce relevant?

Nun, denke darüber nach. Progressive Web Apps speichern normalerweise Benutzergerätedaten und heruntergeladene Dateien in einem Cache. Das bedeutet im Wesentlichen, dass die Daten sofort verfügbar sind, sobald Anfragen vom Gerät eingehen.

Und das Beste daran? Sie können darauf wetten, dass das Laden von Seiten immer superschnell ist, auch wenn Sie mit extrem langsamen Internetgeschwindigkeiten zu tun haben.

Das gesamte Framework wird von einem Servicemitarbeiter unterstützt, der im Wesentlichen als Brücke zwischen dem Server und der App fungiert. Zur Verarbeitung einer Anfrage werden daher Daten verwendet, die sich bereits im Geräte-Cache befanden, während gleichzeitig alle Daten mit den entsprechenden Serverdaten synchronisiert werden.

Dann wegen einer einfachen JSON-Datei namens Web-App-Manifest, Progressive Web-Apps werden normalerweise im Vollbildmodus angezeigt, um ein anhaltend intensives Erlebnis zu ermöglichen. Diese kleine Funktion interagiert im Wesentlichen mit Ihrem Browser und weist ihn an, die Webanwendung über dieselbe Oberfläche wie Smartphone-Apps anzuzeigen.

Und das ist nicht alles. Die Cache-Service-Mitarbeiter in Kombination mit Push-APIs und fortschrittlicher Browsertechnologie haben es möglich gemacht, PWAs direkt auf dem Startbildschirm Ihres Geräts zu installieren. Infolgedessen können Sie es auch dann verwenden, wenn Ihr Gerät offline ist. Darüber hinaus können PWAs Push-Benachrichtigungen empfangen.

Weißt du was? Google war von Anfang an an der Spitze von Progressive Web Apps, zusammen mit Mozilla und Microsoft.

Und nachdem sie das Ganze an zahlreichen Projekten immer wieder getestet hatten, kamen sie zu dem Schluss, dass es sich bei Progressive Web Apps um Folgendes handelt:

• Sie sind zuverlässig- PWAs sind in der Lage, selbst unter schlechten Netzwerkbedingungen extrem schnell zu laden, da ihre Servicemitarbeiter wichtige Ressourcen vorab zwischenspeichern.
• Sie sind schnell - PWAs sind bewundernswert responsive wenn Sie mit ihnen interagieren. Sie behalten durchgehend gestochen scharfe Animationen und flüssiges Scrollen bei.
• Sie engagieren sich -Die Benutzererfahrung hier ist ohne Zweifel ziemlich beeindruckend. PWAs verhalten sich wie native mobile Apps im Browser und können problemlos in Ihren Startbildschirm eingebettet werden. Wenn Sie Benutzer, die Ihre PWAs ausführen, erneut einbinden müssen, können Sie jederzeit Push-Benachrichtigungen senden.

Ein Unternehmen, das diese Vorteile aus erster Hand gesehen hat, ist Zunder Bisher betrug die durchschnittliche Ladezeit für Apps 11.91 Sekunden. Nach der Einführung einer PWA-Version, die 90% leichter war als ihre native Android-App, sank die Ladezeit jedoch erheblich. Infolgedessen sind die Engagement-Levels der Benutzer erheblich angestiegen.

Wenn dich das nicht überzeugt, vielleicht Ubers Geschichte wird. Durch die Nutzung der Leistung von PWAs konnte das Unternehmen eine App entwickeln, die selbst unter 2G hervorragende Ladegeschwindigkeiten bietet. Und die entsprechende Ladezeit? Nun, ihre 50kb-PWA schafft es durchweg, in weniger als 3 Sekunden geladen zu werden.

Jetzt haben wir hier kaum die Oberfläche zerkratzt. Es gibt viele mehr Erfolgsgeschichten von einer breiten Palette von Marken. Alles dank der revolutionären Möglichkeiten von Progressive Web Apps.

Das heißt, gehen wir jetzt zum praktischen Teil.

Also, was genau ist Vue-Schaufenster?

Vue Storefront Review - Übersicht

Für den Anfang ist Vue Storefront eine Open-Source-Progressive-Webanwendung, die für Online-Unternehmen entwickelt wurde. Das Hauptziel besteht darin, digitalen Händlern und Unternehmen dabei zu helfen, ihr Kundenerlebnis zu verbessern.

Zum Glück benötigen Sie kein spezielles E-Commerce-System, um Vue Storefront zu verwenden. Da das gesamte Framework auf der Headless-Architektur basiert, sollten Sie in der Lage sein, Ihre eigene Backend-Integration einzurichten. Kurz gesagt bedeutet dies, dass Vue Storefront eine ganzheitlich flexible Anwendung ist, die sich in jede E-Commerce-Plattform integrieren lässt und als Front-End dient.

Bisher haben seine Entwickler es integriert Magento, Spree Commerce, Sylius und ShopifyDas Vue Storefront Core Team hat in enger Zusammenarbeit mit dem Shopware Team die native Shopware PWA-Integration entwickelt. Vue Storefront wird als empfohlenes Open-Source-Frontend für Commercial Tools und Mitglied der MACH Alliance - der Gruppe von Tech-Unternehmen, die von Commercial Tools, Contentstack, EPAM Systems und Valtech gegründet wurden, um Wissen über das Potenzial kopfloser Technologie zu verbreiten.

Und wenn man bedenkt, dass es von mehr als unterstützt wird 70 offizielle Partner, mehr als 100 Live-Projekte eine umfangreiche Community von mehr als 3000 Entwickler können Sie davon ausgehen, dass bald weitere Integrationen eingeführt werden. Vue Storefront scheint erst am Anfang zu stehen.

Auch wenn die Innovationsrate lobenswert ist, müssen Sie nicht warten, bis das Team von Vue Storefront eine Integration für Ihre aktuelle E-Commerce-Plattform entwickelt hat. Diese PWA ist grundsätzlich codiert Vue.js, und es verlässt sich auf Elasticsearch für seine Datenbank sowie für Node.js, wenn es um die Server-API geht.

Wenn Sie also ein erfahrener Entwickler sind, können Sie bereits sagen, dass das Einrichten eines neuen Frontends überhaupt keine Herausforderung sein sollte. Aber im Falle von Schwierigkeiten, Vue-Schaufenster kommt mit mehreren Tutorials und umfassender Support-Dokumentation. Mit all dem können Sie herausfinden, wie Sie den Open-Source-Code optimieren können.

Wenn das nach etwas klingt, das Sie tun möchten, können Sie auf Vue Storefront zugreifen GitHub. Interessanterweise hat es bisher mehr als 7,000 Sterne auf der Plattform angezogen.

Ok, überhaupt nicht schlecht. Aber woran erfreuen sich die Kaufleute genau? Vue-Schaufenster? Verfügt es wirklich über die Funktionen, die Ihr Unternehmen auf die nächste Ebene bringen könnten?

Lassen Sie mich das beantworten, indem ich Sie durch die verschiedenen Attribute von Vue Storefront führe.

Vue Storefront Review - Hauptfunktionen

Benutzererfahrung

Das wichtigste zuerst. Wie genau funktioniert die Benutzeroberfläche von Vue Storefront, wenn die Benutzerfreundlichkeit im Vordergrund steht?

Nun, eine Sache, die Sie von Vue Storefront erwarten können, ist das Durchbrechen der Geräteschranke. Da es sich um eine Webanwendung handelt, sollten Sie sie auf jedem Gerät starten und ausführen können. Das heißt, Vue Storefront macht die Entwicklung mehrerer nativer Anwendungen für jedes Gerätebetriebssystem überflüssig.

Ein weiteres Problem, das Sie mit Vue Storefront lösen können, ist die Sperrigkeit nativer Apps. Android-, iOS- und PC-Apps werden mit jedem neuen Feature, das Entwickler einführen, schwerer. Aus diesem Grund sind App-Updates dafür bekannt, dass sie mehr Speicherplatz beanspruchen.

Mit Vue Storefront ist es jedoch fast so, als wären wir in das Zeitalter der Symbian-Apps zurückgekehrt. Im Vergleich zu nativen Apps werden viel weniger Daten verwendet.

Und das Beste daran ist, dass der Kunde Ihres Geschäfts nichts herunterladen muss. Sie können direkt über ihren Webbrowser auf die native Erfahrung zugreifen.

Tatsächlich müssen sie nicht einmal online gehen. Vue-Schaufenster Damit können sie bequem einkaufen, auch wenn ihre Geräte offline sind.

Dann hol dir das. Obwohl sich Ihre E-Commerce-Website wie eine native App verhält, betrachtet Google sie dennoch als Website. Daher wird Ihr Online-Shop natürlich wie andere reguläre Websites entsprechend indiziert.

Und hier ist das Ding. Wahrscheinlich hat Ihre Website einen großen Rangvorteil gegenüber anderen regulären Websites, da Google Websites mit hohen Ladegeschwindigkeiten bevorzugt. Erwähnenswert ist auch, dass Suchmaschinen zunehmend auf Mobile-First-Indizierung umstellen.

Apropos, eine gute Ladezeit bedeutet mehr Verkehr. Inzwischen ist Ihnen wahrscheinlich aufgefallen, dass schlechte Ladegeschwindigkeiten von Webseiten hohe Absprungraten auslösen, da Internetnutzer es hassen zu warten. Daher sollten Sie mit einem erhöhten Verkehrsfluss in der Lage sein, Ihre Gesamt-Conversion-Rate auf lange Sicht zu verbessern.

Eine andere Taktik, die Sie anwenden könnten, um dies noch weiter zu verbessern, ist das Senden von Push-Benachrichtigungen. Mit Vue Storefront können Sie Ihre Leads durch Kommunikation mit ihnen über Push-Nachrichten binden. Sie können dies nutzen, um Promotions durchzuführen sowie verschiedene Produkte zu verkaufen und zu verkaufen.

Erste Schritte

Das Team hinter Vue Storefront begann anscheinend mit Magento weil es heute eine der größten E-Commerce-Plattformen der Welt ist. Außerdem ist es ein Open-Source-System, das großartige Funktionen mit grenzenloser Flexibilität kombiniert. Aus diesem Grund treten Unternehmen und Unternehmen in der Tat außerordentlich der Magento Bandwagen.

Wenn Sie einer der vielen sind, können Sie sofort loslegen, indem Sie die Vorteile von Vue Storefront nutzen Magento Anwendung. Der Prozess ist jedoch nicht so einfach, wie Sie sich vorstellen können.

Zunächst müssen Sie sich auf Workshops verlassen, um Ihr Projekt entsprechend zu planen. Das bedeutet, dass Sie nicht nur Ihren Projektumfang, sondern auch das entsprechende Budget und den Zeitrahmen angeben.

Als Nächstes folgt der Proof of Concept, dessen Ziel es ist, die Auswirkungen von Vue Storefront auf Ihr Unternehmen zu bestätigen. Infolgedessen müssen Sie möglicherweise eine kurze Instanz von ausführen Vue-Schaufenster Rahmen während der Durchführung verschiedener User Experience Tests.

Dies kann sich als sehr praktisch erweisen, wenn Sie Stakeholder davon überzeugen müssen, in die App zu investieren. Außerdem haben Sie die Möglichkeit, fundierte Entscheidungen über die bevorstehende Einführung zu treffen, die davon abhängen, wie Benutzer auf die neue Store-Version reagieren.

Alles in allem sollte der Proof of Concept einige Wochen dauern - vielleicht höchstens 4-6. Mit den gesammelten Daten können Sie dann mit Vue Storefront eine vollständige PWA-Version Ihrer E-Commerce-Website implementieren. Und im Laufe der Zeit können Sie schrittweise am zugrunde liegenden Open Source-Code arbeiten, um Ihr Unternehmen an den sich ständig ändernden Marktanforderungen auszurichten.

Komponenten

Vue-Schaufenster kommt mit zwei verschiedenen Komponententypen.

Bei der Stiftung haben wir die Kernkomponenten. Sie bauen auf den grundlegenden Geschäftsstrukturen typischer Online-Shops auf. In gewisser Weise ersparen sie Ihnen die Mühe, alles von Grund auf neu zu erstellen.

Die Kernkomponenten können jedoch von Ihren Site-Themen übernommen werden. Sie müssen lediglich das zugehörige HTML-Markup formatieren und definieren.

Und wenn Sie schon dabei sind, werden Sie feststellen, dass jede Kernkomponente eine eigene Benutzeroberfläche bietet, über die Sie Ihr Thema leicht überarbeiten können.

Nun, wenn Sie für die Aufgabe bereit sind, sollten Sie die Kernkomponenten im Komponentenordner jedes Moduls finden. Wenden Sie sie anschließend als Mixins auf Ihre Designs an.

Apropos, ich wette, Sie haben wahrscheinlich schon die zweite Art von Komponenten erraten. Und ja, du hast recht. Sie sind Theme Components Früher die das Front-End-Layout darstellen, das Sie letztendlich in der App anzeigen.

Während Sie Ihre eigenen spezialisierten Komponenten in einem Thema platzieren können, besteht die einfachste Methode zum Anwenden von Geschäftslogik darin, immer die Kernkomponenten zu nutzen.

Schaufenster-Themen

Obwohl Vue Storefront weiterhin vorgefertigte Designs verwendet, müssen Sie diese überhaupt nicht verwenden. Stattdessen können Sie Ihre eigenen E-Commerce-Themen erstellen und diese dann mit der Kerngeschäftslogik der App kombinieren, um ein umfassendes E-Commerce-Erlebnis zu erzielen.

Sie benötigen jedoch HTML- und CSS-Kenntnisse, um dies zu erreichen. Oder beauftragen Sie einfach einen erfahrenen Entwickler mit der Abwicklung des gesamten Prozesses. Mit Vue Storefront können Sie sogar die Kernkomponenten bei Bedarf weiter anpassen.

Wenn Sie sich das überlegen, erscheint es Ihnen jedoch mühsam, Ihr eigenes Thema von Grund auf neu zu erstellen. Außerdem, Vue-Schaufenster kommt mit seinen eigenen festen Themen in die src / themes -Ordner.

Bleibe auf dem Laufenden! Theme 2.0, wurde zum Beispiel mit erstellt Google UX Retail Playbook. Dies führt zu einer optimierten Benutzererfahrung. Aber das ist nicht alles. Da es dynamisch flexibel ist, können Sie es auf viele verschiedene Arten optimieren, um Ihr eigenes spezialisiertes Design zu erstellen.

E-Commerce-Funktionen

Hier sind einige der E-Commerce-Funktionen, die Sie in Vue Storefront finden:

• Katalogsuche
• Durchsuchen des Produkts
• Unterstützung für die Katalogverwaltung
• Kundenkonten
• Kundenservice
• Auftragsverwaltung
• Marketing-Aktionen
• Analyse und Berichterstellung
• SEO
• Checkout, Zahlung und Versand

Vue Storefront Review - Preisgestaltung

Erwerben Vue-Schaufenster kostet dich nichts. Nicht einmal einen Cent. Die Kosten häufen sich erst in den nachfolgenden Anpassungsphasen.

Sofern Sie keine Erfahrung im Codieren haben, müssen Sie ein Entwicklerteam einstellen, um Vue Storefront in Ihre E-Commerce-Website zu integrieren und dessen Kernkomponenten und -themen zu optimieren.

Wer sollte Vue Storefront in Betracht ziehen? 

Es lässt sich nicht leugnen, dass Vue Storefront ein revolutionäres Tool zur Verbesserung der Benutzererfahrung Ihrer Kunden ist. Und da es sich um eine Open-Source-Progressive-Web-Anwendung handelt, ist es für jeden kostenlos verfügbar.

Das Problem bei Vue Storefront ist jedoch der Implementierungsprozess. Das Einbetten der Anwendung in Ihre E-Commerce-Site ist ein technisch komplexer Prozess, der viel Codierung erfordert. Ohne Programmierkenntnisse geht das sicher nicht.

Aber das ist nichts im Vergleich zu den Vorteilen von PWAs. Vue Storefront ist die Mühe wert. Sie können also einen erfahrenen Entwickler beauftragen, dies entsprechend auszuführen. Die Headless-Architektur macht es zudem zu einer flexiblen Anwendung, die in jedes Backend einer E-Commerce-Plattform eingebettet werden kann.

Alles in allem also Vue-Schaufenster ist für alle Arten von Online-Unternehmen und Unternehmen. Solange Sie eine E-Commerce-Website betreiben, ist diese progressive Web-App eine Überlegung wert, wenn Sie Ihr Kundenerlebnis insgesamt verbessern möchten.

Es ist ein sauberes Gesundheitszeugnis von uns hier bei ecommerce-platforms.com. Nun zu dir - was sind deine Gedanken?