Entdecke unser fortschrittliches SDK zur Entwicklung von Custom Frontends. Nutze smarte Tools, um deine Arbeitsweise aufs nächste Level zu bringen und erschaffe einzigartige Einkaufserlebnisse.
Trenne Frontend vom Backend. Entwickle und iteriere schneller als je zuvor und entwerfe eine benutzerdefinierte Frontend-Architektur, die deinen spezifischen Unternehmensanforderungen entspricht.
Erschaffe einzigartige Einkaufserlebnisse, ohne dabei das Rad neu zu erfinden. Greife gleichzeitig auf bewährte Funktionen zurück, mit denen du deinen Onlineshop genau an den Stellen individualisierst, wo es für dich wichtig ist.
Mach's dir leicht und überlasse Shopware das Hosting, einschließlich automatischer Software-Updates und Maintenance. So kannst du dich voll auf das Wachstum deines Unternehmens konzentrieren.
Alle Apps, die auf dem Plugin-/App-System basieren und Funktionen über die API bereitstellen, werden unterstützt. Der API-Zugriff ist sowohl über den API-Client als auch durch Vue.js Composables möglich.
Setze deine Ideen mühelos um. Shopware Composable Frontends stellt dir eine benutzerfreundliche Auswahl an JavaScript-APIs und Vue.js Komponenten bereit. Erstelle deine Frontends komplett selbst und behalte die volle Kontrolle über deinen Technologie-Stack, ohne den ganzen Update-Stress.
Das Cookbook erklärt dir genau, wie du bestimmte Shopware Features, zum Beispiel eine Wunschliste oder einen Blog, in deine individuelle Storefront integrierst. Dank des API-Clients und der Composables musst du dir keine Gedanken darüber machen, wie alles funktioniert. Es funktioniert einfach.
Der API-Client ist eine eigenständige TypeScript-Bibliothek, die nicht speziell an Vue.js gebunden ist. Du kannst sie in jedem JavaScript- oder Node.js-basierten Projekt verwenden. Nutze sie in Verbindung mit React, Svelte oder einfach mit Vanilla-JavaScript. Starte auf der grünen Wiese und integriere E-Commerce Funktionalitäten genau dort, wo und wie du sie brauchst.
Du willst unsere Erlebniswelten auch in deinem Custom Frontend nutzen? Kein Problem – das Shopware CMS ist headless. Oder ziehst du es vor, dein eigenes Headless-CMS aufzusetzen? Auch das ist möglich. Composable Frontends bietet dir alle Möglichkeiten, um dein CMS mühelos zu integrieren.
Die Art und Weise, wie du dein Projekt aufbaust, beeinflusst natürlich auch das Deployment. Wähle, ob du bei Null anfangen oder ein bereits bestehendes Projekt nutzen möchtest. Shopware Composable Frontends bietet dir die folgenden drei Möglichkeiten:
Beginne mit einem frischen Template, das aus einer leeren Nuxt.js Application besteht und in dem die Shopware Composable Frontends Komponenten bereits vorinstalliert sind. Nuxt.js ist ein "Meta" Framework, das auf Vue.js aufbaut und zusätzliche Funktionen für das Routing und die Dateiverwaltung bietet.
Alternativ kannst du das Demo-Store-Template als Referenz nutzen. Es beinhaltet den Großteil der Shopware Features und ermöglicht dir eine Vorschau des Frontends. Verwende das Demo-Store-Template entweder als Grundlage für dein Projekt oder einfach als eine Inspirationsquelle.
Die dritte Option ist, Composable Frontends als JavaScript-Dependency hinzuzufügen und dann in dein Projekt zu integrieren. Beispielsweise verwendet das Astro-Starter-Template Composable Frontends in einem nicht auf Vue.js basierenden Projekt und veranschaulicht damit die Vielseitigkeit des Frameworks.
Wenn du mit Vue.js vertraut bist und Erfahrung mit dem Erstellen von JavaScript-Anwendungen hast, wirst du unsere detaillierte Dokumentation verstehen und direkt mit Composable Frontends durchstarten können. Spezielle Shopware Kenntnisse sind nicht erforderlich und du musst auch nicht viel über das SDK selbst wissen. Natürlich ist es wichtig zu verstehen, welche Composables du zum Aufbau deines Frontends nutzen solltest, aber mit unseren Starter-Guides gelingt dir ein schneller und einfacher Einstieg. Du musst keine Frameworks, kein Kniffe und keine spezielle Syntax kennen.
Wenn du deinen gesamten Onlineshop mit Shopware Composable Frontends entwickeln möchtest, empfiehlt es sich, Erfahrung im Umgang mit Nuxt.js oder deinem präferierten Framework mitzubringen. Du solltest in der Lage sein, Herausforderungen wie Routing, Datenkonsistenz, Caching und weitere anspruchsvollere Themen zu meistern.
Warum haben wir Composable Frontends entwickelt? Inwiefern unterscheidet es sich von der Shopware PWA? Und für welche Projekte ist es am besten geeignet? Antworten auf diese und viele weitere Fragen erhältst du im Interview mit Niklas Dzösch (Shopware Developer Evangelist) und Dominic Klein (Manager Developer Experience).
“Composable Frontends ermöglicht es Entwicklern, die Funktionen von Shopware in modularen Technologie-Stacks einzusetzen. Wir wissen, dass sich das Frontend-Developer Ökosystem rasch wandelt und von fortlaufenden Verbesserungen und Innovationen angetrieben wird. Genau deshalb wollen wir dir keine bestimmte Technologie vorschreiben. Stattdessen bieten wir dir volle Entscheidungsfreiheit. Gleichzeitig stellen wir leicht verständliche Beispiele bereit, die dafür sorgen, dass du sofort durchstarten kannst. Mit Composable Frontends bekommst du ein zukunftssicheres Framework für deine Custom Storefronts in Shopware.”
shopware AG, Manager Developer Experience
"Wir haben uns aus mehreren Gründen für Composable Frontends anstelle der standard Shopware Storefront entschieden. Die Flexibilität und Anpassungsmöglichkeiten von Composable Frontends ermöglichen es uns, einzigartige Lösungen zu kreieren. Darüber hinaus bietet das Framework einen modularen und skalierbaren Ansatz in der Entwicklung von E-Commerce Projekten – Stichwort Composable Commerce. Damit lassen sich zum Beispiel Headless CMS von Drittanbietern oder E-Mail Marketing Plattformen flexibel und modular anbinden. Ich bin davon überzeugt, dass das für Unternehmen mit Wachstumsambitionen einen kritischen Erfolgsfaktor darstellt."
E-Commerce Entwickler,
kippie.nl
"Warum wir von der Arbeit mit Composable Frontends begeistert sind? Weil der Frontend Tech-Stack den Fähigkeiten unserer Entwickler deutlich besser entspricht als die standard Shopware Storefront. Da jedes Projekt einzigartig ist, profitieren wir zudem von der maximalen Flexibilität in der Frontend-Entwicklung. Dank der Headless-Architektur gestalten sich Core-Updates erheblich einfacher. Wir müssen uns lediglich um API-Breaks kümmern und nicht um Änderungen in der Storefront. Darüber hinaus können wir Shopware gezielt für bestimmte Aufgaben verwenden, weil andere Systeme einfach ohne Programmieraufwand integriert werden können. Die Headless-Architektur schafft zudem eine eindeutige Trennung von Frontend und Backend. Außerdem profitieren wir von modernen Tools und Frontend-Features. So entwickeln wir leistungsfähige, individuelle Storefronts und sind in der Lage, diese langfristig zu warten."
Lead Frontend Engineer,
mothership GmbH
"Bei dasistweb® setzen wir auf die Implementierung von Shopware Composable Frontends, welches zentrale Aspekte wie Tailwind.css, eine Composable Architektur und eine Frontend-Entkopplung vereint. Mit dem Einsatz dieser Funktionen können wir unseren Kunden erstklassige Ergebnisse bieten – und das mit einer verkürzten Time-to-Market und einem reduzierten Maintenance-Aufwand. Unser Commitment gilt den neuesten Technologien und Methoden von Shopware Composable Frontends, denn damit können wir unseren Kunden einen außergewöhnlichen Service bieten."
Geschäftsführer,
dasistweb GmbH
With Shopware PWA we want to enable developers to build ecommerce websites with a clear division between client and server, allowing merchants to obtain a higher level of flexibility and scalability in custom ecommerce projects. Find more details here.
Recently, we announced that we are working on a project called “Frontends”. This blog post deals with the What, Why, and How.
You already heard about the new Shopware Frontends? It uses the headless approach known from the administration area of Shopware. In general Shopware provides an admin API, the sync API and the store API.
shopcast.fm
shopcast.fm
Ramona Schwering, Vuejs Amsterdam 2023
Erfahre mehr über Shopware. Wir freuen uns, von dir zu hören!
Kunden, die uns vertrauen
Lerne Shopware von Grund auf kennen. Um deine persönliche Produkt-Demo zu buchen, fülle das Formular aus und wir melden uns bei dir mit einem Terminvorschlag.
Lass dich von uns durch alle Bereiche der Shopware E-Commerce Lösungen führen.
Erfahre mehr über Shopware’s integrierte Features in einer Live-Präsentation.
Erzähl uns von deinen Herausforderungen und erhalte direktes Feedback auf deine Fragen.
