That's my JAMstack
Bryan Robinson
Podcast
Episodes
Listen, download, subscribe
Andy Bell on 11ty, static sites, progressive enhancement and more
Quick show notes Our Guest: Andy Bell His current big project: Every Layout His JAMstack Jam: 11ty His musical Jam: Lyre le Temps Transcript Bryan Robinson 0:00 Today we have an awesome guest. He's a web designer and developer. You may know him from his CSS newsletter, Piccalilli, his awesome 11ty the starter theme Hylia, his friendly browser checker, mybrowser. FYI, or just his amazing hot takes on Twitter. Let's go ahead and welcome to the show Andy Bell. Andy, how's it going today? Hey, how you doing? Andy Bell 0:17 Okay. Thanks for having me. I'm pretty good. Bryan Robinson 0:21 So that was my introduction of you. But how would you describe yourself? Are you a designer or developer in your own mind, Andy Bell 0:26 I'll say I'm a hybrid sort of buff. So I tend to call myself a web designer these days because even though it's pretty old school term, it sort of describes what I do perfectly. I tend to see projects start finished. So yeah, web designer, or front end developer is tends to do most of the time these days. Bryan Robinson 0:46 Cool. So So what do you actually do for work and for fun? Andy Bell 0:58 And then other guys a chance to have fun because I've got two young kids. Yeah, fund is whatever, whatever includes those two, but yeah, I remember fun from before that. Bryan Robinson 1:11 I got young the same way I got I got three and a half year old, there's not a lot of fun. Andy Bell 1:15 So, I feel for you there. Bryan Robinson 1:19 Alright, so so what was kind of your entry point into this whole like jam stack philosophy and skill and or static sites or wherever you like to call it? Andy Bell 1:27 So, I started with stack size and with Jekyll, a few years ago, I got into Jekyll. I picked up as a solution for really rough agency project. That was, it was super fluid, the brief was so thin you could smoke it. And I just knew that it was going to be a nightmare from from the start. So I suggested, what do we use Jekyll to build it, because if, if I'm going to things change, it'll be a much easier process so that they're going to be really into it. And obviously it isn't it for our personal blog, and all that but is when 11ty came around, where I really started getting into static site stuff properly, really heavily into it, because it's just such a flexible system. And ever since then, I literally use it for everything now. And so yeah, it's brilliant. Love it. Bryan Robinson 2:25 So as a professional Freelancer using it on like your client projects and stuff like that. Andy Bell 2:30 If you're to list of things that 11tycurrently does for me is if prototyping, visual design. And its power in a book is power in the newsletter. And its power in normal client websites, my website, literally everything is now rolling through 11ty in some way awesome form at the moment. Bryan Robinson 2:56 So So would it be safe to say that that kind of 11ty is kind of your jam in the jam stack? Andy Bell 3:03 Oh, absolutely. Yeah. big thick wad of 11ty jam. Bryan Robinson 3:10 There is there any other technologies or products that you're utilizing in the jam stack right now? Andy Bell 3:14 Yeah, so do a lot of stuff with with Node when I do anything that's got like backends. So, I tend to like So this project, called every layer that I work on with Heydon Pickering. Tha t's all built with 11ty but we use Heroku and Node to do the sort of clever stuff. Which is all going to be well by the time this goes out it actually will be live. And so I tend to use that I but I am a slowly get into the survivalist stuff as well in the Cloud Functions, because Netlify made that really easy. So yeah, but really, I tend to stick around in static site world. Yeah, that's, that's where I hang out. Bryan Robinson 3:56 Cool. So what what kind of what actually made you fall in love with jam stack? Like you talked about, you know, Jekyll being your entry point, obviously. Now it's 11ty that's making it much more, I guess, probably fun to work with. Yeah. But what kind of where did you fall in love with some of the ideas? Andy Bell 4:11 I think it was. It's the empowerment thing. So I'm pretty weak with back end technology. It took me a long time to appreciate that. And you can achieve a lot as a as a sort of designer with the JAMstack. And a lot of power is given to you. And you can do a lot for nothing as well. And that's one thing I really appreciate about is that someone can get an 11ty site or whatever they want to use, and deploy it for free, on Netlify and then they own their own content. So that stuff's really appealing. And then I think is going to be really key in the success of JAMstack as well. Bryan Robinson 4:54 I'm kind of curious, cuz I'm a hybrid to like, I'm a designer developer, and I hate the backend. I hate dealing with servers and all that. But I've been doing HTML, CSS and JavaScript for like a decade. How would you talk to a designer, that's maybe getting into HTML and CSS about static sites and about about that empowerment that you were saying? Andy Bell 5:15 Interesting question. And so soon as I just getting into HTML and CSS, I probably wouldn't, I wouldn't introduce them to this JAMstack, because I think it could create some confusion really early, especially understanding because I think when you learn in HTML it's useful to be able to see the document as a as a whole software experience that uncomfortable about the JavaScript frameworks, as well as that there's a there's a higher level of abstraction, I think, causes a lot of confusion for beginners. So but once they're a bit more comfortable and understood HTML, I probably introduce them to 11ty, and then Nunjucks. And so this is now you cannot take this piece of code that you've written in a partial and then you know, introduce it like that, piece by piece. So keeping it as simple as possible. And that's one thing that's really good about, especially 11ty is that it lets you go from zero to naught point one, you know that you don't have to go all in and fully commit to a light Gatsby or something, you can gradually implement it on an existing setup. So you can actually teach it by doing things slowly, but surely, and people can understand what his role is and where it lives. In the stack. Bryan Robinson 6:30 You mentioned, you mentioned Gatsby, I actually just saw a presentation on Gatsby and just it kind of solidified my personal opinions. It looks you know, super powerful, and all that. And I played with it. But the complete abstraction of everything that's going on, I looked at it and said, I've been doing this a long time. My brain doesn't work like that. I can't imagine anyone else getting into it. Yeah. Andy Bell 6:51 No, no, I did. I did a client project with it earlier in the year and just found myself yearning back for 11ty, this is a bit too much. pretty difficult to do. What web web development, this this doesn't really have a role in my stack, especially a specialist. So yeah, stick stick with it. I think while it gives you I don't think you really need it to be honest. But you know, that's just my opinion. Suppose. Bryan Robinson 7:21 Sure. And then I guess beyond that, you know, talking and talking about, you know, newbies or you know, people who, who are maybe making that that advancement from be able to do that static HTML, CSS, maybe a little JavaScript into more, you know, full stack and putting air quotes, no one can hear the radio, it's been more kind of full stack development. Would you still talk to them about more traditional stuff? Or are you all in static sites JAMstack ideology, Andy Bell 7:55 Progressive enhancement is my is my thing. So whatever, wherever you use, as long as what gets delivered to the front end is HTML, functional HTML by default, so if nothing else arrives down the pipe, you've still got usable website that's acceptable and accessible, then it's all good. And you could, you could use whatever you want to do, like you can use PHP can use Node, I don't really care as long as what arrives, if, if the only thing that rises the HTML, it works, and you can use it, and then everything else on top of that is a bonus so CSS great that works now it looks good, you know, and then JavaScript, it's definitely a sort of an additional sprinkling of functionality rather than the whole thing. You know. That's how I always operate regardless of what project is really, even when I've built like React projects is being SSR (Server Side Rendered) to make sure that if the client fails, which it will, there's not, there's not a sort of might about it, there's, there's a will about it, and then make sure they still work. So that all this stuff, so yeah, definitely. Bryan Robinson 9:06 Do you think that the static sites lend themselves stronger to progressive enhancement? Or is it? Is it just a matter of methodology? Andy Bell 9:15 And yeah, I think, I think they might have made that kind of best point a lot easier. And I think that's, that's probably one thing I really like about them and being able to generate what I want -- which is that HTML output -- it seems to be really easy, I think it's almost easier to generate Well, for me, especially to do that with a static site generator, rather than WordPress style, which, you know, it's what I cut my teeth with WordPress, I think even now, if I was to take on the, air quotes, simple project, before I might sling out a WordPress theme, whereas now sling out on the 11ty site, because I think that's now the quickest way to do it for me. Yeah, Bryan Robinson 10:00 That's actually really, really interesting. So I used to work in an agency for about six years, and we had our own custom content management system and all sorts of stuff. But anytime a client couldn't use that, we were just sling a WordPress theme out there. So you think that that potentially, we're getting to the
That's my JAMstack RSS Feed
