Ep. #14, Pitching JAMstack To Customers

Brian Douglas: So, welcome to another installment of JAMstack Radio. Here in the booth we've got Chris Bach, co-founder of Netlify.

Chris Bach: Hey, how's it going?

Brian: And then on the Zencastr, we got Georges also. Charles is on the line too. Charles, I was saying your name before you got on the call. I'm not really sure how to pronounce your last name.

Charles Ouellet: Yeah, actually it's kind of hard to pronounce in English. It's Ouellet.

Brian: Okay, I was way off.

Charles: You know, the team with Wallet and Snipcart.

Brian: Yeah. That makes sense. So you guys are actually from Snipcart. Do you guys want to briefly explain, who you are and what you do?

Georges Saad: Yeah of course, so I was Lebanese born that explains the family name. So I studied in Montreal, moved to Quebec for some reason that I still haven't figured out yet. I'm the Co-founder of Snipcart, and also the Co-founder of Spektrum which is actually the mother company and a web agency from which Snipcart spawned. And so to cut it short, Spektrum is a web development company known for achieving a lot of impossible projects.

And we're actually the ones that introduced the HL movement here in Quebec 12 years back. We are actually fans of developing tools for ourselves and experimenting on some projects before even offering it to the customers. That's actually how Snipcart started and I'll let Charles talk a little bit more about Snipcart.

Charles: Yeah, so I'm Charles. I used to work as a Lead Developer at Spektrum for a couple of years, mostly backend development. Before that I've been coding as long as I can remember, maybe 15 years ago. Back in the days I became interested in web development by making sites for my Counter Strike clans, when I was a teenager. Since then I co-founded Snipcart with my ex-bosses at Spektrum, about three years ago.

George: It's funny when Charles mentions ex-bosses. The relationship has gone through a lot, from one day negotiating a salary or a raise and the next day just being on a committee deciding what to do with Snipcart and how we're going to manage the budget for the marketing part or for getting some new developers in.

And one of the things that's really amazing is seeing how Snipcart evolved three years back. When we started we had a couple of visions of how we wanted to do it. We really aimed at developers and because we're aiming at a lot at developers we wanted to take it slow.

We're a strong believer in slow growth. We started developing the product for us as an agency, then offered it to customers and then spawned it off into a separate product.

And within actually two years, without any external funds, we had Spektrum behind the company so we didn't need to get some external funds or any venture cap.

What happened is that within two years we broke even on a monthly basis and since then the business has been growing. The team, the only thing that we still have in common within Spektrum and Snipcart are really the offices right now. Other than that, it's more the ping pong matches where we kick their asses and the baby foot place where we get our asses kicked too.

Charles: And don't forget in NHL as well.

Brian: Nice, so, I'm sort of familiar with Snipcart because you guys actually put out some pretty good blog posts. Could you explain briefly what Snipcart is and how it associates with a JAMstack? Because I know you guys are actually knowledgable about the JAMstack, but I want to hear about how you fit in with JAMstack.

Charles: Yeah, sure. Actually Snipcart is an e-commerce solution that has been built for developers.

Snipcart is an HTML and JavaScript based cart that you can inject into any website.

It fits really great with JAMstack sites but it can also be on Wordpress or anything because it's only HTML mark up and JavaScript. So you can define the products directly on your site and then from then on you can also customize the cart using CSS so it can fit the site layout. We saw some amazing integrations during the years that we have been running and it's very fun for us to see that.

On top of that we also have the dashboard for the merchants, so we take care of the actual checkout, but then the merchant needs to be able to access their orders, customer discounts, things like that. So they can do it through our dashboard which is hosted by us.

And we also have our rest API and the web hook event that can be used to push the integrations much further because sometimes we have customers who need to integrate the orders or the products with ERPs or inventory management systems. So, with our APIs and web hooks, it can all be done. That's basically what Snipcart is.

Brian: Just to summarize it for a non-developer.

The user will connect from the browser to your API so the site using Snipcart doesn't have to host any of the e-commerce parts themselves.

