Coding Shopify with Anne and Trudy of Design Packs

Thanks for having us.

Yeah. Sure.

So I've been a front end developer for 15 years now. That seems a bit crazy to say, but I've I've been through the the Flash times, the, like, jQuery times, and then the framework era, so I feel like I've sort of seen it all.

And then, I got into Shopify sometime around 2014, I Wes. I built my 1st theme and I was working for an agency and and that kind of stuff, and then I actually, worked, for about almost 5 years at an actual theme company.

So we were building, themes to sell on the theme store. So I was there for, yeah, 5 years and then left in 2020, the great resignation.

And Oh, yeah. Yeah.

And then started a consultancy doing, store audits And then had this idea about maybe building this kind of interesting app and reached out to Trudy, who is brilliant. And I was like, maybe she'd be interested in partnering, and luckily, she was. So, yeah, we launched our app design packs, and we just had our 3rd, year anniversary.

Yeah. Essentially, it adds new widgets and layouts to your existing theme.

Who am I? Wes, okay. So prior to 2015, I was a mainframe system programmer at a bank. And then I, took one of the part time Rails courses at HackerU.

And I kinda decided I wanted to see if I could go into web development and do my own thing. So then I end up quitting my job and taking the boot camp, which Wes was my teacher for. Nice. That was a long time ago. Yeah. Everything I know about front end, I know from Wes.

And then me and another student from that class started an agency right out of the boot camp called Up at 5 because we're morning people.

And, and then we, we quickly we were sort of doing anything, but then we kinda quickly pivoted into just doing Shopify. So from probably around 2015, 2016, I've just been building custom Shopify sites.

And then Anne came to me, and she was like, do you wanna build an app? And I was like, I definitely do.

Oh, I mean, that's a it's liquid. So liquid is is sort of the the secret sauce.

So for anyone that comes from, like, a WordPress background, like, in the same way that you would have, like, sort of little WordPress snippets that you're pulling in, has a similar type thing where you're pulling in information to your templates.

But I remember the first, like, Shopify theme that I built. It it is Wes very Bos, and a lot of times actually similar WordPress as well where you sort of start with maybe, like, an existing theme and you kind of create your own, build off of it, and you learn from that. And then you kind of can go and build your own from there. When we were building themes at, out of the sandbox, that's the theme company that I was working at, the design and development would take at least 6 months, because everything had to be very specific in order to get it into the theme store. The level of curation Wes very high. It's not like they would just accept anything. So there's very specific, rules that you have to follow when it comes to settings, how things work, even the way that things are labeled and named.

But the actual development of themes, I wouldn't say is, like, wildly complicated. Would you agree, Trudy?

Yeah. It's yeah. It's like liquid templating HTML, CSS, anything else you wanna do, but that's the basis.

Cool. And do you feel like you have, like, enough control with liquid? I I I did a ton of Magento work in my past life as a Magento developer.

And then when we did our Syntax site, I got into the liquid temp templates a little bit on Shopify.

And I Wes I was really amazed at how much was there, but I I I didn't get any deeper than just changing some value. So do you really have full control inside of those templates?

I think Wes. Because as it like, from the agency perspective like, Anne was dealing with the theme, so she had to follow sort of the guidelines and everything.

From an agency perspective, my favorite thing JS, like, making Shopify do things that you don't think it do. So I would like I'd be ESLint integrating like Vue JS or React into just 1 template. And then they also have, what they call the storefront API, which is essentially most of the data that's available in liquid, but in an API, which sometimes works better with React or Vue. Js or something. So you can do anything with Shopify. It just

For the Shopify theme store, you can also sell it on ThemeForest

or, you know Oh, interesting. Individually. Yeah. Is Theme Forest still kicking?

Is is that a a place where people go still? I think so. That and creative market. But I Yeah. So it's interesting. I don't usually recommend themes from there mainly because the level of curation is so high, so you're not gonna get that whether you're not gonna have the same requirements from those off-site

