Vue Storefront and commercetools might be seen as two sides of the same coin, but no matter how tempting it is to forge this neat metaphor, it would not be entirely accurate. The fact is that commercetools on the back end and Vue Storefront on the frontend is a set, one which puts you on the path to the best-of-breed third-party services that you need right now. With these two working together, you can tailor-make the system to meet your business needs.
Given the speed of eCommerce growth and the dynamic changes happening right now, it is no wonder that IT companies are trying to outdo each other in giving assurances that their - and only their - solutions are “future-proof.” These words are usually a soothing balm to the aching souls of business decision-makers, but, from a technical point of view, they are often nothing more than marketing catchphrases. Because how is it even possible to be future-proof if the future itself is so uncertain?
In the MACH Alliance, of which we and commercetools are members, we believe that the one and only way to secure a business from what comes next is to prepare for whatever comes next. Flexibility is the key.
With that in mind, it’s worth mentioning that “MACH”, which stands for Microservices-based, API-first, Cloud-native, and Headless solutions, is not just a ready-to-implement toolset. It is more a new philosophy of building software systems. This philosophy focuses on providing businesses with the agility to prepare them for any changes in their customers’ behaviors. However, this may still sound a bit vague. So what does it mean in practice? Long story short: APIs. They are what make this future-proof flexibility possible. Thanks to having an API, merchants can freely compose their systems by adding any services required at a specific stage of their business growth. The desired "future-proof aspect" is achieved by being ready for constant changes rather than predicting them.
Vue Storefront is all about the API
Vue Storefron’s founding idea is based precisely on those assumptions. The powerful API and modular architecture allow customers to build any integration they dream of. However, these two aspects are by no means all we deliver.
Vue Storefront is a product developed in two parallel lines. The core code is open source, and its primary benefit is flexibility. Developers can take it and build any custom solution on top of it. The second line is dedicated to enterprises. In the enterprise version, we wanted to shorten the time to market and increase our solution’s capabilities. So we deliver plenty of native integrations with the best solutions in their classes and put them in the cloud.Patrick Friday, CEO at Vue Storefront.
The key features of Vue Storefront Enterprise:
No UI/functional limitations
Vue Storefront, besides being an API-first frontend platform, is a framework, and - like every other framework in the world - it can be considered a “skeleton” of an application. It provides specific, ready-to-use elements as well as a general pattern of usage.
We wanted to build a solution combining the advantages of SaaS, i.e., ease of use, and open-source, i.e., flexibility in customization. Typically, these two approaches are mutually exclusive, but - as we are explicitly focused on eCommerce - we were able step into merchants’ shoes and predict which components can be provided by default and which ones must give space for some creativity.Filip Rakowski, CTO at Vue Storefront.
It was evident that the UX/UI layer needs to give merchants unfettered freedom. It is the front line of their brands and the space where they have to offer an experience which resonates with their specific target audience.
There is no one universal scheme for that. That is why, to create a Vue Storefront default theme, we used Storefront UI, an independent, Vue.js-based library of UI components such as buttons, galleries, search bars, etc. It enables businesses to build storefronts fast, efficiently, and with no worries about the backend, but - above all - it is 100% customizable. Every single UI component, complex module, or even the whole design system can be flexibly adjusted to a specific brand’s personal preferences.
Vue Storefront is built on top of a standard Nuxt.js template and does not limit its capabilities at all. Anything possible with Nuxt is also possible with Vue Storefront.Filip Rakowski, CTO at Vue Storefront.
Focus on performance
Performance, on the other hand, must be as fast as possible; there is no debate here, but there is also no one simple way to achieve that goal. That is why we focused on providing a bulletproof architecture by using great defaults, best practices, and the best, field-tested tools to make sure your app will perform smoothly. The majority of the business logic is handled on the server-side to make client bundles small, which enables search engines to crawl the site for better SEO results, and allows users to browse the content almost immediately.
How does it look from a technical point of view? Here, it’s worth mentioning the server-side rendering, server-side caching and also the client-side caching and prefetching of static assets.
We also developed comprehensive performance tooling (e.g., automatic route-based code-splitting, CSS purging, inlined critical SCC) to optimize code performance.
Focus on quick time to market
We've built Vue Storefront to make the eCommerce frontend development process smooth and enjoyable for developers and fast for business. This is crucial - and not just in the era of pandemics - so providing merchants with native integration with the best-of-breed eCommerce services such as Headless CMSs, search engines, or payments was one of our most vital priorities. It doesn’t mean we arbitrarily imply which vendors you should choose, but we show the possibilities you have.
Just like Vue and Nuxt themselves, we're focusing on getting things done, providing reasonable defaults, and giving our users integrations and extensions they can use to speed up their development process.Patryk Andrzejewski, Tech Leader at Vue Storefront
An all-in-one but the modular solution
Yeah, the headline above sounds a bit vague, but let us explain.
Vue Storefront is a set of tools that can work together or independently to support you in all development areas. We provide out-of-the-box integrations, a framework for connecting all of them, a library of UI components, and a cloud hosting service.
You can let us take care of all aspects of your eCommerce presence or replace any of those parts with your own, custom-made solutions. How you choose to use Vue Storefront is entirely up to you, we are just giving you a few options.
Vue Storefront is a frontend. Yes, it is a frontend platform, but let’s forget about that aspect for now. It is a frontend. To take your eCommerce project live, you also need a backend, and - in most cases - choosing the right one will be the very first decision you make. The first, but certainly not the last.
Choosing commercetools and pairing it with Vue Storefront gives you more than just a commercetools backend and a Vue Storefront frontend. This pairing will open up numerous possibilities for adding any services you desire, should you ever need them. It doesn’t matter if the services you need are already available on the market (in this case, we provide native integrations) or services that you will build yourself.
Thanks to Vue Storefront’s API, both of these approaches are equally valid and possible. You can choose your own path freely, and... change it whenever the need arises.
With Vue Storefront, the sky’s the limit.