Charles: Yep, exactly

George: It's like two components. There's basically the client part where, you know, the developers inject the script within his website and if he wants to go further with the customization he can go ahead with the JS API or the web hooks or even the look and feel of the cart. And the second component of the application is really a full-blown e-commerce dashboard where you can manage your discounts and everything else. They can basically define custom fields for every product and everything.

One of the particular things that we have compared to any solutions that can be more JS oriented is really that the mark up of the products is really within the HTML so it's not a widget or an iframe, which makes the code more beautiful.

It's more of having a clean mark up within the existing HTML so if we're talking about JAMstack, within the straight up HTML where you'll define the price of the item, Snipcart will just parse that information and create the product out of it. So there's no separate product management within the dashboard.

One of the things within Snipcart is really how we got there. Like at first, how we stumbled across Middleman. It's more a serendipity than a planned move. I was talking about Spektrum earlier when we were trying to solve an issue. And the issue was really that we've been running for nine years now, and often we get back to some customers we've developed six years back, seven years back. And I mean whenever a developer looks at his code, the day after delivery it's already obsolete and he wants to make it again in another way right?

There's always a better way once it's been finished. So the idea was that the team wanted to avoid going back into legacy code and all their technology. But we had the customers that we've been working for, for a while, and they wanted to add an e-comm right? So one of the ideas that Charles came up with was "okay, I don't want to mess up with the backend and everything that's with the legacy code that the customer has. So what we're going to do is we're just going to develop a script and that will be embedded into the website and we'll take care of everything. We'll inject the cart, we'll take care of everything else."

So that was the initial idea, avoiding legacy code, and avoiding going to mess the backend of an older solution. And then well, Charles fell on Middleman, and from there well I'll let you tell the story.

Charles: Yeah, actually I found Middleman back in the day, I think I was reading a blog post or something like this. I said to the team, I want to try to integrate Snipcart with Middleman because it seems very cool, fast and simple.

As I dived into Middleman and the configs and everything I figure out that it's a very natural fit for Snipcart to be in a JAMstack site.

I mean basically all you needed is Javascript and HTML so that's the output of the project. And at that moment there were not a lot of solutions that could fit on a JAMstack project for e-commerce needs. I know there are more nowadays but when we started Snipcart we were probably one of the earliest ones to attack this market.

Then we realized that this post that we wrote about Middleman was getting more and more traction so we decided to push the JAM even further by playing and blogging about other static site generators and use cases that you can plug a JAMstack site underneath. I mean, since then it's been great and we got a lot of questions. I mean every week we receive questions from customers that are working on amazing projects involving JAMstack and our products. So, it's very awesome for us to see it growing and getting more and more traction amongst developers using our product.

And I can say that even supporting these customers and helping them go live is very fun for us because most of the time their projects are very clean so that we don't have to mess with Wordpress or things that don't excite us so that's very nice. And we still contribute to the community actively because we believe these tools are great and should be used more, even for more complex projects, not only blogs.

Brian: Yeah, I'm glad you talked a bit about the client in this case too but I'm curious to know, what about the clients that don't have a JAMstack site? How do you convince them to use something like Snipcart and get involved in the JAMstack as opposed to a full monolithic Wordpress set-up with a database?

Georges: Yeah, it's interesting. One of the things when we talk about convincing the client, when we approach the customers we have a different perspective on it.

One of the things that we try to build up is a certain level of trust where the customer is not really going to challenge the technical decisions that we are going to have. And we won't challenge the expertise that they have within a certain industry.

I really think when we're talking about developers there's a different answer to the question, like how do you convince a developer that it's a good idea, but I think when we're talking about the customer, the end user, his main concern is not scalability and security.

There's a lot of big advantages that we can bring to the table. And the speed where customers are more and more aware how much performance is an issue, how performance is important for Google and ranking and everything. So, there's a couple of low-hanging fruit benefits that can really help the customer understand why we're taking such decisions.

