Ben: Hello and welcome to PodRocket. Today, I'm here with Filip Rakowski, who's the CTO and Co-founder of Vue Storefront. How are you, Filip? Filip Rakowski: Hey. It's great to be here. I'm doing good. A little bit exhausted because I just finished the marathon of two conferences and wanted to be here, all in a row, so you could imagine. But I'm here and probably alive. Ben: Yeah. Well, we're glad to have you and appreciate you taking the time to speak with us. So I'm excited to learn about Vue Storefront. So maybe you could give us a quick overview of what you're building. Filip Rakowski: Mm-hmm (affirmative), sure. So what we are building is, or was, at the beginning, just a frontend boilerplate for eCommerce. So the problem that emerged was basically that all the eCommerce industry shifted into API-first approach and everyone started to begin great backends with great APIs. But then the question is, What with the frontend? What about the frontend? So everyone were beginning this from scratch, or try to make their own accelerators, but because of amount of integrations, amount of complexity, and because that's the headless commerce space is moving so fast, it's taking a lot of time. It's extremely expensive to maintain and build it. So it's the same with regular eCommerce platforms. So we are trying to provide this out of the box, because a lot of work is repetitive and a lot of work is basically can be done for many projects at the same time. So we are trying to provide a standard toolkit for building eCommerce frontends. And that includes all the stages from the design, through the development, to the deployment. Ben: Got it. That makes sense. And my first question, this is maybe a silly question, but is Vue... So the name of the company is V-U-E Storefront. Is that relating to Vue.js or it's just a... Filip Rakowski: Yeah, it is definitely related to Vue.js. At that time we thought that it is extremely nice SEO friendly name, and I still think it is. It has some implications though, for example, imagine that at some point in the future, maybe you would like to also be framework diagnostic, then the name is not very good. Also, a lot of people actually got a false perception that we are an official tooling of Vue.js, even though that we are not. But we wanted to highlight that what we are building is basically made with Vue.js and that this is a storefront. So I think the name is this pretty self descriptive. Right? Ben: Yeah. Makes sense. And so maybe take me through the process. If I'm launching a new eCommerce website and I'm using one of the API-first backend platforms for eCommerce, what is the process start to finish of standing up my frontend, using Vue Storefront? Filip Rakowski: It all depends of course, on the size of your shop because headless commerce is a very broad topic. Basically, if you just have your backend platform and talk to it through an API from your frontend, this is already headless. You don't need any headless CMS. You don't need any additional services. This is already headless, but this is, I would say an easy problem to solve. The harder problem is when you are much, much, much bigger, and you're having a lot of services and your headless commerce... It's at the same time is great because it allows you to scale faster. It allows you to be more agile. It allows you to really like this take best of brick technologies, but those technologies are usually not always connected with each other. So the biggest problem of headless commerce is basically making all of those things work together. Filip Rakowski: So we are starting by picking your technologies. And there's a lot of thinking at this stage as well. Because you not only have to think about what is good for your business, but also take into account the alliances, the partnerships, is it integrated with what I am using? Is it integrated with other technologies that I am using? It's a tough decision actually, and this is something that we are helping with as well. Once you pick your technologies, then you have to configure everything properly. You have to make it work together well. And in many cases it requires just creating some separate microservices or even orchestration layer like API gateway, especially when he wants to send this data to the frontend. So that's usually the second stage, orchestrating your data, making a single API for the frontend, even though on the backend, you're probably using like 20 different technologies or even more. Filip Rakowski: And once we have the data, once we have the backend solve, then you have to start working on the frontend. And the frontend workflow usually looks like this, you're starting with the design system. Then you're creating design out of this. Then you're creating components out of this, ideally as a form of component library that you have matching the design system. And then you're taking the data from the frontend, start building this setting up CI/CD workflows and just deploy. Of course, this is a major simplification, because there is a lot of small things that you have to take care of. But in general, this is how it looks like for majority of the vendors of the merchants. Especially these days when the knowledge about headless commerce is not that much spread. There is a lot of plans coming to us and just asking to help, instead of just asking us to provide the frontend, because it's really hard to navigate. There is a lot of buzzwords and people sometimes really don't know what they're signing for and what are the really benefits versus what it's like a marketing talk. Ben: And so do you just help on that frontend piece there or does Vue Storefront also get into, you mentioned you need to orchestrate, maybe create an API gateway on top of the underlying technology stack. Do you help with that? Or you're primarily helping with everything that happens on the frontend. Filip Rakowski: Exactly. And this is a great question. So we certain started as a frontend, with orchestration layer, but in reality, we just want to be a solution for the whole hat, not the frontend, because if you have a headless commerce, we could call, the headless parts are basically APIs and the whole head is everything that I mentioned. So there is a UI library. There is a design system, there is the frontend itself. There is the data layer where you have to actually orchestrate all your data sources. So the orchestration layer. You have to take care of the caching. You have to take care of the CI/CD workflows. All of this, we call a head. And our goal is basically to provide either a great boilerplate. If something gets really configurable or if the things are some sequel allow across different shops, we can even build a higher level to link and abstract. Filip Rakowski: So the goal here is really just to make developers life easier just to allow them to focus on what is most important. And the most important part is basically building the frontend experiences. Frontend experiences that are really good. Not focusing that much on the details that are really like repetitive across different stacks and across different use cases. Ben: Got it. And you mentioned before that, or I guess it's obvious that you rely on Vue.js currently for the frontend component system and Vue layer. I'm curious, why did you choose Vue from the onset versus React or other options. Filip Rakowski: This is a very nice question because at that time, and it was almost five years ago, if I remember right. Choosing any frontend framework was just a huge bet because if you remember right, they were emerging like every other week, there was a new frontend framework. Everyone were super hyped about this, but at the same time, it was very hard to sense like what will be actually the market leader or which of them will actually persist, which of them will die. And I remember at that time we were very intensively debating if we are going to Vue.js or maybe AureliaJS, because the Aurelia club was pretty big in our company. Lucky we chose Vue. And I'm super happy about this. And the reasons why we chose Vue was actually... Because we loved few things about Vue. Filip Rakowski: First one was that it was very, very easy to grab by inexperienced developers and we haven't seen it with React. We haven't seen it with AngularJS. So that was a huge win because even though you could have a lot of senior people, the reality is that will be a lot of junior people working with your technologies. And it has to be easy to adapt. It has to be easy to learn. At the same time in the eCommerce industry building front and separately from the backends was, let's call it an exotic thing. And a lot of developers who are actually trying to do this were backend developers they're into full stack. So for them it was also a new world and having something like Vue.js, which is very opinionated and very easy to grasp, and you can really build very good websites without even understanding how the framework works or something really nice. Filip Rakowski: Secondly, Vue.js was a community driven project. And well, for some, it could be a disadvantage for some could be advantage, but for us it was an advantage because we ourselves wanted to run a community led product. So if you have a community led, community driven product, it's a great technology to adapt because, we can leverage the skills and experience of Vue.js community because inevitably they will be blending into our community as well. So I think that was a great decision actually, but it was also a huge bet and I'm really happy that it was this way. Ben: One of the things I saw in some of your documentation is that Vue Storefront is mobile- first. I'm curious how you think about multi-platform in general and mobile-first. And why go with that approach nowadays? And how do you think about decisions around design when it comes to mobile versus web versus both? Filip Rakowski: The answer to this question has multiple layers. So maybe let me start with actually, why mobile- first? So this comes purely from the statistics and this comes purely from how we observe that users are browsing the web. But it's also coming from something we called mobile gap. So I don't remember the exact statistics, so I will not bring them right now. But in general, mobile gap is all about the gap between browsing things on the eCommerce shop and buying them. So what users do is they're usually browsing things on their mobile phones and then buying them on desktop. Why? Because the experience is just terrible. It's very hard to buy something to get through checkout on the mobile device. At the same time, we see that majority of them is still using the mobile phones for browsing. Filip Rakowski: So the conclusion is pretty obvious. They prefer mobile phones, but they're not getting the experience that they're expecting. So our goal was to fix that. Our goal was to provide something that is giving them a good experience, not only in terms of performance, but also in terms of few weeks, this is actually why we created Storefront UI. So that's the foundation of why we are thinking mobile-first. At the same time I think it's just hard to make mobile-first websites because we are used to the fact that internet bandwidth is raising. We are used to the fact that the computing power is raising. So people were not taking performance into account for a very long time. After the launch of lighthouse, I think in 2018 or 2017, I don't really remember the exact date. It started to became a thing. It started to become important, but honestly it doesn't translate into early world results. Filip Rakowski: So if you take a look at HTTP Archive, if I remember right, the average size of a website these days is two megabytes, which 25% of this or around 25% is JavaScript. So our goal is to ship something that is a great foundation for this mobile-first application that is also showing some good practices, that is also giving you a UI elements that are allowing you to just build friendly websites. Yeah, I would say it's this. Ben: One thing I'm curious about is MACH. So that MACH is a... You talk about that on your website, that's the Microservices, API-First, Cloud-Native and Headless approach. I guess it is MACH and acronym you've created or is that a broader group? Maybe you could explain that a bit more to us. Filip Rakowski: Yeah. So, MACH is definitely a broader group and this is a group of vendors, but also agencies that are leading the headless commerce space. And the goal of the alliance is to raise awareness, to educate, but also to just integrate with each other, to formulate partnerships, to make it easier for the customers to actually adopt headless commerce. Because the biggest problem to see is that, when you were used to build in monolithic commerce, it was easier just choosing eCommerce vendor. And that was the only important decision that you're making, maybe payment processor because of the fees, but that's it. Right now, we are choosing a variety of different vendors. And as I said at the beginning, it's really hard to do all of this together. And there are new emerging from the market and everyone are changing as well because the market is immature. Filip Rakowski: So for this stuff, I think having something like MACH Alliance, which is trying to standardize this approach, which is trying to integrate with each other is extremely helpful. At the same time, the market is new and there is a lot of disinformation. But apart from disinformation, there's just a low awareness about the early benefits of headless commerce. And the goal of MACH Alliance is actually to raise this awareness. So, we were not the founders, but we were one of the founding members. And I see that MACH Alliance right now is growing with new members every week. And there are new amazing companies joining, which is great, I think for the ecosystem and for the whole headless commerce world. Emily: Hey, this is Emily, one of the producers for PodRocket. I'm so glad you're enjoying this episode. You probably hear this from lots of other podcasts, but we really do appreciate our listeners. Without you, there would be no podcasts. And because of that, it would really help if you could follow us on Apple Podcasts so we can continue to bring you conversations with great devs like Evan You and Rich Harris. In return, we'll send you some awesome PodRocket stickers. So check out the show notes on this episode and follow the link to claim your stickers as a small thanks for following us on Apple Podcasts. All right. Back to the show. Ben: I'm curious... As we've discussed, there's a bunch of different parts of choosing your eCommerce stack. There's the platforms I guess like Shopify or Magento, or there's a whole bunch of those. There's CMSs, I'm seeing a lot from Sanity or Contentful, a few of those nowadays and then payments and then a whole bunch of other tools. If someone's standing up a new eCommerce company and trying to think through every part of this stack, how would you coach that person? What advice would you give in terms of choosing vendors and putting together an overall stack that makes the most sense for their business? Filip Rakowski: Well, it really depends. Of course, like that's the generic answer that any developer would give you. But joke aside, you probably have to start with three most important decisions, which is like eCommerce platform, CMS and your frontend provider. And once you have this, I think every everything else would follow. So for example, if you have a vendor that is meeting your expectation and already has integration of your stack, you should choose it. You shouldn't start from a small ones, definitely, because usually you're ending up with a situation when every vendor is exactly what you are looking for. But integrating all of them and making it work together is just a nightmare. This is why it's best to start with the technologies that are accommodating different integrations. Like the frontend, like the backend, like the eCommerce, like the CMS. Filip Rakowski: And then once you have this, just choose from the ones that are integrated, or if you really can't find anything that is fitting your needs, then just look for some other technologies that are easy to integrate. But that's just a start. And depending on your needs, you could really end up in dozen of pitches for even the smallest possible vendor. And then honestly, it's very hard to navigate because every agency have their own partners, every vendor have their own partners and will be all pushing. And it's very, very hard to actually find an unbiased opinion. And for those things I really, really, really would suggest to just hire some consultant who can advise you on choosing your stack. Ben: I'm curious, when you think about the future of eCommerce in general, is a very broad question, but where do you see things in general going in eCommerce in terms of like tooling, developer tools. And maybe this is a question like outside of Vue Storefront, because I do want to hear about your roadmap, but just in general, where do you see this all going? Filip Rakowski: So what we already see is that everyone are trying to move into cloud native environments. So like on-prem are really not... Maybe not know the thing anymore because as huge enterprises sometimes just require this, but we see that in general, the customers are starting to prefer the cloud native environment. So they can really like just choose the technologies that they want. Choose the APIs, find something that we blew them and then just work. Another thing is I see a very interesting race in the instant shopping. So you probably saw that on Instagram already. And there are also other services that are allowing this. So basically instant shopping is a way to buy things on the internet without actually browsing any eCommerce. You're doing this, sometimes doing some drops. Sometimes doing some live streams.sometimes by clicking link on the Instagram and you are already immediately ending up on a product page, that has a buy now button. And there's like the whole eCommerce. Filip Rakowski: And we are seeing a lot of customers actually adapting this, mostly the smaller ones or the ones that are from the retail. But this is just a thing that they really like, but might not be the next big thing. What we also see is that users are starting to choose more and more and more granular technologies, which is very interesting because the vendors are usually trying to do exact the opposite. So they're trying to provide everything. So how I would see this probably in the future, the future eCommerce platforms would be just glues that will be gluing different technologies together and providing some kind of APIs, that are actually allowing you to plug in different CMS, different OMS, different catalog management tool, et cetera. Filip Rakowski: And that would be a very interesting thing actually to see, because right now the eCommerce is all about making it more personalized. It's all about making it more tied to your needs. It's all about embracing best-of-breed. And I think this way of solving problems would actually allow this. Because right now we are in the middle of having the old way of doing things. Where your eCommerce platform was actually a glue, but at the same time it was providing most of the features. So they are still pushing for their own features, for their own staff, of course, because they want a vendor lock in. But at the same time, we also see that this is not what customers want. Customers want freedom customers want independence, customers want to choose from different technologies. And I think in the end as always customers will win. Ben: I'm curious how you think about competition in general. One that particularly comes to mind is Next.js. When I spoke to Guillermo from Next.js, six months ago, it was a while, but even then they were talking a lot about eCommerce and really leaning into that use case in terms of using the Next.js to build eCommerce frontend. So do you see them as competition or if not, who do you see as competition and how do you differ? Filip Rakowski: That's a good question. And honestly, this is something that we're debating a lot in Vue Storefront really. And I wouldn't see Next.js as a competitor because to me Next.js commerce is just an eCommerce accelerator too Next.js, which is much, much less than what we provide. And it's also for a much smaller customer. That's our ideal customer, because what they provide is basically a very simple frontend that has connections to some external services. What we provide is a whole branch of tools that is covering UI library, design systems, deployment, CI/CD, cloud hosting, the frontend boilerplate itself, of course, SLAs, and much more. So to us, it's more like just an accelerator, of course. There is always some overlap. And I would say there is an overlap, especially when it comes to open-source adopters that have their small shops, or maybe they're selling some goods by on their own and they just want to build their shop. Filip Rakowski: But also even in this niche, usually if someone is using frontend frameworks, they have some preferences. So this preference could be Vue.js. This preference could be Next.js. And it would be hard for me to imagine someone who is deciding to go with Vue Storefront, if they're using React or someone who would go with Next.js, if they prefer to use Vue.js. But of course, there's always some small overlap. And when talking about who we treats our competition, well, we try to treat the people who are actually treated as our competition, by our customers and who are offering more or less the same services. So to name a few there companies like Shogun, there are companies like Frontastic, recently acquired by Commercetools. There are companies like Deity, all of them provide more or less similar things. Filip Rakowski: They always have different philosophies, of course. This is why we are all on the market, right? But in general, there is a new category emerging that is called Front-end-as-a-Service, which is basically what we are trying to build. But at the same time, the biggest problem Front-end-as-a-Service is very low ability to customize it compared to just customized frontend. And our goal is to provide Front-end-as-a-Service, but at the same time, make it as configurable as a custom frontend. And of course there are competitors who are going into more strict way. Their competitors were going into more free way. We are trying to be in the middle, but still closer to the custom frontend position. Ben: I'm curious, with any commerce, payments is obviously one of the most important parts of the technology stack. And as someone who presumably works with a lot of eCommerce brands and also a lot of developers, I'd be curious for your take on any trends you're seeing within payments and what your thoughts are on what does the future look like for eCommerce payments? Filip Rakowski: Well, just to give you a short disclaimer, I'm not an expert in terms of payments integrations. There are some people in our team who definitely I could call, but I'm not one of them. But the one trend I see, and I see this more and more often, is that there's a lot of companies emerging who are trying to be like a one payment provider to fix all, that is the first thing. So instead of having, 5, 6, 7, or even 10 different payment providers, they're just having one and they are having integration with other payments. They're essentially making one integration and immediately everything that you have is available on every market. You have different ways of shipping it sometimes even. Filip Rakowski: Another trend is going a little bit further, and it's not only an API for payments, but also a API for the whole checkout. So this one click checkouts. Yeah. Generally one click checkouts or headless checkouts. This is how they're called. And what is it? Is basically a survey that is focusing only on the checkout. And really, if you think a little, you can just build your shop only with this technology. And we see, for example, Snipcart that is allowing this sort of stuff there is Bolt of course, probably one of the most well known. There was Fast, which got bankrupt recently. So this is definitely an interesting trend, but with payments, it's very complex. So obviously the market right now is trying to standardize it, the market right now trying to build tools that are acting as proxies between different providers. So we don't need to integrate all of them and basically to make the integration as soon as possible. Ben: And I asked you before kind of... or I've asked you a couple of questions about the future of different parts of the eCommerce stack. Now I'm curious to hear about the future of Vue Storefront. So what does the product roadmap look like over the next year or so? And then afterwards, curious to hear about the five or ten year vision for what Vue Storefront will look like in the long term. Filip Rakowski: Excellent question. And honestly, like there's a lot of things that we are focusing on right now, of course, because it's a new category. If you would be focusing only on one, it'll be very hard actually to be competitive in that space. But our biggest focus is launching our SaaS product. So Vue Storefront was until now mostly self-service. We had our cloud offering. The cloud offering was allowing to do a lot of things in a semi-automated way, but our goal in the end is actually to make a fully automated way of running. Not only running, but also maintaining your headless commerce storefront. So from the moment of creating, gluing everything to the moment when you're deploying, ending up with analytics, ending up with monitoring and the marketplace so we can build it further. Filip Rakowski: So that's the high level goal when we want to be. And of course we have to start with something. So we are starting with launching our SaaS offering. And I won't disclose what will be there, but I can only disclose that our goal is to launch it until the end of this year. And over time, we'll be adding more and more and more tools to actually make developers life easier, but also to give some valuable insights for the business. Ben: Is there anything you can share about the cloud offering? Maybe just a hint at what it might have, or it's totally fine if it's... Filip Rakowski: Okay. So imagine the situation, because what takes a lot of time right now is setting up a new headless commerce shop, is always custom. So what we want to provide is, we want to provide a very, very similar way to actually create something like this. We want to allow our customers to basically get through a very friendly configurator. When in five, 10 minutes, you can click through all your integrations, all the regions, all the loci, all the domains, all the limits as well, and then just deployed already to instances of Vue Storefront, have them already automatically scaled. Have monitoring, have all the analytics, et cetera. All of this in just 10 minutes. So that's the sneak peek and that's not everything that we are building for the cloud offering. So it'll not only be very easy to set up something that recently was taking sometimes thousands of hours to set up, but at the same time, we'll allow to maintain it much easier. Ben: Got it. Well, very exciting. And Filip, it's been great having you on PodRocket really appreciate you taking the time. And I've really enjoyed learning about Vue Storefront. So for anyone out there who wants to check it out, it's Vue like V-U-E, storefront.io. Aside from checking out the website, are there any other resources you would recommend folks visit if they want to learn more, or is that the best place to explore the product? Filip Rakowski: I think that's the best place to start if you're a business person. But business people are reading things in a different way than developers. So if you're a developer, what I would suggest is to start with docs that we serve from the IO and take it from there. We also have our own profile on dev.to. So if you want to read about the news from Vue Storefront, or a lot of articles about actually Vue.js type script performance. And also headless commerce, you can also follow us there. Ben: Awesome. Well, thanks so much for joining us. Filip, take care. Filip Rakowski: Thanks so much for having me. It was pleasure. Kate: Thanks for listening to PodRocket. You can find us @PodRocketpod on Twitter. And don't forget to subscribe, rate and review on Apple Podcasts. Thanks.