ones. So Yeah. You're take it's a crapshoot.

The only exception to that are the ones that already have themes on the theme store and are also selling them off their own site because they're already closed.

API somewhere. Yeah. Exactly. I was gonna say it's just the localization.

Liquid is not the most beautiful,

syntax highlighting for it because I was like, I need to have some color to let me know what's what here. But, yeah, you know, once you get your handle on, it does feel like a familiar esque templating language. Right? You can reason about it once you Yeah. Understand it. Yeah. And they're they're putting a lot more before

Like, Trudy and I both remember the olden days before they had, like, GitHub integration, you know, and when building themes.

And now they have like a v s code extension which is really great that they're improving all the time. So I think they they are actually trying to put a lot of work into the dev tooling which is really nice to see because they do rely on the partner ecosystem quite a bit so it's it's nice to get that from them. Like, oh, it makes our our life easier.

Yeah. Totally.

I think that with Liquid specifically, they thought that it would be so easy that designers could use it. So they made a bunch of choices that are counterintuitive to a developer's mind. Like, for instance, the index starts at 1. They later added index 0. Really? Yeah. Yeah. Oh, wow. Like, there's a for loop Scott index and then a for loop dot index 0.

You can't. No. Okay. Yeah. I mean, even even creating, like like, working with arrays is kind of funny and weird. And, like, the idea of, like, an object doesn't really like, you can kind of fake it a little bit, but it's very it feels a little hacky. Yeah. I have a blog

that was called Node Shopify before they made me change the URL. But and the most popular was how to make an array of liquid. Like, it just got the most number. Thank god.

It is it is a a treasure trove, though. Trudy has these amazing tutorials. It's called, too many tabs dotxyz.

X y z. Yeah. Yeah.

Well, recently, they've come out with the CLI for theme development, which is very helpful. So you can just sort of spin up a theme, which I guess is based on the Dawn theme. Am I correct, Anne? Mhmm. And you can connect it in your Shopify admin directly to a GitHub repo.

And so and that kind of connects it, which the good thing is about that, which this is all kind of new. It also like, if the if the merchant makes changes in the theme editor, it also automatically updates it to the GitHub. So you can keep it That's nice. A lot better. In theory, it's fabulous, and I love it. In practice, every single merchant will somehow disconnect it from the GitHub, and you won't know when they did that.

Yeah.

Once you start getting merchants involved with things, your beautiful dev process can kind of break down because so previously, the only way to, sort of upload a new theme to a theme store would be to upload a zip file. That's it.

Whereas now they have the ESLint integration, which is great. But if you duplicate that, theme, it no longer, is connected. So Oh. Yeah.

Yeah. So the CLI actually has like, it'll create, like, a local, URL for you to kind of spin that up. So then it's sort of a matter of, like, keeping all of your branches. Like, a lot of people have, like, a dev and a production branch, you know, classic.

And then so you have your local.

So, yeah, it works really well.

I often find, again, because there's often that disconnect with GitHub, the alternative method to still be able to work locally, is to use something called theme kit, which is, basically, you have, like, a config .yml dot YAML file, and then, that will connect you directly so you can push, to the store.

The only downside with that, as Trudy was saying, is that it doesn't have that backwards compatibility. And so all of the content for, pages and, like, the content for sections is saved in these JSON files.

And what can happen is if you accidentally save that JSON file or do a theme deploy Yeah. It's it's it's replaced with the the old version if the merchant's been editing things at the same time you're working on stuff. Yeah. Yeah. So in pract in the most practical way to do it is use theme kit and, like, work on a

development theme and then just do all your work there and then publish that theme. And then next time you go, like, duplicate the live theme and then work on that and publish it. That's like the most practical way right now. The CLI is beautiful, but you can't trust some people.

I was gonna say, is this something that Shopify is is working on or improving, or is this just a way of life there?