But when it comes down to the customer itself, I really believe it's more about the content addition where it sticks a little bit and that's proportional to the ecosystem that's going to grow within the JAM basically. Where the more we are going to have tools the less friction there's going to be of convincing, non-technical customers about using the JAMstack for his next big thing.

One of the things that we've been seeing is that when we use the term "static websites", it sounds like its for smaller websites but it's actually the complete opposite.

What we're seeing is that it's more high-end customers where the JAMstack fits better because now, once you get into that position with the customer then security is really an issue. So now it's a major argument, giving it and saying, you know, if we adopt such a stack nothing's going to be faster in having a static website delivered.

And the same thing for security, saying that it's completely decoupled with the database and there's actually no potential issue with security. And for scalability, there's really nothing that can be compared to that when you're talking about infrastructure and scalability of the application.

So, I really think for the customer, it's more about the values that it gives and it often comes down to content addition and how can we put in the content without messing around a lot.

But I think for a developer then there's a different answer, I'll let Charles talk about it more.

Chris: One of the thing that I've seen which is interesting, especially back in the agency days, where I spent 14 years playing around is when you deal with anyone that has e-commerce as part of their digital solution. When you talk to performance, those are sort of like preaching to the choir, right? Because I've never met anyone besides e-commerce managers that really understands the true value of a millisecond because they can translate it immediately into extra dollars and dimes right there.

More in baskets, fewer baskets left, you know. Basically, higher conversion and if e-commerce is their main business they are more aware of this and are easier to convince just by saying that, off the bat, by simply choosing the right stack,

Without any frontend optimizations, without any backend optimizations, simply by going with a JAMstack, they're shaving off several seconds.

I mean that's thousands of milliseconds that goes to improving their business. I'd love to hear your input around this but what I saw was that because their pricing market is online and it's so incredibly transparent, what they do is they have to tune everything to make it a profitable business. Because if they just pump up the price people will go somewhere else. So, they are in a game where if they can get 10-15% high conversion then that's probably the difference between profitability and being in the red. So, yeah, my experience is that they're a very grateful audience when it comes to performance.

Georges: True. Like I said the business value and the benefits are an easy sale. Nobody's against better performance for a website. So yeah definitely. And one of the things that we often say when we're trying to explain it a little bit for our customers, we often say you know what JAMstack is not a revolution. An old guy as I am I sometimes give the parallel you know, like 20 years back the first, let's say static websites entered our world, like front page.

This is where we're basically trying to give the customer a way to edit his content and that would generate the HTML and that would get uploaded into FTP. So it's basically like the ancestor of a process where we're generating a static website but still giving the power and the freedom and independence of editing the content as a customer. The maturity of the web has exploded. I mean, we're not really even close to that period. The tools and the ecosystem that's around it, it's going crazy and this is where we often explain that

With the JAMstack it's not a revolution, it's going back to the roots.

It's going back to the roots of the web where you're basically delivering pure HTML. With no decoration, like no, in French we say flaflas. No useless stuff around it. This is where we should've been heading at first but where the maturity wasn't at the right point and now we're at that step where the maturity of the web, the tools are there.

And basically this is why I think the JAMstack is just going to grow. Well what we've seen so far with Snipcart, it's just exploding and getting more and more traction, more and more developer interest. Because it just makes sense, this was the first solution that we wanted at first, we just didn't have the maturity and the tools for it.

I think the technical part is often easier for a customer, the benefits are easy, but one of the things that we say is that we've somehow spoiled the customers with having so many features and most of them useless. But they have so many features they are expecting in a product. Somehow we get into, you know, like a newer technology or newer tools that are coming up and it could be a no-go. I'll give you a quick example for that. You know, in the States when you develop an application or a website, well you develop it in English. If it grows then you aim to go more specific into markets then you going to translate it and go multi-lingual.

In Canada, we're a bi-lingual country, and in Quebec specifically, whenever you start a project, it's multi-lingual, it's de facto multi-lingual at first so having the ability for a customer to edit a multi-lingual website and content is a must, it's not an option, it's not a feature.

