Storefront API — a new product from Vue Storefront team
I personally really like to think that what we’ve already done, what we’re working on — it’s just a beginning. As idealistic as it sounds it’s very often so true. Storefront API is a GraphQL unified API for any frontend you might want to have: Angular, React, Vue — no problem.
Storefront API — General Purpose, GraphQL eCommerce Gateway
Storefront API is a customizable, modular eCommerce GraphQL gateway. You can use this product to provide all your frontends — including mobile applications with a single data source. GraphQL and REST support let you to easily implement BFF (Backend for Frontend) pattern. It unifies the interfaces between all the systems backing your frontend and lets you query multiple data sources with a single HTTP request.
Don’t wait. Check our Github repository and please give us a ⭐️
How to get started?
TL;DR; You can start plaing with Storefront API right away:
- Check the official repository: https://github.com/DivanteLtd/storefront-api
- Read our official docs
- Join the Vue Storefront slack for asking details on Storefront API specifically.
- Join the Vue Storefront forum for asking some support and development questions.
The story behind the project
Maybe it’s a feature of the Open Source ecosystem — where you can easily find a lot of ideas to create a fork? You just start working on something new or just continue the efforts of bringing new life to the project?
Well, we had this kind of Eureka moment and a new idea just pop up a few weeks ago. The vue-storefront-api project. It used to be “just an API” empowering Vue Storefront PWA application. Then, 30+ sites on production later I was like: man, people are using vue-storefront-api in such crazy architectures — sometimes even without Vue Storefront itself. Because it’s a pretty useful API and very, very fast one.
By the same time, I was engaged in some heavy enterprise eCommerce projects as an architect trying to figure out how to cover the legacy SOAP and REST APIs (and sometimes direct SQL queries) with a single GraphQL layer to implement a BFF for PWA and mobile apps.
Then I connected the dots.
Data modeling
The architecture is modular. Each module can extend the default GraphQL schema, REST APIs and ElasticSearch Schema.
Yes, we’re using ElasticSearch by default — because some legacy APIs are not meeting the performance requirements neither let users execute the flexible queries and model the data structures. ElasticSearch, however, is only optional and your custom modules can provide direct connections to the backend systems.
Wrap your all APIs with single GraphQL schema
The modules can extend the standard GraphQL Schema with custom types and entities. By adding just some simple TypeScript based resolvers you can integrate your CRM, ERP, eCommerce APIs all into single GraphQL interface that can be fetched and the data modeled within a single gql query.
Check our default GraphQL schema
Blazing speed
GraphQL is now supported by many systems. But GraphQL is one thing, the speed is another. Pretty complex queries and huge SKU databases usually won’t meet the performance expectations. Unless you’ll use ElasticSearch. Having Elastic DSL + Non-SQL features makes Storefront API a drop-in solution for the API performance issues with the request times never exceeding 100ms. For the REST endpoints, we also have the Output Cache feature which allowed us to serve 3600 concurrent users on pretty modest Vue Storefront instances (meaning around 10–12K API requests per second).
Key features
- Fully functional and extendable eCommerce API Gateway,
- Read/Write integrations with Magento1, EpiServer, Magento2, OpenCart, SpreeCommerce,
- Additional integrations including Prismic with GraphQL support,
- Vue Storefront PWA frontend support,
- Blazing Fast — based on ElasticSearch with avg. response times < 100ms,
- GraphQL API with 100% Customizable GraphQL schema,
- REST API with ElasticSearch DSL support,
- Catalog, Cart, User, Stock, Review, Order, Image resizer modules available thru REST API,
- Multistore support based on store-views (aka. sales channels) concept,
- Dynamic tax calculation engine,
- Extendable via custom extensions (including GraphQL schema and resolver extensions),
- ElasticSearch maintenance tools — dump/restore/schema maintenance/migrations,
Integrations
Thanks to Vue Storefront and its vibrant community the product is already integrated with many eCommerce platforms so you can simply wrap them with GraphQL api layer with few lines of code/config.
At the same time, Storefront API is backend agnostic. That means it’s not an eCommerce backend itself. Out of the box it’s provided with Rreadingead/Write integrations with Magento1, EpiServer, Magento2, OpenCart, SpreeCommerce.
Read how to integrate your own, custom 3rd party eCommerce backend
Bring all your data into single GraphQL schema
The classical eCommerce entities (Products, Categories and other) are bread and butter for any eCommerce site. They’re a foundation of our default data schema as well. However, the really interesting things start when you mix this standard data with product recommendations, CMS and other data sources. Some feature requests for Nosto, Prismic, and other integrations have been already raised on Github! Don’t wait and contribute :)
Default modules are Vue Storefront compatible
As modular the architecture is, the default modules bundled within Storefront API — default-catalog and default-vsf are 100% Vue Storefront compatible. Storefront API can be a drop-in replacement for, however, at this point, some compatibility tests are still due. Well, it’s still 1.0RC-1 so! :) After a stable version released we’d probably switch to Storefront API as a default backend for Vue Storefront.
Read how to create your own, custom modules.
Docs are there, MIT license, looking for contributors!
Along with the development works we’ve created some decent docs. The license is and always will be MIT. We’re looking for contributors!