Well, the the the GitHub CLI is the improvement. Okay. Yeah. And it really works well. And, like, for me GitHub like, as an agency, I can, like, tell my clients, like, train them to understand how it works and be, like, make changes to the dev Node, because I'll usually have 2 connected. The problem comes in when, like, an app they'll, like, email an app and be like, oh, something's not working with the app. And the app company will come in and and just do a duplicate of the theme and make changes because they don't wanna touch the live theme. So it's I haven't found a way to, like, get everybody on board with not disconnecting the GitHub.

Yeah. So there's a couple ways to do that. The, when you're actually setting up a new development store, so if you have a partner account, you don't have to pay for stores that you're working on. You just set up, like, a dev, store.

And they now have the option where you can populate it with, like, example products and and that kind of thing. So previously, the way that we used to do it was having to upload a CSV that had all those different variations so you can you can still do that, and I still have, like, my my go to Node, with, like, you know, all the different variants, but, that's usually the way that you do it. There's lots of oddities with the Yeah. Shopify.

So many. No.

I would say the blog frustrates me. But mainly because I'm dealing with something right now that all I want to do is get blog posts, like a like a loop of blog posts that are written by a certain author.

And you'd think that would be super straightforward to do. Right? But it's not. You can, you can loop through all the blog posts. That's fine.

But there's actually a limit. You can only do 50, so, it stops after that. So the only real way to do it is I'm going to have to use the storefront API and, like, pull in the blog posts based on the authors and then render them with JavaScript instead as opposed to using liquid. And it just feels frustrating. Yeah. Generally, looping in Shopify is often because there's no sort of where clause. So sometimes the answer is, like, loop through every single product. And if you have, like, thousands of products in the store, that's just not a practical

answer.

Depending on the complication. If it's something literally that's just, like, displaying blog post, I'm just using Vanilla JS.

Yeah. Yeah. If it's something like a little bit more reactive, I'll use Vue JS. Because you can use the CDN, so it's really just it's easy to bring on to just 1 page.

Neither has I. No. No. And we we but we've had internal discussions

about We have opinions.

We have opinions. Yeah. It's just they were really pushing headlesses and probably still are as this, like, everyone needs headless. It's the, you know, site speed, everything.

You can have, you know, custom URLs, so, therefore, it's better for SEO and this sort of thing.

But their unfortunate reality is that talking about, like, building a custom checkout and that kind of thing Yeah. You need to have a dedicated dev team that knows what's going on, that's able to build you things rapidly, that's able to support you. And if you don't have the budget for that, it's a really not a great

components that you can slot into your thing. Right? So you would be giving up all of the options that you have. The the annoying little spinner that comes up on every single Shopify website, you're giving that up. Right? Yeah. Yeah. Yeah. Yeah. So Yeah. You're also giving up the the the content management system that's Yeah. Built in that already is there, exists in Shopify. So a lot of people, you know, they'll use, like, put a content folder or whatever, all the various options. But then you're having to, like, completely

rebuild that aspect of it too. So Yeah. And like you mentioned, beyond just having a full dedicated team to build, you probably need a full or at least a team to support long term because you ship anything at Wes. A year from now, who knows what? It it doesn't have that same guarantee of working that you would if you had a managed Shopify

UI. You know? That's true. Like, you have to have it, like, whatever. And also, like, the content management, it's like you can't just swap out your banners every single single day unless you have Yeah. Like, unless you're getting a dev to do that or somebody who's comfortable, but a lot of people just aren't comfortable, like, going into the code. Mhmm. I haven't come across a use case apart from maybe the URLs and certain things that you I can't just build into a liquid theme.

Like, if there's, like, a really unique experience, I just build it in React or Vue

Oh, yeah. Always. Yeah. I've actually built sites that don't even have an ecommerce component. Wow. Yeah. Really? Yes. Me as well. Yeah. Who's asking for that? Just it it because the theme editor experience, people really like it. Like, it's it's a lot more user friendly. Not as user friendly as some things, but I would argue more user friendly than WordPress.