And when you get into, you know, less mature products then this is where it can get stuck. And from our perspective when you're getting it to customers this is really where sometimes it's more of a challenge in explaining the workarounds we're going to have to do to support multi-lingual. A role for a lot more corporate businesses where you're going to have a matrix of role, the audit, the trails. It's more about the feature than the technical side. I think it just makes sense that the whole technical part of it, it's the orientation that we should all be heading toward and this is where the web is going.

Brian: Georges, could you go into more detail of how you approach that challenge of having that bi-lingual site to start off with, how would you approach that?

Georges: It's really different, it really depends on the customer. For a smaller customer, we're simply just going to duplicate the model and we'll do some backend work to synchronize some of the specific language labels or content. So it's more of a workaround than a build around. When we wrote the JAMstack for clients, one of the things that came out of the blog posts that we wrote is a list of all the things that we thought could make it better and more useful for us. Talking about the various tools being you know, Prismic, DatoCMS, Forestry, or whatever tool that we use.

Well, we actually wrote back to these people saying you know what, what you guys are doing is pretty crazy, we really believe in that orientation, but here is the feature that we think missed. And of the biggest surprises that we had, they came back with an answer saying, "you know what, we know that, it's just like the time factor is always the limit". So as a developer we figure out solutions and workarounds to make it for them.

But for me it's definitely not an issue in itself, it's more the maturity of what we're going to evolve with the tools around. I mean all the tools that we have right now are totally crazy. I mean, I think about Netlify and Contentful and Prismic and crazy tools that's just going to change the way that customers are really going to enter the content.

We just have to be patient. Patient enough to get the maturity that we need. And like I said earlier. The usual customers that are non-technical, that have been writing content within CMSs, have been submerged with features. Most of them useless but they know it's there. You know how it is right? It's almost like the minimum barrier of functionality expected is pretty high because, I mean CMSs have been around for what 10, 12, 15 years?

It's simply a question of time to catch up to that. And this is where the ecosystem is right now. You know we got Snipcart, Netlify and all the editors and keep forms and all that, it's old tools. It's just going to make it easier and easier until the ecosystem is pretty mature for even the mainstream.

Brian: Charles, can you speak a little more since you lead more of the technical aspect? As far as process and approaching a problem for a client technically? Is there any speed in development going on a JAMstack site as opposed to a monolithic Wordpress whatever?

Charles: Yeah sure, actually at Snipcart I'm not really involved in getting clients up and running with their site because most of the time those are developers that get to us, they already chose their stacks. But we keep trying. When we have questions like "what shall I use to integrate Snipcart onto my website? Do you have a preferred CMS? Shall I use Wordpress?"

Most of the time we just push them towards headless CMS and static site generators because we let them know that it's very fast to get started and you have a lot of features.

I was playing with Prismic and Contentful for some blog posts originally and I think it's very interesting and very powerful tools that can be helpful. So yeah, we try a lot to push our customers towards this but as I said most of the time, they already have their stack.

Brian: Awesome and then Georges real quick. You mentioned a blog post in your explanation. Is that the blog post that's published on Siteleaf? Or is there another place to find that blog post?

Georges: No the one that was published on our own blog post. The thing is, like Charles said earlier, once we fell into the honeypot of JAMstack. The jam pot! We started playing around with a lot of tools and basically what we did we started sharing the findings and the play around that we had with those stacks and the blog posts that we're talking about is the ones on Snipcarts website.

On the blog there's actually a dedicated channel for static and headless CMS and all the playing around that we do with that. So thats the dynamic that we've had. And you know when we started, the first time that we published a Middleman post, we've got a couple of questions afterward but now it's just regular you know, like we get more and more ask questions and information about that.

Like Charles said earlier, one of the funny things is that the guys are always more happy being supporting the team working with static websites or headless CMS and the whole JAM stack. Because you know, it's almost like a proof of being on spot and what it should look like right now. Especially when you're a Snipcart customer.

