New eCommerce integration for commercetools: Vue Storefront-based PWA.

Headless storefronts are becoming more and more popular and the market shows us that demand for this software is growing rapidly. Customers keep asking for different eCommerce platforms and the most mentioned one is commercetools — here is where the journey starts.

Vue Storefront Next in the making.

Not so long ago, we started an R&D project testing some new architectural concepts for Vue Storefront.

Inside the integration — commercetools PWA underneath.

What exactly is commercetools? It’s an enterprise headless eCommerce system designed to provide API-first developer experience. It’s being distributed in a cloud model so developers don’t have to take care of the operations/hosting. If you want to build your own application, you need to have your own UI. On the other hand, you don’t have to worry about scalability, SLA, and maintenance. Your job is only to configure the platform and adjust it to your business.

Configuration and API

Everything starts with data modeling. If you have just opened commercetools for the first time, and you want to start using it, you need to say what your products will look like. You define the attributes and their constraints, then you go to creating categories before adding products.

configuring product type and attributes
graphQL API in a playground (impex)

The implementation

At the moment of this article being published, we are testing the commercetools API. We decided to use the GraphQL one with Apollo, as GraphQL looks to be the most reasonable choice in the long term.

Next steps

Our new architecture needs a lot of work. We are concurrently working on a few fields such as UI, business logic, packages/bundling and more… the API layer it just one of them. It’s definitely in the R&D phase but we are gradually beginning to see the bigger picture. In the end, we would like to say thanks to LoveCrafts for their help and for cooperating with our commercetools integration. Stay tuned!

The Vue Storefront Journal

The official journal of Vue Storefront community.

The Vue Storefront Journal

The official journal of Vue Storefront community. The latest news on meet-ups, contributions, releases, and the community surrounding Vue Storefront — the top open source solution for progressive web apps dedicated to mobile-first eCommerce. (www.vuestorefront.io)

Patryk Andrzejewski

Written by

Core Tech Lead @vue-storefront

The Vue Storefront Journal

The official journal of Vue Storefront community. The latest news on meet-ups, contributions, releases, and the community surrounding Vue Storefront — the top open source solution for progressive web apps dedicated to mobile-first eCommerce. (www.vuestorefront.io)