So

it feels a little more Squarespace y. Mhmm. K. I did one for the Frankfurt Book Market, which Wes like, Scott content management system was good because each book was considered like a product, but they didn't actually sell it. It was just on the site for people to see. So it sort of, like, had the same back end ideas

I could see that being a benefit. It's like, if they if people have, like, a really extensive and robust blogging system, you can't really get that done in Shopify.

Like, you can have a basic blog, but you can't do what you can do in WordPress. So sometimes people will have a WordPress blog depending on how important it is to their business.

Well, it it kind of we like to so it's interesting because a lot of people do have this, we've gotten pushback from merchants saying like, oh, I already have so many apps and I don't wanna slow down my store and this kind of thing, which is fair because I definitely run into apps where they're loading like, the 1 app is loading 2 different ancient versions of jQuery.

Oh my gosh. I don't know.

So that can happen where, you know, you add, like, 30, 40 apps, all the apps, and they're gonna add a lot of craft to your store. But we like to think about design packs as not necessarily an app, but more of like a section delivery tool. Because within Shopify, the way that a theme is made up is these different sections.

And so those are the little widgets and layouts and that kind of thing. So on average, most themes come with, like, I don't know, 10 to 15 sections, and that's it. So if you don't have what you need there, you're kind of stuck. You need to pay a developer to build a custom section, or you need to figure out how to do it yourself. So, what our app does is it adds in directly into the liquid theme code new sections

for your store. Okay. Cool. Yeah. And and so a lot of these integrations, are these things that people are setting up their entire like, they have a business to sell an integration. Is there a whole market of people building paid integrations?

Oh, yeah.

Oh, I mean, they probably are. That is what they

I bet they do very, very well. Yeah.

I think the really cool thing about it is that you can have 1 or 2 devs and have like an entire SaaS business on the Shopify app store.

The one that always comes to mind, because they're Canadian, is Bold.

They have quite a few different apps.

I don't know how crazy well they're doing. I don't think that anyone has Node ed yet. But Yeah.

It's interesting that, like, like Wes mentioned, in in any of these communities, there's always these niche, like, situations where people are making real money off of them. And it it goes to show, you know, a lot of people, when we do our podcast, we we talk about different career paths.

There's certainly a major career path just by getting really good at this kind of stuff and getting your stuff into the the marketplace. Right?

Yeah.

Absolutely.

And I think that but I what I don't know about Trudy, you can speak to this as Wes. But the biggest sort of mind shift for me when I was getting into Shopify was coming from just a purely web development background.

I had to learn so much about just ecommerce in general. Like, okay, what do people actually need? You know, conversion rate optimization, just about the whole it's so much more than you know, I used to be agency where a site would live for 3 months and they would be taken down. So that's been the thing.

they get a buck from that. That's pretty sweet. I will say some people that come over from, like, WordPress or what have you, they get a little sticker shock when they come into Shopify because they're like, why is this so expensive? Why am I spending this much fun? But to your point, it's because you you're running your business off of it. This is making you money at the same time. It's not just a, you know, a brochure site where people are gonna find out your store hours. This is you're actually selling things through here.

Yeah. Totally.

Can can we go deeper on design packs and, like, what it really gives you? A 170 expert built layouts? How does that how does that all work? Yeah. So,

essentially, when I worked at the theme company, a lot of times we would get these support tickets because we had 7 different themes.

And people would say, oh, I love this theme. I I like this, you know, this section. It looks great. But I I also like this section from this other theme. Can't I just mix and match? I wanna be able to have everything all in Node theme.

And so that's essentially what we've created. It's like little extra LEGO pieces for your, like, existing LEGO set. So, and what we've tried to do is because I do know all of the the very specific settings and how to make sure everything's integrated properly with existing themes, they just merge in as if they've always been there. And we make sure that they're the settings aren't overwhelming in terms of what you can change, but still give people enough control that they can match their branding, make sure everything looks seamless, and we keep on releasing new sections.