Snipcart is a frontend solution for a starter so it just makes sense. We get more and more requests for that and it's really fun helping those people. You know you don't have to dip in a proprietary CMS with a backend you don't really control and it's a lot easier talking about, you know, pure HTML and JS.

Brian: Cool, and I think I found it. It's JAMstack for Clients: Benefits, Static Site CMS & Limitations on the Snipcart blog.

Georges: Yep exactly

Brian: Cool, so we'll definitely have that in the show notes. With that being said I think we had a really good conversation talking about, basically, what was summarized in this blog post and with that being said I want to transition us into picks and talk about what we're jammin' on and what's getting us going. So, it could be workwise, it could be technology wise, we tend to have a lot of music and Netflix picks and with that being said my first pick is going to be a music video.

It's "Wyclef Jean". The name of the song and the rapper is Young Thug and this music video is quite interesting, it actually went viral last week and I guess to summarize it. They shot a music video without the rapper in the video at all and the problem was the rapper just never showed up. So they went through the music video and the director basically made all his decisions for the rapper, even had like a cut out of where the rapper would've been if he was actually there.

He was in the video for like, maybe 10 seconds, where he recorded a video of him eating Cheetos so he's in the very beginning of the video and that's it. So it's just basically annotations throughout the entire video of like, the entire time the music's going, the rappers actually rapping, and there's annotations of this, them saying yeah he would've been here but this happened and he had this excuse.

It's actually pretty hilarious but it takes away a lot from the song, when you watch the video. I couldn't tell you what he's rapping about but it's pretty funny watching the video and basically watching this director whine about the fact that the rapper never showed up.

With that being said my technology pick is going to be React Native. React's a framework we talk about a lot on this podcast. React Native's actually the approach that Facebook created to create iOS and Android apps using just JavaScript. I got into it about 18 months ago, it's actually a lot of fun.I got into actual Swift and Objective C Development, I learned that on my own and then transitioned to React Native really quickly because it kind of was a really good bridge between my web knowledge and my new iOS knowledge.

At the time I was doing iOS and I've since made an Android app, an iOS app a couple of times and I'm currently building a small prototype of the Netlify app with one feature, which is basically your deploy logs all for a talk I'm actually giving tomorrow which Ill probably have a video later on.

So if you check out my blog you can probably watch that video when it comes out. So my pick is React Native. Chris, did you have anything you're jamming on?

Chris: Right now we're spending a lot of time on Netlify CMS actually so I guess it would be React. The reason I guess I'm tripping out over this is because and I keep coming back to these days where we sort of get close to really releasing it. That it's a single page app and using react.

And if you look the old alternative was some bloated thing like Wordpress. It's funny to think that this thing gives you a Wordpress experience is actually a single page app made in React.

It's Open Source, it's built to be agnostic, it works with consistent data in Git, so it's Git based. It is a headless CMS but its something that's purely written in a framework for JavaScript and works as a single page app. That it actually has the same functionality that you needed for a huge monolithic app before was, really interesting. And Doug, I know you've been working on our frontend as well so we're doing so much React these days right and it really is an interesting framework. And it's been fun to see how quickly its exploded.

Brian: Yeah

Chris: How much cool stuff is being made all around the world.

Brian: And it's crazy how much React in general fits within the JAM philosophy.

Chris: Yeah it really does.

Brian: Because you can literally just embed it into either your HTML site or your Wordpress site.

Chris: Yep

Brian: And that's basically what we're doing with the Netlify CMS. We're embedding a CMS in your static site generated site.

Chris: Exactly

Brian: And it just sits comfortably next to it. It doesn't take up any space and you only have to go to slash admin to see your CMS which is beautiful.

Chris: Yeah, it is really fun and cool to see how far you can come with simple.

Brian: Yeah, cool, and then I guess we'll just go order of introductions. Georges, did you have any thing your jamming on, any picks?

Georges: Yeah of course, music wise, there's a, I don't know if you heard of it, it's an older band. It's called Chinese Man. Just got a new album. It's a DJ. It's pretty amazing, you have tolisten to that, it's pretty cool. Working with that, it's a pretty nice beat, like older school little bit of hip-hop with a French touch. Other than that I'd say, most of the list right now and I've contaminated Frank our marketing king here. It's more, you know Cash David like, that's definitely the music we've been jamming out to lately here in Snipcart.