We also have templates as well as the sections, and those are prebuilt pages. So sales pages, landing pages, about pages, FAQ.

And so someone can add those, and they're preconfigured.

So they just have to hop in, add their own images and content, and then boom. There you go.

Also, we really lucked out because about 6 months after we launched the, our app, Shopify changed the way that themes were built. So prior to store 1 ESLint o or whatever, they, you could only have, like, flexible sections on the Node page. So our sections mostly were just for the home page. But then 6 months later, they finally, revealed sections everywhere. So now we are so it essentially turned our app from, like, something that you could put on the home page to a page builder.

Nice. Yeah. Wow.

That's great. Did you did you all know that was coming, or was that a happy surprise? Yeah? They had announced it 5 years previous, so we were Yeah. It was We hoped it would be coming in.

as its own thing? No. We run servers. Well, we're running on Heroku. So we have, like, a Shopify app that, like, does the authentication with the store and does the billing and all of those sorts of things. Like, just the

No. Really. And then they got rid of that. Yeah. Also about 6 months into our app, they were taking 20% off the top at the beginning when we just launched. And then now they don't unless you make over $1,000,000, then they start taking a hit. Wow. Oh, that's awesome of them. Yeah. Same thing with themes as well.

Yeah. On that note, I used to always describe us being kind of like a like a little remora fish on a shark where, you know, we have to be aware that we're building in the Shopify ecosystem, or we're building our business on this larger business. But But, honestly, these days, I think about it more of, like, mutualism because Yeah.

It it's mutually benefit. It goes both ways. It's not like we're just feeding off of Shopify. The partners bring a lot to the ecosystem as well.

Yes.

Unfortunately, a lot. Yeah?

Well okay. So what often I'll I'll caveat this Sanity saying that, like, what often happens with Shopify is that they'll build something that people have been asking for that's been that apps have been providing that service for a while. Yeah. But oftentimes, they'll build, like, an API for it specifically.

And so it's still not super easy for people to use, or they'll have a really basic free app that does very basic things. But the most recent one I can think of recently are, like, stack discounts and, subscriptions.

Okay. Yeah. Because previously, there was no way to natively do subscriptions in Shopify, and then they changed that.

However, I can't think of an example of, like I can't think of one, I'm sure there are, of things that have completely gone away because oftentimes, the apps that are offering those service will offer a bit more, like, than the basic that Shopify is doing. So

Yeah. And sometimes in the case of, they had a free product reviews app, but then there are, of course, a ton of competitors that were also offering reviews and this kind of thing. And what they've actually done is they deprecated the free Shopify reviews, app. So that's just so it's the kind of the opposite. Yeah. Yeah. Userland was doing it better.

Trudy just got so excited. I think I should do a sample somewhere.

Yeah. So, like, Shopify has actually had meta meta fields for, like, as long as I've been working on it, but you literally it was very difficult. It wasn't like user friendly. Like, the merchants couldn't really access it. And then they came out with new meta fields that merchants can access, and they're a lot easier to use. And then they came out with meta objects.

And so they're really I mean, in some instances, it's it is and historically saved on, like, the the app servers.

But now Shopify is encouraging and made it easier to, store it in meta objects, which is like just kind of flexible data that you could use on anywhere in the store. So that's what they're pushing for, which I think is a good idea because then, again, that'll make apps faster because you're, like, living off of Shopify's, like, content delivery service instead of, like, you know, trying to serve it yourself.

Yeah. But, yeah, I'm obsessed with meta objects. It's my favorite thing.

All like, for design packs, all like, with the UI, it's like all of the files are stored on Shopify's

file system. We're not storing anything. Yeah. And then in terms of integrating the metadata and meta objects, because, DesignPAX is built in a way, again, as if, like, a custom developer just came in and built it for your theme.

All of the that happens directly in the theme editor. So in the same way that you could add in, connect a meta field