Tech wise I'd say one of the the things that really got us pumped four or five months back, is really the trend of profit for start ups. We're fans of the slow growth and we've been bootstrapping our stuff and it's been working well so far. And you know seeing all the articles popping up where you've got a dropbox saying "oh we're going to announce profit this quarter".

We're building a business to make profit somehow and t right now it's just picking up. It's a thing that really excites us and you know, one of the things that we've said so far is that, that gets the competition on the same level so welcome to the game right?

It's working with the same constraint and trying to build a business that's profitable and it's something exciting instead of just building something without really necessarily aiming for a profit. I really think it's something that's super exciting in the coming years and it's definitely one of the things that's coming up, jamming us a lot.

Brian: Yeah, that's nice to see companies actually being companies in businesses nowadays as opposed to whatever Twitter's doing. Sorry Jack! So, Charles, do you have any things you're jamming on?

Charles: Yeah, I'm going to start with the music as well. I used to listen to a lot of depressing music. But for like a couple of months I don't really remember who introduced me to electronic music without lyrics. I'm now a big fan of Immense, it's like electronic music, very slow but it helps me to focus when I'm writing code so I really like it.

And on the technical side, I will say that I'm quite excited by Vue JS at the moment. We've been trying it in small project here at Snipcart to help us with the support effort. Actually we built a small application that allows us to fetch the data from a customer to see how it affects settings and things like that and we've done it with Vue JS and it went really well. I'm quite amazed that this project is mostly maintained by one guy so it's quite awesome to see the growth of JS frameworks.

Brian: Can I just ask, what was your favorite part about working with Vue? It looks like it's about three weeks old so it can't be that mature yet but you know, what was the best part.

Charles: Actually I think that it was the freshness that it brought because I've been working on Snipcart for the last years and with backbone and things like that. And now using this framework with the Vue x and having the state and everything it's something that really excited me. And I want to shout out that Maxim, thats the other developer with me on Snipcart who is currently in Bali. He is the one who introduced me to this framework and showed me how it worked for this application.

Georges: So a big shout out to Max if he's hearing this.

Brian: Ooh yeah, Vue's on my long list of things to finally try out. I've built one boiler plate project. I think it was the hacker news clone, just to test it out and make sure it worked on Netlify and it's great, it's super fast and I think it's going to be pretty big in 2017 for sure. I think people are going to get more adaption. I think it's Evan You is the guy who maintains most of this. He quit his job at Facebook or some other company and now maintains this full time. He's done some really good work which is pretty awesome.

Chris: Shout out.

Georges: Hey Chris, Brian, one last thing. I just want to say you guys, what you published about the headless CMS is pretty crazy. Just saying that the ripper story that you published, we were actually working on the same thing as a side project and wanted to publish so that's a pretty amazing move.

Charles: A week later we saw that you guys published this so we just sort of said okay.

Brian: Well, it's open source.

Chris: Absolutely, yeah, we sold a lot of traction with StaticGen back in the day and it's still does carry a lot of traction with it. And we just though there's so many headless CMS solutions coming out there that it would be nice with an overview somewhere. So that was just sort of the gist of it. It's a little bit different than StaticGen because you can't really rate it since they're not all open source and so you can't really look by GitHub usage so it's more of an alphabetical list thing but at least it gives people a place to start when they want to check into it.

Georges: I mean there's definitely a huge value in bringing that into one place. You know I was referring to the ecosystem of the JAMstack earlier and it definitely goes in the same direction right. I mean, there's a huge value in it.

Chris: Thanks

Brian: Cool, awesome, well thanks for coming on Georges and Charles and Chris as well for coming in the studio to chat with these guys. I'm liking what you guys are putting out there. I love your blog posts, I read through a couple actually in preparation for this talk so, keep up the good work and keep spreading the JAM.