with a regular section, you can do that with design packs as well. It's and to give just, like, sort of a concrete example of, like, why you might do it, like, you could make, like, FAQs per product and then store each one as a meta object, and then you just connect the meta object so it you don't have to create a different template. You can have different information on the product page without having to, like, create a separate template for each product.

Yeah. Okay. And that would just show up as, like for the user, it would just show up as a just a general text interface that, you know, somebody could edit if they needed to update that stuff. They're not having to get into code.

Yeah. Exactly. It's it's kind of akin to for any WordPress people, like advanced custom fields. Yeah. That's what I was gonna ask. Yeah.

One thing probably my biggest complaint is that they changed Node APIs on a 6 month basis.

Mostly for developers, like, not for the front end stuff because they they it's like you could see that their, goal is to keep the front ends, like, the merchant store stable. But for the they roll out changes to the APIs a Scott, and we have to keep up with it. And, like, last summer, they decided to change their authentication from OmniAuth to OAuth and gave us 3 weeks to completely update our

And and so when, your app or the Shopify apps ESLint, in, like, a versioned way, You have to stay up to date with the modern version, or do you have to support all versions going back to a certain time? JS it even possible to host a Shopify app with an older version of Shopify?

No. So well, I mean, at the beginning, they didn't even have versions of some of the APIs, but now they've versioned it. Like, when the first like, I used to build Shopify apps for clients prior to, like, just private ones, and they didn't. I don't think they had versioning for their APIs for the app.

Now they do. But they will deprecate them probably within a year and a year and a half. So you can, like there's a few versions that you can use at any given time, but you you have to keep up pretty quickly.

Wow. Yeah. It it makes sense. Like, it's it's a hosted service. You know? And Yeah. Right now. When they change. Yeah. So you have so that's the thing. You're but it's good because it forces you to keep up with modern changes, but it's bad because you're always,

like, having to update things all the time. Yeah. And it's good it's good for competition too because it's not wildly difficult to sort of spin up an app and get it in the App Store, but it's more of the maintenance and, you know, making sure that you can handle the technical debt and that kinda thing comes along with it.

Yeah. Support. Oh, that's a whole other.

I will say the the vast majority of the the people that we deal with are actually lovely for the most part. But it is very interesting to see some of the questions that come up because they sometimes aren't related to even our app. It's more just the Shopify user experience or different things like that. Yeah. Overall, it's actually really great feedback too. Like, if everyone that has, like, a SaaS based business or something like that, you're always looking to get feedback and improve. And so some of the suggestions that people have like, oh, I'd love a section that does this or, oh, do you have a setting for this? It's really nice because we're so small. We can just be like, yeah. Sure. Sure. Yeah. We can do that.

Yeah. And I think at the beginning, we sort of had this idea that people would want really, like, design opinionated sections. But then it turned out that people really wanted very generic sections with lots of customization options.

So there are certain things that we can pull in, just based on you know, we're not overriding all of the, like, header classes, for example. So we'll be able to, like, inherit those from the theme. There are other things like color schemes, which we haven't actually, like, gone down that path too much.

But what we try to do is just give specific, like, a color here, a color there.

And then we're also, our sections have you can put in your own custom CSS snippets for, large screen sizes and small screen sizes. And so that gives us a lot of power on support because someone will be like, oh, can I do this then to this? And we've built them in such a way that it makes it really easy to be like, yeah. No problem. Like, we're consistent with all of our class names and that kind of thing across all the sections.

So it makes it a lot quicker for that. Yeah. That's actually my favorite support. If somebody's like, can you make this section look a bit different? I'm like, let me see if I can.

It's really nice. It used to be that you actually had to create a staff account for their store, but Shopify rolled up this thing called collaborator access.

Yeah.

So as and as long as you have they have the app installed, you don't need to send, like, a code or anything like that. You literally there's

We find that a lot of people really like,

video.

So things like, so there's this term UGC in ecommerce, user generated content. Yeah. So anything that provides social proof, people really like adding that to their ecommerce store. So video testimonials or, like, how to videos.

So those tend to be quite popular.

Slideshows, carousels, you know, the classes. So our our top 3 are video or banner with a video background, image with text simple, and value icons.

I yeah. It's like 3 icons in a row with, like, some text below it, which I get.

Yeah.

Oh. It's like the UVP, unique value proposition. Yeah. Yeah. You have those on my little tutorials. I've used those. Yeah. Yeah. Every that's every website in the world has those. That's awesome. Well, it makes sense that that's most popular. And that's the thing that confused us because we're like, isn't this part of most themes? Like, it is. It's just ours is, like, more customizable in a lot of ways.

Yeah.

But, yeah, that's what confused us. We were like, oh, people want something super unique or different, but people actually just want the basics.

So we do minify things, but actually doing a technique with liquid, interestingly enough.

We don't use any type of, like, build tool or compilers or anything like that. We're we're kinda like Wes, like, bespoke artists in code Yeah. Kind of thing. Straight up. Yeah. Because at like, I I I've worked with a lot of build tools.

And to me, what we're what we're doing, it it doesn't really make that much sense.

Especially, they're actually gonna be releasing nested blocks soon warp, previously all of the blocks that you had had to be in this giant sort of, like, statement. And now those are gonna be able to be individual liquid files, so there's more everything's basically becoming componentized, which we're so happy about.

100 and 70.

You can't even think of a 170 different blog. No. That's

We've got ideas galore.

Both. And working with clients as well.

Yeah.

When we started, we had 10. And we're like, we're gonna run out of ideas really quickly, and that is the thing that we have not done.

We have a whole I and there's even, like, on our GitHub, we've got, like, just different, like, issues and stuff. It's like, oh, all these different ideas and yeah.

I a little bit of a digital nomad. But, pre pandemic, I was going for 3 months. Now I'm just usually going for a month. Oh, okay. Oh, wow. And you're you're in Colombia right now? Yep. Medellin, Colombia. Yeah. Where are you at, like, a co working space? I am. I'm at the Sanity, which is a co working space that they have around Latin America. I've also worked out of the Mexico City one too.

sometimes don't line up. But it's pretty cool that you can travel around the world and still work. Yep. My biggest requirement is just, like, good Internet. But at the coffee shops here, the Internet's, like, 320 megabits. So I'm, like, that's not you Node? That's awesome.

I usually talk to people, like, other digital nomads who know, because there's usually digital nomad communities.

So I find out that way.

Yeah. Go back and and listen if you haven't and you're out there and you're interested in this kind of stuff. We did an episode on digital nomading with Eric Sartorius.

And he also he lived in Medellin. He lived in, Japan. He's lived everywhere doing this stuff, and he recently

moved his permanent base to Portugal. I mean, the guy's from Lansing, Michigan, and now he lives in Portugal full time. So They have a digital nomad visa. There's a lot more places that are having digital nomad visas that give you, like, 6 months to a year. Really? Mhmm. That's amazing. I didn't know that was a thing.

Yeah. He he's doing that, like, as a it's some kind of digital nomad to citizenship thing. I have no idea what it is, but it's a it's like a couple Yarn, and then he becomes a citizen of Portugal. So Wow. That's awesome. I haven't been there, but I've heard really good things.

So one of the things that we found was that, great. We've got all these sections. Cool. You can use them on different pages. But, you can't there's, like, the main product area. Like, think about you're on a product page. Right? And then you've got your buy buttons, and then there's also usually some information below that, like maybe, expander or a video or something.

Well sections can't go in there so we launched, an app called Product Blocks that are specifically sections that go into, that area.

Well, it's just so so Shopify, sort of, like, for app developers offer this new type of thing called, like, an app block, which is confusing.

But they made a way that you can, like, set code that now just lives in Shopify, and the themes were all updated to allow this. So it's just a specific technology that Shopify created to allow that that's different from how sections work.

And one of the main ones that I was excited about is because I've done this for every single one of my clients is, like, what we call, like, fake variants or connected products. Because a lot of times, like, if you have, like, t shirts, like, you'll want to show all the colors, say, on a on, like, your collection.

Yeah. But you want them to look like they're 1 product. So basically, you could just add, like, little color swatches or, like, little product images that just Yarn actually links to other products, but they look like variants.

Yeah. Yeah. So that's, like, one of the, like, app blocks. So we have about I we have at least 5 app blocks right now. The the thing is Wes have so many ideas, but they have a limitation of first of all, what, 25 app blocks Yep. In total. Mhmm. Per app. But they also have a limitation of 100 kilobytes of liquid.

Oh, and that's not a lot, is it? A 100 k b. That's how many characters is that? And and that's total too for, like, all those 25 possible files. Yeah. For all Wes so that means total. Yeah. So you can have 4 kilobytes of liquid per block if you're around there, somewhat something like that.

Well, if you want it. Yeah.

We we had them all built out. We're like, this is great. Amazing. And then we ran into this. So we had to rebuild everything with web components, and so we're actually pulling everything in with JavaScript instead because there's not the same limitation, that there is on Liquid.

I really love web components. I really like them too. Oh, wow. Cool. We were, like, contemplating. We're like, should we rebuild all of our design packs as web components? But we're like, that's not really practical.

We will. Dural eyes.

Yeah. Yeah. Right. Yeah.

Yeah. You can kinda do a combo. There's some themes that use web components in some interesting ways. So I think we Wes would have most of the markup actually.

Yeah. Not like, but then extra things, like because Wes, go into, like, the full how we're actually bringing in JavaScript into the sections, but it would it would be a natural fit to move over to web components, I think. Yeah. That's one thing you don't think about with web components sometimes is that that markup can be just there in the DOM even if it's not

hydrated with JavaScript or doing anything.

Yeah. But I yeah. After rebuilding the web components, I am a big fan of web components.

Lay it on us. As a person with this hair and who likes to travel a lot, my sick pick is, the, like, like, bars of shampoo and conditioner.

Well, I okay. So I've I am traveling with another girl with curly hair, so she's been letting me use her because I didn't know. So I don't know what brand it is. But one of our actual, users, like, one of the users who's used this design packs JS called the Black Travel Bos, and they sell that for, like, traveling and, you know, to keep the hair looking good.

Yeah. Exactly.

Oh, that's nice. Yeah. Oh, liquid.

But, but I thought with my the amount of hair that I had, I was skeptical that I would be able to use it. Like, I thought maybe, you know, Wes hair would work with the bar, but I didn't think that it would be that easy to wash my hair with a bar of shampoo, but it it works pretty well.

Wow.

And,

I have recently so I listen to a lot of podcasts, and I, although not many dev related ones, interestingly. I like to see Yeah. Yeah.

But the the one that I have been listening to recently, well, it's been around for a long time. I've just never heard of it before. It's called Ologies.

It's, basically, it's just different like, literally what it sounds like. So Oh, cool. Yeah. All it's a very science based, but the host is good.

And they have kind of, like, fun, like, little editing things. I don't know. It's good. It's very entertaining. So it just describes the different ologies.

like, experts and stuff. Like, I listen to 1 on, like, copy borrows. It's really good.

Yeah. Wes, you know whose favorite podcast this is? This is Caitlin, from Syntax. It's her favorite podcast. She shared this with me a while ago. Yeah.

Mathemetology.

Gyrology?

Gyrology.

That's wild. A disgusting

Designdashpacks.com.

Love it. Oh, also, we made a coupon code.

Oh, awesome. Yeah. Syntax Wes for 25% off the monthly TypeScript.

Sick. And is that all uppercase, or is that is that does that matter? Case. All uppercase.

Peace.

Thank you.