Skill Piper

Send feedback

S2E11 - Drew Clements on performance, simplicity, and getting to the fun parts

S2E11 - Drew Clements on performance, simplicity, and getting to the fun parts

That's my JAMstack 6 January 2021

Episode Description

Quick show notes

  • Our Guest: Drew Clements
  • What he'd like for you to see: Protege.dev - A job board for Junior devs
  • His JAMstack Jams: The simplicity of the Jamstack that allows you to "get to the fun part"
  • His Musical Jams: Fall Out Boy, Pop Punk from the late 90s, early aughts (you know, like the Tony Hawk Pro Skater 1 soundtrack!)

Transcript

Bryan Robinson 0:14

Hello, everyone, welcome to another episode of That's My Jamstack, the podcast where we ask the time tested question, what's your jam and the jam stack? I'm your host, Bryan Robinson. And this week, we have Drew Clements, a front end developer for Foster Commerce.

Bryan Robinson 0:39

All right, Drew. Well, thanks for being on the show with us today.

Drew Clements 0:42

Thank you for having me.

Bryan Robinson 0:44

Awesome. So tell us a little bit about yourself. What do you do for work? What do you do for fun, that sort of thing?

Drew Clements 0:48

Well, again, my name is Drew Clements. I'm a front end developer with Foster Commerce. We use view a lot on the front end. For fun. I like to play video games. I play guitar. I play paintball. Although I haven't played in a year or two since we've had our first kid.

Bryan Robinson 1:06

Yeah, I have I have many hobbies that I have that I have not done nearly as much in the past five years since I had since I had mine. So I totally get that. Yeah. So So what sorts of video games do you play video games?

Drew Clements 1:18

I mostly play a bunch of first person shooters. I'm really big on the latest Call of Duty right now. PUBG, all those fun things.

Bryan Robinson 1:26

And then you say you're at foster commerce. So I assume that's, that's an e commerce agency or developer. What do you actually do there?

Drew Clements 1:35

So we build e commerce solutions for a multitude of clients. Cool. And you say you say mostly in Vue nowadays. Yeah, we for the front end, we use view. And in the last few projects, we've started roping in graph QL. with it.

Bryan Robinson 1:51

Okay, very cool. So So obviously, we're using some some semi Jamstack things, at least when it comes to Vue and GraphQL. But what would you say is kind of your entry point into the world of Jamstack? Where did you kind of get into it?

Drew Clements 2:04

The entry point for me was when I wanted to probably like a bunch of other developers, I wanted to build myself a blog, because I told myself, if I built it, I would actually write.

Drew Clements 2:14

So when I was looking at, you know, different options for how to do that, I came across things like Gatsby in similar frameworks, I didn't really know much about it, I really just kind of dove in headfirst.

Bryan Robinson 2:27

Nice. And so so out of curiosity, you you did the technology, you learn the technology to do the thing, right to write the blog. Now I've been through three blogs before I successfully actually started writing, were you able to actually overcome that hurdle and write on the blog.

Drew Clements 2:41

I wrote two articles on the blog. That was about as far as I've made it here was here recently, I've been using the dev.to for some of my writing, but I'm actually in the process of rebuilding my blog, I'm not redesigning it. I've already gone down that rabbit hole. But I'm rebuilding it. So I'm gonna be able to use the dev.to platform, kind of as the CMS for my Jamstack Bog

Bryan Robinson 3:09

Very nicely, because they they at least there's an RSS feed. And there's probably some other stuff that you can get out of that right.

Drew Clements 3:14

Oh, yeah.

Bryan Robinson 3:15

Very cool. So so what what kind of technology brought you into the Jamstack? So you said you started researching blog platforms? I think you mentioned Gatsby. But you're also in Vue land. So what are you using nowadays? In terms of that? Or what technologies are you researching? Right now?

Drew Clements 3:30

I'm researching ways I can make Nuxt as Jamstack as possible. I really, I really liked the view framework. And Nuxt, I guess, I guess that's server side view. But there, there are some stuff, you can put some things you can do to it. To make it a little more Jamstack. Ease, I'm really trying to look into two ways I can do that. That's part of the research for rebuilding my blog site. It's how I can implement some of those things.

Bryan Robinson 3:56

Get it get a static as possible. Like it's as quick as possible, I think. Yeah, I think they're doing a lot of stuff right now around around static routes and stuff like that. So that should be that should be a good investment there.

Drew Clements 4:06

I think. Yeah, it's gonna be a lot of fun when I'm still in the kind of the reading and looking around phase I'm, I'm ready to jump into it that

Bryan Robinson 4:14

nice. So. So that's kind of personally how you're using the Jamstack. Are you bringing any of that back into your work in e commerce? Or are you primarily working on just a front end with kind of some stationary back ends in place?

Drew Clements 4:27

I haven't really had the chance to bring that into any of the professional products that we're working on. A lot of the ones they're just they're larger complex builds that I think we actually within let me backtrack that a little bit within the last week. Within the last week, we've discovered that one of the sites we're building would probably actually benefit from being a Jamstack site. But at this point that the deadlines to close for us

Bryan Robinson 4:54

to make that pivot. Yeah, my favorite thing, from what I worked at agencies is discovering a new technology. you're discovering a new a new way of doing something, and really wanting to use it on a client project and then realizing No, we have like, you know, three more weeks left in this project. Okay, quite do that now. So out of curiosity, what you know, without specifics what what kind of things with the Jamstack bring to that project? Is it about like performance, security, flexibility.

Drew Clements 5:21

In this case, it would be performance, it's the, there's not a lot of interactivity on the site, there's just a lot of content being generated from a CMS. So from, from a user's perspective, if we could just, you know, grab all that at build time, or whatever that process ends up being, and just generate the static assets of it and hand it to them rather than rather than, you know, there being the front end spa process of it. It would just, it would just give the users a whole lot better experience.

Bryan Robinson 5:51

Yeah. And I feel I feel like probably one of the one of the biggest sectors in the web industry that could do well to adopt Jamstack. is e commerce. I feel like some of the tooling isn't quite there yet. Like there are Jamstack type tools for e commerce, but they all feel like they lag behind the the bigger players.

Drew Clements 6:10

Yeah, that's, that's one of the things we've been seeing is that it'll be like a nine out of 10 thing like, it has nine of the things we really would like to have. But the 10th one that it's missing, is the one that we absolutely need. Yeah.

Bryan Robinson 6:24

I also feel that not just from a Jamstack perspective, but oftentimes just just doing client work like that one thing that we have to have can't use x, y or z framework.

Drew Clements 6:33

Yeah. Cool. So

Bryan Robinson 6:34

what would you say is your as your current kind of jam in the Jamstack. So obviously, using view or and playing with Nuxt. But what what kind of service or product or philosophy is really keeping you engaged in the way the Jamstack works?

Drew Clements 6:49

For me, I would have to say, the the simplicity, or I guess, relative simplicity of the Jamstack philosophy. I remember when I was first starting out, and I wanted to build my own blog. And like, kind of when I was just starting to get like a confident grasp on the front end. I was like, man, I still have to learn all of this back end technologies to actually build something. But then, you know, when I found Gatsby, and I think I looked at Jekyll and Hugo, a couple of other things like that, you know, that just kind of discovered that I could build stuff without having to become a full fledged full stack developer. And maybe part of that was even true before the Jamstack came about. But the Jamstack was, what kind of opened my eyes to that.

Bryan Robinson 7:35

Yeah. And there's so many services out there that make it so that you like, even if you just had a static site generator, like, like you mentioned, with Hugo, with Jekyll, you can produce a really nice site. But then if you want to add additional functionality, there's just, there's so many ways to do it without having to, it's gonna sound bad, but without having to learn that like extra piece of technology that the back end requires you want a database, you can just push schema less data to something like fauna DB or something like that. You can just push it out there and have have a cool back end with no, no real effort.

Drew Clements 8:04

Yeah. And I was never against learning the backend technologies. I was just so anxious to get something out there that I wanted to do and as quick as possible in it. At that point, it was like, it was something else I'd have to do before I could do the fun part. And I was just really anxious to get to the fun part.

Bryan Robinson 8:20

Yeah, definitely. And I mean, myself, being a front end developer in general, I remember, had a portfolio site. This was years and years ago, now that I happen to know a little bit about Python and Django. And so I wrote it in Django, which is, you know, a Python framework. And it works nicely. And it was a learning experience. And then a year later, I needed to update it, I realized that whatever I'd done a year before, had made it so just wasn't going to work. If I push the code live. I was like, oh, okay, I, I can't do anything without breaking both my CMS and breaking my live site. Oh, there's this static thing. I can just like, I think like, immediately after that I rewrote my portfolio in HTML and CSS. Like, I didn't even have a static site generator. It's like, I can't have this happen again. Yeah. But yeah. And then kind of progressing into these other tools that allow that just allow front end developers to flourish? I think, hmm.

Drew Clements 9:13

Yeah, I think the the first iteration of my, of my blog was it was statically generated. And then the the content was just static within it. It wasn't coming from CMS. But then after, you know, I've learned a little bit in that first part of the process. So then when I got all developers do when I rebuilt it again, the second time I integrated the, I think I'm using the Netlify CMS into it. And then you know, part three, that's going to be coming out sometime, probably not before the end of the year is going to have the dev.to integration into it. So it's kind of has been like a building process the entire time. Always add, add one more thing to it, like as I go,

Bryan Robinson 9:56

I think that's that's such a great way of getting into things like listening That and realizing that was kind of my process into the Jamstack to where I was like, Alright, I need a static static content, I can do that, Okay, I'm gonna use a static site generator and my content will be markdown. No problem, okay. Netlify, CMS allows me to have a CMS that deals with my markdown beautiful, oh, there are these API based things that I can do even better. And so like, I feel like you just you pick up a new piece of technology every step along the way, until you get something that really is almost like, you could give that to a client and they'd be perfectly happy with it.

Drew Clements 10:30

Yeah, absolutely. That was, the only reason I'm considering going to the dev to thing is just so I can, you know, write once publish in both. Right now, if I want to write it. If I want it to be on my dev account and my blog, I have to either copy and paste or write it twice. So this is, I guess, kind of a, an automation feature.

Bryan Robinson 10:55

Yeah. Well, and in fact, like they even have some automation, but it doesn't fully work. So like my RSS feed goes into dev dot two. But I still have to touch every every article, I still have to go back and like, Oh, this syntax highlighting didn't work, or, oh, this image is pulling my version of the image, I need to upload it to dev dot two for my own bandwidth. And yeah, if I wrote it in dev dot two, and then brought it to my site that would that would automate most of the problems away I think.

Drew Clements 11:22

Yeah, that's, that's the part I'm really excited to get to get into.

Bryan Robinson 11:25

authoring in one place is definitely the way to go.

Drew Clements 11:28

Yeah.

Bryan Robinson 11:29

Cool. So let's talk a little bit about music right now. So what is your actual real life jam? What's your favorite song or musician? What's in your earphones?

Drew Clements 11:36

It rotates fairly often. Like I have a huge Spotify playlist that keeps me pretty satiated throughout the day. And that that covers anything from like, you know, Fall Out Boy pop punk to like some really heavy metal stuff. But you're here lately, I've been on like a late 90s, early aughts, skate punk kick. So I've been listening to a lot a lot of Goldfinger the mighty mighty bosstones XSR 71. Kind of like the Tony Hawk Pro Skater one soundtrack you chalk it up to that

Bryan Robinson 12:08

that is that is pretty much the the perfect analogy for my my my late teens was Tony on the Tony Hawk video game soundtrack because that was that was very energizing. So listen to that on Spotify and then whatever, like the Spotify automation AI brings your way.

Drew Clements 12:26

Yeah, pretty much do you

Bryan Robinson 12:28

find Do you find that certain types of music because because you just listed out some pretty varied styles there from like, you know, heavy metal to you know, ska and punk from the from the late 90s. Do you find that some of the music does better at various things for you? Like do you do you focus better with like, hardcore metal? Or do you focus better with with ska or punk?

Drew Clements 12:51

I think it's kind of a situational thing. So like I noticed in the morning, I'll usually start out with kind of more of the in the punk mode or sometimes out there on like some lo fi hip hop when I'm getting started in the morning. Then like if I'm like, if I'm like really focused and in the zone, like out there on some metal and it just, you know, blinders on heads down.

Bryan Robinson 13:13

And one thing I'll give I'll give you a warning about actually, so I just discovered this I use I use amazon music for mine, but I share it with you know, with my entire family and when you go to their like recommendations and all of a sudden it goes from from something like some video game music or some some upbeat you know, hip hop and then all sudden you're listening to Daniel Tiger and you don't know how that happened happened. It happens when you have when you have children, that happens pretty easily.

Drew Clements 13:40

Yeah, that that happens to me, I have had that one playlist that I usually go to. But they Spotify does has kind of like a recommended listening based off of your, you know, previous history. So I have gotten hit with some Rain rain go away.

Bryan Robinson 13:56

Every now and then. Perfect. Yep. Yeah. So Well, is there anything that you would like to kind of promote that you're doing that you want to get out to the Jamstack community? Anything that is that is coming coming our way from you?

Drew Clements 14:08

Yeah, so it's it's not Jamstack yet, but it's it's coming down the pipe. Mima co founder. We've been building a site called protege dev since March of this year. And really, it's a it's a remote job board for junior developers. It's right now right now. It's just a create react app. But in the future, we're going to be moving to either either next or Gatsby we haven't really decided yet. It's a it's a remote job board. But we are ideas for it to be more than just a job board. We're not we're not sure how we're going to do this yet. But we want it to be a platform that also champions the candidates we're trying to get hired. So like I said, we're not sure if that's going to be like content, or maybe a podcast or something right. Right now it's open source so people can contribute to it. And our idea behind that was that if a company comes here to post a listing, they can check out the contributors page and see, oh, I can hire this person, they've actually helped build this platform I'm posting the job on. So we still have some some ideas of how to shake that out. But

Bryan Robinson 15:17

one of the hardest things for juniors to kind of get going is that kind of idea that they've got a portfolio outside of like, test projects. So like, Oh, I helped implement or fix this bug on project dev like that's, that's a really cool way of helping them get get into things like Oh, and by the way, that means that I know how to use GitHub. And oh, by the way, it means I know these technologies. I think that's a really cool way of resume building for those juniors as well.

Drew Clements 15:43

Yeah. And we have, so we have react on the front end, tailwind for styling, and then it's Firebase on the back end. So and I think, I think last I checked, we had not counting me, we had 22 contributors, maybe? Well, you know, some of those are accessibility fixes where they're, you know, just adjusting some contrast ratios. But then there was one where a contributor came in and built some GitHub actions out for us. That kind of automates part of our processes for pull requests and things like that. So anyone can really jump in. And it's really kind of free rein anyone could jump in and touch whatever part of the project they wanted to.

Bryan Robinson 16:22

So yeah, that's I think that's a really worthwhile project, I think that there needs to be, especially in the remote world, like more ways for junior devs to find to find work, because back in the day, it was like, you could sit next to a to a mid or senior level Dev and learn lots of things that you needed to. But a company that is remote, needs to have a lot of things in place to make sure that like, boosting up their juniors is a priority. This whole project started out because at the beginning of COVID,

Drew Clements 16:51

I lost both of my jobs. And I had the protege out of domain. I knew the situation I was in, I would look down the job boards and see senior senior senior tech lead CTO, all these jobs that I didn't feel I was qualified to apply for. So I had a whole lot a whole lot of newfound time. So I just started throwing it together and pretty pretty early on my co founder Andy he found he found the project through Twitter. And I think I think it was like a Wednesday he said, Hey, I'd like to help contribute. And then by like Saturday, he had built like the entire form process for hosting a job to at first it was originally just going to be like a I was hoping it would turn into something but at the same time, if it didn't, it was still something I put I could put on my portfolio. Yeah, but then he came in like full sin. So I was like, Alright, here we go. The thing.

Bryan Robinson 17:43

Gonna, it's gonna completely spin up at that point. Yeah, very cool. Yeah, there's definitely a lot of people in that situation too. Because, you know, they say, you know, it's fine to like, apply for jobs that are like a little bit beyond your reach. But if you're a junior, and all you see are seniors and yeah, like, like, Director level CTO level. That's a couple a couple steps beyond what you're willing to maybe put yourself out there for?

Drew Clements 18:05

Yeah.

Bryan Robinson 18:06

All right. Well, very cool. Thank you so much for being on the podcast with us today. And I hope you keep doing amazing things both in e commerce land but also with, with Project Dev. That sounds like a really cool project.

Drew Clements 18:17

Awesome. Thank you for having me.

Bryan Robinson 18:20

Thanks again to drew and thanks to everyone out there listening to each new episode. If you enjoyed the podcast, be sure to leave a review or rating in your podcast app of choice. Until next time, keep doing amazing things on the web and keep things jammy

Transcribed by https://otter.ai

Intro/outtro music by bensound.com

Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

...see more

More Episodes


S3E5 - Facundo Giuliani on end-user experiences, NextJS, and Storyblok

S3E5 - Facundo Giuliani on end-user experiences, NextJS, and Storyblok

Quick show notes Our Guest: Facundo Giuliani (Twitter) What he'd like for you to see: His musical Jam: The Meters Transcript Bryan Robinson 0:15 Welcome back to yet another episode of That's My Jamstack, the podcast where we ask the ever important question, what is your jam in the Jamstack? I'm your host, Bryan Robinson. And this week we had the amazing Facundo Giuliani. Facundo do is a developer relations engineer at story block, and an avid presenter and author about all things Jamstack. Bryan Robinson 0:46 All right, Facundo. Well, thank you so much for joining us on the show today. Facundo Giuliani 0:49 Thank you. Thank you very much for the invitation and the opportunity. Awesome. So Bryan Robinson 0:53 tell us a little bit about yourself. What do you do for work? And what do you do for fun? Facundo Giuliani 0:57 Cool. So Well, I started working as a developer when I was 18. While I was studying at college, because I finished high school on on a school that had a career that was like programming oriented, let's say so I, I learned how to program during the high school, I started to work with all programming languages that people don't know what they are about, like Visual Basic six, or those things that are like, I mean, I talk to people that this 20 years old, and they look at me, like what are you talking about? Right. Bryan Robinson 1:38 But luckily, I at least dabbled in those super early on. So I'm with you. That's fine. Facundo Giuliani 1:43 Okay, okay. So, um, yeah, I mean, I started working with Visual Basic seats. After that, while I was studying, I was also working as a developer, it was like, almost 1414 years, probably that I worked as a developer. And during the last couple of years, after working on on different companies on different positions, but all of them mainly related to the development, like, full stack back and, and etc. I started to, to be more involved with the community started to generate content to share starting to talk to other people and and meet other people. And I really enjoyed doing doing that. I did that during my free time. During these last couple of years, like after work, I started to generate content, engage with the community, like being involved in a Ambassadors Program in in different organizations and companies. And this opening a new door for me, because I started to learn about developer relations, developer advocacy, developer experience, some terms that probably I've read in the past, but I didn't know what they were about. And, and I started to get interested on that, like I, I mean, I felt like I was enjoying more the fact of generating content, or sharing content with the community, or communicating with the community, I really like to talk to other people. And I enjoy talking. And I felt like I was enjoying more doing that, instead of doing my daily job of developer, let's say, I mean, it's not that I don't like to, to develop, but I was enjoying more generating content, sharing content with the community engaging with other people. And well, I took like this, I made a decision, I started to read about developer relations and etc. I saw this opportunity on serverless, that they were looking for a developer relations engineer, I applied for the, for the job, and I was selected. I mean, I had a portfolio because in the past, I presented some talks, or events or conferences, I had some articles that I wrote before applying for the for the job, working with different technologies, and etc. So that was my, my presentation letter, let's say, and well, I had the chance to apply and to be and to be accepted for the position, let's say. And since June, I'm working as a developer relations engineer at serverless, my first developer relations position and experience, and I'm really enjoying it. So that's a little bit about me. Bryan Robinson 4:38 Sure, yeah. So So you're a developer relations engineer at storyblocks. So you're doing all that kind of content creation, education, talking with community there. Are you still doing that in your spare time? Are you actually able to like branch out and do other things now that you don't have to do that yet to your day job? Facundo Giuliani 4:56 Well, that's a good point. Because I mean, I did it Probably, I'm doing it but just a little bit like not so much. Because the cool part about being a developer relations engineer is that I found that that it was possible to do what I wanted to do or what I was enjoying, while doing it on my on working time, right, I mean, during the day, instead of using my free time to generate the content to do that, probably use my free time to set my mind free, right? That I mean, I'm not complaining, because I really enjoy doing that. And I enjoyed that at that moment when I was doing it after work. But I felt like it was it was cool to to enter to a company and start doing this during I mean, like, my, the tasks that I'm doing in my position are related to that. So I can use my free time on that on other things. So I enjoy doing that. But yeah, I'm trying to take the free time for other projects, probably not related to to developer relations or engaging with the community. I'm probably not even related to programming developer or technology Bryan Robinson 6:15 at all. What's your favorite thing to spend time on outside of development? Facundo Giuliani 6:19 Well, I really like I mean, I was I mean spending more time outside, I moved to a house, I was living in an apartment and I have a house with a backyard. So I'm trying to spend time there or I don't know walking around the neighborhood, I live in more than a situs Argentina, in the suburbs of the city, not in the city center. And the place where I live is like a calm neighborhood with a lot of trees and etc. So like when I, when I finished my, my, my day after working, I like to go and walk around the neighborhood and etc. but also talking with friends. So there are other projects like personal project related to, to their staff playing, playing sports with friends. I'm trying to do several activities, like to get out of my house. I mean, I enjoy being on my house with Mr. Gary Burger, and etc. But I also enjoy seeing other people spending time with other people. And these last couple of years were like We spent a lot of time inside our houses. So spending time like, I don't know, keep grabbing some fresh air and talking to other people is something that I enjoy doing. And I try to do as possible. Bryan Robinson 7:33 Awesome. I think there's something that we all do a little bit more of, especially in the past couple of years. Yeah. So. So moving on to talk about the Jamstack a little bit. You have a history in kind of full stack development, back end development, what was your entry point into the Jamstack, and static sites and that sort of thing. Cool. Facundo Giuliani 7:52 So Well, in my previous job, I mean, my last job before being a developer relations engineer, I was working mostly as a back end developer, I was working with Microsoft technologies like ASP, dotnet, dotnet, core and etc. But I, I mean, I felt like I was missing the the opportunity of learning about probably newer products or different products, let's say related to the front end. And when I started to read about the static site generators, the headless CMS is that I mean, for the products that we did in my previous job, I was not able to apply these technologies on them. So I was like, not super aware of all this new approach of creating study sites. And I started to read about the Jamstack different articles, watching different talks, or Devens, at conferences, and etc. And I started to learn about that and to learn about the approach. I really enjoyed that because at a certain point, as I said, I am I mean, I'm working as a developer for since I was 18. But before that, I was creating websites at home when I was even younger, with with products that again, they don't exist anymore, like Microsoft front page, or Macromedia Dreamweaver. And what you did in the past with Microsoft from page was like creating your own website. And when I was said, I mean, when I was a teenager, or probably even younger, I really enjoyed doing that. Because at that time, internet was not what it is now, right? I mean, at the beginning of this of the 2000 years, or the or the or the end of the 90s Probably, internet was like the super new things and being able to create your own web page was like, Man, this is NASA technology, right? So I tried to create like websites related to anything related to my friends related to us. Searching a football club or related to I don't know, my different interested interest is that I had in that moment. And and what I was doing at that moment were static sites. I mean, they had movement. They have awful MIDI sounds in the background, because that was so yeah, I mean, that was like any any site at that moment, that sound. So that is terrible, I think now about that. And he's like, Man, why do you need to listen to music while we're browsing? A web page was terrible. But well, it's what we did. Yes, exactly, exactly. So I enjoyed doing that. But the thing is that they had dynamism, let's say, or movement, or etc. But they were static. So while when, when I started to read about the new approach of having studied websites, I felt like, I mean, the Navy sidebar, but we are again, doing the same that what that what I did was when I was a young teenager, or probably pretty teenager, I don't know, how is it called the the concert when you are 12 years old, or 13 years old pro. But, I mean, I started to feel to feel like excited with this concept. And I started to read about different study site generators, like neck JS Gods B, I started to read about React, probably get more involved with React, and etc. And on the other hand, all the concepts that you have avoidable to generate the content at build time, ahead of the people visiting your website, I mean, the process of generating static assets, but not manually, right, not using Microsoft front page like we did at that time. So I mean, I felt that that was super fun. Because using new technologies, you were able to do something that probably reminded me to what I used to do when I started creating web pages. So I think that that was the first step that I took to to enter to the Jamstack work, let's say, Bryan Robinson 12:07 I like that concept of like, this is kind of how we did things in the late 90s. And now we do it. We have a similar output. But it's so much easier to like it just Yes, I'm not I'm not writing and copying and pasting 15 different HTML pages. I just, it generates for me, it's an amazing feeling to kind of see that come out. Yeah, exactly. Facundo Giuliani 12:28 I'm not only that, I mean, when you are using a study site generator, when you like, start a new project with the boilerplate that they offer you, you have a site up and running, and you run just like three comments in the console, or probably less. And that's all I mean, that's awesome. For me, the web development is evolving in, like, in all directions to make the work easier for the developers and to have the products up and running as fast as possible. And that's something that for me, it's awesome. Bryan Robinson 13:01 Yeah, and let's, let's try a whole bunch of stuff and like work closely with clients and with stakeholders and all that to, like, realize what they're looking for. And then we can make it better. Like we can do something simple and then add to it and add to it and add to it. I think that's a really powerful pattern that we get to have. Facundo Giuliani 13:18 Yes, yes, I agree. I mean, a lot of technologies appear during the last year, some being able to use these technologies, but also offering a great experience to the final users or the content editors. It's something pretty, pretty cool. I mean, I see that all the pieces are, like joining to offer a good experience, not only to the developers, but also to the people that is using your product on beseeching the websites that you create, right, Bryan Robinson 13:46 exactly. Yeah. Theoretically, if we can do things easier and simpler, we can pass on a whole bunch of really positive things to those end users. Facundo Giuliani 13:55 Yes, yes, I agree. Totally agree. So. Bryan Robinson 13:58 So you're at story block now. So how are you using? I mean, sorry, block is a headless CMS. So it's a very Jamstack company, how are you using Jamstack philosophies and kind of your day to day at story block. Facundo Giuliani 14:10 So what we were we tried to offer to the, to the customers to the users is that having a headless CMS is a way of generating faster websites, using cool technologies and cool frameworks, probably, but also offering a good experience not only to the end user, but also to the content editors, the Jamstack, we see that we have a lot of products available to create static sites, or offer great experiences and having like, sites up I mean, up and running that are working great. But the thing is what happens when we need to generate the content that is going to be exposed in our static sites, right? So story block has this real time visual editor, which I think it's probably the best feature that serverless is offering. Because there is this bridge that connects the the admin panel that Starbuck offers to generate the content with the front end of your application. And well, you can use it with environments that are already deployed, like your testing environment, or staging or production. But you can also connect that to your local host. And using like the preview mode of the different static site generators, you can also offer an experience to the content editors to see how the content is going to look like before it's deployed or published. So in that case, connecting the story blog application or the server admin panel to the front end of your application using the storybook bridge, you're offering the possibility of creating an experience very similar to a page builder, but not being tied to the styles or the components or their structure that the Page Builder probably feeds or probably sets for the developers that are going to use it. So you are able to create the front end and the code and the logic that you prefer for your application connecting to a headless CMS that is allowing the users to see that page and to like, create a unexperienced very similar to editing that page on the fly, and see how the content is going to look like. So I think that we are focused on on different technologies, frameworks, and tools, probably I will I work more with Node js, and react. And what we try to do is to get advantage of the static site generation process of these frameworks to generate static assets, but also work with a preview mode of these frameworks to connect to the headless CMS and offer the content editor the possibility of exactly creating the continent scene, the content that is going to be Publish when the build process run and generate the static Bryan Robinson 17:14 assets. Exactly. And that build process sometimes can be a minute or two. And so like if you're trying to iterate on content, and you're having to save, wait for the build, preview it and then preview it live, like snap previewing more, it's just a view that can really slow you down. Oh, no, I wrote one word too long. It's gonna break onto a line at the screen sizes. Like no, just use the Preview mode, use that visual editor to make sure it's exactly what you want it to be. It's kind of it's the best of both worlds kind of solution. Right? Facundo Giuliani 17:42 Yeah, exactly. Exactly. And not only that, I mean, talking about Nigeria, in particular, the framework offers cool features like incremental static regeneration, where you don't really need to generate the the run a build process for the complete site to generate probably only one page or two, apply the changes to only one page in your website, we can discuss about if using incremental study regeneration is really Jamstack or not, because you are breaking the atomic bill and etc. But you have the possibilities there, you can use it or not take it or leave it. Bryan Robinson 18:19 I actually like that that like thought process of I might not be Jamstack anymore. But it I mean, at the core, even though you lose the atomic deploy, you're still hosting the majority of it from the CDN, it's still much the majority of it's still pre built HTML, and you're updating pieces. It's a rehydration thing, which I I would say arguably, is still plenty within the idea of the Jamstack. I think it's it's a big umbrella. We can fit everyone underneath it, I think. Facundo Giuliani 18:46 Yeah, totally. I in fact, I think that, well, probably the concept of the Jamstack was originated by JavaScript API's and markup. But the thing is, I feel like the idea is always trying to generate the more static content that we can as possible at build time. And not, I mean, not having dynamic content to be generated whenever a user visits our website, right? Why are we Why will we generate content, that will be the same for probably all the users that will visit our web application or a lot of them, if we can do that ahead of time, and offering a better and faster experience to the user right there. Exactly. Bryan Robinson 19:27 And then just augmenting, augmenting is always the best way to go adding little bits of extras for for when you have the ability to do it. And it matters like what what, what pieces of content actually have to be dynamic. And let's make sure those are dynamic and keep everything else quick and secure, you know, as static as possible. Exactly. So we've talked about story block we've talked about next. Jas, we've talked a little bit about incremental static regeneration and whether or not that's Jamstack or not, what would you say is kind of your jam in the Jamstack? What's your fate? Have a product maybe story block or or framework or philosophy, what makes you love the Jamstack. So? Facundo Giuliani 20:06 Well before joining storybook, I was a user of a storybook, I've used terbuka and other headless CMS. So I mean, probably I'm biased on my feature now is like, but I really think that cerebral is a great product to generate content, probably. I mean, we as developers are used to work with things that are not super how to say that friendly for the users, or were used to work with code and etc. But having the possibility of giving the people that there is not super full into the technology, the possibility of creating the content and and exposing the content that they want to share. I think it's very, very cool. And having a visual editor to do that. I think he's pretty cool, too. So I think that sort of look is very, very good. I'm kind of like, I use NET Jas a lot. And I feel like when the the new versions that they released, I mean, version after version, I see that they create really cool things. So I will say that I really enjoy using Node js with with Node js 12. And all the announcement that they did was like, the possibilities that are appearing with these new features. And with these new products is really, really cool. I mean, enjoying, like the edge functions or the support for React 18 with the React server components, different features, like I think that are opening new doors or new windows for other possibilities to, again, what I think I mean, what I think it's important from the Jamstack, that is offering not only a good developer experience, which they are with the product, but also offering a great experience to the final user. So if I can offer a website that is working faster and better for the final user, I'm getting the advantages. So I will take it. Bryan Robinson 22:08 And the great thing on like next and again, like the the big surge of next Jas, in the past year and a half, two years. They're bringing so many new things to table. I mean, next next 12 is great. But we've talked about ISR, like that was pioneered in next and like all these different patterns that are coming out, are coming from the next open source team, the Vercel. Team, the community all around that. I think it's it's moving the ecosystem at a much faster pace than it did previously. I love to see that. Facundo Giuliani 22:40 Yeah, I agree. I totally agree. I mean, the the opportunities that are appearing, and yes, as you said, like an starting point, or a pioneer point of saying, hey, why don't we take a look at this possibility and discussing it and offering that to the developers. Bryan Robinson 23:00 I think it's also interesting, you know, we talked about ISR, maybe not being Jamstack. And I think the cool thing with next is the next doesn't care. Like they they look at it, and they say, Well, you can be completely Jamstack and just use, you know, static props and all that good stuff and render HTML and and send that down for the CDN. But you can use these other things, too. And whether or not that's Jamstack. It's still a nice website. And it's still like meeting all the user needs. So let's not even talk about it. Let's just have these features built in. Facundo Giuliani 23:30 Yeah, that's true. That's, I mean, I love the Jamstack. I like the approach. I enjoyed using it. Sometimes we have to think what's better for the users and for the developers, and probably not stick to too much to the theory like, Oh, I'm moving from the Jamstack. Like, what I was going to say millimeter but if the United State people is listening to me, they probably won't get what measure unit I'm using. But what I mean is that barely moving from the borders of the Jamstack, or the bounds of the Jamstack is not that bad. I mean, the final idea or the final goal is to offer a great experience not only to the final user, but also to the developer. So you have to think about that Bryan Robinson 24:15 make a good app or a good website with the best developer experience possible. Facundo Giuliani 24:20 Exactly. Bryan Robinson 24:21 All right. Well, let's let's do a kind of a hard pivot here and ask maybe the toughest question on the show, which is what's your actual jam right now? What what are you listening to what musician or album is really getting you going right now? Facundo Giuliani 24:33 I mean, I really enjoy listening to music. I'm listening to music all the time. Like, what I found out lately was that if I listen to music that they have like a singer and they are singing a lyric. I can't focus on the work that I'm doing. I don't know if that happened to me in the last time or not. I really don't understand because I really enjoy listening to music and I Listen, a lot of music of different genres, so of different types and etc. So while I was working or probably probably because with this developer relations engineer position, I need to focus more on writing, or I don't know speaking or generating content, I'm probably not doing some automatic thing, things, let's say, I need to focus more on the work and not not too much on the on the lyrics that I'm listening to. So what I what I was listening this last time was probably more like Lo Fi setlist in the background, I live Lo Fi music, and I enjoy listening to that while I'm working. But I also was listening to the meters, which is a band from I don't know, if they are from New Orleans, I really don't remember. But they did in the in the 70s. Music like it was it is funk music, but without singing, or at least, not all of the of the songs have had lyrics. I mean, the most of them are music only. And I enjoy that because they have this groove and this kind of music that I really like. And with the headphones with the, with the boost of the bass there is like it's a good experience while working. So I'm really enjoying that. Bryan Robinson 26:22 Awesome. Yeah, I totally like Lo Fi is definitely something that I usually have on in the background while I'm doing some writing or working through a hard code problem. So I get that. And I hadn't heard the beaters, which is surprising. So I'm going to check them out. And I could I could use some fun in my ears as well. Yeah, sure, sure. All right. So anything that you're doing that you would like to promote out to the Jamstack community as a whole, Unknown Speaker 26:45 Bryan Robinson 27:53 amazing. All right, cool. Well, thank you so much for being on the show with us today. I hope you keep doing amazing things at storyblocks and beyond. Facundo Giuliani 27:59 Thank you. Thank you very much. Thank you for the invitation again. Bryan Robinson 28:03 We'll see you around. Thanks again to our guest and thanks to everyone out there listening to each new episode. If you enjoyed the podcast, be sure to leave a review, rating, Star heart favorite, whatever it is, and your podcast app of choice. Until next time, keep doing amazing things on the web. And remember, keep things jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by contributing to their tip jar: https://tips.pinecast.com/jar/thats-my-jamstack

3 June 2022


S3E4 - REMIX! Tamas Piros on islands architecture, Astro and media usage

S3E4 - REMIX! Tamas Piros on islands architecture, Astro and media usage

Transcript Bryan Robinson 0:13 Hello, everyone, welcome to another stacked episode of That's My Jamstack. The podcast where we ask that best-of-all question, what's your jam in the Jamstack. I'm your host, Bryan Robinson . And this week, we've got another. That's My Jamstack REMIX. Bryan Robinson 0:32 We welcome back to the show Tamas Piros. Tamas Piro is a developer experience engineer at Cloudinary, and the founder and educator at Jamstack.training. Let's go ahead and dive in. Bryan Robinson 0:54 All right, well, Tamas. Thanks so much for coming on the show again, how are you doing today? I'm doing well. Thank you very much for for having me. It's good to be back. Yeah, as I say so. So this is another one of our remix episodes where we're having a guest that was previously on two seasons ago, two years ago, almost to the day on this recording. We talked in 2019. Now, this will probably come out in January, and it's December right now, but it's almost two years. So I guess give us give us an update. What are you doing nowadays for work and for fun, and all that good stuff. Tamas Piros 1:26 Okay, so work didn't change that much. So if people listen to that episode, or people know who I am, then I still work at Cloudinary. The only thing that changed is that I am no longer a developer evangelist, but I am now a developer experience engineer, which is more, you know, esoteric, so to speak. It's a it's a fancy term describing pretty much the same stuff, in my opinion. But I like that now. I'm, I'm recognized as an engineer, which I am, as opposed to just, you know, someone thought that I was a priest, because I'm an eventually. Bryan Robinson 1:58 So evangelist was always a weird title in general. Tamas Piros 2:01 Yeah. Yeah. And and yeah, so it's just more described what I do. But yeah, in terms of that, you know, no, no real, real changes. Tamas Piros 2:09 What I do for fun, I still do, you know, Jamstack, I see lots of stuff for Jamstack, I started to sort of look into what I label emerging technologies, which is, you know, not necessarily relevant to the Jamstack, you know, kind of things like rust or WebAssembly, that kind of stuff. In fact, I've done a lot of talks on web assembly in the past, you know, two years. And it's, it seems to be a very popular topic. But that's, you know, that's not related to jumps. So let's talk about that. Now. Bryan Robinson 2:37 I feel like there's a lot of those emerging technologies play a role in the Jamstack. But it's not actually what a Jamstack person is going to be worrying about. It's just it's happening on the backend, like some of the systems get built in Rust for speed and some other stuff and WebAssembly, maybe one day, because like, that'll can compile down to JavaScript in the end, right. Tamas Piros 2:56 Yeah, I mean, you know, WebAssembly, is what I like to say. And this was the title of my talk as well, which is supercharge your JavaScript into web assembly, right? So JavaScript has API's very similar to you know, you have a Fetch API, you have all these these browser API's. And so there's an API specifically for web assembly. And then you can just have a C++ project or projecting rust compiler down to WebAssembly. And then just to consume it using JavaScript within your browser. And in all these modern, all the modern browsers that are out there today can not only compile and work with JavaScript, but they can also do the same with WebAssembly. Right. So you get this built into every browser that that's out there today, which is pretty cool. Bryan Robinson 3:40 Yeah. And so, so Cloudinary, so Cloudinary. And if I remember correctly, two years ago, you had just started a side project called Jamstack.training, right? How's that been going? Tamas Piros 3:50 That's, that's, that's right. So yeah, I think when we first thought I had one course on there, which was a very generic sort of introduction to the Jamstack. You know, no tech involved, just just me explaining in, obviously, in terms of what the Jamstack is, and then decide became very popular, you know, in this two years, I know have, you know, very close to 2000 students, I have 11 courses up there. And all of those courses are still free. Tamas Piros 4:18 And I am now you know, sort of applying or making some changes to that site purely because I've been doing this for free for two years. And I'm using a platform, I have a domain these costs money. And I see that a lot of people love the content, I did experiment with adding the price tag to the courses. And then signups just literally stopped. So that wasn't that good. It wasn't working. And then ever since the courses are free again, I get the usual, you know, 356 10 signups per day, which is really nice. And so what I'm doing now is I am now accepting sponsors and I'm doing sponsorships. So, I did talk to some companies, but I'm just going to say this here as well, in this recording that if there's any company or anyone who wishes to sponsor, just like the training, I have three packages, you know, you can, you know, just put your logo on, you can have like a custom landing page, you can have your own video course, I can produce a video course for your produce and record a video course there's lots of options. So I would be, you know, I would love to have some conversation with people and organizations about this. And, and also, I'm, you know, in parallel to that, I'm recording a brand new course now. Tamas Piros 5:40 So I'm looking at Astro, which is a, an interesting tool. From from what I've seen, I'm putting together a sample application with it now. And then I'm going to create a another free video course about Astro, just covering these basics. And you know, I'm still not sure what I'm going to build, although I have an idea, Mike is going to be probably a very simple landing page, showcasing the capabilities of Astro. Nice. Bryan Robinson 6:06 So I think it's relatively obvious just from this early part of the conversation, how you're using Jamstack philosophies, obviously, you're teaching a lot of them. And I'm assuming Jamstack training is built using Jamstack technologies, but I kind of want to sidetrack a little bit since you brought up Astro, I've only scratched the surface of Astro, I've done kind of my first lap in it as well, what kind of drew you to wanting to do some some coursework around that. Tamas Piros 6:30 So what I tried to do as part of Jamstack.training was also to you know, pick a number of technologies that seems to be popular, or have the opportunity to become popular. And, and I kind of, you know, mixed and matched the, you know, static site generator with an API with a with a CMS and deployment platform. And then, you know, I said, let's use eleventy, with, you know, strappy and deploy it on on Netlify, for example. And, you know, the, the idea behind Jumpstarter training was always, you know, to teach people how to use technologies, as I said, that have the opportunity to become popular, and I see as shown to be super powerful. And I, you know, I really enjoyed the talk, I think it was I'm forgetting who did the tour, but it was part of the Jamstack conf a couple of months ago,transitional apps, the that one as well. But there was a very specific talk to about Astro, I think like he was like introduction, or introductory talk to Astro. And I looked at I thought this, this is good, this is powerful, you know, how it can bring, you know, react and view components and know JavaScript, and then, you know, have this whole island architecture. And I think, having a course about first of all explaining what this island architecture is, you know, how to do you know, static site generation, and how to just have a React component without JavaScript. And you know, these are very good learning points, especially for the Jamstack. So this is why, you know, I also choose to, to create a course on Astro. Bryan Robinson 8:04 So you, you kind of name drop there, the islands architecture, what does that mean? Tamas Piros 8:09 So the island architecture is really, you know, you defining, it's almost like an advanced way to think about component based development, right. So in component based development, you will have a Navigation component, you have a component for for an image carousel, you have a header, a footer, all the components that basically make up your page, almost like Lego pieces. And it's Island architecture, you kind of take that to the next level. That is this is just my view of it, and my sort of explanation of it. And so you now control whether a, you know, image Caruso, which, generally speaking has a lot of JavaScript involved, probably, you know, it's close to around maybe testing, you know, event handlers for clicks. So, you know, control whether that component or that component, Demetri relative components should be loaded at, you know, at load time at build time, you know, at an idle time. And you can very much control this using gasher, which is really nice. So, you can say, you can just drop in components that are purely for layout purposes. And you can say, well, those do not require JavaScript, and then you just delay the loading of a component that has JavaScript because either is you're not visible on first load. So it's, you know, it's not above the fold content. And so your initial load will also be very, very fast, right? Because you're now almost deferring JavaScript and a component that requires a JavaScript to a later point in time you're not blocking the main thread. And you're just classic web performance. Routers from from there Bryan Robinson 9:44 every I feel like and that was that was kind of a setup question, right? Because I actually am super jazzed about islands architecture. I think it is. Like it's what I'm most excited about for 2022 Tamas Piros 9:55 Testing my knowledge then I feel like university. Bryan Robinson 9:59 No, I was just kind of like what I was like, let's, let's let the guest actually speak and do the do the description. But you know, this, like this idea that like, the differing again, it's like, it's the idea that we have these best practices that I think we've all known about for a long time, about making sure that things load as fast as possible, get on the page as fast as possible, and then do extra stuff. But I feel like it's the promise of the frameworks, right? It's, it's what we, what they said a decade ago, like when react was first coming out. But like, finally realized, and something a little bit bigger, like, oh, you know, React is, is just the view layer for little components on your site. But what happened over the course of that decade, was we saw react and similar frameworks take over the entire site. And now I mean, even with stuff like with NextJs, and Nuxt, and all that, like seeing, seeing it transition in a way that still ships HTML over the pipe, but then becomes interactive, I feel like islands architecture with with Astro I think there's, I think it's called Isles there's a view or a view, similar concept called isles and, and slinky with the Levante. I think that these kinds of projects are kind of the future of how we're gonna be doing stuff, at least that's, that's my gut feeling on it right now, having built like, two demos, right? Tamas Piros 11:23 Oh, that, you know, we're experts, we should put this in our CVs. I know, I think we are the, you know, the starting point of something incredible, you know, it's, as you said, you know, went from single page architectures to server side rendering to then, you know, mix and matching the two, and then, you know, server side plus hydration rehydration. And now we arrive to this, you know, Ireland architecture, first of all, we are in a time where everything gets developed really fast, and things move at a pace that I can't even, you know, comprehend. And we also in a in a state where we don't know what the next big thing is going to be, can only guess. And then, you know, we settle down or maybe say, you know, hey, use the island architecture is the next thing. And if we meet in a podcast a year from today, and we're like, oh, my coworkers so wrong. Or we would like yeah, we told you, it can go both ways. But you know, at this point of time, I really like the idea, and like, what Esther was trying to do and how they're trying to do it. But yeah, it will take time, you know, because not everyone is just going to build a blog or a, you know, like a steady website, because it's the almost like a de facto example for the Jamstack to be on the blog. I just wonder if there's, there's going to be more use cases for the likes of Astro. In terms of what's, you know, applications, we can develop, like, you know, what, if I want to do an E commerce site, what if I want to do, like, a social media site? Like, is that possible. But we'll see. Bryan Robinson 13:00 I also kind of wonder if that ends up being the true use case of Astro, right, I feel like, like at this point. And again, Astro is super, I don't even think they're technically a beta yet, I think they're still kind of kind of alpha level. I wonder if we'll still reach for bigger tools like a next or like a Nuxt. For bigger, more application like experiences. But when you've got, again, like those islands, right, those little bits of interactivity that you want on like a fairly static site, like, there's so many, like, there's 1000s, probably of marketing websites, they get launched every day, right? There's always a new business, a bit new business needs like a five page brochure site. Most of that should be HTML, right, most of that needs to be HTML shipped down to the browser. But little bits of interactivity make it such a more polished experience. And having those scattered throughout the page sounds exactly like like what you want for that. But like, you can do, you could probably do big applications and asteroids kind of wonder if that's, if that's the end use case or not having having built I built a demo, that's like three pages. And each page has like, one bit of JavaScript on each. And it feels application asks, so like, I almost as I was working through it, I was like, should I be in next? Should I be in something different? But in the end, it just worked out fairly well. But I do I do wonder, I do wonder if it's just a new tool in our tool bag, Tamas Piros 14:26 when I see value in having less choice is you know, just thinking about all these sort of companies that offer, you know, web development and web design services to, you know, to restaurants to as you said to you know, some sort of any sort of business. So in order for them to to get up and running and create a production ready website is now going to be super easy, right? Because they now have this tool. And they can also you know, if I go back to this idea about the components and how you can recreate reuse these components. Now imagine, if you own a business and you help restaurants, right, you could almost have a component written in React that does something very generic, maybe like, you know, displays the, the menu or the other drinks or allows you maybe embeds a map. And now you can just state a React component and put it into any astral project, you know, very easily. And so maybe that's that's the, you know, that's where the value is. And maybe it's not for large enterprises, but more for like, you know, smaller businesses trying to build websites for other smaller businesses Bryan Robinson 15:34 also really enjoyed the philosophy. They've got around the multiple frameworks, right, like view, spelt, react. Yeah, all of them are like, first class citizens and Astro. And, I mean, theoretically, you can have a component that's a view component react, put its component on one page, that feels like you probably don't want to do that just for like a performance standpoint, like no matter how much they sit that down. But like, if you had a React company, let's I worked in an agency as a PHP agency, and we had a lot of people who were good at React. And then we were having to pivot. We had some turnover, we had some new people come on, that had different strengths. It was a completely new, like learning experience, like our new lead Dev was a view dev as opposed to reactive that we had before, we could still have been using Astro. Like if that this had existed back in the day, we would have just swapped out a few of the components to render the HTML at that point. So even that front end architecture, it's really just how we render the HTML, which is, I think, pretty exciting. Tamas Piros 16:35 I think so I've been giving this some thought. And I would love to hear you know, if someone knows the answer to this, or if someone is, you know, actually involved in Astro and knows the answer to this. I love the fact that yes, I can have you know, react and view and swells in one project. My question is why, you know, it's not, it's great. But so here's the thing I remember many, many years ago, I wrote an article where I created a, an Angular components. And then angular had this for probably this, you have this feature whereby you can create, you can actually generate a web component based on an Angular component that you have. And then now that you have a web component, you can just use it as a web component. And I imported that into a view application. And it worked. And I wrote about this. I wrote a blog posts, I post into various pieces. And then the most common question comment I got was great. But why? Maybe so you create something in a language that you're familiar with. And then you can now put it into another project. Why do you learn but you know, what is the? Again, I love our show? And nothing, as far as I'm sure, you know, but what is the value that it adds that I can use multiple frameworks? I'm trying to figure this one out. Bryan Robinson 17:55 Yeah, I think I think that idea of being able to add into one project is probably it's a little bit a little bit of a weird thing, right? Like I think that's that's a very like one off every once in a while, you might need this sort of thing. I think the power of that is an adoption power. Right? So if I'm, if I'm a view Dev, I can use Astro from react, Astro. Tamas Piros 18:20 It doesn't matter what background I have, I'm going to end up having with a very sort of powerful slash performance static page. Yeah, I can I can see it because because I was thinking, you know, why would I have a React view swelled in one province clear, because I was thinking about that, like having everything in one project. And maybe you're right, it's have to think about just almost like silos? Maybe Maybe that's the answer. Bryan Robinson 18:45 I mean, that the upside of individual frameworks in one project might be that, like, there's a really great component, that's NPM installable, the React version is okay. But the view version is amazing and has all these additional features, I can now use the View version on a page in my Astro build, and keep all my other stuff the same. Now, again, like there's probably some performance concerns around that if you if in your rendering it on the front end, right, if you're doing browser or client side stuff for that. But if you just want it for the display purposes, or to generate HTML, I can use this view thing and write no code and just adopt it. But that's me who I want to write as little code as possible. So let me let me npm install something and go, Tamas Piros 19:27 No, I think, you know, developers, we like to reuse we like reusability. Bryan Robinson 19:33 So this has been Kevin's circuitous talk that I wasn't expecting, but has been awesome. But I do want to make sure we kind of focus on anything that you consider to be your your current jam and the Jamstack. We're talking about maybe that future jam of yours, right? Because you haven't even really, like use it. I wrote about it yet. But what are you really digging on right now? I think two years ago, we talked big about back when the Jamstack was still an acronym, right? The A and the Jamstack and API's and that sort of thing. But But what are you digging on right now? I Tamas Piros 20:04 API's? There's no, there's no change. You know, it's also because I work at a company that does, you know, you know, we work in inverted commas work with the API in the Jamstack. And actually, you know, last year I was part of the I don't know, if if you know, web Almanac, which is a, you know, this yearly have to call It's a yearly report by Google, written by, by community members. And so last year, I was authoring with a colleague of mine, the media extra two copies of the media chapter. So we kind of go through how media images and videos are being consumed on the web, and I just, you know, had the opportunity to review and read the draft for this year's media chapter. And every year, it's very clear that there's more media being consumed on the internet, video, so like a five or a 7% uptake. So this, like, it compared just bid last year, there's more demand for video. And then developers are actually, you know, delivering on that. And then you know, the same is true for images, you know, larger images, images ever, like if you, if you can tell me a website that has no image, then I just want to see that it's going to be probably a very, very old website, every single image website has images, right. And so what I what you know, my jam is to make people understand how important the visual web is, how important it is to to have visuals on the web, but more importantly, how to deliver these in the right way. Because, you know, the many image formats, you know, JPEG is still the most dominant image formats on the web, as concluded last year, and as completed this year in the report for web Omona. But there's Wi Fi, there's, you know, there's a VI F, they're much better ways to encode images, which will, just by doing that, it's going to give you a performance benefit. And now you've wrapped the Jamstack around this, which is all about static HTML and stuff that that's, you know, that's going to be the best website that you can deliver. So it's not just, you know, not just about, hey, that's, let's build everything's to statistical statically. But also, remember that you know, what you put in there in terms of the media sets, those are also going to be defining how performant your website is. And another example, and I'm just going to say this, because if someone listens, and if you use video, then just just notice, because it's, it has been a problem last year, it's still in the almanac report this year, the video element, great. It allows you to drop a video into any web site, you can specify the source element as a child to the video element. And you can specify multiple sources. And you can specify like an mp4, you can specify your web app, which is, you know, a more performance encoding for video. And the intention, you know, the intent behind this is amazing by developers, because they put an mp4 and a webcam, but they put it in this order. And the order matters because every single browser, most of the browser's are going to understand the mp4 file. And they're just going to play that they will never get to your optimized by them, which was your intention that if the browser's suppose that, and I want to play that, right, and there are some other interesting things, I think, if you just, you know, hide the video elements, that the browser will still download your video elements, right. So this is all these things that you know, people are not necessarily aware of. And because everyone talks about web performance, I think, you know, the majority of Jamstack projects are also about web performance. I just try to combine the two and make people understand that yes, Media Matters. It's there. And it's also the heaviest resource on the web today. It's not JavaScript. It's not fonts, it's not HTML. It's images and videos. Getting those right. Awesome, getting them wrong. It has a penalty Bryan Robinson 24:11 i We spent like 1010 plus minutes talking about about islands architecture, which is all about shipping less JavaScript. And yeah, JavaScript bloat is a problem. But when you've got giant PNG is large JPEGs Tamas Piros 24:25 75% is the amount of media that we ship on average. So that's the out of you know, all the JavaScript and HTML, CSS 75% is media assets, which is, you know, a massive proportion compared to just the JavaScript who don't want to ship. Bryan Robinson 24:42 Cool. So so the jam is still API's, but the API is hopefully making things more performant. And obviously, media is one of the biggest things to do. And I know, I've gotten the chance to not have to think about some of this because I mean, in fairness, I've used Cloudinary Right and so like At least with my static images, I just put was it like format equals auto. And I get you know, what B, Tamas Piros 25:06 you actually use one of our competitors. If you said, Well, you said, That's okay. Bryan Robinson 25:11 So yeah, I just make up some text sometimes that's fine. Tamas Piros 25:14 That's fine. That's fine. Yeah, so fo, so you basically, you know, you upload your assets to Cloudinary V also act as a CDs, we get, you know, you benefit from this global set of servers, which is one performance optimization by default, you then just add f on the scroll through into the URL. And what that does is, if you open that URL in Chrome, it will serve a web p, because that's the most optimal format for making this very simple, because they do analyze the image as well. And then if the analysis says, well, actually rendering this as a JPEG is thermal performance, we do the smaller size, we would do that. But then you take the same URL, you put it into Safari, which does not support Wi Fi, it's likely that you're going to get maybe a JPEG 2000, which is a more modern imaging coding compared to this, you know, at this point, ancient, you know, just standard JPEG. And then the benefit of that, and I think I, you know, two years ago, I said this is that, you don't need to worry about any of that, all you get is a URL, you put it into your project or use one of our SDKs. And then this is just going to work magically. So you don't need to manage the infrastructure. You don't need to worry about, you know, managing the CDN or anything. All of that is taken care of by by Cloudinary. Bryan Robinson 26:27 Awesome. So we are starting to butt up against the end of the of the runtime here. So I do want to make sure we talk about the most important question, which is, what's your musical jam right now? What are you What are you listening to every day? Tamas Piros 26:40 I think I said this two years ago, so very close to Christmas, right? So it's, I'm all for Christmas songs. I think I've been playing them for a couple of days now, you know, like Michael Palais, and Frank Sinatra and all the core classics, like the jingle bells and stuff. So I love them. And I also said J bobbing two years ago, and I'm still listening to Jay bow. He was, you know, a Colombian, reggaeton artist, and I still I still love what he does his music. So again, I'm sorry to say no changes. Bryan Robinson 27:11 Well, the upside is the two years ago, I learned about an entire new genre of music with with the photon and actually did research into that back then. So I appreciate that. And yeah, J Balvin. Was was awesome. I've, I've listened a few times in the in the past couple years. I'll take it. Nice. And, and yeah. So as usual, I want and and like, give you a chance. If there's anything you want promote, obviously, we talked about Jamstack training, if that's what you want to kind of throw out there again. Tamas Piros 27:36 Yeah, I'm not going to reiterate what I said, my training, you know, free training courses. And yeah, sponsors. I'm telling you, please, please come and see me. Bryan Robinson 27:46 And we'll have all the ways to contact Mosh in the in the show notes. So be sure to reach out. Well, thanks so much for taking the time to talk with us today. It's been an amazing conversation. And I hope you keep doing amazing things both with Jamstack training and Cloudinary. And everywhere that you're doing cool stuff. Well, thank Tamas Piros 28:00 you for having me. And let's not wait two years to do this again. Bryan Robinson 28:04 Exactly. Let's let's make it an annual Christmas time thing, right? Yeah, that would be nice. Yeah. All right. Well, thanks so much. Thank you. Thanks again to our guest, and thanks to everyone out there listening to each new episode. If you enjoy the podcast, be sure to leave a review rating, Star heart favorite, whatever it is, and your podcast app of choice. Until next time, keep doing amazing things on the web. And remember, keep things jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by contributing to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

9 February 2022


S3E3 - Raymond Camden (REMIX) on the amazing expansion of the Jamstack ecosystem and how far we've come

S3E3 - Raymond Camden (REMIX) on the amazing expansion of the Jamstack ecosystem and how far we've come

Quick show notes Our Guest: Raymond Camden What he'd like for you to see: His New Jamstack book with Brian Rinaldi His musical Jam: Pink Martini Transcript Bryan Robinson 0:14 Welcome, everyone to another episode of That's My Jamstack the podcast where we ask that amazingly complex question. What's your jam and the Jamstack? This week, we've got another That's My Jamstack REMIX! Going all the way back to season one, episode two, we're catching up with the amazingly prolific Jamstack author Raymond Camden. Raymond is a senior DevRel at Adobe, a Star Wars nerd, and a web and serverless hacker. Bryan Robinson 0:55 Hey, Raymond, thanks for joining us today on the podcast. Raymond Camden 0:57 Thank you so much for having me. Bryan Robinson 0:59 All right. So for longtime listeners of the show, I mean, like the longest time listeners of the show, they might recognize that Raymond has been on before, but it was legitimately two years ago, more than two years ago, and it was the second episode. And I think we're both older and wiser since then. And there might be folks that haven't listened to the entire archive of That's My Jamstack. So why don't you give everyone a refresher on who you are, what you do for work and what you do for fun? Raymond Camden 1:26 Absolutely. So yeah, first off, I'm definitely older. I'm not quite sure about Weiser. Give me 30 or 40 more years from that. So hi, everyone. I am Raymond Camden. I'm actually not sure what company I was at two years ago, probably two or three different ones. Bryan Robinson 1:45 You weren't allowed to say is actually what you had yet people go to your LinkedIn. Raymond Camden 1:49 yeah. That was American Express. They were antsy about, you can't see where you work. Yeah, I was American Express. And I'm not there anymore. So yes, I am currently at Adobe, I am a developer evangelist, I am working on the document services team. So we have API's that work in PDS. So like a concrete example of that is you let people upload PDFs and you want a consistent way to render it in the browser. And we have a free tool for that. You want to do some stuff on the server side. So you want to like OCR to PDF, or maybe cut it in half, or add something to finance, slice and dice PDFs, basically. So we have sort of API's that work with PDF, but that work with PDFs, and we have a PDF viewer for the web as well. And that's the team that I'm on. That's what I do for work. And it's got to find as well. But for fun. I am a big video game player, so as my wife so. And even better. She's a big PC Gamer, so she'll game on her laptop while I take away the TV from my console. So again, like that works Bryan Robinson 3:00 Best of both worlds. What? What games are you playing right now? Raymond Camden 3:06 When I'm not playing with my friends, every Friday night, we call it bowling league, we hang out and play Call of Duty. We just switched to Vanguard. But outside of that, and when I'm by playing solo, I currently am playing Far Cry six, which is pretty cool. I pretty much like only do multiplayer stuff on Friday nights. Because when you have kids, it's hard to do anything multiplayer, because there's no pause that all Bryan Robinson 3:35 that pause button is so important with kids. Raymond Camden 3:37 Oh, yeah. Bryan Robinson 3:38 Yeah. So cool. So you're doing some cool PDF stuff with with Adobe. But you're also probably one of the more prolific writers in at least in the Jamstack space, but like you do quite a bit of writing too, right? Raymond Camden 3:52 I do too much writing. been blogging since 2003 or so. And I try to blog about once a week. I did a lot more in the early days. But I also started before Twitter, you know, and so Twitter as bad as it is, you know, Twitter's great for short things like, Hey, you wrote a cool article, here's the link. And the old days, you know, there wasn't that. So on my blog, I would just quickly share stuff like that. So I look at my stats, there was one year right at about I think 800 blog posts, which is stupid. The last couple of years, it's a bit more reasonable. So I'm approaching 74 This year, so I definitely hit my one per week average. Bryan Robinson 4:40 Nice. That's I used to go for one a month and I'm not even there. So that is super impressive to me at least. So we talked a little bit last episode, but I want to give a recap. What was your entry point into static sites and the Jamstack? Sure. Raymond Camden 4:55 So I've been around for a very long time to I started web development and 93 year 94 or so, you know, back when there wasn't any defined roles, like you did everything. And I quickly found out that while I could do HTML, no problem, making things pretty was not my forte. So I got really involved in Perl, CGI scripts, and just the dynamic web, which back then, even though we had JavaScript, it quickly became really crappy. On the front end, so the back end really became the place to do anything dynamic. It's been a very long time in the ColdFusion community, which is in law was, you know, a great product, you know, it wasn't open source, and a lot of people look down on it. But it was very practical. It made hard things easy back, when there wasn't a lot of solutions out there that would do that. But yeah, you know, 1015 years to everything, and ColdFusion, and a database and a web server, and that was my jam for a long time. And it kind of two things happen at once. The front end began to get less crappy, like, shockingly, less crappy. And, you know, I always knew JavaScript, but you know, there wasn't much that you could do with it. And all of a sudden, you could start doing really good things. And so like that happened. And I began to realize that I was using a lot of power for websites that probably didn't need it. And I ran across a tool called hark js, which is still around, but I don't think it's been updated for a while. But it was my first introduction to the idea of a static site generator. And I, you know, sort of played with it and just clicked, it was like, oh, okay, it could be dynamic locally, but like, when I'm done with just files, and like, nothing can can crash, nothing could go wrong, nothing could be hacked. So like, I took a couple of my old ColdFusion websites, where, you know, they were database driven. And I recognized, you know, I haven't edited the database in like months. And I began to have to convert them to static and almost like, this is the best thing ever. And this began to do more and more with it. And it really kind of clicked for me. Bryan Robinson 7:20 So out of curiosity, and I don't know if we talked about this last time or not, but you're primarily a back end person from back in the day. And I found not always, but often back in people like servers, they they enjoy working on the server, not me personally, not back in person. But it's interesting that you made this transition to something that is not at all, like, you can host it on any server anywhere. It's just HTML, it's just whatever. But I guess, was it the simplification of the workflow that drew you to it? Or was it something different, as a back end guy coming in? Raymond Camden 8:00 It definitely the simplification. I mean, while I can appreciate the power of something like ColdFusion, or PHP, even, not having to worry about it breaking live was was huge. And doing more in JavaScript, you know, that doesn't need a server, you do have to worry about browsers. But you know, in general, browsers have a good level support for nearly everything that I want to do. You know, ignoring a certain mobile browser from a company in California, but even that does the basic stuff. Okay. Bryan Robinson 8:35 Yeah, exactly. We won't talk about that. It's fine. So cool. So a lot has changed in two years. It's amazing how much this ecosystem changes on a regular basis. How are you today using the Jamstack both professionally and personally and maybe like a slight comparison to maybe how you were using it two years ago? Raymond Camden 8:57 Well, for one, it's definitely nice to see the the ecosystem and not just in API's, but in companies like Netlify and their competitors providing more and more value out of this just off the box. When I first started I used s3 which was convenient you just FTP the files up and you're good to go. But then we saw tools like search for example, which is something else I don't see a lot of people using but I know it's still there and just command line and live what was just really really great like when I started getting a website up involved calling an ISP and waiting a couple days and then you know maybe you got your website where they you had access to again to copy stuff up. So seeing that ecosystem evolved seeing that the different features and seeing different companies now competing to offer more the most value just makes things great for for me I love the fact that I feel like I have good solutions for for like real science. So like, as an evangelist, I don't do a lot of real work. I make a lot of dumb demos. So I like mentally in my brain. I have a path that I use for like my blog, which is a real site. And then I have like a path for here's a dumb toy. I went online, and I don't care if it's online 10 years from now. Bryan Robinson 10:23 Thanks. And it's interesting to me. You mentioned surge and surge was early on for me as well like a way of getting things live. And I really appreciate it. And that was in the days before, like, honestly, important Netlify came around. And I remember the first couple times I use Netlify and figured out like I don't need I was using CodeShip with Serge as you needed to see ICD to like, have those deploys work well. And it's interesting to me how I think it was Phil Hawksworth said on Twitter, like, the table stakes have changed, right? Like what a company that is planning on doing Jamstack or Jamstack, a Jason stuff has is very different than it was in 2015 2016. And like, we expect to see ICD, we expect like these, these server side things that we don't want to have to write. And if you look like the ecosystem has has done that to like Vercel, as a competitor Netlify has many of those things. AWS has amplify now doing a lot of that stuff. Azure has static web apps, I think so like all these. It's interesting to see huge companies, Amazon, Microsoft, like chasing the tail of the little upstart that like said, a front end developer needs these things. Like, let's just give it to him. Raymond Camden 11:39 I agree. 100%. Bryan Robinson 11:42 Seal of Approval. Back in the day, I think at some point we talked about you said talking about harp, I think in the last episode, we might have talked about Jekyll a little bit. And I seen a few of your presentations from way back in the day, I had a chance to see a couple times that a couple conferences talking about different form handlers and stuff like that. But in the 2021 2022 era of the Jamstack. What's your current jam in the Jamstack? What sorts of technologies are you using? How are you putting them together and all that Raymond Camden 12:12 I quickly moved on from harp to other engines heart was good and simple. And I'm really happy with the first thing I saw, because within five minutes, I had stuff going. But I've gone to a couple of different generators over time. And they all have different philosophies. And I have found that my philosophy is that I like a lot of freedom. I like the freedom to write bad code for a sample if I want to, or I need something very unique. I need extremely configured stuff to do whatever I want. Some generators just don't allow that. I don't want to attack any generator. So I'll be vague, but I was using one from my blog for a while. And blog is a huge site. So build times are kind of important. And one of the things I found out is that, you know, in my blog UI, I had like the last five blog posts and my nav. And every time I'd write a new blog post, all 6000 Plus URLs had to be updated on that URLs, files had to be updated, because I was changing part of the UI for every blog posts. So my my quick fix was I'll just make that Ajax, you know, that can load later. It's not crucially important that just a way to drive, you know, more traffic monster on my site. And the generator I was using at a time, competed incredibly hard out but JSON, like it was fine tuned for blog posts and HTML. And I want to output JSON and I spent a day and it was very frustrating. And in in that particular instance, defense, I know it's gotten better at that. But it was enough to kind of get me off that so in general, I look for things that are very flexible. Raymond Camden 13:55 I use Jekyll for a long time I like liquid it again was was very flexible. But the Ruby dependency was a bit of an issue. I always liked using Jekyll I hated installing. It's gotten better, which is nice. But when I ran across 11ty and saw that it was Node based and it certainly wasn't the first one. But it was the first one and that kind of clicked for me. And it had that flexibility in there to an extreme phase. Raymond Camden 14:32 So for example, supporting markdown liquid Jade, handlebars, everything. I felt like I could do anything I wanted to there even if it was a foot gun like it let me do what I wanted. And like since I have started using 11ty, every kind of crazy wild idea I have just plain works because you know Levante is very light. You know, I get For tools, you do whatever, like, a couple weeks ago, I did this really dumb idea of, I want to file I want it to output to PDF. And he gave me the hooks to allow me to, you know, use frontmatter and say this is a PDF, it gave me the hope to recognize that and change the output stream, I used our PDF services to do that. And, you know, again, maybe it's not a very practical idea, but I loved that 11 D allowed me to do that. Well, Bryan Robinson 15:31 so I remember back in my agency life, it didn't happen often. But it happened enough that clients wanted to be able to generate PDFs. And you know, we were a PHP shop, and we had a custom content management system. And so like our CTO, and our developers would work on like, these big, like, monolithic PDF generators, and like, they would use services and like, there's like Doc raptor and stuff like that. And, but it was, it was always dependent on that. And like the idea that you can theoretically hook into any custom content management system, using like 11ty data, JS data files, and you could hook into any service, like like Adobe's PDF service, and then all you're really doing is changing the data. And then using 11ty to create a template, and that template could go somewhere. And that template could be written, I don't know, like, in probably like, in an HTML or HTML, like, you know, system, it means that anyone can generate this sort of thing. As long as they know, a few basics. We're talking about, like making the transition from Jekyll into like, eleventy. I, that was my personal transition, as well. And I've heard a few different people kind of, kind of talk about that. Was it eleventy is Jekyll likeness that brought you to it? And it was just like, oh, it's it, but it's a Node and it allows these other things, or was it actually the extensibility of an actually the configuration of it? Like, what what caused like that perked you up to 11ty, I suppose. Raymond Camden 17:04 All of that, um, I know, specifically, I was looking at Node based static site generators. And I'm like, I recognize that much as I like Jekyll, I wasn't happy with Ruby. So I looked at a couple of them, I think, like ghost, for example. And they just wasn't clicking with me. So eleventy was easy to start with. I think a couple things. The way it did pagination was mind numbingly awesome. And again, I think all the generators out there support pagination, but I don't think any has done it quite as easily as How 11ty did it. So that was a huge, big thing. And the data files, I think, was also really cool, especially being able to do API type calls. And then and just make it available. I think those two features in particular, I might push me over the edge, like everything I'm going to do, for the time being is going to be with this particular Bryan Robinson 18:08 tool. I remember thinking about data in the in the Jekyll world, and I would end up I need to write Jason, I need to write a script that's in my build process that spits out Jason that Jekyll can consume. There might be better ways of doing that. But I have not Ruby Dev. So like, where's my where's my JavaScript? It's in my build step. So yeah, that was that was a big selling point for me as well. I do want to talk a little bit because you've been you've done a little bit of a blog series. 11ty 1.0 is in official beta, a lot of cool features coming out. I'm curious your take on it. And like the the pieces that have you excited in that world, Raymond Camden 18:45 there's a lot. So one thing is the template engine upgrade. And that really hit me coming from liquid. So what you may not know if you're new to 11 AR VR or not use it. It supports all these template languages. But it's important that at a certain version, when I came to it from liquid from from Jekyll, not only the Jekyll have, I believe a newer version of liquid, it had its own added things to liquid. I didn't quite grok that. So I would do things and eleventy that wouldn't work. Also, when you add it back, that liquid has this really, really, really bad default of if you're trying to do something I don't support, I do nothing. I just return an empty string, which you can configure to throw an error instead. But I'll never understand I'm like so I tripped up on that a lot. And so one of the things I love in 1.0 is just kind of catching up the the template engine so the most recent version so I really appreciate that that's it's not it's not a whiz bang type feature but it's a daily life thing that I think is really really great. There's a lot of small Claudia live things like even dynamic ignores having a larger website, I had an ignores file that was a press like 90% of my content just so that my reloads were quicker file based, I could check that into GitHub, because then that would get pushed to production. eleventy just adds a way to to kind of make that a bit easier. Another thing that they just just released is the ability to have a file in one language like liquid and literally embedded different language in there. So one of the things I did early on with eleventy is because it's supported all these different languages, I like the liquid. But it's also a bit prescriptive in terms of how it works. EGS is it is a, it's not a pretty language at all. It reminds me a lot of classic ASP, but it's incredibly flexible. So I one of the things I've done on my blog is I have a static page, which pretty much only I use, but a lot of number crunching and stuff like that, I could have built a lot of eleventy filters and stuff like that, no, I, I just switched the EGS for that page. And I have a very ugly page, because EGS is not pretty. But it got the job done. So the fact that in a 11ty 1.0 I could use liquid for like my main stats, and perhaps just have a block, have it be the ugly block, where I use EGS to do all that crazy number crunching. I like that as long as well. Bryan Robinson 21:32 My, my excitement on that is probably worse than that. But like I'm a Nunjucks person again, like we get to have these kinds of like decisions made on a file by file basis by like nunchucks is very similar to liquid, a couple extra powers maybe a little slower. But the default installation of nunchucks in 11 D And again, that's changing, I actually need to look into the new versions but have fewer filters than liquid liquid does built in. So if I want to handle dates, the liquid installation handles it with a filter, I have to write my own filter in nunchucks, no big deal. But now, I could literally have my nunchucks file and then have one liquid tag that renders a date when I need it rendered and not ever have to worry about it again, not ever have to write that filter. And that's, that's exciting. For me, it's just the fact that it opens up these interesting worlds where you can have whatever also like as a plugin creator, nunchucks, handles, filters and some of the other stuff that or you can do a little bit more like Object Notation inside of it. Liquid, it's space delimited. And it's just kind of like, that's really ugly to me. But like I could then let my plugin be used as nunchucks and not have to worry about it for anyone like they can just bring it in use liquid for everything else. And we're use handlebars or use whatever. Or use handlebars until you need a loop. And then you can bring a loop in via these other ones. But Raymond Camden 22:56 I'm just saying like how freeing it is. And this is not an 11 a thing or I love the one final thing, but it's so freeing, know that I could write code that's going to be run one time only period. And you know, I still try to write proper code, clean code documented code. But I it's so freeing, like I don't have to worry about performance, like it's going to build one time. And then it's done. Like and if it's a little slow, that's okay. And that relieves a lot of pressure from me when I'm building things it's referring to Bryan Robinson 23:30 when when when the performance concerns or performance for your build step. You can be a little bit more lax about it. You don't have to worry about it as much you can. You can render, you don't want to render 1000s of pages, right? Like obviously, that's not great for quick iterations. But you can and that's not the worst thing in the world. Awesome. So let's, let's pivot a little bit and talk about your musical jams. What are you listening to nowadays? I think last time, you mentioned a band called Hatchie I think are they still in your in your listening queue? Or have you moved on to different pastures? Raymond Camden 24:08 i Yeah, I'm not day to day. I have pretty varied things I'll listen to. But the one that comes to mind and just so happens to be one applying this morning. There's a band called Peak Martini. And they're very eclectic. Think like 1930s Jazz and Paris or beatnik kind of 60s. Great background, great party music. It sounds very highfalutin. And I say like I think they imagine without the long cigarette type. That type of vibe but listening to is really kind of cool and relaxing. And one of my favorite features of Spotify is you can like pick a core band or a core song and Spotify just going to read from there. So I've been doing Pink Martini radio on Spotify a lot. It's a really great, Bryan Robinson 25:06 um, I have to check that because I've recently, due to some tick tock videos gotten back into like the 90s arts like jazz scene that was happening. And I could I could use to mix that up a little bit stay in similar genres. Awesome. So is there anything that you're doing that you'd like to promote out to the Jamstack community? Raymond Camden 25:24 Absolutely. And myself and Brian Rinaldi, we are writing a book, we call it the Jamstack book, because we're that eco tip book you'll ever need. We are working on it for Manning. And I assume we could share URLs late. So it's available now and meat, which is manning Early Access Program, which means you get a beta copy of the book, but it is pretty much done. And when you buy me, you get the real book later. So it's totally safe to buy right now. But if you want to wait, it also should be out in 1.0, relatively soon. And I think it's a great book for people who are new to Jamstack because it gives you a variety of different tools and techniques, and also give you some basic examples. So building a blog building a brochure where site but doing ecommerce, and then goes deep into things like adding API's and services and doing serverless functions. So I think it's a great book, and every copy you buy helps me feed my children. So guilt at all, Bryan Robinson 26:30 you know, none, none. And I could be wrong about this. You and Brian wrote something similar ages ago, right? Yeah. So this is like a big, big updated version of all of that. Absolutely. Cool. All right, Raymond. Well, I appreciate you being on the show with us today. And I hope you keep doing awesome stuff help the blog keeps rolling at a once ish per week rate, because it's a lot of great stuff. And I appreciate you being here. Raymond Camden 26:53 Thank you for having me. Bryan Robinson 26:55 Thanks again to our guest, and thanks to everyone out there listening to each new episode. If you enjoy the podcast, be sure to leave a review rating, Star heart favorite, whatever it is, and your podcast app of choice. Until next time, keep doing amazing things on the web. And remember, keep things jammy Intro/outtro music by bensound.com Support That's my JAMstack by contributing to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

12 January 2022


S3E2 - Salma Alam-Naylor on shipping, learning, and rendering in the Jamstack

S3E2 - Salma Alam-Naylor on shipping, learning, and rendering in the Jamstack

Our Guest: Salma Alam-Naylor What she'd like for you to see: Unbreak.tech Her JAMstack Jams: All the amazing rendering options! Her musical Jam: Move On by Emily Vaughn Grant (pay special attention at 1:47 in the track for the double tracked bass!) Transcript Bryan Robinson 0:14 Hello Hello everyone. Welcome to another JAM PACKED Jamstack episode. This is That's My Jamstack the podcast where we ask the best question since sliced bread. What is your jam in the Jamstack? I'm your host Brian Robinson and this week, we have a very special guest. I'm pleased to introduce the winner of the Jamstack community creator award from Jamstack Conf 2021 Salma Alam-Naylor. Salma helps developers build stuff, learn things and love what they do. She does that via her Twitch streams, YouTube channel and blog. One quick update for the episode, we recorded this prior to Salma joining the Netlify team. So while we mentioned Contentful, in various parts of the episode, Sam is now on the DX team at Netlify. Bryan Robinson 1:04 Alright, Salma, well, thanks for joining us on the show today. Salma Alam-Naylor 1:06 Thank you for having me. It's a pleasure to be here. Bryan Robinson 1:08 Awesome. So tell us a little bit about yourself. What do you do for work? What do you do for fun, Salma Alam-Naylor 1:13 I am currently a developer advocate for Contentful. I've also got like kind of other stuff that you do. So you might know me on the internet as white Panther. And I help developers build stuff, learn things and love what they do. I write educational blog posts about web development. I do a lot of live streaming on Twitch, I make YouTube content. And I'm an all round Jamstack enthusiast To be honest, for fun, I mean, I kind of do that for fun as well. But if you want to know about non web dev stuff, I actually love interior design. And I'm moving in the next like two months. So hopefully, when people hear this, they would have actually finally moved house. So I can't wait to get my hand stuck in to that little project. I also like to play cerebral puzzle games with my husband on on a computer, most recently, a game called Super liminal, which is all about like perspective and maths and stuff. It's very good. Bryan Robinson 2:19 I'm gonna jump in real fast. I have a six year old and we were playing super limited together. Nothing about it. I was like, this is super fun. And like we were having good time. He that was really cool. And then it gets creepy. I didn't expect they get super creepy. And he's like, I don't want to play this game anymore. Daddy. We never have to play it again. You're fine. Salma Alam-Naylor 2:38 Yeah, it was a good game. It's a good game. I remember this one bit that when you get on like a roof, and there's the moon. And we were like on the roof thinking this you have to we have to get above the roof because of the weird glitch thing when you turn the light on and off. But it wasn't it was an Easter egg. It wasn't a thing. It was fun. And I'm also, you know, my background is in music. I did a music degree. I was a music teacher. I was a musician. So I still try to play music for fun with my family. And I do want to get back into making music. Actually, I missed that a lot. But so when I move into my new house, I'll have a proper studio purposely for the music. So I think I'm looking forward to that a lot. Bryan Robinson 3:21 That's amazing. So what's your instrument of choice or musical talent of choice, I suppose. Salma Alam-Naylor 3:27 So when I was growing up, and when I was a teacher, my main instruments were piano and flute, but and singing, but I also taught kids how to play in rock bands for a few years. So I was a bass player. I don't really do much bass now. And I did some guitar and played some drums and stuff. But making music now I really like making electronic music mainly. I was also a musical comedian for a few years. Interesting. touring the UK, singing weirdly satirical British political songs. We'd get cancelled now so you can't hear any of it. Bryan Robinson 4:14 Out of curiosity. Is there any comedy in Britain? That's not satirical political comedy? I feel like everything kind of falls into it. Salma Alam-Naylor 4:23 Yeah, it's pretty much there's a lot to satirize in the British political system. But I guess that's for another podcast. Bryan Robinson 4:31 Yeah, sure. Awesome. Yeah. Let's let's maybe not talk about about the Jamstack. He's, he said that you're a Jamstack enthusiast. So what was your entry point into this ecosystem philosophy, what have Salma Alam-Naylor 4:45 you it was actually with Jekyll, the first static site generator many, many years ago, and that was the only one that existed you know, like around 2015 2016 and I had no idea what it was doing. But I was experimenting, I had really no idea that it was part of the Jamstack. At the time, I was just building a website, I had no idea that it was a static website, and really what that meant, but I was building something with liquid templates that compiled into a website. And I was hosting it on GitLab Pages at the time, not GitHub Pages. I was because I used to get lab for work. And so I kind of naturally gravitated towards GitLab at that time. But I guess the ecosystem sucked me in. I really don't know how I went from building my first Jekyll site to where I am now. I have no idea how, how this has happened, or what made it happen. But clearly, the Jamstack has, has a good thing going right. Like, it's fantastic. Bryan Robinson 5:51 So what are you doing right before you started playing with Jekyll, you were at some sort of company doing tech stuff he's mentioned you are you are using GitLab. So what was that like? Salma Alam-Naylor 5:59 So I did a variety of different things. Before I ended up here. I was working for some startups, I was working for a global e commerce company that was using like Java, whether bespoke kind of E commerce system with JSP front ends. I was also before that I was building a new e commerce platform in a startup that was JavaScript based what we're even using PHP, we're using PHP with JavaScript front end. But it was a it was a plain JavaScript front end, it wasn't statically generated, it wasn't using a framework or anything like that. After the global e commerce company, I was actually working for another startup building a React Native app. So like my career actually had nothing to do with the Jamstack. It was all my side projects. Until my last job, I was working at an agency, product agency. And we built quite a lot of things in the team. And actually we started gravitating towards next J S for these quick. They were initially proofs of concept, because next JS was pretty young at the time. But it ended up that next JS was a really scalable front end with a lot of capabilities. So we normally have like a dotnet back end and an extra as front end kind of thing with the API layer in the middle. And that was really my intro into the enterprise levels, scalable, robust, we can build whatever we want with the Jamstack kind of thing. Bryan Robinson 7:38 Alright, so let's fast forward a little bit. That was your last thing, right? How today, are you using the Jamstack philosophies professionally, I mean, obviously, Contentful is pretty, pretty big in that world. But also personally with both your educational stuff and anything else you're doing on the side. Salma Alam-Naylor 7:52 So one of the biggest philosophies that I like to promote the Jamstack is that just do it, just build something and get it live, just build it learn some stuff while you do it, and have a good time. Like, I can try things out without having to over commit to anything on the Jamstack I if I've got an idea for a website, a lot of the time I will get the idea or buy the domain, I will go on my Twitch stream for three hours. And I will build it and release it in that three hours. And that is the joy of the Jamstack. Salma Alam-Naylor 8:05 And what I love about that as well as it's so accessible to developers, because you don't have to over commit or pay for anything at that stage of IDEA inception. And so it's so accessible, and it's so in reach for so many people, for example, dot take dotnet I don't want to like hate on dotnet. It's great. It's a fantastic enterprise solution for enterprise products. But as a developer, as a front end developer, even though the dotnet comes with front end or back end stuff, what do I do when I've built an app? Like how do I put it online? So like I can just hook up a Jamstack hosting platform to my GIT repository, do a git push and great, there it is. It's online on a on a URL, I don't have to buy a domain even it's just there. And it's it's just so beautiful. And it's it really embodies the actual kind of agile kind of continuous delivery methodology as well. Salma Alam-Naylor 9:26 Every commit is a release, every commit is an immutable release. So you can roll back, you can have a look at the history you can you have, you can just click in a UI in like Vercel or Netlify or GitLab. Just click Oh, look at that. That's what I mean and week ago, I can compare that with what I've got now. And, and it scales. You don't even have to worry about scaling. If you get like a big hit on your proof of concept or whatever. And you know, it just enables developers to move fast to try things out to experiment and test Have fun without all the nonsense that developers have to deal with, day in, day out. And it's just a joy. Salma Alam-Naylor 10:09 And I've learned so much like, I never would have thought like, when I was building my like first websites maybe 10 10-12 years ago, my first proper websites, I never would have thought that I would be utilizing a CDN at the edge. And all of these different rendering methods, depending on the data that I needed to serve, auto scaling, immutable deploys, Git integration, infrastructure, serverless functions, you know, it's like a whole ecosystem that lets you try stuff, to see if it's gonna work. And if it does work, you can go further and make it robust. Like one of one of my biggest slogans is also build first engineer later. And that I think, is a really like, core part of the Jamstack. Just get it live and see what happens. Bryan Robinson 11:00 And you can get it live in any number of ways too, right? You can if you're making a content driven thing to begin with, you don't need a CMS. But yes, it takes like a few lines of code tweaked. And your next js, your 11ty, your whatever static site generator, right, like just ingest from somewhere else. And it's good to go? Unknown Speaker 11:19 Salma Alam-Naylor 12:24 Like I have a four year old. And I can't wait to show him the stuff like he could put a website live. That's just an HTML page and JavaScript file, potentially, you know, on the Jamstack, when he's like, eight years old, you know. And imagine us being able to do that when we were eight. Bryan Robinson 12:46 At like 14, I think I had my first website. And it was like Microsoft front page built like graphical UI, it was, it was quite choice. Yeah, my six year old, I built him a website in a day, he happened to have a piece of art that he brought home from school, that instead of writing his name on it, he had to write his his first first name, and last initial, because that was yet another, another kid in his class with that name. And then he wrote.com At the end, and I said, I bet that domain is open. And it was and like, I threw it together, uploaded the artwork. And then he told me, he's like, I want to like button. And I was like, I bet I could do that. But you have to do three pieces of art every week to to make it so that I'll build that for you. And then like, I was able to walk him through what I done. And he had no real understanding. But it was like, okay, I can. This is simple enough, I can show you and it's Yeah, super low bar. Salma Alam-Naylor 13:43 Yeah, I can't wait. I can't wait for that. It's so empowering. And it's so exciting to see what our children could make one day with, how it's being innovated, and the improvements and the things that are being done on the Jamstack. And Bryan Robinson 13:57 how it kind of opens up into like the the kind of natural open web platform. Yeah, walled garden is not something that you have to buy into. And it allowed, like, I used to teach a journalism class on HTML and CSS. And I was like, look, you'll you can you can do this. And if you do this, you don't have to depend on these other platforms anymore. And like, I would talk about the history of the web and how in the 90s, it was a creator focus space. And in the current state, in fact, like anything from like, 2010 on, it's very consumer based. And so it's like, there's this dichotomy of the web, and the more people that can be creators, the better. Yes, yeah. So we've talked about next JS some, obviously, you work at Contentful. We talked about the olden days of Jekyll and all that good stuff. What would you say is your current jam in the Jamstack? What's your favorite product? Or maybe it's a philosophy or framework. What makes you love the Jamstack? Salma Alam-Naylor 14:53 It's sounds really nerdy. But what I like about the Jamstack is the different types. Types of rendering that are available. This is like, this is so ridiculous, but it's like. So obviously, I work for Contentful. Right, and I'm dealing with data like data comes from a CMS. But data is not all created equal. And so there are four types of rendering depending on the data your data needs, like, it's not just about like pages and posts and stuff, like there are some bits of data that are very granular, they might need to be more up to date than the others, because obviously, mainly Jamstack is static first, right? And so but not everything can be static. But not everything needs to be client side. And so that what the Jamstack has now is like these four types of rendering. So back in the old, old web days, everything was server side rendered, right, you you your web request, hit a server that went to the backend that generated from all the logic a, an HTML document and gave it back to the client, right. So we still got server side rendering on the Jamstack, which I think right now is really great for personalization for things like E commerce, and other things. Because I especially talk a lot about using query params with get server side props with NextJs. JS, for those kind of personalized experiences, rather than just serving everything statically to the same as same to everyone. But then we've got the static, so there's, the second one is static generation. So you've got a plain site content site, nothing changes, nothing needs to update it, just serve it as quickly as you can statically do your visitors great. But now we've got some fancy stuff, there's incremental static regeneration, which is based on a cache validation strategy called stale while revalidate. And what this does, especially inside next js is you choose when the server re validates your data. And at certain intervals, and if it is out of date, it will rebuild in the background via serverless functions. And then for the next visitor, it will show it up to date. So that's like good for kind of data that it's great if it's up to date doesn't matter if some people see it if it's out of date. And then you've got distributed persistent rendering, which so if you want the Jamstack to scale, you, you might have 1000s, and 1000s, and 1000s of pages, right from your CMS, your E commerce site or wherever. Now we know that with the Jamstack, a site to go live and be deployed, it needs to be pre built and pre rendered, right, but 1000s and 1000s of pages could take hours to build. And if you want to continuously deploy and be agile and move fast and break stuff, you can't have every single bill taking hours and hours and hours. So distributed percentage rendering, what it does, it lets you choose what pages are pre rendered, and then doesn't pre render the other ones, you could pre render like your top 20 pages or wherever at build time. But then when someone goes to visit a page that hasn't been pre rendered, it gets pre rendered at request time, and then cached at the edge for future requests. So we've moved away from like building static pages and static data on the Jamstack blanket to a flexible model where you can choose when your pages rendered, depending on the type of data that you're serving your visitors and how up to date it needs to be. It sounds really weird, but this is my favorite part of the Jamstack. Bryan Robinson 18:19 So it obviously, right? Because like that's a lot. And like when you when you actually said like my favorite parts, the rendering modes like okay, all right, but no, totally. And like, here's my absolute favorite bit of that entire of that entire conversation, right? You don't have to understand any of what Salma just said, if you're listening, right? Because you can start and you can, like we talked about, like the accessibility of the Jamstack earlier, you can start and you can just upload an HTML file and you're Jamstack. But then you can bring on something like a nextjs or an 11ty or a Gatsby or what have you. And then you're doing a different kind of Jamstack. And then you can bring in, like you said, the incremental static regeneration ISR. We love acronyms. And that uses SWR another accurate acronym, and then you've got DPR. But you can learn those things slowly as you go. And like you said before it, you can build stuff and put it live and have no understanding of any of that and then come back and get a little bit of performance boost or a little bit of build boost or these little things. And you can go Salma Alam-Naylor 19:24 When you need it. You know when it's appropriate when your site needs to scale when you've now got a CMS when you've got different types of data when you convert to use this database or something like that. And it's so flexible. It's not just static sites. It's it's a whole ecosystem that is so far removed from the monolithic way. We used to do things with just everything, everything from the server at request time done, or you know, everything from the CDN or request time static done. It's like there's these combinations Have those but then some more clever stuff that makes your workflow more efficient. That means that you don't need to worry about these things. And it's just like whoever thought of these things. I wish I had thought of those things. Oh, yeah. I'd feel pretty accomplished. Bryan Robinson 20:20 Oh, yeah. And I mean, we'd be having a completely different conversation if either of us were there. But But, but in all seriousness, right, like, the fact that I built my son's website, and it has a like button, I have no clue. Like, I've been doing this a long time, I have no clue how 10 years ago, I would have done that, because I would have had to stand up a server, I would have had to learn PHP or Python, or a server side scripting language, I would have had to do all these things, I would have had to do the JavaScript on the fly on the front end, I wouldn't have done it just pure and simple, I would not have done it. And literally, it was two hours of work 2 serverless functions and low clients are JavaScript and I was done. Salma Alam-Naylor 20:56 Do you remember back in the day when front end development involved, like httpd conf files and things like that, and I had no idea what that meant server configuration, get out of my life, I just want to build some front end with JavaScript, I don't care about that stuff is in my way. And the amount of I used to work on the LAMP stack when I was first starting because I was doing PHP at work. And so like to set up a whole PHP server on your on your local machine with PHP, MyAdmin, and blah, blah, blah, like, I'm not hating on PHP is great. But as a front end developer, you don't want to deal with that. Because that's not what you are an expert in, that's not what you want to do. That's not what makes you happy. It's, you know, it doesn't make me happy, like the four different types of rendering on the Jamstack makes me happy. Bryan Robinson 21:51 Well, and I mean, you get further into that. And you have to think about the DevOps. And like I, I pride myself on being able to find all the edge cases and break everyone's DevOps, that's something that I'm incredibly good at. And it comes from, like, I learned about Vagrant, and, you know, virtual machines on my laptop. And I, I haven't installed a vagrant or virtual machine on my laptop in six years now. And it is so refreshing. Salma Alam-Naylor 22:18 Yes, I remember that used to do that was all I did at work on these big monolith systems and deploy systems. I wonder how far those systems are away from that now. But I wonder if that's still the same, but it's just, there's always, there's big pain points between Windows and Mac, as well. And the Jamstack doesn't really have that, because you're just running some Node in a terminal right to develop locally. And then you're just sending it to the CDN. It's just Bryan Robinson 22:46 that like, like between Linux that you might have your server and Mac the Mac flavor versions, then then you got like title case sensitivity. Like no, no, don't make me think about that. Please. Bryan Robinson 22:59 Let's pivot a little bit. You have a music history. And so I'm very excited now that I've learned that for the next question, which is what is your actual musical jam right now? What's your favorite musician or album or what's playing on a day to day basis for you? Salma Alam-Naylor 23:14 So I think whenever you ask a musician this question, they will always say, the classic developer line it depends. Always It depends. I have I like such a varied bag of music because I used to listen to such a varied bag of music when I was learning music and writing music. I like music from progressive metal to EDM to jazz to folk to weird sounds. A solid favorite band that I will always reach for is Architectes, which is a British metal core band. And me and my husband. I actually met my husband when I joined his band. So we've got like a lot of music in common. It was a progressive metal band long story a long time ago. But the song I have on repeat right now is more on the EDM side. It's called probably no one's ever heard of this. It's called move on by Grant and I love it right? Because another weird nerdy thing. This is a music nerdy thing now. You know how often in pop songs your head double tracked guitars like panned left and right. This song for the first time in my life, I have heard double tracked bass guitars, and they're playing slightly different things. One minute 47 into the song is a feast for your ears. It's amazing to listen to, and I can't stop listening to it because of this double bass track thing. Move on by Grant if you want to hear some nerdy stuff, musically. Bryan Robinson 24:42 Now for that you probably need stereo headphones, right? Yeah, exactly. Get the benefit of that. Yes. Wow. Okay, that's I am not disappointed by the answer in any way shape or form. I learned a lot I didn't even know that was the thing double tracked anything so excellent nerding on that Salma Alam-Naylor 25:01 Yeah, great nerding love it. Bryan Robinson 25:04 Alright, so before we go, is there anything that you would like to promote out into the Jamstack ecosystem, anything, you're doing Contentful anything. Salma Alam-Naylor 25:11 So on my Twitch streams, I stream twice a week. Currently, I always build on the Jamstack. And one of the most challenging projects I'm building is something called Unbreak dot tech, where, and sometimes it's weird to bring these stuff. These sometimes it's weird to bring these things up in these kinds of podcasts. But as a woman in tech on the internet, it's very difficult, full stop, to realize. And sometimes it generally falls on the women and the marginalized people to talk about the issues that we face. However, unbraked dot Tech offers a platform for men to talk to other men, about being a better person and treating women and marginalized people better. So I've been working on that on my stream, I am welcoming contributions from men who want to talk on the matter. And we'll see how it goes. It's a complete experiment. I have no idea. You know, again, I'm using the Jamstack to experiment and see how it goes. So it's all good. It's hosted on Netlify using like Netlify forms, it's built with NextJs. JS. And I work on that every now and then and see where it goes, you can now submit videos as well as articles to the site, and they have captioned I've got captions and all sorts of accessibility stuff going on. So that's the thing. Catch me on twitch twitch.tv/white p four, and three are the Bryan Robinson 26:45 one of the hardest screen names in the business. Salma Alam-Naylor 26:48 Yeah, I regret it holy. Bryan Robinson 26:50 Anyway, definitely check out on what was it Unbreak tech it on Unbreak dot tech unbrick break dye Tech because I have heard way too many stories, and everyone should know the stories and again, the women and the marginalized people have had to tell them enough. So men, let's step up and do a little bit more around that. Salma Alam-Naylor 27:09 I appreciate that. Bryan Robinson 27:10 Salma, thanks so much for joining us on the show today. And I hope you keep doing amazing things, especially with Unbreak dot tech, and Contentful and everything in the Jamstack. And we hope to see some really cool stuff in the future. Salma Alam-Naylor 27:21 Thank you, Bryan. Thanks for having me. Bryan Robinson 27:24 Thanks again to our guest, and thanks to everyone out there listening to each new episode. If you enjoyed the podcast, be sure to leave a review, rating, Star heart favorite, whatever it is, and your podcast app of choice. Until next time, keep doing amazing things on the web. And remember, keep things jammy Intro/outtro music by bensound.com Support That's my JAMstack by contributing to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

4 January 2022


S3E1 - Sean C. Davis on the Jamstack philosophy, NextJS, and more

S3E1 - Sean C. Davis on the Jamstack philosophy, NextJS, and more

Transcript Bryan Robinson 0:14 Hello, and welcome back to season three of That's My Jamstack. It's amazing that we've been going this long. I know it's been quite a bit since our last episode, but to jog your memories, That's My Jamstack is the podcast asks that time honored and tested question. What is your jam in the Jamstack? I'm your host, Bryan Robinson and we've got a lot of great guests lined up for this season. So without further ado, let's dive in. On today's episode, we talk with Sean C. Davis. Sean is a passionate tinkerer and teacher. He's currently working as a developer experience engineer at stack bit. Bryan Robinson 1:04 All right, Shawn. Well, thanks so much for coming on the show and talking with us today. Sean C. Davis 1:07 Thanks for having me, Brian. Excited to be here. Bryan Robinson 1:09 Awesome. So first and foremost, tell us a little bit about yourself. What do you do for work? And what do you do for fun outside of work Sean C. Davis 1:15 For for work, I am currently the developer experience engineer for stack bit. I've been in the web development space for about a decade or so the first nine years, were all in agency space building agency freelancing, building websites for folks. And just this last year, took a shift into the product space and spending some time with stack bid. And that's that's been so that's super exciting. That's what I've been doing every day. And I'm sure we'll we'll dig into that a bit. For fun on the side. Well, I feel like I'm the I'm the classic developer in the sense that there's always some, there's always some technical thing that's happening on the side. Right now that thing is, it's it's my personal site I've had, I've had a couple of different blogs that I've maintained over the years. And within the last two years or so I've been trying to focus that content, bringing it all into my personal site. But right now, it's still kind of just like a, it's just a, it's a blog, most of most folks who come there, Googled some problem, they get the solution, and it serves those folks really well. But I'm in this transition of trying to make it more of a learning hub. So that's, it's kind of a side project now. But that's but it's still like it's fun, but it's still I don't know, it's where it could still be in a developer. I'm so like, the the other part of me, I've got two little kids at home and like a lot of folks when the pandemic hits kind of focused a lot of energy and attention into the home. So it's various projects around the house or like like many people I am part of the reason you couldn't find flour at the grocery store because I got really into baking for a while and still doing that a little bit to some like some gardening kind of just fun fun stuff around the house. Bryan Robinson 3:06 In your in your baking exploits. Are we talking like bread, baking, pastry baking, but what kind of baking Sean C. Davis 3:13 where I spend most of my time and still doing a little bit today is the classic sourdough loaf. So mostly bread, mostly bread, at least I'm better at the bread. I've done a bit of the Sweet Treats and trying to learn a little bit about the decorating but it's just the presentation isn't my strong suit. So the flavor might be there. I've got a ways to go in the inner desert department. Bryan Robinson 3:37 Yeah, I've got I've got my own sourdough starter and all that. So I definitely feel I actually, I like a time I can be a hipster about something. And so when my son was born, actually so that was six years ago now. So pre pandemic, my wife my birthday that year, two months after he was born he got me a sourdough starter from King Arthur baking and amazing. I lapsed right because obviously like infant and all that and I baked for a little bit but yeah, then started back up during the pandemic as well. Because who, who doesn't want to do that? We're gonna do Yeah, exactly. You got something to focus on. Anyway, I actually love your site. I'm sure that when we do shout outs at the end, we'll talk about that Sean C. Davis calm but one things that came up on the little repeating thing on your homepage is you're afraid of bears and Bs. Is that Is that a thing? Or is that just a funny thing? Sean C. Davis 4:21 Oh, yeah, it's a it's a funny thing. I mean, I I I love both of them, but also am terrified of both that I do. I do. I guess I didn't mention this in the fun thing. I really enjoy hiking and camping. haven't done much camping since having little kids. We're gonna eventually get them out there. But we do a fair amount of hiking. And so yeah, I've had a number of run ins with both bears and bees. And it's terrifying every time but I also very much appreciate and respect them for what they do for us. Yes. Bryan Robinson 4:54 All right. So let's talk a little bit about the Jamstack. So what was your entry point into this space? It seems this idea of Jamstack or static sites or whatever it was at the time. Sean C. Davis 5:03 It that's an interesting question. Because Okay, so if you say, Yeah, entry point into Jamstack, or static sites, if you broke that apart and said, What's your entry point into Jamstack? And what's your entry point into static sites? I have two different answers. So I'll tell you a little bit about the the journey from one to the other. It's, I find it kind of interesting. So it static sites were was the first thing before I knew anything about Jamstack. In fact, before Jamstack was coined, because the gens Jamstack term comes from I think, later in 2015, I believe. So the first agency job, I had built a few sites with middleman, they were originally a PHP shop, and about the time I joined, were transitioning into becoming a Rails shop. And so Ruby was the bread and butter programming language. And there were a few clients that would come on, who didn't want to pay for a CMS or just like they needed something real quick, and it could be static and totally fine. And so we, we were building middleman sites, but deploying, deploying them to like a digital ocean or equivalent, it's still running on a web server still serving up these pages in real time, even though they're just HTML files city like kind of silly, but But there weren't great solid patterns at that time. And about that time, 2013 or so is also when I started building custom content management systems. I built it, I evolved, and I iterated on it. And I think I was looking at this recently, I believe there were four major, different versions that I built over the series, or course of about three or four years in there. And so I'll come back to that. But as I was, so set, this first agency working on middleman, I built a few middleman sites is when I switched to freelancing. And then at this at the last Agency, also, a few middleman sites like middleman kept kept popping up when I was when I was freelancing there. Actually, that's when I built the fourth and final version of that CMS. And at that time, this is probably I think we're talking about 2016, maybe 20. Yeah, I think that seems right 2016. And so the Jamstack term exists, the term headless CMS exists, but I had no idea that these things were things that people were doing. But I had this need, where I had a client who wanted a mobile native application, and a, also a website. And it seemed like a lot of the content was going to overlap. And I was like, Well, I'm building this next version of a CMS, what should it look like? Maybe it should be able to serve both of these. And so I was like, Oh, brilliant, decoupled architecture like this is this is gonna be great. And so that that last CMS I built was API driven. And, and I believe, I believe the website was a middleman site, it, it may have been some other framework, but it was like this Jamstack pattern, but again, still deployed, still using a web server to serve every request. So like missing that, that final piece that that Netlify gives us in the CDN in that instant cache invalidation. So fast forward to this last agency, and we're also a rail shop Sean C. Davis 8:40 and built a few middleman sites. But what happened was, why I think that the 2017, I believe, the the CTO, late 2017, early 2018, our CTO gets wind of the Jamstack. And so this is pre Jamstack. Conference, still really small kind of tight knit community. And we're like, and everything just kind of aligned because we won this work. For a company where it was going to be building them a new marketing website, it was gonna be a fairly big site. But this company also had a product and an internal product team. And that team had already switched to building that product with React. And so and we had heard a little bit about Jamstack. We heard about Gatsby and we're like, Oh, perfect, perfect time. Gatsby is the cool kid in town. Like we can jump all in on the Jamstack we think we can reduce development costs over time. You know, all the all the classic Jamstack benefits like we can get those and so we took a leap. We jumped all in and so that was like that was the real introduction to Jamstack and I find it I find it kind of funny looking back on it now because I spent all those years with Jamstack like patterns and using tool and middleman was part of all of those and then we're like, oh Jamstack, but also switched to JavaScript based frameworks at the same time, which I think a lot of folks went through that pattern. But I don't know if funny to reflect on. Bryan Robinson 10:11 Yeah, definitely. And like that that kind of journey is really interesting. Like in that agency world, the fact that, like you were having defined these patterns on your own, and then this community kind of sprang up next to what you were doing, and then look like we can do those things, maybe even slightly better than than kind of where we are now that we see kind of this broader scope, and there are products out there. That's really, really interesting. And it kind of mirrors on my own journey. I was at an agency when I discovered all this as well and never really implemented at the agency that we had a customer we had a full fledge, like custom content management system that like the agency had built, so never got a big we Sean C. Davis 10:49 did we did too, I don't it was like it was a compelling enough idea to our CTO, that he's like, we're throat, like we're throwing it all out where we're, I, we had a lot of, I mean, you know, there's issues with you, you have to maintain your own software. And it's it's another piece of the stack. And he's like that we were just getting bogged down with this site went down. And there's a bug in this CMS. And I think the crux was, there was one site where we didn't protect the slash admin route, like, should have done that. And we're like, Okay, well, let's, this is a way to never make that mistake. Again. I'm not Bryan Robinson 11:27 gonna speak for you on this. But my advice to anyone listening out there is if you think you should build a content management system, don't just don't do it. Sean C. Davis 11:38 Yes, yes. I don't know if I may have written a post about this at one point, or maybe it was just an idea in my head, but it was gonna be ashes, I should see if I can find it. The idea was, here's how you can build a content management system and my journey and exactly why you shouldn't do it. Like it's, it's, I think the the lesson I have baked in there is, it can be a really powerful experience for learning about content schemas and know how to organize pages and components and like structured data. But it's also just not a good idea to do it. Because there's there are how many dozens or hundreds of companies that are focusing on that problem every single day. Bryan Robinson 12:20 And let's be fair to our past selves, right, like in 2012 2013 weren't as many companies do, and they weren't as fully featured as they are today. I think it's kind of the same thing. A lot of people have probably created their own, like, custom static site generator in the past, like, Oh, I just made a couple include stuff like that. Let's just, oh, but we have them now. From from the middleman and Jekyll times all the way through to all the fancy ones today. Let's fast forward to now. How are you using Jamstack philosophies professionally? And personally? And obviously, you're at stack bet. So probably quite a bit professionally nowadays. Sean C. Davis 12:54 Yeah. Yeah. Interesting. So Stackbit is, I mean, if the Netlify is the Jamstack tool, but also when you think stack bit like stack bit is, exists, because the Jamstack exists. And it's, I know, the, the Jamstack pattern was really powerful and felt like a great entry point for newer developers. But it, it turned out that it was it was kind of difficult, because it's like you could get started really, really kind of simple to get started. Really difficult to go to the next level, which requires stitching together all of these decoupled services. And so stack bit pops up originally three years ago, as a solution to basically say, well, your start, here's the starting point. And it's Netlify and Jekyll and some markdown files or you know, in some styles, something like that, and it has evolved and now as a full fledge visual editor, what's, what's interesting is, we're in a transition where we're just about to release a new version, or the beta version of a new version. And it's still largely following that pattern. It's a really powerful visual editing experience. But the the Jamstack I feel like Jamstack is kind of in this identity crisis sort of mode or, or maybe not like figuring out where they where they fit. You know, what Jamstack actually means and knowing that the web is going to continue to evolve. And so if you, depending when, when this episode gets released, it's like what we, if we look before this release, and what happens after it right now you go to the website, so pre pre release, and like Jamstack is plastered all over it real big, top of the homepage. And I I'm seeing that this, this language is going to shift a little bit and so we're still very much Jamstack tool. Websites are going to get deployed. They're going to be built with next they're going to be static by default. They're going to be deployed To Netlify using Marco. So it's like still, it's still very much Jamstack pattern. But I think how we, how we talk about that might change a little bit. That's, that's professionally and personally, I mentioned, the, the project I'm spending most of time on now is my personal site, that site is built with eleventy. and deploy to Netlify. And using Mark, just local markdown for content. I, I've been thinking a lot about like, well, what's the future of this? For me, if I really want to make this a hub, and I want to make it a content engine? And I'm thinking well, okay, well, eventually, I'm going to have to go to like a next or something like that. But honestly, I every change that I make, I say, Well, okay, well, can I get this done with eleventy? And I consistently finding that the answer is yes, like it has, there's probably a limit to this some point in my future. But right now, I'm in love with, but eleventy is giving me and so I've kind of have this classic Jamstack pattern happening on the side and loving that Bryan Robinson 16:08 perfectly. And then I mean, I can go on and on about love. And it is it is kind of where I'm at in the last of two and Zach Leatherman, the creator of 11. D, recently just even showed like gated content with 11, D serverless. And so like the, the line is blurring about what 11 D can and can't do, it used to be pretty solid, like there was a pretty solid point where like 11 D didn't serve you anymore. Little little iffy. Now, Sean C. Davis 16:30 I think that the big question for me was, oh, there were two. So one is that I'm I built my own kind of component system using nunchucks shortcodes in and so like, you have this smart transformers that make it nice and easy to work with. But it's I mean, it's still a little clunky, I would love to be able to use something like reactors felt and then hydrate them on the fly as needed. And fortunately, we have been homes and slinky, working on that exact problem. So that's really exciting to follow that. And then the second question I had, and second hurdle I thought I was going to run into was authentication, I don't need it now. But my plan is to start to build out some courses, and some of them will be free, and you don't have to track them. And other ones, you know, I feel like well down the road, I'm going to want people to people are gonna want to sign in, they're gonna want to track their progress, maybe some of them are paid. And just this last week, a video came out where Zach was going through the process of showing authentication with 11. D. And now I'm like I, I mean, I feel like the wall I'm going to hit now has less to do with features, and is probably going to have more to do with how many files can we read from the file system? And but I also think that it's getting smarter in terms of incremental builds. And so maybe I don't hit that. Well, I don't know. I'm gonna keep pushing it. We'll see what happens. Bryan Robinson 17:58 Yeah, that wall becomes smaller and further and smaller and further. Yeah, that's right. That's right. All right. So we've talked about a few technologies. We've talked about a few methodologies. But what would you say currently? Is your jam in the Jamstack? What's your favorite service? Maybe its stack, but are your favorite framework or philosophy? What what makes you love working in the Jamstack? Sean C. Davis 18:19 Yeah, talk philosophically for a minute, I suppose. Yeah. So what I really loved about the Jamstack, especially in the early days of me discovering it, I'm thinking pre NextJs. JS blowing up. So like 2019. And before? Is that it? To me, it was it's, well, it's still very much this way like you. It's a methodology. It's not a prescription say this all the time. And there's something really powerful in that in that if here's a pattern that we think is a really strong way to build websites that it's it improves the developer experience, and delivers great experience for end users. But you can use whatever tool you think is best for your particular project. And I what I've realized is as the web continues to evolve, is that the there were more kind of guardrails on what Jamstack is than I originally thought, like there, there are more opinions baked in than I originally was, was seeing. However, it's still within within those guardrails and within that pattern, very open and, and not not prescriptive in terms of tooling. And I think what that has led to that even though the community is led by a product in in Netlify, that it's very open in talking about what tools you can use in the space. It's really everyone's really respectful in that space and empowering and so just like the My Favorite I'd love to philosophy itself, the community that came out of that philosophy. It's is like a really, really great thing to be involved in. But I think in terms of tooling, yeah, I can't. I mean, I love stack. But that's why it's why I'm at stack, but I think it's a, it's a great, I do think it's a great entry point into the Jamstack. space. And it it's, it's a such a unique tool that it can serve. The personal blogger, especially someone who isn't super technically savvy, wants to learn a little development. But it can also serve a serve enterprises that have hundreds 1000s of pages, but are storing those in Contentful, or Sanity, some other headless CMS. But really, I keep coming back to eleventy. Especially, there was some news in the last couple of weeks where Rich Harris, the creator of spelt joined, we joined Vercel. Right, so so it's he gets to work on it full time. It's still community driven, but it still also kind of feels a little bit like funding from Vercel. And with that, I, I don't Okay, I don't know if this is entirely accurate. But it's, I think of the group of static site generators or front end frameworks, popular front end frameworks today. The vast majority of them are funded by or have some ulterior motive for where they're there. The people are working for some particular company. And so even though they're open source, they're, I mean, I don't I'm not saying that they've done their communities to services in any way. But eleventy what I love about eleventy is that it is it for now. I mean, today, it's all about the community it is it is very much driven by the community. And it is. And I just I love the way that Zach leads that project. It's, it's really exciting. And similar to what I said about a stack bit and what we just mentioned about eleventy, it's, it's great, because you can get started and know if you know HTML, like you can, you're good, you can build a website, and you can just you can fly. And then you can you can piece together things a little bit at a time, like learn a little bit of nunchucks. Or eventually if we have if when slinky gets to version one, and maybe it's like maybe you just dip your toes into React and, and, but that it also seems like it's going to it's scaling well for a handful of folks. And so it's not like you learn it as an entry level tool. I think that's that's where it was for a while, like a great entry level tool. And then our I don't want to build a serious site. So I'm going to go get a serious framework. It's starting to become a serious framework, and, but without necessarily raising the barrier to entry. And I think that's, that's really cool. So that's, yeah, I just, I feel like I'm just gonna keep talking about stack bid and 11. D all day. Bryan Robinson 23:07 Yeah, no, that doesn't that that's a great combo. Anyway. Um, I also think it's entering you said, like, you know, rich, rich chains go into Vercel. And, I mean, Zack Letterman's at Netlify. But he's building sites for Netlify. And so I think the interesting thing that's happened there is that he's learned what a company the size of Netlify needs out of some of what it's doing. And that's what's been kind of powering is not that Netlify has been prescribing what he needs. But Zack as a developer using 11. D to build sites for an enterprise level company now knows more about what what 11 D needs for that area. I think that's an interesting bit of information that he's kind of feeding back into the the 11 D framework. That's Sean C. Davis 23:51 a great point. Absolutely. Bryan Robinson 23:53 All right, so let's shift gears a little bit. Let's go away from technology and let's let's find out what is your actual jam right now? What's your favorite song or musician? Or what are you listening to day in day out? Sean C. Davis 24:04 Alright, so I had I had to look this up because I'm I am all over the board in terms of music and I haven't hadn't been listening to as much recently as I have in the past it you know, excluding like, all the all the Disney soundtracks that are on all the time, kids. Okay, so just to tell you how weird my, my taste in music is. I was like, alright, well, what are what are a few of the what are a few of the albums that have been on in the last week or two? Okay, so I've had gone all the way back to the Beatles revolver. I love that one. Okay, then what I'm almost like chronologically What have I done? I put on I put on Jay Z's Black Album. I had. I forget what it's called is Sturgill. Simpson. He released a couple blue grass albums, I think I think they're called cutting grass. Maybe not. Do you know? I do not know. Okay. Blue Grass. And then what did I have? I've had the newer Lord and Taylor Swift albums on as well. So I'm like, all over all over the place all over the Bryan Robinson 25:18 place. Yeah. That's awesome. That's I mean, it's variety is the spice of life, right? Sure. Yes. Yes. I love that. Now, it's kind of open forum, right? Is there anything that you that you are doing right now you stack that whomever that you want to promote and get out into the Jamstack. Community. Sean C. Davis 25:34 I mentioned a little bit earlier, this this idea of the the Jamstack identity crisis. And I try to talk about this without sounding disparaging or critical, because I actually think it's a good thing. And I think there's a lot to come in come from being from the community being introspective and figuring out who we are. And so I had, I've had lots of conversations around this topic throughout the year. And in, in doing so what a few of us realized is that the, it? You know, I think we all kind of have a little bit of different opinion of like, well, where's the line? What exactly does Jamstack mean, but maybe it doesn't, maybe it doesn't totally matter. But it's still, like, like we talked about earlier, like, there's still a there's still that the the guardrail is in a sense, like, there, there is an established pattern, in a way to build websites, the web is going to continue to evolve, and it won't necessarily be the cool thing on the cool kid on the block forever. But that, that that community can still exist. So what what a few of us have done is we said, Okay, well, what if we step outside of that? And to say, What if we created a space where folks could talk about all sorts of different patterns and ways to build websites, and Jamstack and all of the tools and variations within within that community is part of that discussion, but it's not the only part of that discussion. So there's also folks who are building rail sites and are choosing rails for a good reason or choosing full stack WordPress for for a good reason. I'm sure there's a good reason in there somewhere. Maybe. And so it's it's goofy, and it's brand new, but it's called good websites club. And it's at you can visit the bare bones website. It's good websites dot club. And so we're there's, it's just a tiny discord community with a little bit of chatter now, but there are there are some grand visions for it. There's someone who's talking about conference and 20, to 23, maybe some, maybe some various meetups throughout there. Personally, I am starting a show that I'm calling the the good websites show, and I don't know exactly what it's gonna be, it's gonna, it'll evolve. But it's, it's gonna start as a live just like a live interview show. And in kind of, we'll talk about, yeah, grab various folks from around different communities and talk about problems they have solved on the web, all kind of in a way to help inform developers or even marketers, content editors just have different different patterns, different ideas that are out there, and kind of kind of help them hone in on what exactly they are. They're going after, and I think we'll see, my prediction is we're gonna see it largely be, there's, there's gonna be this huge fear to draw a Venn diagram, like a lot of overlap with Jamstack in the beginning, and maybe it evolves, I don't really know. But that's, I'm kind of excited to see where that goes, while also being really heavily invested in Jamstack. And seeing how that evolves, because this, this recent announcement of Netlify got got their next series of funding, and they're gonna pump $10 million investing in the Jamstack. And that is really exciting. I cannot wait to see what that means for the community. So that's, I'm working on Yeah, like, websites club, but but, but also really excited for the Jamstack at same time, Bryan Robinson 29:25 absolutely cool. I'm now a member of the discord as of two months ago. So I'm really excited to see that everyone else listening should go go sign up as well. And then keep an eye out for Shawn doing good websites show in the future as well. So Shawn, thanks so much for taking the time to talk with us today. And we look forward to seeing more amazing stuff you in the future. Sean C. Davis 29:46 Alright, thanks for having me, Bryan. Bryan Robinson 29:48 Thanks again to our guest and thanks to everyone out there listening to each new episode. If you enjoy the podcast, be sure to leave a review rating star heart favorite whatever it is in your podcast app of choice. Until next time, keep doing amazing things on the web. And remember, keep things jammy Intro/outtro music by bensound.com Support That's my JAMstack by contributing to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

28 December 2021


S2E13 - Miguel Arias on form handling and lowering the learning curve

S2E13 - Miguel Arias on form handling and lowering the learning curve

Quick show notes Our Guest: Miguel Arias What he'd like for you to see: Kwes Forms His JAMstack Jams: Lowering the learning curve, Kwes, and AlpineJS His Musical Jams: Drake | Classical (and coding to rainfall) Transcript Bryan Robinson 0:14 Hello, everyone, welcome to another episode of That's My Jamstack, the podcast where we ask that simple Kwesion, what's your jam in the jam stack. I'm your host, Bryan Robinson. And this week we have Miguel arias on the show. Miguel is the co founder of Kwes forms. Hi, Miguel, thanks for being on the podcast with us today. Miguel Arias 0:42 Thank you for having me, man. It's a pleasure. Awesome. So Bryan Robinson 0:44 tell us a little bit about yourself. What do you do for work? What do you do for fun, that sort of thing. Miguel Arias 0:49 Okay, a little bit about myself. I'm the co founder of Kwes forms, it's a, it's a form service ideal for like the Jamstack community. I like to think of us as like the next evolution of what form service should be. Before we were around, there were a lot of over called, like endpoint services, to kind of handle your, like your submission, storing and whatnot. And then we kind of felt like there was a big gap in the market where, you know, like, it kind of took care of that. But then you had to go on your own and figure out validation and components, like date pickers, multi step, things of that nature. So we kind of felt like it was a perfect opportunity to kind of get in there and that space and put out a product that that we would love to use, you know, and that we felt like maybe other people in that space would like to use as well. So what I do for fun, you know, COVID is kind of killed a lot of it, but when I, what I normally do for fun is play basketball. The weird thing about it, though, is that I actually like to practice more than actually play. Sure, I think it comes with like my perfectionistic nature, I just, I just have this thing that I like to train and just and my wife is the same exact way. So I'm glad that we found each other because we didn't go to the parks when it's empty. And just like practice all day. It's like the weirdest thing, but that's what we like to do. You know, Bryan Robinson 2:09 I can totally get that, like, as soon as you as soon as you introduce other humans into it, then like there's so many ways that like imperfections happen because of that. Some people find beauty in that and then it's like, but no, if you really want to, like compete against yourself, like doing it on your own just makes so much sense. Miguel Arias 2:26 Are you like sports guy, he like we like playing basketball? Bryan Robinson 2:30 I am I am not particularly athletic. I do have sports. Basketball is is up there. I am very when you introduce other human beings, I am very bad when it's just me shooting and like, you know, kind of running around. It's okay. Like I could I can play horse decently. But you get somebody in my face and I fall apart. Miguel Arias 2:50 Yeah, you know, I kind of find it like it's like therapeutic in a way just to kind of compete against yourself. It's cool. It's a good way to kind of exercise patience and stuff. I really like it. Bryan Robinson 3:00 Yeah, it's like, it's like, Alright, you know, you know, free throws, right. And like, it's really funny. My, my mother is actually a huge like NBA fan. And like when she's rooting for her team, she gets so frustrated at the players missing free throws. Miguel Arias 3:11 Yeah. Bryan Robinson 3:12 Don't you practice that enough? Like, can't you just make that shot? It's like, Well, yeah, except for when all the variants happen. And you know, you will miss every once in a while. But yeah, you get to kind of practice that. And you get to like, find your form. And I think there's a lot of a lot of cool things that happen in that space. Miguel Arias 3:30 For sure. Yeah. Cool. Bryan Robinson 3:31 So let's talk about the Jamstack a little bit. And I'm sure we'll kind of weave in some more about Kwes as we go forward. But like, what was your entry point into into the idea that Jamstack or static sites or whatever you want to call it? Miguel Arias 3:41 Yeah, the funny thing is when we started our service, um, we really just started it, because at the time, like, I met my co founder, because he was actually my boss. Yeah, when I was about, like, 18, I was looking to, to get a job so I can marry my girlfriend at the time. Well, I mean, she's my wife, now. She's my girlfriend at the time. She's my wife. And so we used to use a service called formstack. You know, which is great, but it was like, a, it's like a drag and drop type of service. And then one day, I just kind of burst into his office, as I normally would do. And I was like, bro, we should make our own like form service. You know what I mean? Like, not drag and drop something that I would like to use, just because it was a hassle to kind of go through that process and then have to like, put it on your site, you have to strip all this styling. It was just like, it was like an unneeded amount of work. Right. It's how I felt. Bryan Robinson 4:33 I use Formstack quite a bit at the agencies that I worked at. And yeah, it was, it was super handy for that for like the editors making the forms. It was super awful for like the developers working Miguel Arias 4:43 Exactly. So then we kind of felt like, you know, this really isn't the ideal tool for us, you know, so then I burst into his office and I told him, we should make our own thing and he kind of just like, looked at me like I was crazy. I was like, Yeah, he's like, go back to work. So then, so I was like, Alright, cool. I went home, I kind of just kept thinking about it, it's just in my nature, like, I get obsessed with things. So I kind of kept thinking about it. And then one day, I think maybe it was like, the next day, the next evening, I was in the shower. And then I just got this idea of how I would be able to go about it, you know, and I, like ran out of the shower naked, like, super wave naked. And I ran to like my notebook and start writing down and my wife was looking at me, like, I'm like a lunatic, you know? And, and so that's how we kind of started it. But I didn't really know what Jamstack was at the time. I never even heard of it. Yeah, the only reason, the reason that we got into it was because as it started gaining, like popularity, we started noticing a trend, like we started noticing people telling us, oh, this is perfect for my Jamstack site. And this is good for Jamstack, whatever. And I was like, What the heck is a Jamstack? You know, we looked it up and, and we felt like, you know, this is awesome, I kind of felt when I saw it, it made perfect sense. Like, that's where the industry at least, I feel like that's where the industry is probably headed because of how simplistic it is in nature. Like, I feel like the theory, or the concept of a Jamstack is to like, try to simplify, you know, your workflow as much as possible, you know what I mean? So I felt like, you know, it was a perfect entryway for our service, and I just kind of just fell in love with, with the whole concept of it in the community, which then allowed me to allow me and my partner to kind of improve the product now that we kind of knew what was really meant for right hand out, let's improve it even further. Bryan Robinson 6:37 Out of curiosity, what was kind of the, the beginning there? Like, what, where, where are you targeting the forms before that cuz like said, like, it is, like a great fit, like finding these services that you can fit into the Jamstack is just is so important. So like, Where was the methodology? Like, who are you targeting before you kind of had this discovery? Miguel Arias 6:54 Bryan Robinson 7:45 I got to say, yeah, wherever developers were working and needed a form that was maybe outside of whatever stack they were using, or didn't want to bother with, they could just pick it up and put it put it in Miguel Arias 7:55 Right and make something fun, you know, it's like something that they would actually enjoy using, we felt like if a developer could enjoy using it, that was that was our guy, you know, Bryan Robinson 8:03 Out of curiosity, is there, is there any sort of in the actual, like infrastructure behind the product? Like, are you using kind of notions that you've kind of discovered in the Jamstack? In the back end? are we are we talking? Is it? Is it kind of its own monolithic structure? Or is that you know, microservices or serverless functions? What what's kind of going on there? Miguel Arias 8:22 Well, it's definitely its own thing. It's the script itself, because it's built on JavaScript, right? Because, you know, handles your front end validation, back end validation, you know, helps you build out these like complex things like multi step forms, repeater fields, things that normally kind of take up a lot of your time, that's like monotonous, it helps you achieve these things in a much more enjoyable way. Right. So then, the first time I built it, I had built it on a front end framework. But then as I kind of got to understand the Jamstack community a little more I, my partner, and I realize how how much importance is placed on speed, right. And things being lightweight. So then we ended up, you know, rebuilding version two, which we released, like, a few weeks ago. And we we dropped the size of it from, like, 300 kilobytes to about 20 kilobytes. Oh, wow. Yeah. So and the only way that we were able to do that was to kind of try to stay to as native JavaScript as possible. You know what I mean? I guess to answer your Kwesion, like, yeah, we try not to use too many like microservices to accomplish it just so that we can kind of keep the file size down. Yeah, but yeah, so it's basically just supposed to be a script that you import into your site, and then you know, you're good to go. Bryan Robinson 9:41 And I love the idea that like, at first you had these kind of bigger pieces to it, but then seeing how people were building on the Jamstack and realizing the importance they placed in certain areas. So like you said, like, speed and performance being such a high level thing that that allowed you to kind of pivot the product in a way that was in line with those Same philosophies. Miguel Arias 10:00 Yeah. Like that just kept coming up, you know, and which, which is funny, like how I said we had spent, like three years building on that product. But then when that kept coming up, we just kind of realized, you know, this was not built on the right foundation. We had to scrap it go back to the drawing board start over, you know, but it was great. You know, I kind of I saw it as a learning experience. When I built the this the second version, I really knew who I was building it for, you know, Bryan Robinson 10:28 yeah, that the audience is super important to kind of figure out and find exactly their needs. And it's super cool that like the it's a it's a JavaScript solution that has performance built in like that's, that's always super important, because JavaScript can get real heavy real fast. If you're not paying attention to that. Miguel Arias 10:44 Yeah, definitely. Definitely. Bryan Robinson 10:46 Nice. So now that you've kind of kind of joined this, this Jamstack community of kind of builders, like, what would you say is kind of one of one of your jams in the Jamstack? Like, obviously, Kwes, I would have to assume as is one of them, but like, what sorts of ideas and like philosophies and maybe even other products and services? Are you really enjoying that you've kind of found yourself in this niche? Miguel Arias 11:07 Well, I mean, you took my first answer. Okay. Yeah. I think Well, like I said earlier, like the whole concept and theory behind Jamstack elite, at least for me, like, I really love the fact that it's kind of like, okay, you simplify your product. And then once you feel like, it's It is as simple as possible. You'd like simplifying again, you know what I mean? Like, I love how there's such an emphasis on like, lowering the learning curve, like this new thing came out pretty recently, Alpine js, I don't know if you've heard of it. Yeah, it's kind of like Vue js, at least, the way that they even describe it, it's kind of like uJs, where it's like very, very similar syntax, super simple, but it's written in like HTML markup pretty much. And I just blew my mind when I saw that, because I felt like Vue JS was already extremely simple. But then they found a way to simplify it even further, you know, and that's, like, super inspiring, I feel like you can always simplify your product to the point where it's just becomes almost like second nature to us it you know, like is, like picking it up. And learning it is like not a problem. Bryan Robinson 12:15 I was gonna say like, and getting it as close to like, the natural languages of the web is also like, super nice. Like you said, it gets Alpine is even close, like view got close to like, some the declarative nature of like HTML. And then Alpine took it a step further and said, You know what, let's make it look exactly like HTML. You know, Miguel Arias 12:32 it's funny, you say that, because that was like the whole concept behind our idea for the validation rules, because we had used certain, like, you know, other services that because, you know, there'll be services out there that are just front end validation rules. But I always felt like they were kind of, you know, like, not super difficult to write, but you had to write it in in JavaScript. And I felt like, it would be super cool. If we could put out a service where you could write the validation rules in just like markup, you know, what I mean, like HTML markup, so then that kind of gave us the idea to just add them inside, like a rules attribute inside the input. You know, like, you know, you have your input, you say, rules, and then you add your validation in there, and then a validated front end and back end at the same time, right. So it's like, the whole concept behind it was like what you said, trying to get it as close to like, the native, you know, markup language as possible. And I feel like Alpine JS did like, an amazing job of accomplishing that, you know, Bryan Robinson 13:30 yeah, yeah. And I like, I like that you're like building it in that way, too. Because like, if you think about the the nature of a product that is like making forms as easy that it's like, including your site is possible, you might be working with somebody that is, you know, creating maybe just HTML CSS, right, and they still won't be able to like import that into their project. Or maybe they're using something like 11 D, and it's a very, like HTML feel everywhere. And they still want that without having to go outside and be a JavaScript developer like that. That's, that's such a handy thing for something that should feel as simple as forms should feel. Miguel Arias 14:07 Right? Like, we want it to be able to allow users to build down like a complete form, like everything you would really need, but without really needing to know how to write JavaScript, you could and you could, like, extend it further, which is awesome. But you really don't need it to be able to create a fully functioning complete form, you know what I mean? Bryan Robinson 14:27 Yeah, and when you kind of look at it, and you look at, like, the big competitors in the space, like you mentioned, formstack, and there's stuff like wufu, that are these, like, you know, you know, GUI interface, like let's drag and drop the the the form fields in, like, that's, that's one step further, and then what you get out of it is like a jumbled mess. Whereas this can kind of be that that middle space, where it's like, you know, what, an editor might actually be able to stumble their way through this kind of thing. But it's going to be in a way that developers can come back and be like, Oh, no, no, we're gonna do this slightly differently, because I understand the underlying code. Miguel Arias 14:58 Yeah, that's true. But really our our intended audience is really just developers. If you know, HTML, CSS, I mean, you don't have to be like a crazy programmer, if you know, HTML, CSS, any developer can do it, you know, but that's why I felt services like formstack, and wufu. They're just like in a different space, right, they're servicing a different audience. Like you said, like the editors, people, like in marketing teams or something like that. And that's, you know, that's great, that's perfect for them. But then we kind of felt like they were also servicing developers, but just not as good as, as it could be, you know, what I'm saying, at least in my experience, when I use it, it just kind of felt not like a natural workflow for me, you know, Bryan Robinson 15:38 and what, you know, I used to look into, like their API's and to send the biggest thing you could do, and you could do, like, you could have created your own like, form API based on their API, but you know, no one's got time for all that when they just want to put a form on the page. So like, having something that is itself, given his own API driven experience, just means you get that kind of for free at that point. Miguel Arias 16:00 Yeah, and it's just, you know, it's simple, it's enjoyable, it's, that that's really the goal, which I feel like, it's the goal of overall Jamstack just like services like, like Vercel and Netlify, that just kind of, because I feel like Jamstack, you know, the the nature of it, is you have your front end framework, right. But then you got like the missing piece, which is the rest, like, you know, the whole back end, part of it, deploying, and in this case, forms, emails, things like that. So I feel like services, like ours, you know, services like Vercel, and Netlify, they kind of complete that whole environment for them. And I, and I honestly really do feel like it's where the industry is headed, just because of how simple it is to kind of start it up and get it going, you know? Bryan Robinson 16:47 Well, and the nice thing is, like you mentioned, like Netlify, and, you know, they've got the like, the super simple, like form stuff built in, right, you toss Netlify attribute on your form, and you're done. But that doesn't really accomplish, the more complex, you know, UI as you might want to do around forms. Because forms can be super simple, and that's great. But they can also be, you know, complex business, decision driven things that need some extra logic and need some extra handling built in, that you'd have to kind of roll on your own, if you're trying to use like, the super simple solutions that are out there, Miguel Arias 17:19 right, and things like, you know, not to bash on what Netlify hazard form services like those, they're just like an endpoint that don't really have, like a front end aspect to them, there's a certain kind of security that you're going to be lacking there. Because, for example, like validation rules, especially ours, we our validation rules are unique in the fact that they're on temporal. So if you were to, like, add a form and validation rules, you know, load of the page, if you were to inspect element and try to remove the rules, no, it's not, it's not gonna happen. They're the rules are there to state, you know, and maybe try to inject a new field, if you try to remove a field, you know, because it validates on the front end and the back end. So then when you kind of don't have that, that part of a form service, you know, it's a lot easier to be able to inject fields change, like the type attribute of a field, or if something's a read only, you can like go and just take off the read only attribute. And, you know, that is just a certain kind of security that will be lacking, if you're kind of lacking that part of it. Bryan Robinson 18:20 And you could, you could handle that on the front end, on your own. But like I said, like, when it comes to forms, you just want the form to work, you don't want to have to go and roll that yourself, you rather do whatever cool feature you're working on, that needs the form, like work work on it elsewhere, Miguel Arias 18:33 because it's just monotonous. And the thing is that every project that you do is kind of, you know, almost like 99% of the time, you're gonna need a form, you know, so then, you know, this part is solving a piece of it, but then you kind of have to every single time, figure out a way to add these, everything else has missing to it, you know what I'm saying? So, it's nice to just have a service that you could, you know, import the script plug it is done, you know, and I mean, it, everything's done, you don't have to go on a scavenger hunt and find, you know, like another Validation Service and then find a way to validate on the back end and then find yours or something like compliance, for example, right? Like you have these medical sites that need HIPAA compliance, and things like that, you know, what I'm saying is easy to, it's so much better to just be able to trust a company to kind of handle that for you. And that provides a really easy experience in regards to like implementation. Yep, Bryan Robinson 19:27 I did one HIPAA compliance site one time and I never want to touch that sort of thing again. Yeah. Unknown Speaker 19:35 Bryan Robinson 19:37 what what is your what's your actual jam right now? What are you listening to what sorts of music are you into or your favorite song or musician? Miguel Arias 19:44 You know, I wish I could be one of those people that have that's that's super unique taste in music knows all like the underground people before they get famous or something. I'm definitely not that. I feel like music has this this super unique way of putting putting you in like, the frame of mind that you want, right? So, you know if I'm trying to relax or something, maybe I'll listen to like something classical. You know, if I'm trying to focus, I'll listen to something else. And I'm trying to get inspired. Maybe there's like a Drake song that inspired me. So I think it's just gonna depend on, you know, what kind of what kind of move what, what kind of emotion I want to put myself in, right? Yeah. So I think it's cool how we can we live in this era that we could just, you know, on demand, just be like, okay, I feel like being inspired. Let me put on this song, you know? Bryan Robinson 20:32 So so let me let me ask this then. So when you're when you're coding when you're working on the product, what's in your earphones at that point, Miguel Arias 20:39 it's gonna be the weirdest thing ever. But what I listen to at that point is literally just like rain. I put like, how in the rain. I don't know why, but it just, it really helps me focus like crazy. So I just put like the sound of rain for like, 10 hours or something. Or like snow or something weird like that. Bryan Robinson 20:54 Yeah, I found some like some lo fi like YouTube videos that have like rain and stuff in the background like that. That's so soothing. Like, you can definitely get you into a focus minds. Miguel Arias 21:03 Yeah, I like that, too. So sometimes I put like the lo fi, hip hop or something like that. Bryan Robinson 21:07 Nice. So So what would you like to promote and kind of get out to the, to the Jamstack community as a whole? I mean, obviously, we're probably gonna talk about Kwes, but go for it. Miguel Arias 21:16 Yeah, I will, you know, we're still kind of new in the scene. You know what I mean, we launched it about so the whole story, you know, we worked on it for about three years. We launched it last year, we scrapped it somewhere. Like it like, I don't know, October not really scrapped, because it's still out, you know, it's still being supported. But then we kind of put out the the new version, I would say, maybe it's been a month already since we put it out. Okay, and yeah, I would like to get that out there, you know, for people to check it out. Give it a try. You know, we offer free trials and we feel like it's a really great service and we would love to hear anybody's opinions on it. The only reason why has gotten to this point is because of you know, all the love that people have shown and people reaching out to us. You know, we We always love when people reach out to us. They call it a game changer. They they really seem to love the product, you know, so any anybody out there that wants to check it out? give their opinion, definitely welcome you to hear. You could also check us out on Twitter. That's a Kwes forms, kW LS fo RM s, and my personal Twitter Miguel JSMIGU, el, Jay AR, I as I almost forgot how to spell my own name. Bryan Robinson 22:35 Well, and don't worry, I'll grab those links. And I will put them in the show notes for everyone to kind of grab as well as i think it's it's what kwes.io, right kW. Yes. Awesome. So, Miguel, thanks so much for being on with us today. And I hope you keep doing amazing things at Kwes as well as Kevin this broad Jamstack community. Miguel Arias 22:52 Awesome, man, thank you so much. You too. You got a great podcast going on. Here are some of your episodes. I love them. Bryan Robinson 22:58 I appreciate it. Thanks so much. Bryan Robinson 23:04 Thanks again to Miguel and thanks to everyone out there who listens week after week. If you enjoy the podcast, be sure to leave a review or a rating in your podcast app of choice. Until next time, keep doing amazing things on the web and keep things jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

3 February 2021


S2E12 - Anthony Campolo on full-stack serverless frameworks

S2E12 - Anthony Campolo on full-stack serverless frameworks

Quick show notes Our Guest: Anthony Campolo What he'd like for you to see: FS Jam - Full stack Jamstack His JAMstack Jams: RedwoodJS His Musical Jams: Radiohead | Bon Iver Transcript Bryan Robinson 0:14 Hello, everyone, welcome to another episode of That's My Jamstack, the podcast where we ask that not so tricky question, what's your jam in the Jamstack? I'm your host, Bryan Robinson. And this week we have Anthony Campolo. A full stack web developer and RedwoodJS advocate. Bryan Robinson 0:40 All right, Anthony. Well, thanks for coming on the show with us today. How are you doing? Anthony Campolo 0:43 I'm doing great. Thanks for having me. I'm a big fan of the podcast. So it's great to be here. Bryan Robinson 0:47 Excellent. I appreciate it. So tell us a little bit about yourself. What do you do for work? What do you do for fun? Anthony Campolo 0:52 Yeah, absolutely. So I am a bootcamp student. Someone who is kind of coming to programming from a different area of life, I was originally a music teacher, and then also ran a performing arts summer camp for about four years, and just decided that I wanted to try something else out. And you know, that the journey I got to, to coding is, is long and winding, which we'll talk about a little bit as we as we go on. But um, right now I am at lambda school, and learning full stack web development. And so yeah, that's where I'm at. Right, so your lambda school, you do that kind of full time for a small cohort, right? Yeah. So they have a full time and a part time program. So full time is a nine month program. And then part time is an 18 month program. So I actually started full time, and then switch to part time. So I've, I've done a little bit of both, it kind of just depends on you know, if you're also working to support yourself as well, or if you can really do it kind of full time. So yeah, it's, it's it's nice, because they have that flexibility. So people can kind of choose the schedule that that fits for them. Very cool. Bryan Robinson 2:03 So what do you do outside of obviously, now you're learning to code what's, what's your idea of fun nowadays? Anthony Campolo 2:09 Yeah. So I've gotten just really into open source. And it's the type of thing where I'm doing it both to to eventually help my my career, but it is something that I've really enjoyed. And I've learned a lot about RedwoodJS. In particular, I've spent a lot of time blogging about it. And I've also given a couple meetup talks about it. I did one at Jamstack Denver, and another one for GraphQL Texas. And I'm also now doing some some podcasts. I got both Jamstack podcasts done by Bryans. So that's good. And yeah, so that's kind of where where I'm at now, I'm really kind of deep into into the redwood world. Bryan Robinson 2:51 Very cool. Very cool. So obviously, you're a bootcamp student. So you're picking up development as you go along. But what was kind of your entry point into this idea of the Jamstack? Was it Redwood? Or was it something something else in the past? Anthony Campolo 3:03 Yeah, so it definitely was way before Redwood and already kind of being familiar with with the Jamstack beta easier to kind of get what Redwood was was going for. But to take it back a little bit. I originally before I was doing any web development stuff, I was actually learning like data science and machine learning stuff, is what I was first trying to get into. And a lot of people who do that type of research, they have their own personal websites as well to talk about the stuff they're working on. And there's a couple where I would scroll the bottom and it would say it was created with Jekyll. And so Jekyll is funny enough static site generator created by the creator of Redwood, Tom Preston-Warner. And so I think that was probably the first time I ever had heard of the term static site. And I ended up not going that route. I ended up just making a WordPress website when I was first getting into like blogging. But then once I started to transition more into web development and learning JavaScript and react in particular that I learned about Gatsby, and so I spun up a Gatsby blog. And I listen to a lot of podcasts. So out here podcast with, with Kyle from from Gatsby, or I'm Matt from Netlify. And so I was I was hearing all these all these people like talking about these ideas, and it was just kind of floating around. So it was it's been a kind of a slow, slow roll into it. But it's definitely it's just like it's a huge, massive thing that's just there. And if you kind of pay attention, it's hard not to poke that bubble every now and then. Bryan Robinson 4:38 Exactly. And so so you said that you were kind of when you're getting into development you were doing you know more on the machine learning side and stuff so that like more computer science II stuff, what's kind of your, your, your plan, where do you want to go with web development, kind of in a post bootcamp world and all that? Anthony Campolo 4:52 Sure. Right now, I mean, I'm really into just kind of like the, the dev advocacy side of it, because I really enjoy creating. In the tutorials, I enjoy going out and talking about these things. And my background as an educator kind of fits really well in that in that niche. And there's you know, there's different kind of corners that that people go for. There's some are kind of more education, focus, some are more outreach, focus, some are more about like, bringing feedback back from the community. And so redwoods been cool, because all the kind of mechanisms for feedback are already in place. So I see myself more just like getting out and explaining it to people like, what is this? How does it work, and then that's like, kind of the whole role that I've kind of monopolized. Bryan Robinson 5:41 Nice, you've got kind of that that arts background, which definitely helps when it's like framing the story of how to do that education, too, that's always a handy thing to kind of have in your tool belt. Anthony Campolo 5:50 Yeah, you definitely need to be able to put things into a narrative for people to really want to, like, pay attention, especially for technical things. But I find that the history of this thing is is so fascinating. And I've actually spent a lot of time writing about kind of this transition from static site generators into the Jamstack. And now even like the Jamstack is turning into something else that we're not quite sure what it is yet. Because we've we've gotten rid of the acronym and now Jamstack is stands for nothing. And it's just kind of like an architecture. And so I'm really interested in those kind of ideas of like, Where is the Jamstack going? Bryan Robinson 6:27 Definitely I think, I think that there are so many new technologies kind of coming out Redwood being among them next JS having like, all these new ideas around what static and and like, server side and what these different pieces bring to the table and how they can kind of be intermingled? I'm kind of curious, like, how does Redwood see itself? Cuz I know it's a it's a full stack front end kind of application builder. But what what's the community kind of see in terms of like, where it's going? Anthony Campolo 6:54 Yeah, so it's called a full stack serverless framework for the Jamstack. So you have the Jamstack part, which is about having your front end be just static assets that you can serve from a globally distributed CDN. And then the full stack part is, how do we get those same benefits attached to the database and the back end? So it's about how do we also get that back end to be distributed globally, which, like fauna, db is doing a lot of really interesting research there. And then you have the serverless part of it, which is, how do you get your whole application to be sort of smushed into just these like AWS, lamda handlers, or, you know, Google Cloud Functions or Azure Functions. So the back end is set up in a way. So it's easily deployable to these sort of Functions as a Service serverless back ends. So it's, and then also, I didn't even mention graph QL. Like graph qL, is kind of what ties the two together. And then so there's a lot of there's a lot of tech that goes into it. And it takes a long time to kind of wrap your head around, which is why I like spent a lot of time writing about it and talking about it. And you know, I have hours and hours of material about it at this point. Bryan Robinson 8:15 How are you kind of pursuing kind of redwood right now? Like professionally, personally, what what are you building with it? What what are the applications that you kind of see optimized around what Redwood can do? Anthony Campolo 8:26 Yeah, so the first thing I did was just go through the tutorial. And this is what I would really recommend everyone who is getting into this, you should just go through the whole tutorial and kind of build out that project because they started with what they call tutorial driven development, which is sort of a play on README driven development, which is another term Tom was using a while ago. And the idea being that you create the tutorial, and then you build the framework to make the tutorial work. And so it's, it's a really crucial part of it. And now that I've kind of gone through that, it what it does is it has you deploy to Netlify for your front end, and then Heroku for your back end, does that have a Postgres database, so I'm really interested in kind of like other deploy targets and other databases you can link it up to so I wrote an article about how to connect it to fauna dB. And then that was also deployed on Vercel. And then there's other people who are doing work with like, the serverless framework, and like Azure, Postgres. So I'm interested in kind of like, now that I know how to build out a redwood project is like, what are the different ways we can deploy it? And what are the different ways that we can get it out actually, onto the internet? Bryan Robinson 9:43 Yeah, and like, how can we do that that database structure because that's, you know, traditionally what's always been the fun challenging aspect of the Jamstack is like, how do you get that third party data and, and if you're having it be your own database at that point, like a Heroku, Postgres kind of idea. That's not that doesn't necessarily fit in with some of the other Jamstack ideals, whereas a Fanta DB type solution might and like serverless functions and lambda might over like, you know, hosting elsewhere. How is that going? How does that feel in terms of ripping out a Postgres server and installing a no SQL server or maybe a third party data API of some other sort, Anthony Campolo 10:21 it's really interesting. And another thing you have to consider this is, what we haven't talked about yet is Prisma. And Prisma, is, it's called a query builder. So it's a little bit like an ORM, but a little bit lower level. And that's what you use to do a lot of your database work for like Postgres, or MySQL, or like SQL Lite. So as I said, when you go through the regular tutorial, you you eventually have a Postgres database, and you're using SQL lite and development. And Prisma is what you use for like your migrations and a bunch of stuff like that. So you have to rip out Prisma to use fauna. So that's actually kind of the biggest thing you have to consider is do you need the functionality that Prisma gives you. And you know, some people don't, because they're, they've never used it, they don't even they don't even know what what it does so. But once you kind of learn Redwood, through the tutorial, you learn it with Prisma. So it can be easy, or can be hard to kind of tell where the two, actually where the line is between the two. Because redwoods csli actually reaches into Prisma c li and what do you do Redwood commands, some of them are actually Prisma commands. So So for me, I actually learned a lot through the fata project in terms of just like, Where is the boundary between Redwood and Prisma. And so that's kind of the thing you're gonna have to, to figure out if you want to decide which kind of route you want to go with with your database when you're using Redwood Bryan Robinson 11:52 It's interesting, like one things I've kind of seen in the Jamstack world in general, but with some of the conversations around Redwood is this idea that opinionated frameworks aren't a bad thing. So like, you know, Gatsby comes with its unique flavor of react. And it's tightly coupled with GraphQL. Redwoods coming with its own brand new things, I've actually heard it favorably compared to, to rails in a lot of ways. Like, it allows you to create things very quickly, if you're doing it in their opinionated way. It seems like we're going a lot in that direction. So that if you have a set of opinions that you like, you can find some sort of tooling around it. And seems like Redwood is kind of settling into a very specific niche there. Anthony Campolo 12:34 Absolutely. This is a big thing with other frameworks that are compared to a lot you have like Blitz is now they're like rails inspired, opinionated, full stack framework. And then you have Bison, by Chris ball, which is a really interesting projects that is still pretty new, and is up and coming. But it's Yeah, I like it. Because it's nice to have options, as nice for me as a beginner to be able to see a stack put together. And so even if, you know, I ended up moving away from Redwood and doing other things, just learning how the redwood stack was put together, is has given me things that I can take from for the rest of my career. So it's not about like, this is the one true way to do kind development so much is like, here's a way that we think works for us through our experience as as developers and taking bits and pieces from different frameworks they've used in the past and, and the rails comparison is interesting, because I think this can actually trip some people up. And they think of redwood, like rails. And so they think, you know, whatever advantages or disadvantages rails has, Redwood will have those same advantages and disadvantages, but actually, it was made to contrast rails in certain ways as well, there are things that Tom doesn't like about rails that he specifically is trying to do different. So I think that's, that's an important thing to note, too, is that, that don't get hung up, like too much on the rails thing is that it's rails inspired in the sense that it wants to have like, a happy path. But what that happy path is, is not the same thing as rails. Bryan Robinson 14:12 Yeah, and definitely, you know, what I mentioned that I it's, it takes the positive side of like being able to scaffold quickly and build quickly from the rails ideology and kind of runs with that. I think it's really, really interesting that, you know, coming from, you know, Tom's kind of rails background and working on various things in the past, he's been able to bring that sort of hard knocks education into what he built. I think that I mean, you mentioned that I think you're exactly right, that it's one of the best ways to learn is to take a very opinionated framework, and see how somebody has set it up somebody who has, you know, decades of experience, you then get to learn from those decades of experience, which I think is a very, very powerful tool. Anthony Campolo 14:54 Absolutely. Yeah. Yeah, it's been fun. And it's not just Tom to like actually Peter, Peter pastorius he's worked on a lot more of the code than then Tom has. And I say he's kind of like the Rosetta Stone of this project is that it came out of the work that Peter and Tom were doing on chatter bug. And so they were, you know, doing react and graph qL, and all that kind of stuff. And they and they wanted to put together a framework that would work for that, that would give them the same sort of benefits they had from rails, but with this new technology, Bryan Robinson 15:28 I'm gonna date myself a little bit here, and I'm not too afraid of that, I suppose. But, uh, one of one of my biggest learning experiences, and this has been a decade ago now was actually I primarily use jQuery back in the day, as many people who were, you know, doing web development a decade ago were doing. And the biggest thing I learned was when I actually read through the code of jQuery and dissected how it worked, which was Mind you, like, five years after just using the framework is like diving in and saying, Oh, that's how JavaScript callbacks work, or Yeah, like other pieces that I hadn't experienced and hadn't had to write because of jQuery, I then was able to learn by reading it. And I think that that a lot can be said about, you know, these new frameworks, and that as well, it's like, learn how to use it, you know, get it system under your belt, and then like, wait, no, now, how did they write that? How does that function and like, it just, there's so many education opportunities? Anthony Campolo 16:27 Yeah, it's a weird time getting in now. Because learning things like react, like, I know that I should try and like read through the React source code, but it's, it's hard. And it's really hard to even know, like, what what to get out of that. And, you know, they also talk about how you can't really do View Source anymore, because of how much all the all this stuff gets minified and spit out. So yeah, it's really hard to even know like, you're using all these tools and where it even break in to try and figure out how they how they work. Luckily, it's like Doc's have gotten a lot better. So really, like, you should just read through, you know, the, the React docs front to back, and I find most people they don't even do that. But um, yeah, back in the day, where you could just go read through the source code, I think that's, um, it's not really a thing you can do very much these days. That's fair. Bryan Robinson 17:15 Yeah, I guess there's also like, the idea of like, all the code splitting that we do to whereas, you know, jQuery used to be, you know, one directory with like, you know, 10 files in it, nothing, nothing major, you know, now, if I were to rewrite jQuery, it would be 100 files, you know, 150 files just to do that same functionality. And the same can easily be said for, you know, react and for the for the meta frameworks built on top of it. Anthony Campolo 17:39 Meta frameworks and meta meta frameworks, because there's now frameworks built on top of frameworks, like Blitz and bison are built on top of next. So I find that really interesting how you have all these different layers, like further and further layers of abstraction with frameworks built on top of frameworks, it's, it's super fascinating. Bryan Robinson 17:57 You can go back and in like the first dozen or so episodes of the podcast, like I was talking with a bunch of Gatsby people, a few next people, I would ask, like, how do you refer to this? Because it's not a static site builder anymore. That's not what this is, is not a static site generator. And they're like, Oh, you know, it's an application framework. And then a guest, I had second half the sea for a season. Like, oh, Google is calling it meta framework. I was like, you know, that makes sense, a framework on top of a framework. But yeah, then we've now got meta meta frameworks, which is exciting, but the language feels a little tortured about it. Anthony Campolo 18:32 Yeah, I know, Jason Lengstorf was calling Gatsby a content mesh. At one point, which I thought that was a really fascinating term, especially because of how it uses graph QL. And this idea of kind of, like, you have this one universal middle layer between your back ends and your front ends. And so you can create whatever front you want, and then pull in whatever combination of back ends you want. And, yeah, that's the thing that I found really interesting with with Redwood is, is just when you have graph qL baked in from the start, like what you can kind of do with that what kind of power that gives you it's, I really liked graph QL. But that's been the thing. I've enjoyed learning the most out of redwood, for sure. Bryan Robinson 19:09 It's definitely way better than then going and getting the entire, like, Jason return response from an API that has, you know, dozens of things that you don't need inside of it. I'll always appreciate what graph qL did around that. Anthony Campolo 19:23 Yeah. And it's one of those things where I imagine a lot back end people are like, graph qL is not simpler. It's much more challenging. It just seems like it's simpler once it's set up. So yeah, I definitely sympathize with with people who who think you know, it's a huge startup cost. But I think that the benefit that your your front end gets from just being able to have really flexible queries is is just you know, it's really high. Definitely. Bryan Robinson 19:49 So I think I can make some assumptions here. But what would you say that your jam in the Jamstack is I'm assuming Redwood and graph qL but Want to leave the door open whatever else you want to say in here? Anything goes. Anthony Campolo 20:03 Yeah, I mean, that's definitely what I've invested the most time into into learning and to communicating. But I am really fascinated by the the entire ecosystem. And I'm starting to learn a little bit of like Nuxt cuz I'm really interested in view three with like the composition API and how all the changes are going to come in with that. I'm really interested in spelt and like sapper, and I just heard about elder which is supposedly like the new static site generator thing for for spelt. That's supposed to be really good. So yeah, red wood is definitely like my bread and butter right now. But I'm constantly expanding out and try to look at what else is out there and, and other ways to do things. Because I find that for me, that's the best way for me to learn is to compare different ways of, of doing things. And then you have in one framework, and it doesn't have something and other framework has to figure out how to implement it myself. And very cool. Bryan Robinson 21:02 So what's your actual jam right now? What's your musical jam work? What's your favorite song or musician? What's in your earphones? Anthony Campolo 21:08 Yeah, so I used to be a full time professional musician. So music is obviously a big thing for me. My favorite band has always been Radiohead, going back to like I first got into them around when in rainbows came out, which was like 2007. So that is my favorite band ever since then. I really enjoy Bone Iver. I first got into him back when his first album came out. And his career has just been incredible to see now he's like, he's Kanye West albums. And he's been nominated for Grammys and all that. And then like, just 90s indie rock. So like new book hotel, Modest Mouse, built a spill, you know that that whole kind of scene? That was always really influential to me. So yeah, those are some of my favorite bands and artists. Bryan Robinson 21:55 Very cool. All right. And is there anything that you would like to promote something you're doing? You log out to the Jamstack? world at large? Anthony Campolo 22:01 Yeah, so there's this thing called Fs jam. So full stack Jamstack. It's, um, you know, it's what Redwood is, is going under right now. And a friend of mine, Christopher burns, he is kind of creating, like an organization around this. So the Twitter handle is Fs jam o RG. So Fs jam org, and we'll be putting out some content and possibly even getting a podcast going. So yeah, that'll be something to look for. Bryan Robinson 22:32 Very cool. So something to stay tuned for, as they say in the industry. Right. Bryan Robinson 22:37 Well, thank you, Anthony, so much for coming on the show today. And I hope you keep doing amazing stuff with red wood, but also beyond as you're saying, like, there's so much to learn and so much to to write in, right, Anthony Campolo 22:46 Totally. Yeah, thank you for having me. It's been a blast. I'm always really enjoying the content you put out and I've learned a lot. So continue to do what you're doing. Bryan Robinson 22:54 I appreciate it. Thanks again to Anthony. And thanks to everyone out there listening week after week. If you enjoy that podcast, be sure to leave a star heart review, rating, whatever, in your podcast app of choice. Until next time, keep doing amazing things on the web and keep things jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

20 January 2021


S2E10 - Dan Barak on making your own stack, the maturing of the Jamstack and more

S2E10 - Dan Barak on making your own stack, the maturing of the Jamstack and more

Quick show notes Our Guest: Dan Barak What he'd like for you to see: Stackbit's offerings, but also reach to Dan out for a conversation about Stackbit or the Jamstack in general. His JAMstack Jams: Stackbit | Next.js | Sanity.io | Contentful His Musical Jams: Jazz; whatever Spotify plays to keep pace to This week's sponsor: Auth0 This week, we've got Auth0 as a sponsor. While their prowess at authentication is important, they're also releasing a ton of new tutorials and courses on their YouTube channel, including a free course on building a full-stack Jamstack app with Next.js. Transcript Bryan Robinson 0:14 Hello, everyone, welcome to another episode of That's My Jamstack the podcast where we ask the intriguing question, what is your jam and the Jamstack. I'm your host, Bryan Robinson. And this week we have the amazing Dan Barak. Dan is the co founder and CEO at the Jamstack company Stackbit. Before we dive into the episode, though, I want to thank this week's sponsor, auth zero, we'll talk a bit about all the amazing educational content they're putting out at the end of the episode. If you're curious about that, Jamstack and auth education, head on over to a0/to/tmjyt for all the videos. Bryan Robinson 1:06 All right, Dan. Well, thanks for being on the podcast with us today. Dan Barak 1:09 Thank you for having me. My pleasure. Bryan Robinson 1:10 Yeah, no problem. So tell us a little bit about yourself, what do you do for work? What do you do for fun, that sort of thing. Dan Barak 1:16 I'm the co founder and COO of Stackbit. And we're the only platform and for the complete platform for the Jamstack. And so I come from a product background, I've been a product manager at Lyft and Facebook before that, and startups and before that, as well. And for fun, I usually do things that my six year old does, and means like a lot of Legos, riding bikes, and etc. Bryan Robinson 1:43 Very cool. So my five year old is absolutely in love with video games, which I kind of apologize for, in numerous ways, multiple days a week. But yeah, that's that's pretty much my, my fun twos, oh, whatever my five year olds into right now? Dan Barak 1:57 Exactly, yes, we just, we just started using the Switch. So he's, he's very much into that. Bryan Robinson 2:03 That's, that's what we do quite a bit too. You just you watch daddy play, and then daddy gets to actually play video games a little bit. Dan Barak 2:09 Exactly. Exactly. Bryan Robinson 2:12 So tell me a little bit about what does it actually mean at a kind of a product company like Stackbit to be, you know, COO, what do you do on kind of a daily basis there? Dan Barak 2:20 So the COO at a purely technology company, mostly I think, and it's about running the company smoothly. So it's, it's managing most of the of the people and making sure that they have what they need to move forward, and they're not blocked. And they're also, you know, on the administrative side, you know, that everything is a Okay, everybody's has, you know, contracts getting paid, like all that work smoothly, we're fully distributed company across the world. So making sure that part is running up and running. And other than that, is also kind of dealing with no as a co founder, and you also deal with a lot of product coming from a very deep product background. And a lot of the product work is done between my one of my other co founders, like in CO hot Pressman, and we're like working together on the product, making sure engineering is up to date and makes and, you know, has a good roadmap, we obviously have an engineering manager, but in discussing priorities in etc. Other than that, obviously go to market talking a lot with customers and clients, and selling in etc. Like just everything, making sure everything takes Yeah, definitely kind of a catch all, but also some important things along along the the product side as well. Bryan Robinson 3:48 Yep. Very cool. So you've been at you, you mentioned Facebook and lifts some outside, you know, not to use the word traditional, but definitely some, some older, longer standing tech companies, but what was kind of your entry point into this idea of the Jamstack, of which sackbut is such a kind of an integral part. Dan Barak 4:07 Yeah, so as often happens, I think we use it these things happen from I've both like a domain and passion and from a personal passion, you know, and one of the things that was very, very much important to me was working with, with great people, and, and ohada. And I go way back, like 1012 years, as well as with Simon, our third co founder, who's the CTO. So we've, we've known each other for a very long time, we've worked in the past together and manage like not to kill each other. So so you know, it's like, very good signs. And, and, and so, you know, mostly, I've switched product domains a lot as I was transitioning between companies, and never did I kind of clung too much to like a specific domain and always They're very excitable and excited about everything. So I can deep dive very quickly into each domain. Unknown Speaker 5:09 Bryan Robinson 6:40 Very cool. So. So I'm kind of curious, like, the collaborative nature of kind of where the, where the Jamstack is kind of starting to go towards, like, how, how content people, editors, and developers and designers, how all of those kind of play together, it's kind of what drew you over to kind of this world, especially like in the Stackbit world. Dan Barak 7:03 Yes, essentially making sure that you know, that the Jamstack is growing, and it's a wonderful, and platform, I think, or stack, you know, it's like it has great developer experience. And it's fast, it's secure, it's scalable, all those great things. And but from you know, like the marketing perspective, or the business person's perspective, and you're kind of going back in time, and you have to edit things in a way that they're disjoined, from the actual result, making it very hard to, to actually understand what you're changing, you have to look for, you know, how is this thing that I see on the screen right now, on my website? Where is it defined in the in the CMS? And how do I find it, and I change it? And if I change it, like, Is this too long? Will it fit? Okay? Okay, I have to build it, you know, I have to like, now wait seven minutes for my site to build just to understand that. So it feels like a very, very hard process. And we hear that from customers, both from like, agencies that are trying to move people over to this, you know, much better and much better ecosystem, and from people internally in companies. And one of two things happen, either they are presenting, you know, like, Hey, we want to, like, have all these benefits, and then they're presenting and the tools that are available to the business person or to like the non technical stakeholder, and they're looking at it, and they're like, whoa, wait a second, what is what is this? What do I do with with this interface? I don't want it right, give me WordPress, or something like that. Not that because it's good, but because, you know, allows me to do a little bit of my job, and better. And, or, on the other hand, is like the engineers making know, the right decision for the organization, transitioning to the Jamstack, but then kind of blocking in many ways. And the non technical people, you know, it's like, even like coin lists, in this in kind of hilarious, it's hilarious. You can like testify on your cell phone. It's hilarious. Maybe maybe stupid is the right thing. But it's like jam stuck, like you're in a place where like, some of the choices have been made. And now you're lacking, you know, this, this one solution, one platform, and that unifies everything, and you just have like, the separate tools. Bryan Robinson 9:31 Yeah. And it's kind of it's oftentimes, you know, we talked about the, the benefits for the Jamstack has to developers, those are very obvious in many ways, like in terms of like, work in the code that you want to work in and, you know, not have to worry about the things that you don't want to worry about. And we talked about, like some of those end results, right, the websites that are out there, they're fast, they're secure, kind of out the box, but oftentimes the neglected audiences that kind of in between, like in between the developers And what is finally, finally on the site is copy, you know, copywriters, and editors and designers putting, you know, photography around. And it's definitely, I think an unders underserved to a degree audience for the Jamstack. Even though, if the website is faster and more secure, it's gonna be better in the long run, but if you can't edit it, that can also be a problem. Dan Barak 10:25 Yes, exactly, this is and, you know, this collaboration, most of the websites and most of the, you know, am marketers working in a very collaborative manner. And, and organizations have their own workflows, you know, who gets to make changes, who gets to, you know, now we need a translation. So a page is now ready, it has to be translated into other languages. And it has to be approved, you know, sometimes by your manager, sometimes by legal. And oftentimes, you know, designers want to look at what, what you've made changes to, and kind of, you know, make that happen. And this is like, obviously, in large organizations, but even you know, even when somebody's publishing by themselves, they still have a little bit of a process, they go through, you know, like, they validated, it works well on mobile, and do a bunch of other things, you know, clicking the links, making sure nothing is broken, if you have an e commerce site, and making sure you know, end to end, you can you can complete a purchase, etc. So, so facilitating that, and making sure that and that collaboration can happen is I think key. Bryan Robinson 11:35 So let's talk a little bit about stuck back. Because, you know, we'd like to talk about, you know, how you use the Jamstack professionally a decent bit, how are you utilizing it, obviously, Stackbit is a is a very Jamstack centric company. But like, philosophically speaking, how do you all kind of perceive the Jamstack. And we're, we're kind of going Dan Barak 11:56 I think we perceive the Jamstack in a way that is very much and you know, about, about choices, and about customizing and picking the right solutions for you. That's why and you know, Stackbit is this kind of end to end solution and platform for the Jamstack, and allows developers to just pick whatever combination, and have site generator and CMS and, you know, themes or designs that work for them, this is very much into, it's about the not just fly by the choice, right? We will support and work with, with whatever tools you choose, you've chosen, but it's also if you if you choose to create a site with Stackbit. And that also kind of nothing is a walled garden and nothing is proprietary like you Am, as a developer who created this, you have access to the repo, it's like your repo, it's your and, you know, your space in the CMS. So Stackbit is very much and you know, we believe will provide a lot of value. And, and that's why we're not trying to build any walls around it, right, you can like build your site with staff bid and edit with the Stackbit studio, you know, send previews, publish, do whatever, if it's not valuable, stopping to use that that is just, like, super easy, they don't, you don't have to do anything. And even while you're using staff that if somebody really prefers to go into the CMS, you know, and like, you know, there's something more complex that they prefer to do with Sanity, or like, just make some changes there. Because like, that's, that's their workflow, then it all works together, right? The the the preview reflects all the changes that are made in code made in the CMS, whether it's within Stackbit or without. So having this openness is very important to us. And being able to, and support all the different tools in the ecosystem is important. Bryan Robinson 14:01 That's a really interesting word choice there with with the fact that you're talking about, you know, choice. And oftentimes, I come from an agency background a little bit to you, you end up locking your agency or your company into a very specific stack, because you like x templating engine, or you like the benefits that you get out of y CMS. But in the future, you may not want those things anymore, or you may there may be the next cool development framework that comes out. And you wanna switch over to that, but maybe you've lost your clients and they think this is the only way I can edit or this is the only CMS that I know. And so, one of the one of the virtues I stole about the about the Jamstack is the idea that any front end developer can make a website from, from soup to nuts from beginning to end. But if they only specialize in that one Like front end framework, and it only communicates with a couple CMS is in a very specific way, it could be very difficult to make a switch. But sounds like making these pieces not to go back to your first question about having a six year old and playing Legos. But it feels like there's a lot of Lego pieces that we're hoping to kind of be able to make interchangeable so that we can use framework of choice with 18 different CMS is with, you know, all these different pieces. Dan Barak 15:26 Yeah, that is that is very correct. And I think you're, you're right, that there are multiple use cases here, right. And oftentimes, people, especially the build sites for a living will kind of settle into one and framework and one workflow and kind of make that happen. And we support that fully, right. So you can, you can, if you have like a specific theme that you're working with, that has all the elements and all the pages and all the things that you were kind of like you would use for your clients, then and you know, you can import that into Stackbit create sites repeatedly with it, and then either make the customizations yourself in the studio, even without a developer that point, right, because if even if the developer has defined the framework, and then somebody was like a Tinker and like this, like a technical person can now work with the Stackbit studio and customize it, and then hand it over to the client, even allowing the client themselves to, to make changes. And when when I say client, like obviously, this is kind of like the agency setting, but the exact same thing happens within companies, right, the engineering team, the front end builds the site, and then they they kind of hand it over to the marketer, more product person to to build. Bryan Robinson 16:41 So we definitely just change the word client to stakeholder, and then we're good to go. Dan Barak 16:45 Yes, exactly. Yeah, I think like the stakeholder feels like more formal and kind of more rigorous, but yes, this is essentially Yes, you have the developers and you have the stakeholders. And so we definitely support that piece. But yes, we also we also support the the option to easily change, and, and switch and technologies, we see people that are using our site builder, right, they just, you know, they just go over just activate and can super easily within 60 seconds, create a website. And that website can be built with different configurations. So so you know, some people are just like iterating over all them and trying to see, you know, which CMS works best for them. What is, you know, what is the difference between using next js and Gatsby and Hugo and Jekyll and how everything is arranged. So they're learning from it. And I think the nice thing is that, you know, developers are kind of very much a lot of them are early adopters and like to fiddle around and play with things and change them. Having kind of this em studio that abstracts some of it from, you know, your stakeholder is very nice, because they, they don't have to learn a different CMS, and if this is using reference objects, instead of just you know, like, and other ways to represent content, and it's very much abstracted away, and the people who are more usually kind of more like, prefer, you know, like the same interface, and then would love to kind of like, have a specific workflow because they're trying to get something else done, right, they're trying to get their job done, which is changing the website to reflect the brand to get traffic to grow the company, and they would have a very stable interface to work with. Bryan Robinson 18:35 Now, that makes that makes total sense. So, normally, at this point, we would ask, what's your jam in the Jamstack? And I've got some assumptions around what yours might be. So let's hear that and then maybe ask a follow up or two? Dan Barak 18:49 Well, you know, I'd be lying if I'd say that ours is not my favorite, right is this, because I think, you know, like, being I've started out as a developer, and I think I've, I've kind of matured out of it too fast, you know, I was too eager to do other things. So I kind of like very quickly and got out of it, you know, just just stay and just switch to product management and switch to like, you know, being a founder of companies. So, you know, it's like, Am I feel my choices are probably, like, you know, less informed, and I love the fact that I have the ability to play around with our tool and super easy, like, if I had to start a Jamstack site from scratch, it would probably like, take me a week, you know, to define everything correctly understand the content schema, you know, and kind of make sure well, the web hooks are all set up and I make the right choices. And I I obviously you know, you know, kind of like many people and I'm very pedantic, you know, like, I really want to be like get the best you know, in class things. I would like to Spend an obsess over it for hours. And, but so yeah, so I really love this and this kind of ability to work quickly and fast and see things visually. And personally, when I, when I start, when I start in Jamstack site, which I do multiple times a week, is I really, I really love the themes that we offer, because there have been built in with the sun about, like, their design is great, I think but it's also they have the right content schema in place. So I have a lot of flexibility into changing things around, you know, I can, I can always add more sections, which things are like around in terms of like, if Is it like right oriented, left oriented? Do I have like images or videos or like, whichever of those work? Am I usually prefer to use next js. And in in terms of CMS is I kind of alternate all the time to keep me on my toes. And I think the it's usually Sanity and contentful. And also, you know, just like, plain am just using Git, you know, just putting markdown files in Git and having that it's always kind of like a simple and fast solution if you don't need anything, and fancy. So I Bryan Robinson 21:18 put a few files together in a folder and you're done. Dan Barak 21:21 Exactly. And then and then obviously, you know, we deploy to Netlify. And yeah, from that point onward, I kind of like, I switch to the studio and forget about all the others and Bryan Robinson 21:33 let all those technical concerns just float away, because you don't need them anymore. Dan Barak 21:37 Yeah, and they're like, you know, as, as somebody who's like been in product and all these, like, very data driven companies like Facebook and Lyft, I'm, for example, I'm a sucker for a B testing. You know, it's like, I just, I just can't operate without data. Yes, I have gut feelings. And I have, you know, kind of like a vision for certain certain things. But, and, you know, like, and AV testing on the Jamstack was always kind of such a pain. And we're now releasing, releasing this feature, which is in allows you to just like, if you're a business person, a marketer, product managers just create an A B test with one click of a button. And we're just we're sitting there, because we're sitting on top of everything else, we're just orchestrating all these changes. So we can, we can create a new branch in git, and GitHub, and then you know, another environment in the CMS and tie it to the to the AB testing feature on Netlify, eyes, and CDN and make that all kind of work together. And so for me, it was like a very kind of passion, project to nature, we can, we can do that. And people can actually make data informed decisions. Bryan Robinson 22:48 Yeah, and it's one of those one of those interesting things. Like, it's a feature that Netlify has had, for most, like most the time that I've been using it, which is a long time now. But it was never everything that you need to actually do AV testing properly, say, Oh, you know, if you've got everything in markdown, you can have a new branch, and that branch can be, it's great that it's CDN served. And that logic is not in JavaScript or anything like that. But like managing data sets and your CMS and managing all these other pieces, kind of were left to the developer to figure out and it sounds like abstracting those out, means that a marketer can do it, which is really the end goal, something like a B testing. Exactly, exactly. Dan Barak 23:27 And, you know, like I've seen, I've seen the way, you know, accelerating that ability. And like, I think in this case, like it's more than accelerating, it's like, as a marketer, with no developer, like you just couldn't run even an A B test. But even if you had a developer, it's like, it's so much work, as you kind of just described to get that working. And so so, you know, companies, we would measure em, if we built an internal tool that allowed marketers to just iterate faster, and try more things. It was bound, you know, like, it's just like, it's just like statistics, you know, part of these tests will be successful part not, and on average, it will drive each test, you know, will drive this amount of impact. So the faster you can move faster, you know, you can iterate and understand what works better, and just create so much more value for the business. Bryan Robinson 24:20 It used to be to be able to have these super simple AV tests, you went to JavaScript, which that itself, it's almost like a Heisenberg principle, the act of adding JavaScript to the page to test something is going to impact the test the thing that you're testing, it's an Heisenberg principle of JavaScript or something like that. Yeah, it's great that great that we can utilize Netlify CDN A B testing, but also get all the, the marketing aspects of it as well. So it's best of both worlds almost. Dan Barak 24:49 Yeah, and I think this is this is just, you know, it's it's one example. Another thing I'm thinking about a lot is is just internationalization and and you know how Having multiple languages, and, you know, I've seen this, I've seen this again at Lyft, when one of the projects that we had we drove was just making sure that Lyft is available in multiple languages. And until, you know, until my team came along and changed that, and I think at the end of 2018, you know, it was like, it was just English in English. And making those changes, you know, part of it is like, within the code, and part of it is, is in the CMS, you know, because, like, there's, there are application aspects, and there's like, website aspects. And it's just, it's just so hard to kind of make sure that everything works correctly, and every string is wrapped, you know, like, I'm doing air quotes here, you can see that, but, you know, everything is like properly wrapped, and like developers have to provide context cycle, this string appears on this page. And it is the explanation of what happens if you press you know, submit, and having that, you know, having a tool and, like Stackbit that allows you to just switch environments, this is another thing that we're adding, you know, switch kind of like the locales and be able to look at them separately and be able to just, you know, have the people who deal with the German side, see the German strings and translate them and be able to, like, look back and see, like, Oh, this is the content, this is how this is what it meant in the English version. And, and quickly switch between those is also very meaningful. And, again, these tools exists, I think, the one thing that is kind of missing is that glue, that orchestration, that tying them together, and which, which we felt is very much needed. Bryan Robinson 26:52 And that is not even that that point didn't exist, but that point existed inside of people. It was a developer, those having to do all that. And now there's a service and we developers, we love the service that can get rid of the stuff that we don't want to deal with. Dan Barak 27:04 Yes, exactly. It's like, you know, it's like as a developer, you can like set things up and in a way that you like and you feel is the right way and then you can you know, sleep at night knowing that like everybody is able to work and do that within their kind of rail guards and or guardrails, sorry, in bounds and and make sure you know that this this, everything works properly and correctly. Bryan Robinson 27:31 Very cool. So now it's time for the big question, which is, what is your actual jam? What's your musical jam right now? What's your favorite song or musician? Or maybe just genre? Dan Barak 27:42 Yeah, so I think and I think this is like the the one the one aspect of my life that is very much I feel like super ignorant about like, I love listening to music, but I have a sign of kind of like a artists blindness, you know, maybe or something like that. I just like, don't have something some light body specific that I just listened to all the time. I think jazz is probably my, my working music. My dad, like really love classical jazz and got me into it somewhat, you know, I think like it was in my teens, so I have liked it have felt compelled to rebel against it. For no, so, you know, but I think it's very much like when I work this is this is my jive. And then, you know, when I'm running, I'm just trying to get Spotify to, to feed me something that will keep the pace going. Bryan Robinson 28:41 You got to keep your feet moving to the beats that beats copy the exact beat that you need for for running. Dan Barak 28:47 Exactly, exactly. And, and I've sometimes I really love audiobooks and podcasts. And so sometimes I run to those, I tend to do much worse usually. Yes, as the running results go, Bryan Robinson 29:02 yeah, I can definitely feel that. So is there anything that you'd like to promote anything you might get to the Jamstack community as a whole, that you are the stack that is doing? Dan Barak 29:10 I think I think I honestly, I've done like so much self promotion here. And you know, like that, that stems from like the very best intentions. And I think from a belief that this is actually it, but yeah, I don't I don't want to I don't want to add anything to it. I think we we've spoken about most things in context. And so So I think, you know, definitely what I would say that I love talking to customers and to users and to anybody who's like, has an opinion about, you know, the Jamstack our specific tools or anything else in the ecosystem websites. And so I just welcome these conversations. And I think I learned every like every single time that I talked to anybody that's, you know, outside the company. I learned something new. I do learn new stuff from people in the company as well. Just kind of like to highlight that piece. So if people want to reach out to me, I'm really happy to discuss, you know, answer questions, or anything like that you know about the Jamstack, about Stackbit. And yeah, that's about Bryan Robinson 30:20 it, I say. And if there's one thing that developers do have is plenty of opinions. So yeah, hopefully, hopefully, you'll get some best way to get in touch with you like Twitter, LinkedIn, Dan Barak 30:32 I think I'm much more of like a of an email person. And so Dan at Stackbit.com, just will will do the trick, and beautiful and that's why I'm like, I'm trying to get to inbox zero for things that matter. And usually I fail like miserably for like the general way emails that I get, but I do tend to read and respond to almost anything that you know, is kind of tells us something about the business opinions or anything like that. It was like a genuine outreach. Bryan Robinson 31:08 Very cool. That's That's it. That is a noble goal. I'm, I can't imagine what your inbox might look like. But uh, but I appreciate that. You're that you're working towards it. Dan Barak 31:18 Yeah. Cool. Bryan Robinson 31:19 Well, thanks a lot for coming on the show today. And I hope you keep doing amazing things of stack but and in Canada, Jamstack as a whole. Dan Barak 31:26 Thank you so much for having me. This is fantastic. Bryan Robinson 31:31 Thanks again to Dan for being on the show. And thanks to all of our dear listeners for tuning in Week after week. Be sure to star heart favorite or you know, whatever in your podcast app of choice. Now sponsor time this week, we're lucky to have Auth0 backs our sponsor. Auth0 is an amazing authentication platform, but they also have a wealth of amazing content coming out regularly on their YouTube channel, including a free course called Full Stack JamStackbit Next.js. If you're interested in learning more about Next, taking the Jamstack further, authentication on the Jamstack head over to a0.to/tmjyt for their YouTube channel. Bryan Robinson 32:15 That's it for this week. But until next time, keep doing amazing things on the web and keep things jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

16 December 2020


S2E9 - REMIX - James Q. Quick on Auth, working on what makes your code special, and Jamstack services

S2E9 - REMIX - James Q. Quick on Auth, working on what makes your code special, and Jamstack services

Quick show notes Our Guest: James Q. Quick What he'd like for you to see: Developer's Guide to YouTube His JAMstack Jams: Next.js | FaunaDB His Musical Jams: Rod Wave | Jason Aldean This week's sponsor: Auth0 This week, we've got Auth0 as a sponsor. While their prowess at authentication is important, they're also releasing a ton of new tutorials and courses on their YouTube channel, including a free course on building a full-stack Jamstack app with Next.js. Transcript Bryan Robinson 0:12 Hey, everyone, welcome to another episode of That's My Jamstack the podcast where we ask the time honored question, what is your jam in the Jamstack. I'm your host, Bryan Robinson. And this week we have our first ever. That's My Jamstack remix. We talked to today's guest about a year ago. And we're bringing him back to catch up. Bryan Robinson 0:32 When we last met James, he was a software architect at FedEx doing Jamstack things on the side. Now James is a Developer Advocate Auth0 bringing auth flows and Jamstack education to developers everywhere. Bryan Robinson 0:44 Before we dive into the episode, though, I want to thank this week's sponsor who happens to also be Auth0. We'll talk more about their amazing educational content at the end of the episode. But if you're curious about that, Jamstack and auth education, head on over a0.to/tmjyt. Bryan Robinson 1:17 All right, James. Well, thanks a lot for coming on the show again. James Quick 1:20 Yeah, yeah, I am super excited to be here. I know, we haven't gotten to see each other in a long time now that we're not in the same city. So at least we can hang out and do a podcast together. I feel like it's probably the best alternative. Bryan Robinson 1:31 Exactly. And for those listening that don't know, James not used to both live in Memphis, Tennessee. He's still down there. But I've since moved to the to the frosty north of the US, Michigan. Yeah. James Quick 1:43 I was just gonna say like, I miss our, like, kind of planning meetings, we would have like every month, but just kind of checking in and see what each other was working on and bounce ideas back and forth. Bryan Robinson 1:51 Yeah. And that also would have been different nowadays. Anyway, cuz we used to do that at coffee shops. And I'm not sure we would have any more James Quick 1:58 zoom for the when I guess. Bryan Robinson 2:00 Exactly. Which also means that we can do that, you know, anytime. James Quick 2:03 Yes, that is. Bryan Robinson 2:04 So So longtime listeners will be familiar with you from the old episode. This is a remix episode where we're catching up with you. So let's catch up. So last time you were on. You were jamming, I would say in your spare time. But you were working as a software engineer at FedEx. So I know a lot has changed for you. So let's catch up. What are you doing now? In terms of work and on the side and all that good stuff? James Quick 2:25 Yeah. So I think when I went on last time, was in October, November of last year, so it's been eight or nine months. But shortly after that is when I decided to leave FedEx. And I really was I just wanted to get more into dev really type stuff. So doing video content, speaking at conferences, and just joining like a an exciting, like younger startup II feel to a company. So anyway, all of that kind of came to fruition for me to join Auth0 back in January of this year. And I think I did, I did one trip and two conferences, and everything stopped. So we had a big transition to we talked a lot about this personally, but doing live streams on twitch and creating more YouTube content and that sort of stuff. So it's been a little bit of a transition. But it's been that way for everybody. I think. So anyway, yeah. I have been working for SEO now for however long it's been seven months. And it's been going really well. Bryan Robinson 3:24 Nice. And so it also you said, you know, you're you're you're getting more into dev rally type stuff. So what do you do as a dev REL at all? Zero? James Quick 3:31 Yeah. So if people are familiar with the idea of developer advocates, in general, it's, or my definition is really just like earning trust and respect in the community. And that can take shape and a lot of or take form. And a lot of different shapes take shape in a lot of different forms. There's a lot of it would be like speaking at conferences. So again, that's kind of on hold for the time being at least in person, it could be being at meetups in person, again, that's on hold, or at least virtually for the time being. And then in addition to that, is creating content that people enjoy, we are specifically looking to grow our YouTube channel and Twitch channels, get an ambassador program that Sam julene on my team is working on to help get some people to kind of represent our brand and help them kind of grow some of their skills and public speaking and content creation and that sort of stuff, too. So yeah, that's that's the kind of activities that we're doing. And I've done lots of virtual events and conferences and stuff, which has been interesting, but I would definitely love to be back in person sometime soon. Bryan Robinson 4:30 Yeah, definitely. Like like the the virtual stuff can be a lot of fun and you can reach a lot of people but nothing quite beats. The random interactions you get when you're at an in person event. James Quick 4:40 I'm sorry, the hallway track is what exactly what a lot of people refer to and it is it is a very powerful, powerful and enjoying or enjoy mint fun track. Bryan Robinson 4:52 Yeah, exactly. It's, it's just it's nice to hang out and just have have just random asides with people. So So Let's talk a little bit about the Jamstack at all zero also like just how you're utilizing Jamstack philosophies now professionally and personally like in the in the first episode, you're primarily doing it in your spare time. FedEx not having done a whole lot in that world yet. But what what's different? How's the house Auth0 pursuing had the Jamstack? And how are you changed in the way that you pursue it personally now? James Quick 5:25 Yeah, I think on the personal side, it's, it's kind of similar, although I've done a lot more. So still still running my youtube channel doing a video a week, and a lot of the recently has revolved around the Jamstack. So I've done a Jamstack Crash Course, actually two Jamstack crash courses, I've done things on serverless functions, getting into next js, which is pretty exciting. For me, I've been kind of putting that off for a long time, because I'd use Gatsby and serverless, functions and Netlify. Now with that stuff kind of all tied together. And actually, this is really interesting. So that personal stuff is not that different. Although I've got more experience, and I'm doing more content, it's still the same, like I'm working on it on my in my spare time. And then for Auth0, when I started in January, we had kind of some targeted audiences that we really wanted to get more engaged in. And we had been really engaged in the angular communities, I think we had two or three people at the time that were Angular experts, I guess, like gdds, on the angular side, I guess, is what what that is. And so they had like really strong relationships there. But we didn't have relationships, and like react and view and and really the Jamstack in general. And so with that being mentioned, to me as focuses, it was just kind of an opportunity for me to really lean into it. So again, like creating content around that I just released a next j. s and austero video on the SEO channel on YouTube. And that's a lot of where our conversations, lead. And the activities and things that we do is like in this Jamstack world that is is different than what a lot of people are used to, how do we do authentication. And that's been kind of fun to dive in and create some demos, and explore with these different technologies and the Jamstack and then tie that back to zero and kind of figure out how these pieces fit together. Bryan Robinson 7:13 Yeah, definitely. I feel like there's there's a perception in the world. And obviously, there's been hot drama in the in the Jamstack world recently with, with WordPress and all that good stuff. But there's, there's this feeling that the Jamstack has certain limitations to it. Now, those of us who are in in the world and using it regularly know that we can do most things with it. But one of those big limitations would be around the personalization, the authentication area. And it seems like all zero can be a big player and circumventing the issues that might come with statically generated sites. James Quick 7:47 Yeah. And I think this is where the idea of static statically generated sites or static sites, it's it's that misnomer, right that, like you said, people that aren't like intimately involved, think of it as being just literally like, just HTML, right? But we forget that Jamstack includes JavaScript, so we can basically do anything in our JavaScript that we want. And that's kind of where all zero is fitting in here, we've done some work with integrating all zero into Gatsby. And a year or so ago, we actually had a guide. And this is an approach that some people still take, where you can have certain pieces, certain routes, for example, inside of Gatsby or other frameworks that are protected. And you do something differently with those where you kind of like override the built in routing in Gatsby. And then you add your logic to those specific routes. Everything else just kind of acts as is. But the interesting thing with Gatsby is it has this hydration aspect to it, where they I mean, you can do whatever you want, right? Like with Gatsby, you think of them and you hear them as a static site generator. But it's really I forget exactly what phrasing they prefer to go with. But with the hydration process and react, you can do whatever you want with a regular react application. And so we've started to create some content around just like tying in all zero into Gatsby. And you can, there's not really much of a limitation there. Like there's a couple of very subtle tweaks that you have to do to incorporate that into Gatsby versus just regular react. But like after you do those couple of things, it works just the same as it would. And we have a new react SDK is a new, it's been a few months now. But we have the new react SDK. And to me, it just makes it so easy, so easy to incorporate into your app, and then you get access to these hooks. So you're using modern react, you're getting all the things that you need about the user, and you can access it in your application, wherever you need it. Bryan Robinson 9:42 Nice. And so so it seems to me like like that's working in Gatsby kind of integrated with Gatsby about a year ago. And then you can move in, like you said, you're moving into the next world a little bit where you've got like API routes you can have you can have the hybrid model with next where you can have like some routes being generated statically In some, some fully directly, like server side, do you see like that hybrid model catching on at all? Or is it or do you see like static is still being a pretty big way of going in the in the Jamstack? world? James Quick 10:14 Yeah, I, for me, I'm kind of all about next j s right now, I think ultimately it gives you the flexibility to do both, right. So like, if if I decided next j, s was going to be my framework going forward, there, I could do the same thing I could accomplish in Gatsby with next j. s. And I would argue, like I've done a YouTube video on the comparison of these two recently, like Gatsby is more optimized in terms of its ecosystem, and its documentation for static just because that's kind of where we're at focus. Next, JS can do those things. They're just maybe less like plugins. So you may have to figure out a little bit more to yourself, but you can do it all. So for me, I love the flexibility of next js, I love that it still fits into the Jamstack. Because your API routes, even though you kind of you can basically treat them as if it's like a node application like it looks, it looks almost the same as what you do if you built a node app from scratch. But the output of an X JS app or the deployment of it is the it's just serverless functions. And you can obviously deploy to Vercel, which is where those are made by the same company, right? So that's kind of an optimized process. But you can also host in, in Netlify, and other places as well. I don't know, I just I love I like the idea of being able to have more of the traditional web app in the sense that like you have server side rendering, but it's still in the Jamstack, and still works really well with all the things that we expect out of a Jamstack site. Bryan Robinson 11:34 You just spoke pretty passionately about about next j s. So I'm so so what would you say that your jam the jam stack is right now. And I think if I went back and listened directly to to the old episode, I think we're talking to Gatsby a decent bit back then. Yeah. But what's your favorite service right now? Or maybe philosophy framework? What makes you love the Jamstack? Now as opposed to 10 months ago? James Quick 11:57 Yeah, next js is definitely one that's been kind of an eye opener for me. So like you said, I'm talking passionately about it, I've been excited about it, I actually just recorded a two hour course that's going to be on the auth0 YouTube channel. So people go and check that out. And the next next couple of days or week at the very most, and it's it is next JS air table all zero until one CSS. So next, as far as flexibility is amazing. I have used air table in a lot of my demos since then for I mean, it's a pretty powerful database. But it has such a great SDK to work with. And it's really quick to set up and it just looks great. So I've done that with data a lot recently, I've also used fauna dB, a good amount recently as another alternative database for the Jamstack. And they really advertise themselves as being optimized and targeted at the Jamstack. And they've got this, this graph qL layer that they basically like set up for you. And I've never written a graph qL server from scratch. So I don't actually know like what it's like to do that I've just used tools that take care of it for me. And fauna, db is one of them. And there's a couple of other services. One is Cloudinary that I've like started looking at since since last November. And you and I are both media developer experts, which is indeed not necessarily a Cloudinary pitch, but it is sponsored by Cloudinary. And I've really enjoyed diving into learning more about media and doing transformations and the storage and things like that in Cloudinary. So I think ultimately, it comes down to there's like the Jamstack is so cool, because there's now systems out there to do like every aspect of features that you might be looking for in an application. And some people might look at that and and say like, well, that may be more expensive. Or I could just build it myself. And that's true. But the exciting thing for me again, is like I don't have to build it all. And if I want to build an application, I don't have to worry about all the specific details in these different categories. Like those things can be taken care of, for me through these third party services. Bryan Robinson 14:00 Yeah, I think I had a conversation the other day, I don't remember who with but, you know, it's like you can you certainly can build all these things from scratch on your own server. But Why the hell would you want to like and I think I was actually having this conversation specifically around auth zero, right, like I it was, I could build an entire auth workflow. Like it wouldn't be that I would say it wouldn't be that hard. security's always hard but like, I could do that. And I could use like, you know, user databases and stuff like that. But like, why would I want to create that flow from scratch? Or why would I want to set up image transformations from scratch? Or why would I want to even go in and create these images from scratch at these different sizes? Like That all sounds like a headache to me? Absolutely. James Quick 14:53 Yeah, that's that's one of the big conversations for us. The phrase that we use is build versus buy. And if you look at authentications Specifically, like, yeah, I've done it before. And like I followed in West bosses node course back in the day, like you do all the authentication stuff in node, and you do JW, T's JSON Web tokens, and you send it back and forth, and it works really well. But the thing that, that you forget, or you need to at least consider is like, Alright, basic authentication works. It's not too bad. It's still work, but it's not too bad. But then you get into like, Alright, what features Do I need on top of that, and something like something like a password reset, that's it's not a simple flow to do. I think westballz actually covers it in that course. But there's logic to that, right, because you have to track like, you send them a special code, and you store that in the database, and you have to have an expiry time on it, you have to check all that stuff. It's doable, but it's getting a little more complicated. And then you get into like, Alright, what if I want to include other social providers, I want to do Twitter and GitHub and Google and that sort of stuff. And you can go through their documentation, and you can find a way to put it together. But you're getting more difficult than you think about like multi factor authentication, and like password, list, login, and all these things. And like, that's where you start to realize like, and this may not be worth my time to build all of these other features, as well as stay on top of like, all the security threats that are that are out there. I mean, those things change on a daily basis. And if you're a person or a small team, it's really hard to make sure that you're really really taking care of your applications at all times. So that's when you start to realize like, Alright, maybe it is worth just like having someone else take care of that part for me. Bryan Robinson 16:30 And it was actually in a conversation on an episode of That's My Jamstack, leading up to this one, about like, the weakest point in an application isn't the code necessarily, it isn't a specific feature. It's kind of the developer writing it. And so if you are not a security expert, or you are not a media expert, or you are not a x feature expert, and you write that you then become kind of the weakest link in your codebase. And why not defer to an expert in that field, and write the feature that you care about not the feature that you have to have to make it work? Absolutely, James Quick 17:10 there's an interesting perspective on that, too, of like, who becomes the expert, because I've been in a situation where, you know, we are tasked with coming up with a solution to something and maybe it's authentication, maybe it's a million different things. And developers that aren't experts in that at companies where they have, they're not super siloed. So they kind of work on whatever needs to be done, or figure out what needs to be done. They're not experts, right. But if they are the people who then start to build something out, and they're doing the research, and they're trying to figure it out, internally, they become the experts. And that's probably not the person that you actually want to be that expert, because that person, and I've been in this situation, I'm watching YouTube videos, and I'm like taking courses and reading articles to figure it out. But that's not my area of expertise. I'm just trying to fit these pieces together. So like the idea of like, who is the expert, there's the actual expert. And then there's the person internally that people look to you as the expert. And that person only knows so much. Yep, the Bryan Robinson 18:06 organizational expert, and then it's the, it's the bus problem, right, what with that person gets hit by a bus or, you know, leaves the company like, then who becomes the expert, then it's kind of you keep adding links to this chain, and they are progressively weaker links. James Quick 18:21 I think we talked a lot about the bus problem at first. But it's still a huge problem, or it was when I was there, of there's still only so much knowledge that you can pass around to people without taking like really dedicated time to get them deep into it. Bryan Robinson 18:37 When that's I think one of the things that I personally love about the Jamstack, and a lot of ways is that if you are a front end developer, and you take a look at a code base that is built decently with Jamstack philosophies, you can probably reason about it, as opposed to if you come in, and there's a large scale of Node ecosystem, like at some new company that you're working for, it's gonna take you much longer than if you're like, Alright, well, I know, I know, react. So therefore this company using next I'm good to go to, like start reasoning about what they're doing. Oh, you know, I know how to use API's, therefore, I can kind of trace how the data is flowing through, you know, from fauna, db, or from, you know, some provider where that data is coming from, because it's all in the end, some amount of JavaScript and as long as it hasn't been written to spaghetti ish. You should be able to reason about it in some way without, without a lot of institutional knowledge, which is what the bus problem is kind of all about. Yeah. James Quick 19:41 And that's where, again, like the idea of having these services that take care of that stuff for you. Now, your knowledge is all the stuff that's most important to your business, right like you. Like the authentication piece is not special to your business. It's just a requirement for your business to be successful. The media management Is our transformations or optimizations on images, Bryan Robinson 20:03 digital asset management, James Quick 20:05 yes. Just buzzwords all around. But your digital assets, man, asset management, is again, probably not something that's like that's your core logic. It's just a piece of your application. So now, you spend more time focusing on not only building but like internalizing and having the knowledge around the stuff that's important to you and your application. What makes Bryan Robinson 20:24 your application your business, your website, special work on that don't work on the things that everyone has, because they have to have it. Unknown Speaker 20:31 Bryan Robinson 20:32 So let's pivot away from technology. And to be honest, I didn't make it all the way through the episode from from last October. I don't really remember what you said about your musical choices back then. But what's your actual musical jam right now? What are you listening to what gets you pumped one is still the same. James Quick 20:48 Back in November, or whenever that was, it was Jason aldine. Country artists, and I was listening to him on repeat and like now I'm listening to like, my wife has a pretty good station on just like modern country, which we listen to a lot. But I also still listen to a lot of Jason aldine. And then I've also been listening to for several months now and artists called rod wave. And this is a rap artist. So if you're into rap, you check it out. If you're not into rap, you probably won't enjoy it. My tastes are kind of all over the place. So from Jason Aldean on the country side to rod wave on the rap side is what I've been listening to a lot recently. Bryan Robinson 21:26 Nice, weird question James Quick 21:29 all about the weird question. Bryan Robinson 21:30 Yeah. Cuz like I'm with you, in a lot of ways on like, what I listened to a year ago is not drastically different from what I listen to today. Do you find that that's just kind of how you live your life? Or has that changed? And have you become less adventurous over the years with your musical tastes? James Quick 21:51 Yeah, I don't know. I don't know if I've become less adventurous. I think I've always gone through cycles of like finding, finding an album of some sort that I like, like in the back in the day, it might have been like a mix CD that I made myself. And that was the thing that I listened to. But I think I've always kind of like gone through these phases of who I listened to. And some of it, I actually, like I mentioned, my wife having really good playlists, like she's much better at listening to Pandora, and then paying attention to the random stuff that she hears. And then now she's got that many more things that she knows of and wants to listen to. I'm not as good at being random. And I think that's, I think I've just kind of been that way. So I am, I am always looking for trying to find new music in theory, but it's also like, I just enjoy the stuff that I enjoy. And sometimes I just keep running with that instead of venturing out of finding new things. Bryan Robinson 22:40 I just find that as, as I age, I think about these things a little bit more like, Am I just set in my ways? And while I listen to the same four albums over and over again for the rest of my life? James Quick 22:48 I don't know. And I mean, that may not be a bad thing. It's all about what you enjoy. Right? Bryan Robinson 22:53 True. Yeah, whatever makes you live your best life. Nice. So what would you like to promote and get out to the Jamstack? world before we let everyone go? What what are you doing right now that you want to share out there? James Quick 23:04 Yeah, I am. So I don't know when this will be released. And it may be this podcast may be released by the time or my what I'm about to talk about might be released by the time the podcast comes out. But I'm working on my very first ebook as part of a two week product challenge where you create a product in two weeks. And that ebook is the Developer's Guide to creating or starting a YouTube channel. And it's all about like, how do you get started and like, here's tips and tricks and software and hardware and things that you can use, but also what are the benefits and why you should do that as a developer. So by the time you listen to this, this will probably already be deployed. So you can check out YouTube for developers COMM And check out that ebook there. And then just in general, still doing lots of stuff on my YouTube channel at James q quick. And then also on the SEO side, I'm really starting to give a big focus to continuing live streams, but also did a lot more video content on the Osceola YouTube channel. So au th zero and go and check it out. We probably by the time this podcast comes out this crash course or mini course with Nexus air table, or zero and tailwind, CSS and other hot buzzword will be out. And I think that one is pretty cool because it walks through like the entire authentication workflow and the Jamstack and tying these technologies together. Bryan Robinson 24:19 Nice. So I'll have all those links in the show notes. I do want to take a half a second and talk about the the E book right because you've been doing video content. For a long time. I've been doing it for a decent bit too. And I would say that if you watch some of my first episodes, I'm sure you probably would agree with some of your first episodes of, you know, tutorials in video form. The differences between that and what you and I are both doing how are pretty drastically different. So would you say that hopeful that you're hoping maybe the ebook can help people skip over some of our earlier hurdles? James Quick 24:54 Absolutely. Yeah. And I think that's definitely a part of it. I want to say like it's not enough. necessarily going to be a focus throughout the entirety of the book. But I think one of the big focuses is just to try to convince people that like, yeah, you're nervous about it. And you're worried about like, what if people judge me? What if I get negative comments? What if nobody watches it, but I really want to encourage people, like, none of that shit matters, like, just do your first one and see what happens. And like, if you didn't enjoy it, and if it didn't work out, well, that's fine. But like, try it. Because there are these, there's so many benefits to it, like it goes on your resume, it gives you experience with speaking, there are all these other benefits that come along with it that, like I just, I hope that I'm able to encourage some people to create their first video and what happens from there. Like, hopefully, some of the tips help too. But just getting that first video is such a big accomplishment for people. And I kind of Bryan Robinson 25:41 find find it's very similar with blogging, like blogging is the super low barrier to entry thing. But like, if you struggle with an issue, and figure out how to fix that issue, that means that there's at least at least one other person in the world that has struggled with that issue and would find whatever content you create about it, probably insanely helpful. James Quick 26:04 Absolutely, yeah, I've always, always been a big fan of like, no matter, no matter how little you think, you know, whatever or how small something is that you learn, like somebody else, like you said, doesn't know that thing. So now you're providing the resource for them. But also, you're providing the resource for you. Like I can't tell you from the articles and videos that I've done, how many times I've gone back in search for that thing, and I find my video or article and that just goes to show you like you may know something now you might forget it. Now you need a reference, but also like people are going to have that same issue. So there's always an audience now you have to kind of figure out how to get it in front of them. But even if people don't see it, it could be a useful thing for you. Bryan Robinson 26:42 And I'm also going to give you one one more shout out that you didn't mention. James James also has a Discord server, where there's a bunch of developers all kind of in there learning. I'm a member of the discord server, so you can always come chat with me and there's nothing else but uh, but no, it's an active little community. And I've enjoyed seeing it grow over the past few months. James Quick 27:00 That's been a really cool thing. I didn't really know what to expect in starting a Discord. I didn't know how it would grow. I didn't know how the community would get along together. And we're at I think, like 400 people almost exactly now. And this is after two or three months, which is really cool. And the community is great. People are so supportive. They're always sharing resources. They're asking questions, it's been just fantastic. So I'll give you a link to to discord if you want to throw it in the in the description as well. If people are interested in joining. Bryan Robinson 27:27 I certainly can. Yeah. Cool. Well, James, I appreciate you coming on. And I'm looking forward to seeing the E book when it comes out. Which it may already be out when this is actually going on. But you know, time is a weird thing. So yeah, keep doing the amazing things you're doing and maybe we'll have you on another year from now and we'll see the differences the year makes. James Quick 27:46 Yeah, I'd be excited to do like the what is that at that point the remix times two I guess. Bryan Robinson 27:52 It's the the hundred other songs. It's like the remix to ignition where there wasn't an actual first song. Yeah. The remix to the REMAX. It'll be great. Thanks again to James for being on the show. And thanks to all of our listeners for tuning in Week after week. Be sure to star heart or favorite in your podcast app of choice. Now sponsor time this week, we're lucky to have Auth0 back there sponsored Auth0 is an amazing authentication platform, but they also have a wealth of amazing content coming out regularly on their YouTube channel, including a free course called full stack Jamstack with next j s. If you're interested in learning more about next, taking the Jamstack further authentication on the Jamstack head over to a zero to slash TMJ YT that's TMJ YT for their YouTube channel. That's it for this week. But until next time, keep doing amazing things on the web and keep things jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

9 December 2020


S2E8 - Gareth McCumskey on serverless-first, helpful services, and the backend of the Jamstack

S2E8 - Gareth McCumskey on serverless-first, helpful services, and the backend of the Jamstack

Quick show notes Our Guest: Gareth McCumskey What he'd like for you to see: Serverless' Components feature His JAMstack Jams: JAMstack and Serverless help build things with low-code. Check to see if there's a solution out there for what you need to solve a problem. His Musical Jams: Jinjer - Pisces This week's sponsor: Auth0 This week, we've got Auth0 as a sponsor. While their prowess at authentication is important, they're also releasing a ton of new tutorials and courses on their YouTube channel, including a free course on building a full-stack Jamstack app with Next.js. Transcript Bryan Robinson 0:03 Hello, everyone, welcome to another episode of That's My Jamstack the podcast where we ask the time honored question, what is your jam in the Jamstack? I'm your host, Bryan Robinson. And this week we talk with Gareth McCumskey, a serverless architect at Serverless Inc. Before we dive into the episode, though, I want to thank this week's sponsor off zero, we'll talk a bit more about the amazing educational content they're putting out at the end of the episode. If you're curious about that, Jamstack and author education, head on over to a0.to/tmjyt. That's My Jamstack YouTube for all the videos. Hey, Gareth, thanks for joining us on the show today. Gareth McCumskey 0:45 Yeah, thanks so much for having me. I just, I love talking about Jamstack stuff. So it was a opportunity not to be missed. Bryan Robinson 0:51 Cool. Well, you like talking about Jamstack stuff. But tell us a little bit about yourself? What do you do for work? What do you do for fun? Gareth McCumskey 0:58 So my work right now is essentially I'm a Solutions Architect with Serverless, Inc, the creators of the Serverless framework. And yeah, being a small startup means that I kind of do a multitude of roles like most folks in the in the company. So I I'm involved a lot with helping users have the framework design and and sort of plan out the systems there. They they plan on building with service. And the other side of it is as well as I act as sort of developer advocate in trying to help spread the word about serverless. And related stuff, I guess you can say, Bryan Robinson 1:33 That's kind of growing the whole the whole world so that you know, people who want serverless might come to serverless in the future. Gareth McCumskey 1:40 Yeah, absolutely. And I find a lot of folks will hear some brief inkling about serverless, not quite sure what it means. And because you know, we've been able to produce enough content, they get a bit bit of understanding, and then they have questions. So it's nice to be there. So for that, for that growth period that a lot of devs go through. And I guess on my personal side, I'm, I think very much into the computer world. So especially with the with the load with the global pandemic we've been going through lately. So I'm quite an avid gamer. Yeah, and it's just that's kind of that way I love steam these days. Bryan Robinson 2:14 Nice. Are you? Are you on the PC side on the console side are like kind of in between? Gareth McCumskey 2:19 Well, PC side, which kind of means I never leave the desk. But yeah. Bryan Robinson 2:25 What's your what's your go to game right now, especially with with pandemic round? Gareth McCumskey 2:29 Well as a typical developer story, where I play a game called factorio. I don't know if you've heard of it, but it's essentially an engineering style game where you build a factory and consume resources. And it's a massive problem solving things. So I go from working with developers all day long to basically running a little factory. Bryan Robinson 2:49 You know, from from software engineering to real engineering, in software. Gareth McCumskey 2:53 Yeah, something like that. Bryan Robinson 2:55 Nice. Alright, so so we're talking Jamstack today. So let's talk a little bit about what was your entry point into this world of Jamstack, or maybe static sites, I know you've been in the industry for a while? Gareth McCumskey 3:07 Well, it's one of those interesting situations I found myself in. And just a bit of context. So long story, here we go. I have had, I was a lead in a team at a tour company that basically sold all their product online. And with that, they had a platform that was built on WordPress that they've been using for about 10 years. So really showing its age really legacy when we're talking legacy. And when I joined, there were there were there being some serious issues with performance and science. So ultimately, we came to the point where we had to re architect pretty much the entire platform. But we needed a way to do things piecemeal as well, because we couldn't go down a rabbit hole for a year come out with something on the other side that maybe didn't fit, they need to start seeing some return on what we were working on. So initially, after spending a bunch of time looking at stuff, I found serverless, which was kind of my gateway into Jamstack side of things, and looking, looking at building, you know, the whole Functions as a Service became very attractive, especially when you're in a team of about two or three developers where none of you have massive DevOps experience. Myself, I can kind of spin up a web server when I need to keep it up to date. But you know, I wouldn't necessarily trust myself, you know, the massive production, cluster, and so on. So that became a little tricky first, and serverless seemed like the right answer for that. But serverless doesn't come without its own own way of doing things. And traditionally, for me, I had come from the world of big fat PHP frameworks that handled everything, you know, rendered rendered everything on server and push that out to the browser. So there's really going back to my roots when I was looking at serverless and realized that probably the best way to attack this would be to build back end API's with serverless and have a completely static front end running something like view or react or Whatever, and have that calling this API back, because the API back end is really where we were concerned about load the most. And this led us to start building a solution like this, where we could have a team focus on building a nice front end, and have a couple of guys building a front end. And myself, maybe, I think, was one of the engineers working on the back end, small team. And this works incredibly well, for us. We had an entire ci CD process, things were going really nice. And the first time I heard Jamstack, was about, I don't know, nine months into doing this, we attended a conference and somebody gave a talk about Jamstack. And the four of us sat in this talk looking at each other throughout this entire discussion going that's what we did. So it was very interesting way. And and I think one of the one of the key things that we talked about afterwards was how it was going back to our roots as as people building stuff for the web, seemed to be the best solution all along just building static HTML, JavaScript and CSS, and having API's to call to Bryan Robinson 6:03 Yeah, so an interesting thing that you kind of said, Kevin, in the beginning of this story, which is, I think, different from what a lot of people have said about their kind of intro into the Jamstack was, you actually started with this idea that we need serverless functions, we need Functions as a Service, whereas most people are saying, you know, hey, I am already using view or I'm already using react. So I got into this thing called Gatsby, I got into this thing called grid zone. And that was my entry point, or, you know, I like HTML. So I got into Jekyll or something along those lines. Where it said, where you're kind of saying, you know what, we don't want a monolith on the server, we want to break it up. And then oh, what are these other things we can do to attach it is that kind of a good representation of what you're what you were going there? Gareth McCumskey 6:50 Yeah, it was interesting, because there was some other things we were looking at sort of at the same time, I was really doing a big investigation into micro services as well, because this is back in 2016, as well, just to give it a little bit more context. So micro services was kind of new and coming out. And there's a few books written and it was growing in popularity. And when looking at microservices, the one thing that struck me instantly was how come out complex the infrastructure behind it looked. So microservices looks really complex for us to try and use. And we didn't feel confident in our skills, you know, in managing all this amount of infrastructure, as I mentioned, and servers just seemed a great answer for that. And very quickly, we realized that building a back end with something like serverless wasn't just about the Functions as a Service, because lambda was that new thing that I'd seen at AWS event which sort of struck struck me as well, and ultimately led me when I was investigating serverless, to realize that this was using lambda. But it's also all about the other services that you end up consuming as well, which you build upon. And that essentially replaces the need for this massive monolithic back end server. One of the things I point out to folks is that when you're building an application, there's really three, three main things that you need, you need some way to receive a request, some some HTTP endpoint, you need some way to compute, and you need some way to store data. That's ultimately and then of course, the fourth part, I guess, would be the response back, which would be the static pages that you're providing to user to, to consume. But ultimately, with an API, there's three components, we need to receive a request, you need to compute a response, and you just store data. And when you look at serverless, especially on the AWS side, which is what I'm most familiar with, you have AWS lambda, which kind of started a lot of this dynamodb, which ends up being a fantastic serverless Datastore. And API gateway, which becomes that front end that you need that can handle handle that scale and load. And then you've got your pick of the static, static site, web servers out there, everything from s3, to you know, there's a whole bunch of options out there to store static sites. So that's pretty cool. Awesome. Bryan Robinson 8:54 So So obviously, that was how you were using the Jamstack. Professionally, back when you were doing that, how are you using the Jamstack professionally now and also personally, personally? Gareth McCumskey 9:05 Yeah, it's interesting, I kind of use things in very similar way. So right now, pretty much all the sites that I build end up with a step by step all the front end sets in a statics store somewhere like an s3 with a cloud front in front of it. And the API back end, the difference has become the difference now is that the issue, I'm traditionally from the back end, so that's why my focus tends to be on on back end infrastructure. I just more adept at that, I guess. There's a lot of skill that goes into building a good front end and I just haven't had the time to really focus on that. I mean, it's a it's a massive world to delve into. But for example, my my back ends now for my API's tend to be microservices based, and with tools like like, you know, with the cloud and AWS and many other cloud providers as well. You can build really sophisticated back end services with Beautiful asynchronous communications between them. That lets you defer all sorts of load and issues that you may normally experience into asynchronous processes that kind of execute when they feel like it when they go capacity, which is fantastic. It just means that when you have that, that buzz of traffic at eight in the morning from your customers, because you sent them a mass email, you can handle what you need to the front end, because s3 or all these other site generators can handle the HTML and CSS they need to push out. But your back end is just deferring all the processing of the instance. It's a pretty interesting way to build things. Bryan Robinson 10:33 Yeah, it definitely it can. It can be kind of a web to weave in your mind, but it works incredibly well on the actual technology. Gareth McCumskey 10:42 Yeah, absolutely. I mean, doing things like receiving an API call. And it's interesting, because I've had this discussion with other folks as well, where they talk about things like you know, if somebody wants to edit their profile, this is a silly example where, you know, they change their email address, and they hit save, they expect that to be saved immediately. And when the page refreshes, they're expecting that to be the representation of what's in the datastore. In the back end, Meantime, it doesn't have to be, that could just be what's cached locally. And the front end knows, I've told the back into stores, it told me it's going to at some point, I trust it, I'm just going to tell the user This is what the email address is now because the beckons told me that's what it's gonna be, it's pretty optimistic way of, you know, storing these things. Meantime, that beckons been designed in a way that it's just absorbing all this traffic as it can. And yeah, things just work really beautifully. Bryan Robinson 11:29 And so I'm kind of curious. So I don't think we've had someone who, who's probably heavier on the back end. On the show, I think, I think for the most part, we've had some full stack developers, and we've definitely had a slew of front end developers. So if you were to talk to a pure back end developer, maybe like how you were 2015 2016, you know, having a big PHP stack or even like a dotnet, or something like that? How would they how should they think about transitioning to something like Jamstack, with, you know, various serverless pieces? Gareth McCumskey 12:04 Yeah, it's interesting, we had to do this actually, with the company that I was working for at the time. And one of the things, one thing I always suggest, first of all, is to start with a basic PRC, something, something that's concrete, so it's not meaningless, but not something that's critical. So you don't want to go PRC your checkout process, because that could affect the bottom line, bad idea. But we're seeing something like for example, we had a review system that people could leave reviews for the tours they had gone on. And the review system is important for the full conversion of sale. But if it happens to fall over, it's not the end of the world, people can still check out, we can still sell things on the site, and so on. So ultimately, that was our stepping stone into the world of Jamstack and serverless. we extracted this widget that we had in multiple places across the site, turned that into essentially a component for the front end, that had a back end component, which was an API. And that's how we how we proceed that just this one, one small component. And ultimately, that was a massive success for us, and proved out the technology. And we took the next step where we went through the site and looked at some of the content we had for things like the About Us page or company values page. And but that's the kind of content that does have changes at times, but changes very infrequently, it's not a product page that might change in you know, within within seconds with the price and reviews and any other information. So the next step was to extract those out, turn those into static pages with some kind of CMS back end, but not something that needed to be to the second with updates that you could let generate in the background whenever it needed to, and it would pretty much just sit there statically. And again, there was that there was the proof of concept for the front end. Now because we've just done a small component. Now we were proving the front end, and that worked beautifully. And just keep going up, then we started converting product pages, then we converted checkout. And you just keep taking these pieces at a time basically the strangler pattern. If anybody's familiar with that, we just take one piece at a time. And with a tool like CloudFront, or any other CDN cloud was what we were using at the time. CloudFront was set up to default to route so it would go to the WordPress installation by default. But we could use the URL structure of our site to break apart each piece one at a time. And initially, we were manually entering these URL endpoints like slash about us and they would point at an s3 bucket slash company values were pointed at s3 bucket route slash we just pointed the WordPress instance that was sitting on an easy to instance. So that allowed us to wait to sort of break things apart and point traffic at the right locations while we were building. Interesting. So Bryan Robinson 14:37 yeah, I don't think we've ever had anybody talk about about that. We've talked about like breaking up monoliths into micro services, but like literally breaking up the front end to is a very interesting thing like oh, I've got WordPress, we can't completely migrate away from it for X, Y and Z yet, but you know, our about page does need to be a database generated page, our company values like let's just redirect That VR CDN. And that's a really interesting take on that. What would you say is kind of your overall jam in the Jamstack? What's your favorite service? Obviously, you work for a service, that's a pretty big service in the Jamstack. But what's your favorite service? What's your favorite philosophy or framework, and then like, what just makes you love the gym? Second, it's gonna keep you working in this space for a while, Gareth McCumskey 15:22 huh? Where to begin? Alright, so I guess the biggest overall one, and we've really pointed out I'm very much sort of the back end guy. But the thing I love the most, and this is gonna sound strange being a guy who likes to build back ends. But I don't like code necessarily. It sounds bizarre. But code is is actually the weakest part of any application. And a lot of developers especially. But a lot of those are coming and raise their eyebrows at that, because that's what we get paid for it. And they want to get paid to write code. When really, it's not what any business wants. And I've it's taken me most of my career to realize this. But what most businesses want is they want a solution that solves the problems, they ultimately don't really care where it comes from, as long as it's reliable, and it's done within some reasonable timeframe and cost, then they're happy. And that's what Jamstack and serverless, as well just, you know, as part of that has really helped me build with all the solutions that I have. I, I normally, you know, espouse the mantra of serverless, first or Jamstack. First as well, I mean, that's one way to look at it is, instead of writing code first first solution, see if there's an existing service out there that can solve the problem for you. And usually, it's going to be reasonably priced and paper use. So you don't have to worry about this massive, you know, albatross around your neck. And ultimately, what it gives you is a way to solve a problem that you don't have to maintain over time that you don't have to make sure that whoever you hire into the position will know how to work on and code for. And a simple example of this is if you look at a very basic API, for example, with something like API gateway, a lambda function and dynamodb, the lambda function itself is probably going to end up being if you have a simple crud application, let's call it a create user endpoints as an example, if you have a POST request for that you set up API gateway API gateway is going to receive an HTTP request, it's going to handle the HTTPS for you, you can configure API key, so you can restrict or restrict access to it automatically. You don't have to worry about that. It will manage load for you. There's no load balancing involved in it at all. I sound like I'm selling API gateway. But I'm just talking to the the basic features of an API gateway. But the biggest thing that it does as well is routing. And often routing has been one of those things left for the big fat frameworks to do for you in code, which sounds great, except now you have a dependency on code that somebody else managers, whereas now with something like API gateway, this is a running service inside a cloud vendor that is executed as nothing, you don't have to worry about that open source project, maintaining the routing mechanism, this is done as part of a service, it's built for you. That's that's the way it works. What this means is my lambda function now isn't isn't resolving routes, it's just receiving event data, it's just receiving an HTTP request. And similarly, if you if you look further down into data storage, using a tool, like Dynamo dB, for example, is a key essentially, at its most basic form is a key value data. So it's a little bit more advanced than that. But we just say that for now. What's really nice about this is that it has an API, a very simple API that you can send requests to. And ultimately, there is no ORM necessarily involved. So you're writing a basic API calls to a Datastore in the back end, and a lambda function is going to probably be about a 10th of the size of your regular amount of code that you would have sitting in even a non monolithic framework these days. So that for me is the biggest one is the reduction in code. Bryan Robinson 18:48 Yeah, and I think I think that's an interesting way of putting it too, because anyone who's viewed my code, at least knows this the weakest link in my application. But on top of that, like if you look at it, and you say, you know, I'm, I'm a web developer that excels at writing, x type of feature, but you know, what I'm really bad at is writing off, like auth is an incredibly complicated, very security, heavy specialization in code. I should not be writing that, oh, I can go find you know, one of these two or three, four different services that will provide off for me in a very compact API driven way, which I think, is probably for the best for a lot of web developers out there. Gareth McCumskey 19:29 Yeah, that's one of those things. I think developers are really bad at writing a really bad security. And it's no fault of developers. It's actually a fault of our education in the industry. It's kind of like, I'll worry about security when I'm done. Which is probably not what you should be doing. But you know, that's this way we have problems to solve. We have solutions to build the worry about securing it later. But yeah, mean things like auto will will hand you essentially an entire solution to handle auth and I've built my own custom authorization services even in the gem stack itself. It's not an easy task, you're constantly maintaining it even, I'm maintaining it to this day. Unfortunately, if I just used the service that was available to me, I probably wouldn't have to do that I'd saved myself a lot of time and effort. And my, you know, the users of the system would be probably a lot happier to. Bryan Robinson 20:16 And you even mentioned something, something that the nowadays at least with a lot of the modern tooling scene, you know, super easy, right, which is managing HTTP versus HTTPS. But like, even three, four years ago, you know, I was managing servers and having to, you know, deal with, okay, well, let me figure out, Let's Encrypt, and let's make sure that that bot is running at the appropriate speed and the appropriate time. And that was a huge headache. And now it's literally just a Boolean field in, you know, most of these cloud providers, like, yes, please handle HTTPS for me. Gareth McCumskey 20:47 And even I mean, I've been around in the days before, Let's Encrypt. And that was, that was an absolute nightmare. It actually got to the point, I don't even know how to set up HTTPS anymore on a on a web server, because back then I would go down that rabbit hole handed over to the to the sysadmin. To finish it up for me, because I was pulling my hair out. Let's Encrypt, solve that problem to a large degree for servers. But it's still not an easy task. And it's something you have to either set up an automated process for or come back to every three months to renew those certificates. But you know, the cloud vendors just completely take that away from you again, it becomes so much easier to set up. Bryan Robinson 21:22 I mean, granted, it was my entry point and the learning how to do cron jobs and some other stuff. I I owe some education to doing SSH. But yeah, it was a SSL it was it was definitely a trial in a lot of ways. So what would you actually say in terms of musical jam, what is your musical jam right now? What's your favorite song or your favorite musician? Gareth McCumskey 21:43 So lately, I've gotten into a new band, and I've always been a bit of a metal head. So anybody who's not into into that kind of music, I do apologize. But lately, there's a really great band of heard called Jinja. And anybody who's not familiar with them, I would suggest looking up the song on YouTube called Pisces. By ginger, it's a nice surprise when you get to watch that it's pretty infamous in YouTube circles now for being one of those react. videos that you surprise a YouTuber with? Yeah. But yeah, it's it's it's just one of those bands that have really impressed me with their, the entire band. I mean, the the vocalist, she's absolutely incredible, has an amazing voice. And just ultimately, the entire band works together, like an oiled machine. They're absolutely amazing at what they do. It's what it was one of the things that really impresses me is when an entire band works together so well that not a single one of them sort of stands above the others. They're all just absolutely awesome. Bryan Robinson 22:40 And that takes a lot in the in the music world not to have that ego to like be able to mesh like that. Gareth McCumskey 22:45 Yeah, it's always nice to see their interaction on stage and so on as well, where they're all trying to have their moment in the in the in the sun essentially trying to show what they can do. without it being, you know, over the top. Bryan Robinson 22:56 It's not It's not the 15 minute drums. All right. Yeah, exactly. Nice. So. So is there anything that you'd like to promote and get to the Jamstack something you're doing or something serverless wants to talk about at all? Gareth McCumskey 23:08 Well, from the service side, there's something new that I can mention. Front End, folks, as you mentioned, there's a large audience of front end developers that listen to the show, where I've been on the show, at least as well. One thing I can mention that that is really great is that we're in the middle of working on a really great project called components right now. And this is different if folks have known the serverless framework from 2015, we released the the actual serverless framework itself, it's a fantastic tool, it does a lot of great stuff, a building, for doing back end work, and so on, help orchestrate all of these services and so on in AWS. But what we found is that while it's great at doing that, and it simplifies things a bunch serverless as a concept is very new and different enough that it's kind of a barrier to entry for a lot of folks. And especially if you're not already a if you haven't been building backend solutions for a long time. It's unfair, just you know, I, I would have no one would expect me to just dive right into view and react and angular know my way around in exactly the same way that you know, there's there's a lot of stuff when dealing with with back end code and applications. But one of the things that components does is that it takes the idea of serverless and boils it down into a nice consumable package with very little configuration. And you can actually go to the point of configuring a solution in serverless, with about three lines of configuration, a single COI command, and you've essentially deployed your Jamstack application into the cloud. Yeah, it's it's actually pretty awesome. I've been playing with it a lot myself. And we are actually it's one of those things we built for other teams and we're using it ourselves now. And it's it's really also because what it and this is the sounds like hyperbole, but it really isn't because ultimately I can go to Can I can I drop a URL? Oh, yeah, go for it. So if folks can just go to Apple serverless.com, which is our online platform, and once you've signed up, you can go and create with any of the existing components. And there's new ones coming out all the time. But one of the ones I can point to as for example, the full stack application, which ultimately what this gives you is a command to run in the CLR to install and initialize your your application that you want to create your full stack app. And this full stack app contains essentially four components. One is for a front end. So we call it the website component, the other. The other is an express API. So if you know anything about Express, you can actually just spin up your own sort of Express back end within it as an API, database component for Dynamo DB as well as permissions that set up all the permissions you need in AWS. And you can just go in and you can, you can deploy it immediately because it has a working front end back end and everything else that it needs. And just play around with it in your own AWS account. Or you can go ahead and edit it, you can point it at your own react, view, whatever code, when you run the deploy command, it'll automatically build your front end, it'll automatically connect to AWS, and push everything into s3 into lambda into API gateway, all these things that you need to run this application and then give you a URL CloudFront URL at the end for you to go and try your application. It's it really is as simple as that. Bryan Robinson 26:16 That's very cool. Because I find that one of the one of the easiest ways to get into new technology, especially new architecture, technology is to find an opinionated source, and then like use that opinionated source editor until I feel comfortable with it, and then kind of I can roll my own at that point. Gareth McCumskey 26:31 Yeah, and that's exactly the point. Over the years, we've seen a lot of folks come into service with Express as an expectation. And while the Solas framework can be used to deploy Express applications, just as they are, it's kind of a bit of a bit of a faff to use. It's, you know, you've got to configure things, you've got to configure things a certain way, you know, it becomes a bit of a hassle. So I deal with the Express component, for example, is that you can literally just pointed at that f.js file, which contains your your Express routing, and off it goes, it's into lambda, and works as intended. And the idea there again, is, as you said, folks, we'll get into this, they'll start using their application, things will run well. And that's the other the other thing that was difficult for me to figure out about this philosophy that you asked me before, because Jamstack and serverless is incredibly forgiving, you can do things kind of okay, and if it runs well anyway. And if it doesn't, if it stops running, well, you can tweak it in ways that'll make it run better. And once you once you become steeped and understand the technology, you can then rebuild pieces of at a time because that's what you did. Anyway, you started building pieces, you could replace those pieces with more optimized versions of them later down the road. And it becomes incredibly easy to do that. It's so super forgiving. Just try stuff out. And that's where a lot of folks will come and say, you know, how do I get into doing serverless? I said, Just try it, just do something with it. Even if even if it's gonna be even if it's the worst possible solution you could think of building with serverless it's probably gonna still gonna work and I'll probably still work. Okay. And that's okay. Okay, it's fine. Just change it later. Bryan Robinson 27:58 Yeah. Okay, means that you have shipped something that somebody needed. And it's out there. Gareth McCumskey 28:03 Yeah. And yeah, your users all they want is a working solution. They don't necessarily need the best crafted, highly engineered, fanciest solution that you can come up with. They just want something that works. All Bryan Robinson 28:15 right. Well, Gareth, I appreciate you coming on the show today. And I hope you keep doing some amazing things at serverless as well as just kind of in the in the general web dev back end world. Gareth McCumskey 28:24 Yeah, well, that's the goal. I'm hoping we can get there. Bryan Robinson 28:31 Thanks again to Gareth, for the awesome conversation. And thanks to you our dear listeners for tuning in Week after week. Be sure to star heart favorite or you know, review or whatever in your podcast app of choice to spread the word. Now a sponsor time. This week, we're lucky to have off zero back as our sponsor. Author is an amazing authentication platform, but they also have a wealth of amazing content coming out regularly on their YouTube channel, including a free course called full stack Jamstack with next js. If you're interested in learning more about next, taking the Jamstack further or authentication on the Jamstack head over to a0.to/tmjyt that's That's My Jamstack YouTube, TMJ YT for all their YouTube videos. Bryan Robinson 29:16 That's it for this week. Until next time, keep doing amazing things on the web and keep things jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

21 October 2020


S2E7 - Ohad Eder-Pressman on configuring sites, the minimum needed to do the job, Jamstack as the predominant web architecture

S2E7 - Ohad Eder-Pressman on configuring sites, the minimum needed to do the job, Jamstack as the predominant web architecture

Quick show notes Our Guest: Ohad Eder-Pressman What he'd like for you to see: Stackbit Studio | Jamstack Themes | Keep your eyes on the Jamstack His JAMstack Jams: Simplicity and straightforwardness of the Jamstack | Next.js or 11ty | Sanity | Netlify | Stackbit His Musical Jams: Eclectic from Bossa Novas to Kids Music This week's sponsor: Auth0 This week, we've got Auth0 as a sponsor. While their prowess at authentication is important, they're also releasing a ton of new tutorials and courses on their YouTube channel, including a free course on building a full-stack Jamstack app with Next.js. Transcript Bryan Robinson 0:02 Hello, everyone, welcome to another episode of That's My Jamstack the podcast where we ask the timeless question, what is your jam in the Jamstack. I'm your host, Bryan Robinson and today on the podcast, we have Ohad Eder-Pressman. Ohad is the CEO and co founder of the Jamstack company Stackbit. Bryan Robinson 0:20 Before we dive into the interview, though, I want to take a second and thank this week's sponsor off zero, we'll talk a bit at the end about the amazing educational content they're putting out on YouTube. But if you're curious about that Jamstack education, head on over to a0.to/yt for all the videos. Alright, thanks for being on the show with us today. Ohad Eder-Pressman 0:35 Thanks for having me, Bryan. Bryan Robinson 0:40 Cool. So let's start. Let's, uh, let's tell us a little bit about yourself. What do you do for work? What do you do for fun, that sort of thing? Ohad Eder-Pressman 0:49 Sure. So I'm Ohio, I live in work in San Francisco. I'm a co founder and CEO of Stackbit that company building platforms for developers and other stakeholders to produce Jamstack sites very passionate about the Jamstack and kind of involved with the space for a while. What do I do in my free time, I guess hanging out with family families taking up more and more time bigger share of my life. I, I used to grow up on size don't really have a lot of time for that anymore. But I'm very curious person. So you put something in front of me, I just dive in. You know, like, I watched a ton of videos about engineering yesterday, you know, in like how to do construction underwater. So yeah, let's call that a hobby for the next 24 hours. Bryan Robinson 1:43 Sure, sure. I thought so. Are we gonna be seeing some some underwater architecture from Stackbit? Probably probably just watching the videos. Ohad Eder-Pressman 1:51 No, no, no, these things don't always have to intermix? Yeah, I love construction and building things. Very big DIY. Bryan Robinson 2:01 Cool. Very nice. And with the, with the old bonds, I have it, like you grew them, you shaped them, like how many did you have kind of at the most? Ohad Eder-Pressman 2:12 I think I've killed five and then stuff. Ohad Eder-Pressman 2:17 That's, you know, the world gave me a signal and I listened. Bryan Robinson 2:20 Yeah, I actually had one in college. And I kept it alive about six months in a dorm room, and then took it home for the summer to my parents house where it got destroyed, because there was an infestation that happened. And then I never picked it back up. So I was one and done. But it was a lot of fun. It was cool to like, you know, gently clip and gently shape over the course of the six months. Ohad Eder-Pressman 2:39 Yeah, it's very Zen. Very Zen. I love that. Bryan Robinson 2:42 Cool. So what was your entry point into kind of the idea of the Jamstack? Or if you're old school enough into the idea of like static sites and that sort of thing? Unknown Speaker 2:51 Bryan Robinson 5:04 I like how it was it was possibly the first, the first WordPress on the Jamstack kind of ideal, export the entire WordPress, HTML and just toss it up on s3 bucket. Ohad Eder-Pressman 5:16 Mm hmm. Yeah, we're seeing some companies do that today as a strategy for people who are still very, very much committed to the WordPress ecosystem, and admin and tools and so forth. But yeah, for me it the gratification was instant. Because you know, like, the moment you do that, you don't have to worry about anything. The next time you do have to worry about something is when you want to edit your site. It's like, hold on, hold on, hold on, what did I do? And so that took me on a journey of, you know, introspection and prototyping, in years of, of just going through different methods of working on my website, which eventually led to a lot of the things that I'm kind of involved with in the Jamstack. Nowadays. Bryan Robinson 5:59 Very cool. So yeah, there's definitely a lot of a lot of tools, a lot of different things you can use. So let's talk about that professional use of the Jamstack. Obviously, Stackbit is a very Jamstack centric company. So how are you? How are you using a professionally what's Jamstack kind of got to do with the Stackbit thing? Ohad Eder-Pressman 6:17 So, you know, I'm a big believer, big, big believer in the Jamstack. And in the concepts of, you know, building sites and serving them statically. And in a very confident that the tooling around all of that is constantly evolving. Stackbit that was born in response to that point in time earlier on where I was, like, how am I gonna edit my website. And, you know, I personally went through a lot in this seven years or eight years that that transpired between 2012 and, and maybe seven years, in 2019, when we started Stackbit, but in essence, that, you know, the Jamstack is a phenomenal way to build website, which is only accessible to developers who are comfortable with the command line. And since I'm very, very confident that it's the it's going to be the predominant way that we build websites, the predominant concept and architecture that replaces lamp, I realized that we're going to need tooling, we're going to need better tooling for developers, we're going to need better tooling for their stakeholders, we're going to need platforms that enable people to create Jamstack sites as easily as it is to create a Wix or Squarespace or even a WordPress site. And, you know, we're going to need tools for marketers and companies who need to do a weak editing to websites that are built in the Jamstack architecture, which you know that Jamstack really hit home on a lot of great benefits, like a great developer experience, and modernize developer experience, the fastest websites in the world, and likely the most secure websites in the world. But at the same time, it sacrificed the world of tooling that is now considered table stakes whenever you talk about creating and editing a website. So if if we really want organizations and people to adopt this, this architecture, we have to give them the tools that enable them to be successful in doing so. And we can't we can't look at something like Squarespace and say, well, that's that's a wiziwig experience. It's consumerized. It's not what we're competing with, you know, I think Jamstack has to compete with that specifically with Squarespace or Wix. But, you know, in general, we have to get the experience to that level and beyond in order to enable this to become the predominant architecture for the web, Bryan Robinson 8:56 I guess. So going forward. The The goal is kind of like we have this developer ecosystem and the developer ecosystem is actually pretty friendly to developers that know about it. But how do we make the Jamstack and all the benefits that the Jamstack brings accessible to those who don't have a developer on staff like so that they can have it as well as we can still have our shiny fancy things in the in the code? Ohad Eder-Pressman 9:19 Well, that or, you know, here's an organization and developers have built a site, right, because developers aren't going anywhere. You know, I, you know, I'm also a big believer in low code and no code, but developers aren't going anywhere. It's just that the work that they're going to be spending their time on is going to be higher impact and more developers, but their stakeholders and let's just call them marketers, for simplification, you know, are going to use other tools. So developer can set up a Jamstack website, but their counterparts at the company are not going to use the command line or edit markdown files and GitHub. They're going to need proper tools. They need to be able to preview them. need to be able to share, they need to be able to create 100 landing pages with a couple of clicks and uploading a CSV file of keywords. They people need these tools, you know, if you think in the context of jobs to be done, like a lot of people need to work on a lot of sites every day. And if we want those sites to be Jamstack, we, we want to help those websites become Jamstack websites and have anybody reap the benefits of this architecture. We have to build this tool. Bryan Robinson 10:31 Next, so you mentioned something, it's actually something that I haven't thought about before. And I come I've got a little bit of a marketing agency background, the idea of the of having a CSV of keywords, and then like spitting out like 100 landing pages, is that I can't even think of how I would how I would kind of start doing that on the Jamstack. Like, philosophically, that seems tough. Ohad Eder-Pressman 10:55 Right? I mean, it's, you probably integrate it into some sort of data processing pipeline that runs before your static site generator, or if you're using one that has an ecosystem that can import, you know, CSV files, and just use that as part of your data. You know, you'd kind of work at it that way. But it's, you notice, it requires a developer, there's no best practices for how to do that. There's no kind of like, framework that encourages you and empowers you to do that. And so, but it's not rocket science, like, How hard is it to take something from here and put it in there, it's just we need these abstractions. And we need these tools. And we need user interfaces that empower real people to, to be able to do these things and not have to come back to developers because the world is shifting in this direction of empowering people to do more. And let's think about it as low code. You know, marketers now have tools like air table and motion and whatnot, and they just expect to be able to do more. And so when you try to sell the Jamstack organization, today, it's like, yes, and actually, you're going to be more dependent on your developer. And guess what, that dependency is going to create a lot of work for your developer that they're probably not too excited about, you know, like, and so it's, um, it's all about creating the tools and abstractions, and services, that, that real empower developers to focus on the things that they enjoy, and that they're good at, and enable the marketers to do all of the day to day work, it kind of streamlined way, and not in a way that creates just tedious repetitive work for developers. Bryan Robinson 12:29 Cool. So I think it's interesting that, you know, Stackbit kind of sits in this unique position in the ecosystem, like the hub of a whole bunch of different tools. And you, you recently wrote a post contemplating the Matt Mullenweg. WordPress vs. Jamstack stuff, we don't need to get into the, into the drama of that piece. But like, the idea that I think I think you wrote that, like, it's not that there are these insurmountable issues in the Jamstack. It's that we're working on building the tooling. And we're still very early in that tooling. I'm kind of wondering like, what what's the what, what what, what insights Do you have coming from this centralized location in the Jamstack? about that? Because obviously, you wrote about that, and I'm interested to find out a little more. Ohad Eder-Pressman 13:18 Yeah, I think I really enjoyed writing that piece. And I think it's, it's, it's valuable for all of us to have this type of discourse. It's not something official to be dismissive, not of Jamstack, and not a WordPress, which isn't going anywhere, we have to recognize that it has some benefits, and the world knows how to use it. And so how do we like where do we go from here? The my commentary was focused on, you know, it's not about comparing the Jamstack toward press Jamstack has to be compared to to the LAMP stack, right? The Jamstack is an architecture, it's a way of doing things. It's it's kind of a flexible definition, right? Like if you have a Gatsby front end for, for content coming from a WordPress, you know, admin install and sites deployed on Netlify. Is that a Jamstack? site? Like, I totally think it is. And, you know, it's, it's, WordPress is very, very dominant right now. I personally think it's dominant, because because it's dominant. I don't know if that makes sense. Bryan Robinson 14:29 I know there's momentum. Ohad Eder-Pressman 14:30 Right, exactly. There's momentum. And there's kind of wait, but you know, I'd love to meet the developer, who is completing who yesterday completed their boot camp, right? Because that's how most developers kind of become developers nowadays, which is fantastic. So show me that developer who is excited to go into WordPress and learn how to build plugins in PHP. You know, I don't I think that's non existent. And so I just I think that the that developers aren't going to pull us Out of WordPress with time. And I say that, you know, we, I could have made a prediction that WordPress will turn into a Jamstack solution and kind of get rewritten in JavaScript. But I think it's such a massive open source project with open source governance and so forth, which is, is great at times, but at the same time, I just, I don't see it shifting fast enough, so that it can keep up, you see how long it took for Gutenberg to, to arrive, which, you know, is infinitely better experience than what was there before, but I, I just don't see it happening. And so you know, that the tooling for the Jamstack today is not competitive enough with with WordPress, you know, WordPress, you can send a non technical person to themeforest, they can download the zip file with a theme, they can go to digitalocean and get a droplet and with like reasonable UI, they can kind of get a site up and running. In all honesty, I think it's a horrible experience. But it's, it's possible, and it's feasible, and people actually do it every day. So that the Jamstack isn't there just yet, Stackbit tries to do a lot to push us in that direction. But it's, um, it's still it's still taking time. And, you know, if you look at some of the core challenges with with the Jamstack, which are, well, I need to connect different services together, or, you know, incremental build rehydration, but there's a lot of there's a lot of kind of, you know, technical challenges with the Jamstack. But the rate of progress, and the number of super smart people working on it really encourages me that, you know, I don't see those as fundamental issues with the architecture, I just see, you know, this is the current state of the tooling. And the tooling, I mean, look at the tooling 12 months ago, look where it is now. And let's imagine where it's going to be in 12 months. And so I'm not, my point is not, you know, hey, let's fight about who's better right now, you know, of course, WordPress is super dominant and popular and kind of the default choice, but I'm just allowing myself to extrapolate based on the trends that we're seeing, you know, we, we look at a lot of data, and we see the dynamics and the evolution of the static site generators and the preference, that that kind of shifts and, and the rapid adoption of Jamstack technologies, right, static site generators, headless CMS is in deployment platforms, modernize deployment platforms, we just see the the growing adoption of those both in in enterprise companies, you know, Alexa top 10,000, but also in cohorts of websites, like all the yc companies, or all of the websites mentioned on indie hackers. So, you know, if you look at indie hackers, and we've done this work, and you look at all the websites started, but all of the people there who are predominantly early adopters, DIY, DIY errs, it's upwards of 20% of the websites created there are powered by at least one Jamstack kind of leg, if you will, like a headless CMS, a static site generator or deployed to say, and Netlify. So yeah, super confident, and confident, not in a cocky way, which is super positive. And, and kind of looking forward. Bryan Robinson 18:18 Yeah, I really like the idea of it's not it's not WordPress versus the Jamstack. It's more it's, it's the LAMP stack isn't even versus, but it's like, comparing you compared to the LAMP stack. If you look at the LAMP stack from, you know, I guess, the late 90s, early 2000s, it's very different than where it is today. And all of that tooling came up in a way that, you know, solve the same issues we're talking about, and now we're just solving them in this way that is more secure, faster, etc. Ohad Eder-Pressman 18:48 Right? And I think it's very natural. You know, when say, when you represent WordPress to become defensive and say, oh, but you know, look, Netlify is only such and such percentage of the web. But I mean, you know, I think Netlify is an amazing company, we can talk about them. But more importantly, the Jamstack is an approach is, is much bigger than any single company, or any single static site generator, and it is this kind of, like, fluffy, broad definition. And that's also one of the reasons I'm very, I believe that it's going to kind of eat the web, you know, because it's, it's better. And it's a logical choice. And it's broad enough that, yeah, a lot of sites are going to be Jamstack sites, and some WordPress sites are going to be Jamstack sites as well. And you know, Matt, Matt, of WordPress agreed to that. And so it's this isn't about, you know, it's it isn't as much about worse WordPress versus Stackbit or WordPress versus Netlify. This is, you know, Jamstack is an architecture is going to take over the web again, in my opinion, and so how do we prepare for that? How do we go Encourage that, and what's missing for that to happen? And for the people who adopt that to be successful and not feel like early adopters who have made the wrong mistake or an early, you'd like to who have moved there too early, if you will? Yeah, Bryan Robinson 20:12 definitely. Very cool. So we've listed out a whole lot of different different benefits, different thought processes around the Jamstack. But what would you kind of consider? What would you say your jam in the Jamstack? Is? Obviously you run a service, this Jamstack service, but like, what's your favorite service product, philosophy, framework, even what's what what makes you love the Jamstack Ohad Eder-Pressman 20:16 I love I love the simplicity, and the straightforwardness of it all. I'm very biased, because I didn't mention this earlier on. But I'm, I'm involved with a bunch of different companies in the Jamstack. And I'm the you know, the first investor in Netlify, and on the board of the company. And so I was in, you know, I was fortunate to be in the room with Matt and Chris were like, oh, should we coined this term. And I was like, Guys, let's let's not bet the company on that. But they've obviously, they've obviously done really well and have created tremendous positive change in the world of the web. I'm also an investor in, in Sanity, and I think the team there is doing a phenomenal work. And obviously, associated with a bunch of other companies. And so I, you know, like my go to stack right now would probably be either next JS or eleventy, depending on what type of site I'm playing with. I really love just storing my content and get but if I need something more serious, I really enjoy, really enjoy Sanity. And yeah, deploy to Netlify. So that's my that would be my jam. And you know, of course, it's I, I don't start a website today, that isn't managed by statute. So it's, you know, some most people probably know Stackbit, but for our site builder, you know, 60 seconds, pick your stack, and you have a life site working, where we've provisioned the source code for you and everything is wired. And none of it is built with some secret stack, that sauce or custom Stackbit SDK is just taken and do whatever you want with it. But our main product is the Stackbit Studio, which basically, if the Jamstack unbundled content editing from publishing and kind of this integrated all of the product workflows, we kind of re aggregate all of that back into a single experience, where you can have a website, whether it was built with Stackbit or whether you build it by yourself, you can plug your repo in your, your your CMS in and you get a you get a WYSIWYG editing experience, you can create a B tests, you can create pages, you can share previews, and you It kind of looks and feels like a Squarespace or Wix or maybe a little bit of a web flow. And, and so that's how I enjoy working on my website. So of course, I can go directly to the repo and make changes if I want to edit templates or do anything like that. And it automatically gets reflected, but like my day to day of just like, you know, once you build a website and ship it, that's when the real work kind of starts depends if you think about your website, as a developer, or as a marketer. And, for me, I kind of enjoy to traverse both paths and kind of go back and forth. And so I spend most of my time in Stackbit, but when I work on my websites, Bryan Robinson 23:21 And so to kind of go back, you said, you know, you like the simplicity of the idea of the Jamstack. And so it sounds like the Jamstack has simplicity. And each of the products that are a product of the Jamstack. Collectively, they can be kind of complex and sounds like what you're doing with with a Stackbit Studio to kind of create a simple interface for that extra complexity that comes from the multiple simple applications out there. Ohad Eder-Pressman 23:47 Yeah, that's one. That's one way to look at it. Because of course, to integrate these things and think about how they touch each other is, is somewhat complex. But the bigger thing is that if you even put aside the complexity, there's just a lot of capabilities that existed before whether it's in WordPress, or whether they exist today. When you create a website with Wix or Squarespace, like, you know, things like with you, we get it. It's not complex is just impossible, right? You're, you're expected to go and edit your content where your content lives. The place that manages your content, and does a phenomenal job of letting you create structured content, and then manage it and play with it and edit it has no idea what you actually do with that content, because we've separated content and and how we render it right. And so Stackbit just has a lot of a lot of secret sauce to kind of re bundle that experience and introduce those capabilities, which are not hard to just, you know, don't exist or like impossible. Bryan Robinson 24:48 Cool. So, so let's let's pivot just a little bit so we can keep our episode length. We could talk about a lot of this stuff for a long time I can gather here, but so we keep our episode length right on that. Time. Let's talk about what your musical jam is. What are you listening to right now? When you're working when you're with your family, that sort of thing? Ohad Eder-Pressman 25:08 Yeah, I'm extremely eclectic, extremely eclectic. So this morning, I've been listening to both the Novus and lamenting the fact that I haven't learned Portuguese yet. I really love languages. But, you know, because I have have a young daughter, we listen to a lot of a lot of kind of kids, kids, kids songs, and so forth. Ohad Eder-Pressman 25:32 And yeah, so that's kind of where I am right now. Bryan Robinson 25:36 Nice. Very cool. So, so to kind of finish things off here, is there anything specific that you'd like to promote out to the Jamstack community, anything that you're doing that you want everyone to kind of get them eyes on? Ohad Eder-Pressman 25:48 You know, I think, keep your eyes on, keep your eyes on the Jamstack. We're, we're doing a lot as a, as a company, not only to build better tools to empower people, but also to uplift, the whole, the whole Jamstack. You know, Jamstack themes that dev is, is the leading resource for open source themes for any of these static site generators. And we're just doing more and more of that work. So we're announcing a very, very cool project soon. So stay posted. Very Jamstack key. Yeah, yeah. A lot of good stuff coming. Awesome. Bryan Robinson 26:25 Well, I appreciate you taking the time to speak with us today and tell us all about things going on and in Stackbit world as well as personally with you. Thanks so much. Ohad Eder-Pressman 26:32 Thank you, Brian. Thank you for the patience and the opportunity. And yeah, I enjoyed this as well. Thanks, everyone, for listening. Bryan Robinson 26:41 Thanks again. Oh, hug that awesome conversation. And thanks to you, dear listener for tuning in Week after week. Be sure to star heart favorite review, you know, whatever and your podcast app of choice to spread the word. Now it's sponsored time. This week, we're lucky to have back off zero as a sponsor. Author zero is an amazing authentication platform, but they also have a wealth of amazing content coming out regularly on their YouTube channel, including a free course called full stack Jamstack with next js. If you're interested in learning more about next taking the Jamstack further, or just authentication on the Jamstack head on over to a0.to/yt for their YouTube channel. That's it for this week. Until next time, keep doing amazing things on the web and keep things jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

14 October 2020


S2E6 - Brad Garropy on the A in the Jamstack, cloud databases, and side projects

S2E6 - Brad Garropy on the A in the Jamstack, cloud databases, and side projects

Quick show notes Our Guest: Brad Garropy What he'd like for you to see: His Twitch Streams | His Discord Community His JAMstack Jams: Netlify | FaunaDB | The "A" in the JAMstack His Musical Jams: Kolby Cooper | Artists on his Daily Texas Country site This week's sponsor: Auth0 This week, we've got Auth0 as a sponsor. While their prowess at authentication is important, they also just release a free online course for building a full-stack, Jamstack application with Next.js, Tailwind, Airtable, and Auth0. Transcript Bryan Robinson 0:01 Welcome back, Jamstackers! It's been a bit of time since last we talked, but I'm so glad to be back with you. You're listening to That's My Jamstack the podcast where we asked a timeless, ageless and incomparable question. What is your jam in the Jamstack? I'm your host, Bryan Robinson. And this week on the show, we have Brad Garropy. Brad is a lead front end developer at Adobe by day and a live code streamer by night. Bryan Robinson 0:46 All right. Well, Brad, thanks for being on the show with us today. Can you tell us a little bit about yourself? Brad Garropy 0:50 Yeah, absolutely. I'm a recently promoted lead front end developer at Adobe. And the job description basically entails that I build SAS services for the Magento ecommerce platform, as you mean like Software as a Service things or another definition of SAS? Yeah, software as a service. So imagine things like product recommendations or search that can be kind of tacked on to the e commerce store. So what do you do for fun that if that's what you do for work? Yeah, well, definitely for fun, I do a lot of programming and side projects, but away from the computer, I really like to work out I'm into bodybuilding, powerlifting, running, all those types of things. Bryan Robinson 1:31 Awesome. So so what what kind of, is it like strength training? Is it are you doing like a Olympic league? Like overhead presses for your powerlifting? What what's that entail? Brad Garropy 1:41 Yeah, like my training splits are typically like this, they start off with one of those powerlifting movements like your, like your bench press, or your squat, your deadlift. And then the rest of the training session kind of focuses around bodybuilding movements like to, to really stress out and tear down the muscles. Bryan Robinson 1:59 That sounds awful from somebody who doesn't do a whole lot working. Brad Garropy 2:03 You know, it's funny, I found that a lot of developers actually take well to powerlifting. Because it's a it's usually a very structured program with progression and percentages and numbers. And I think developers just feel right at home when they have a lot of structure to training. Bryan Robinson 2:22 Yeah, that makes sense. It's kind of a logical, like I said, the progression is a logical thing. And that tends to play well with the way our brains work. Brad Garropy 2:29 Exactly. Bryan Robinson 2:31 Nice. So so this is a Jamstack podcast, let's talk about the Jamstack. A little bit, what was your entry point into this idea of other static sites or Jamstack? As we can know it today? Brad Garropy 2:40 Yeah, it was interesting. I, I started learning web development at a really volatile time, like create react app was just coming out. And this notion of front end frameworks was just really picking up and my entry point into Jamstack, was trying to make my first blog. And I had to think about, you know, how do I source data but still make hosting cheap and free and easy? Yeah. Right. So Gatsby was one of the first tools that I got to reach for I did run Jekyll for just a little bit there. But Ruby, Ruby is difficult to work with. Bryan Robinson 3:18 Yeah, definitely as a as if, especially if you're coming from like a front end development perspective. And you also often have to do Ruby work, like that just doesn't feel quite right. Brad Garropy 3:26 Yeah, like my learning path was like HTML, CSS. What is this Jekyll thing? You know? Yeah. So eventually, I kind of switched over to Gatsby and kind of hopped on the train with everybody else about like, this is kind of how you source data and and pre generate pages, which made hosting, you know, easy, simple and free, which is I'm a big proponent of free Bryan Robinson 3:51 Free is definitelya nice thing, especially especially in like side projects like that. Like, if you got a budget at work, like, that's cool. You can use that budget, but when you just want to blog, like, I don't want to pay $10 a month in hosting for that blog. Brad Garropy 4:03 Yeah, and, and Jamstack is really cool, especially with that philosophy, because there's so many services around the Jamstack, that the way they work is they offer free tiers and free tiers just good enough for my use case, you know, I haven't built anything that's kind of broken out of that free tier. Bryan Robinson 4:22 Yeah, I think it's one of those things where if a developer is using it on their personal projects, or their little side projects that like, they may then want to use that for bigger projects at work, and they may find more enterprise clients that way, something along those lines. Brad Garropy 4:36 Exactly, yeah, they they, they can bait you in with some really good premium features, or just essentially just like scalability. Yeah, definitely like that. The scaling is always a always a fun challenge to not have to worry about yourself. Absolutely. I I see my back end team at work constantly like thinking about how do we use Kubernetes to scale our API infrastructure and what happens when, you know, we released this to the public and there's 100,000 requests in, you know, 30 minutes. And they have so much to worry about with with us front end folks and the Jamstack technologies, you kind of make your HTML pages, add in a little JavaScript for interactivity and API calls, and they just get cached and served as kind of works in the end. So you talked about building a blog. So obviously, you've you've used Jamstack, a little bit personally, but how are you using these philosophies? professionally now, but also a little bit more on the personal side, too? Yeah. So the blog, it's Brad garrett.com, it was my entry point into kind of building a site with real data and content. But I built many other like side projects that stemmed from there that kind of gave me my my base as a front end developer. So I built like, a little website for my wife's photography business that was done on the Jamstack. I built daily, Texas country.com, which is like a Texas country music focused blog and community website, and that sources data from all sorts of different places, and it uses Gatsby for that data sourcing. And I've even built things on the Jamstack. Not using like Gatsby and react, I built a svelte application that, in my opinion, still very much adheres to the Jamstack to track workouts. Bryan Robinson 6:29 Okay, cool. So so it's like when you say, it still adheres to the kind of Jamstack philosophy? What do you kind of see as that as that philosophy? Because a lot of people have different definitions of it. Brad Garropy 6:40 They do. Yeah. So it folks listening to the show probably know, Jamstack stands for JavaScript API's and markup. And so this workout timer application is a single page application that I still believe falls into the realm of Jamstack. A single page application is still delivering HTML, which is your index dot HTML file just happens to be pretty blank, although you can kind of pre generate the shell of the application, and then populate data inside of there. So this application is just a timer that runs and you can go to a page, if you're logged in, where you can fetch your previous workouts, it saves it up to fauna, db. Bryan Robinson 7:29 Oh, nice. Very cool. So. So also, I'm kind of curious, you said that the daily Texas country it was a it was a Texas country music blog, but also a community. What's the community aspect? And how's that playing with the Jamstack? Brad Garropy 7:42 Yeah, I suppose what I mean is like, I'm trying to bring the community together on that website. So I make a bunch of different types of content. So I'll source YouTube videos that I make I'll source blog articles, and all sorts of playlists to try to get folks to gather at that website. There. I see that confusion there. There was no like, notion of a user or a member where there's comments or anything, I kind of use the other platforms for that. Bryan Robinson 8:07 I gotcha. And you're sourcing those and pulling them in. You said via the Gatsby source stuff. Right. Right. Unknown Speaker 8:13 Bryan Robinson 8:13 Cool. Cool. So So we've talked a little bit about Gatsby, but what is kind of your jam in the Jamstack? What's your favorite service or philosophy framework, etc. Brad Garropy 8:24 Man, I think this is the really cool part about the Jamstack. And this is where the A in the Jamstack kind of plays an important role. So like, first of all, hosting on the Jamstack is great. Netlify is a tool that's universally loved. And I am no exception. They they make posting your files easy integrating with GitHub easy. It makes hosting serverless functions easy. And even doing things like DNS management easy. If you opt into their DNS servers, you can do like redirects very easily or sub domains. Just easy is the word that comes to mind. That's on the hosting side. Another thing that I really like about the Jamstack is that there are so many services that support it. So this kind of brings me to like the A in Jamstack, where, if you're coming at it from a front end developer point of view, you can build a front end, but you're looking for like, what is it that might happen does? How do I connect it to services or databases, and that's where you kind of go searching for the A, the API's. And I think it leaves developers in an interesting, interesting place, they have to kind of choose what services to stitch together. And for some folks, that might be like, a good thing or a bad thing, because at the end of the day, if you're choosing to integrate a bunch of services together to create a product, you have to write a bunch of like Glue Code and you might reach more of like a fatigue and trying to determine what's the best service for CMS or a payment processor or a database? Bryan Robinson 10:07 Yeah. And you haven't mentioned, like the fact that you've got, you have to string these services together, you have to figure out what is that string? How do I actually do the stringing of those services? Brad Garropy 10:18 That's right, yeah. And this is where a lot of confusion can come into play. Or if if, for instance, one service isn't as flexible as you want. And now you have to like migrate to a new one, or if one service changes their pricing model, there's so much to consider. So I think a and Jamstack is fairly overloaded. When when all the services work well together, you just kind of you're picking apples from the tree, and life is dandy. But when you kind of run into problems, you really have to, like, interact with those services, support teams, or dev roles, and try to find answers. Bryan Robinson 10:53 So do you have any kind of like, best practices to like, try to avoid some of those those hiccups? Or are there any any kind of tips or tricks that you that you've had to implement as you've been building some of these things? Brad Garropy 11:07 Yes. So one approach that I've started taking was, don't rely on CMS, if you don't have to, if you don't have somebody else, that's going to be modifying data on your website, I would opt not to use a CMS. First of all, that means you can generally bring your content right into the repository, where the front end code is hosted. And it's co located, which is a good thing, you own your content at that point. What that does is it kind of helps saves you from like, integration problems with your front end build tools. Like for instance, I was using contentful for a while, and I found that there, Gatsby source plugin was missing some fields that I really, really wanted. And after working with, like their, their dev rails and and submitting like some issues, it was clear that like, this stuff just wasn't going to be resolved. So that was one of the things that kind of forced me to move content into my repository. Another thing is like development environments, if you use Netlify, for hosting, every one of your GitHub branches, is actually turned into its own subdomain on Netlify. So that you can have like, immutable deploys two branches that have previews of content that's not actually published, which is so helpful. And sometimes getting a CMS to do that can be kind of difficult. Bryan Robinson 12:34 There's definitely some overhead that kind of comes into play when you have to do that from a CMS or from any kind of API layer at that point. For sure. Brad Garropy 12:41 So like, I think mitigation wise is like, own as much code as you can without reinventing the wheel. And then if you have to use a service, find one that's fairly popular, or one that clicks with your mental model. And it just takes trying different services out to figure that out. I've recently worked with fauna DB as like a serverless first database. And I found that after understanding their query language, it really clicked with my mental model of like, this is how my Jamstack site is going to work with serverless. First database. Bryan Robinson 13:16 Yeah, well, and the interesting thing for me fun is actually was the first, like, no SQL like, schema list database that really clicked with me. Like, I'd used Firebase and some other stuff in the past, but never, never felt quite right. And then something about fauna just just hit me in the right spot. And I built a couple small apps with it now. Brad Garropy 13:38 Yep, yep, I built my Murphy app with it. And I'm pretty happy with it. And actually chose not to go with their graph qL implementation, I'm doing just their, I guess, their JavaScript library implementation. Bryan Robinson 13:51 And there's a lot of interesting things that you can do kind of in the in the back how they work to where they've got their their SQL query language, their fun a query language, and you actually build out complex queries as functions that they have. And then you can actually just submit one like line of JavaScript, and it runs that function on their on their servers, which can be really, really handy. Brad Garropy 14:12 Yeah, and I found it like, super helpful to build up a utility folder, or like a utility file with like a bunch of CRUD operations written out in SQL. So if you want to read all posts, or read a single post, or edit a post, and you just kind of build out those CRUD operations, then they're like building blocks you can use in your serverless functions, that, you know, you might have route handlers for each one, and then you just call out to that specific utility function. It just, it almost felt like I wrote kind of an express app without having to set up, like, all of the boilerplate, you know, and it was just really easy to deploy things to Netlify. Bryan Robinson 14:53 Yeah. And like the interesting thing to me too, is that like, honestly, the SQL language kind of broke my brain. In a little bit, it was, it was very difficult for me to get into. But there was a moment. And it was like two days into working with it. Were all of a sudden, like, it was like the matrix, I get all sudden, like, see my queries happening and like understand exactly where it was coming from. So there's definitely a hurdle there. It's it's a new language, but it's a, it can be very, very beneficial, I think, Brad Garropy 15:19 yeah, I was very lucky in that I had the help of dev REL from fauna, I was actually streaming and tagging them and everything that I was doing. Next thing, you know, I got a dev REL sitting in chat. And then he joined up on a Discord server that I'm in. And he, he really worked with me side by side to like, improve my queries, discuss options, I even got invited to like a feedback call where I could, you know, talk to them about the decisions I made and how I use fauna and areas I see for improvement. And that's another thing about the Jamstack. I just feel like, all the companies are very much like developer experience first, and they're willing to engage and they, they hire Developer Relations people, and they do a really good job at reaching out. Bryan Robinson 16:06 I think I wonder if that has anything to do with kind of the, to your point on the A in the Jamstack, the API layer and how you really do kind of need developers on your team to be able to to utilize the Jamstack properly. And I wonder if that's, you know, the defining characteristic of a Jamstack company, is how well, they manage their developer community, because that's, that's who really buys in and makes all this work. Brad Garropy 16:33 Yeah, like if A is truly kind of just a bunch of services that you have to go utilize. They have to know who their customers are, they have to know who they're delivering to. Bryan Robinson 16:43 Cool. So let's talk music. What's your actual jam right now? What's your favorite song or musician or I know you run a website about music. So hopefully, you've got some some hot takes here. Brad Garropy 16:52 Yeah, so that daily, Texas country website is all based around a playlist that has like 1200, Texas country songs, and it's actually 1200 Texas country songs. Oh, yeah. This is only like a very select subset of the ones that are curated by me, you know, so it's a it's a big genre, because it's a big state. You know what I mean? Yeah, definitely. Anyways, there's a up and coming kind of artist, he's 21 years old, just turned 21. His name is Colby Cooper, and I love like, basically everything that he does, Bryan Robinson 17:26 so it was out of curiosity. So what is Texas country as compared to country with a capital C? Brad Garropy 17:36 Yeah. Okay. So I think the main difference is a country that kind of comes out of Nashville, you kind of do like there's a natural epicenter of country music, and there's like a Texas epicenter of country music. And the difference is, the giant labels like Sony and Columbia are producing records out of Nashville, that that sound over produced, they use drum machines, they use snap tracks, all these different pop music elements in country music that Texas country music fans don't view as like traditional country music. Whereas in Texas, you're typically recording in like, a very modest studio. You expect to have like a fiddle in the band. That's definitely true. And there's like a steel guitar like more rich natural instrumentation, and then you typically just have like, Guys being very honest in lyrics just talking about everyday stuff. Bryan Robinson 18:35 Is Texas country that the hipster country of the country world. Brad Garropy 18:39 So I think i think i think Nashville folks looking in would say that, but I think Texas people looking out would say no, this this is the original We are the one true country. Bryan Robinson 18:50 Gotcha. Mind you. I'm from Tennessee, so I don't actually like the Nashville the Nashville scene. But uh, but I guess I guess it's been it's flavored my my knowledge of the genre. Brad Garropy 19:00 I think the coolest part about Texas country music is that like, you can go to a concert on any given Friday or Saturday night for like 15 bucks, you know, you're not going to have to pay $70 for an arena. See, you can go see your favorite artist right around the corner. You know, any given weekend. Bryan Robinson 19:18 Nice. Very cool. So is there anything that you would like to promote anything that you're doing that you really want out to the Jamstack community right now? Brad Garropy 19:25 Yeah, I'm actually like, a much smaller content creator than the crowd I hang out with. And so I would love to like try to build up my my Twitch and my Twitter a little bit more. So I'm Brad Garrett at Twitch. tv slash Brad GaryVee. I stream like weeknights, like 10pm fairly late. So I'm a night owl and Twitter. It's twitter.com slash Brad Garrett up. I try to tweet out some tips every now and then and just keep you all informed about the projects that I'm working on. Bryan Robinson 19:56 So what are you what are you streaming most nights? What what kind of code Are you working on? Brad Garropy 20:00 Yeah, I work on react. I work on feltz. But lately, it's been a lot of felt because of this Murphy app. I've been live streaming the entire development process of the Murphy app written in spelt on the front end and serverless functions and fauna DB on the back end. Bryan Robinson 20:18 Very cool. Well, I appreciate you coming on the show with us today. And I hope you keep doing some amazing things both at Adobe as well as in all these awesome side projects you got going on. Brad Garropy 20:27 Thanks a lot for having me, Brian. Bryan Robinson 20:30 Thanks again to Brad for coming on the show this week. And thanks to you, our listeners for listening each and every week, week after a week. Now sponsor time and I'm really really excited to talk to you about a free course that our friends at auth zero have released. This course is going to cover building a full stack Jamstack application with next j s, air table off zero and tailwind CSS. Now next j s is going to be the front end framework. You'll learn all about designing with tailwind CSS air table is going to be for your database. And of course, for authentication, we're going to be using auth zero. So to watch this course, head on over to a zero to slash full stack Jamstack for all the details. And of course thank you for sticking around to the end, listening to our sponsors, visiting our sponsors, all that good stuff. Until next time, keep doing amazing things on the web and keep things jamming Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

7 October 2020


S2E5 - Debbie O'Brien on NuxtJS, web frameworks, creating your own framework and more

S2E5 - Debbie O'Brien on NuxtJS, web frameworks, creating your own framework and more

Quick show notes Our Guest: Debbie O'Brien What she'd like for you to see: Nuxt Content | Nuxt Static | Nuxt Components Her JAMstack Jams: NuxtJS Transcript Bryan Robinson 0:02 Hello, everyone, welcome to this week's episode of That's My Jamstack the podcast where we ask the timeless question, what's your jam in the Jamstack? I'm your host, Bryan Robinson. And this week on the show, we had the amazing and talented Debbie O'Brien. Debbie is the head of learning and developer advocate for NuxtJS. She's a Microsoft MVP, Google GDE and Cloudinary MDE. Bryan Robinson 0:25 But before we get to that, let's talk about our amazing sponsor this week TakeShape. We'll talk about their content platform after the episode. But if you're curious to find out more right now, head on over to take shape.io slash That's My Jamstack for more information. Bryan Robinson 0:45 All right. Well, thanks for being on the show with us today. Debbie, how are you doing today? Debbie O'Brien 0:48 Hey, I'm good. Thank you. Thanks for having me. Bryan Robinson 0:50 No problem. So tell us a little bit about yourself. What do you do for work? What do you do for fun, that kind of thing. Debbie O'Brien 0:56 So I'm working for NuxtJS as head of learning and Developer Advocate. So that's kind of pretty cool. And in my free time I'm doing sport because like lockdown makes you fat. So I'm doing a lot of sport, Taekwondo running, cycling anything. Bryan Robinson 1:12 Anything get a little active, right? Debbie O'Brien 1:14 Yeah. Also because we were locked up for like two months. So it's just like, good to get outside and actually do stuff. Bryan Robinson 1:20 Yeah, the best I'm on managing right now is just short walks outside. That's, that's what I've got going. Debbie O'Brien 1:25 Well, it's a good start. Bryan Robinson 1:27 So tell us a little bit more about what you do as kind of the head of education and dev advocacy at Debbie O'Brien 1:35 Yeah, so basically, my job is to kind of like make sure that Nuxt is really easy to use, easy to learn by providing good documentation, great examples, demos, pretty much anything that you would want when you want to like learn something, that you have the right materials, and then we'll work on workshops and video courses, etc. And then obviously, just Nuxt-ifying the world. I mean, the whole aim is that everyone uses Nuxt. They know what it is. Because it's amazing, right? So we just have to like, show it to the world. And then like, everyone would just come on board. Bryan Robinson 2:06 Watch everyone pour right in at that point, right? Debbie O'Brien 2:09 It's easy. It was really easy. Bryan Robinson 2:13 So so what what do you kind of see is the difference between like, since you have both those titles can combine what's the difference between like developer education and you know, Developer Relations or developer advocacy? Debbie O'Brien 2:23 Um, I guess you could say they're very similar sometimes, especially when you're writing a blog post, right? Because you're advocating because you're producing material, but you're also teaching because you're teaching someone something new. So that's why I think they're very much combined. But I guess if you were like to go for a job and learning it doesn't mean you have to be a speaker on a stage right. So the advocate, advocacy ism is a little bit more. Get out there in front of people. I think, you know, be more, don't be shy. Bryan Robinson 2:50 Cool. So, so we'll talk a little bit more about Nuxt here in a second. Because I imagine when we talked about your, your use of the Jamstack. Professionally, we'll talk a lot about that. But what was your entry point into the idea of the Jamstack, or static sites, or whatever that may have been, Debbie O'Brien 3:04 Yeah, so I guess I kind of just fell into it in a way, um, we were working for a company, and they, we had to, like, rebuild the website, it was it was really, really, really slow. And it was development experiences terrible. There's a lot of problems. So we at the time, we researched which framework to use, and, you know, was react or Angular or Vue. But we needed server side rendering, we needed like, you know, good search engine optimization. So a lot of them were a problem for us. And we came across Nuxt. And at the time, they said no, because Nuxt was too young. Debbie O'Brien 3:40 So they basically asked us to build our own framework. So we built our own framework, which was like a statically generated site framework. And we built that which is still in use today by the company. It's an amazing experience to build your own framework, but never do it. Yeah, it worked. Yes, it was great. Yes was fantastic. But you have nobody contributing to it. I don't work there anymore, and nobody's who's going to maintain it? So having a community behind you is, you know, you just need it when you're creating something like that. It was a great experience. But yeah, when we finished it, and we kind of showed it to everyone, we said, Look, this is how it works on it is super fast. And like, the website is still alive today. And it's still super fast. But my recommendation was okay, now that we've built this, now it's time to move to Nuxt. And they said, No, I left the company. I didn't want to work on my framework for the rest of my life. Bryan Robinson 4:38 Yeah, like you said, like creating something like that can be super rewarding, but like long term, it's a problem. Debbie O'Brien 4:44 Yeah, and it has its limitations because you know, if you want to do new things and add more to it, etc. And there was just two of us actually, full time on the project and then a few others that were kind of helping out. So I wasn't the main like the person who was doing all the developing developing work. was working more in the front end side of things and kind of like making sure things work the way they should some more in architecture. So if you take away the person that really built it, which he's now left the companies, well, then you kind of like, you know, I'm not gonna be on my own doing all this No way. Bryan Robinson 5:13 Yeah. Well, and then it's like, if you need to update a feature, do you really want to touch all that code that could then come crumbling down around you? Debbie O'Brien 5:21 Exactly, exactly. I don't know. companies don't trust, like open source, for some reason. But I think that's changed a lot. Now. That was like a couple of years ago. So Bryan Robinson 5:30 Yeah, I hope I hope that there's a nice bit of growing momentum behind, you know, don't reinvent the wheel. Like, let's use open stuff, not close stuff, and most definitely not coated ourselves. Debbie O'Brien 5:41 What a lot of companies do I mean, trivago have their own and it's working perfect for them. And Uber, do they have their own as well? I think it is. So there's quite a few that still are producing their own because it works for them. Because, you know, I don't know. They can do what they want on with a team of developers. And if you have a big team of developers and they're willing to spend time and money because at the end It's money, then yeah, go for it, but it's not necessary. Bryan Robinson 6:03 Well, I also kind of look as much as like, I'm usually gonna derive Facebook overall, like, I like the Facebook model of they needed something, they created the React stuff. And then they said, we're gonna open sources because we sure you know, we really want, you know, the community involved in it. So we have less work to do to Debbie O'Brien 6:20 Exactly. I mean, it's a it's a win win. Right? Bryan Robinson 6:23 Exactly. Cool. So So let's talk about how you're how you're using the Jamstack. Now, now that you don't have to create your own framework, how are you using it professionally? How are you using it personally? Debbie O'Brien 6:32 Yeah, well, before I started in Nuxt, I actually work for an agency and one in my job interview, actually, I kind of said, You know, I want to work with view and with Nuxt. And they said, well, you're going to be in charge. So you can just do the technology. And I was like, I like that. Okay. So I accepted the job because of that, right? And, and I literally Nuxtified the whole company. None of them had view experience, and I taught all the developers view Nuxt it was it wasn't An easy, right, it was a kind of a big battle because you know, you're going into a company that was very back end focused. Debbie O'Brien 7:06 PHP igniter, for example, was what they were used to working with. And you're coming in and you're saying, right, you know, front end is going to take over. And we're gonna, we're going to use Nuxt. And we have all this power now. And it was a challenge. And then, okay, introducing Nuxt is one thing, introducing static sites that was like, you know, why, what do you want to do? What do you mean? What, why do you want to take the server away? What do you want to do that for? Bryan Robinson 7:29 We love our PHP. Debbie O'Brien 7:29 Yeah, so it was, it was really hard work actually convincing people. So yeah, I just fought. I'm a good fighter. I did Taekwondo, so I just kept fighting. And the fighting works, and eventually you win. So we managed to be able to convince the back end team and the, my old boss to basically use Nuxt, and we started using it for a lot of company projects. And when they seen the performance benefits, it was kind of like, okay, so yeah, this is a little bit better. And you know, So we kind of managed to, to basically produce Nuxt websites for pretty much every company that we work to it, which was great. So it was it was a good way of like, you know, Nuxtify the world through the agency. And then I moved on and started with Nuxt. I've only been with Nuxt, three months. So it's quite new. And yeah, it's it's obviously amazing, because now I actually, you know, just get paid to work with Nuxt, which is just fantastic all day every day Nuxt. Bryan Robinson 8:31 I'm kind of curious to take a take a step back. So you went into an agency that was primarily using PHP, I've gotten the impression overall with the PHP community that the Vue is actually looked upon as kind of the JavaScript to use did was that kind of your experience there? Or is it maybe too early at that agency and they hadn't quite gotten to that point. So I know like Laravel has always liked view and integrated well view. Debbie O'Brien 8:56 Yeah, unfortunately, they weren't that far advanced. So it was actually me that introduced Laravel to them, and said, like, you know, you want to build your own CMS or why don't you use Laravel because it works nicely with Vue. And then we can help you on the front end. And we can work together and, and the back end team then started to work with view, and started to really like it. So they were like, in love with Laravel and view and the whole mixture of how it works together. So I think they were, they were quite open to move in that direction, but they just didn't know the right direction to go to. And I don't know, I guess when I come in and say this is the way you know, you might geek out a little bit and you can like, just follow me. Come on. I know the way. Bryan Robinson 9:36 Very cool. So out of curiosity. So you're at Nuxt now, and obviously you've been you've been kind of your own advocate for Nuxt for a little while. I'm very curious around the space that Nuxt and Nuxt. And even even like Gatsby and Gridsome kind of occupy because they're not static site generators, and I just I don't know what to call them. What would you call them? What kind of phrase would You manufacturer around all about? Debbie O'Brien 10:02 Well, the Chrome team actually call it a meta framework. We're just calling it a web framework, because we're using NodeJS. And we use Vue. So you know, depending on what you want to use, it's not just a view framework. It's also based on NodeJS as well. And it's using, you know, developer tools. So we call it an intuitive web framework. Because we can have server side rendering, and we can have static site generation. And we can have single page applications, we can have it all right, not all of them can have that. So Nuxt kind of is different in when you compare it to some that are just static site generators. Um, but yeah, Jamstack framework doesn't sound really too good either. doesn't Bryan Robinson 10:45 No. And I mean, you could theoretically probably do an Nuxt application, not even like using CDNs, not using some of the more traditional stuff in a in a Jamstack stack. So I guess you could you can even have Nuxt without the Jamstack at that point. Debbie O'Brien 10:58 Yeah. I mean, Nuxt just works with everything. It's just cool. Bryan Robinson 11:04 Cool. So I would I would hazard a guess and say that perhaps Nuxt is your jam in the Jamstack? Debbie O'Brien 11:10 For sure. I mean, yeah. Nuxt is my job for quite a while, as you said, before I even started working with Nuxt. I was like, you know, speaking about Nuxt at conferences, and you know, it's actually funny because, um, I didn't like Nuxt. Debbie O'Brien 11:23 At first. I didn't want to use it. Debbie O'Brien 11:28 This is at the time when we were trying to figure out what we were going to build our own framework and stuff on, we wrote our own server side rendering on top of you to try and make it work and it wasn't working properly. And I reached out to the core team members to Eduardo, from the core team from view and said, like, you know, I'm having this problem and I really need server side rendering. And like this is not working if you've got any recommendations and he was like, did we just use Nuxt? Okay, for the Vue team are recommending Nuxt so that means it must be okay to use. Debbie O'Brien 12:00 So when I started playing around with it and stuff, I didn't like it because it gave me things I didn't know. And I didn't need. I was like, what's this? I don't need that. I don't want that. What Why are you giving me this? So it kind of like, pushed me away from it. And then when I realized that, you know, when you stop using it, and you start just using view, you go, Oh my God, I've got to like, do the whole router, follow my own. Nuxt just doing all that for me. I'm going back to Nuxt. So I think about when you don't understand something, you don't like something, when you start to understand it, you start to realize what it does, and then you go, wow, this is actually powerful, but I know how it's working. So I get it. And it makes sense. And yes, I want to use it. I think that's what's important is understanding. Bryan Robinson 12:41 Nice and so so now that you've kind of you have an understanding of it what what is what has been the big draw that has kept you with Knox, so obviously, you know, you didn't understand it, didn't like it at first, but now that you're really in it, what are its like core features that are gonna keep you staying with Nuxt for a while. Debbie O'Brien 12:58 Well, there's quite a lot. I mean, develop experience, for example. So like, I mean, I wrote the course Vue router, and it's a lot of work. So I know what it's like and what's involved in it. And this is all done for you with smart prefetching. With code splitting. It's all done. And there's a lot more other benefits. So we just released the Nuxt components. And now we don't have to write import statements were components. So Nuxt is making your developer life easier. And when you're like having to, especially when you work in an agency, and you have a limited amount of time to develop something and you need to get this job done. Well, you don't want to be spending time doing unimportant tasks like writing import statements, or, you know, configuring your router. So in Nuxt, takes that away from you. It's kind of like, yeah, this is really, really cool. Debbie O'Brien 13:40 But the other great thing is the performance. And for me, performance was probably the biggest seller, because I'm a bit of a performance freak. And I you know, I've been waiting to Webpack so I like I really am focused on performance, I'm Google Developer expert as well. And when I was consulting with the agency, I did a lot of work on performance. So to be able to go into a company and say, yeah, this is the website, look at performance it is Look how how fast it's working because of the smart prefetching that Nuxt gives you because of the automatic code splitting that Nuxt gives you. And you know what, I'm going to create a pw way for you. And you do it in 30 minutes, because not even three minutes. Like it's as simple as that. I mean, that's just magic. Debbie O'Brien 14:21 That's just something a company says, Wow, you know, I've seen it like, from the companies we've gone into just to kind of go Wow, this is amazing. This is so fast. This is so good. So performance for me is is key. Bryan Robinson 14:33 So with all the like, obviously, the Jamstack itself is a very performant kind of architectural mindset. But with that server side rendering built in with the specific routing built in so Nuxt is kind of pushing almost performance first. Debbie O'Brien 14:46 Yeah, I mean, we're very performant for sure. And it developer experience I recommend to go side by side. So like basically your performance on making the developers lives easier. That's what we want to do. We want to make it like we're lazy people, right developers, so We want to just have fun and we don't want to do those unimportant tasks. So if Nuxt can do all that for you, and you just concentrate on curating the cool stuff, then that's what makes your, your experience better. Right? Bryan Robinson 15:09 Hmm. Very cool. So So are there any kind of ancillary philosophies, services, software that you're digging on in the Jamstack, as well, besides Nuxt are the pairs particularly well with Nuxt. Debbie O'Brien 15:25 So obviously, serverless functions are like, you know, a big thing. And we I didn't, I haven't dug that deep into it, I started using them. And it's something I wanted the company to use at the time. And we're going to actually build them into Nuxt. So we're gonna have Nuxt functions. So that's gonna make the whole Jamstack even more powerful. And I think that's what I'm, yeah, that's what makes everything just kind of like go together. You know, with the back end team can build something cool. We have a serverless function, you just go to the API, get it done. Bryan Robinson 15:53 Pretty cool. So So is it going to be its own flavor of serverless functions or is it going to be just co located With with the front end code, how is that gonna work? Debbie O'Brien 16:03 I'm actually not too sure the they're working on them at the moment. And I don't know if it's gonna be like, similar to how the lambda functions work or not, I'm not sure, or it's going to be based on that or, but it basically just means that you'll be able to write them directly in your code, which is just going to make your life easier again, right? Because that's it, we Bryan Robinson 16:22 definitely, I've never really enjoyed having like the lambda functions completely separated out. Like that's always been one of the pain points for it. So that's cool that you're working towards more solutions for consolidating everything. Debbie O'Brien 16:33 I was just gonna say as well like something that we released just recently with the full static module. So that was released last week. Because before we weren't in full static, we were statically generating or pre rendering the sides. And then when you changed from one page to another, it's still called the API because it was it was rendering there and then and calling that API, right, whereas now we're not doing that anymore. And we basically on a build time, we call your API, we get everything. thing that we need from the, from the data, and we store it in a static folder as a payload js file. And then every time we client side render the page, it's going to go to that file and collect that data. And that works a little bit different to other frameworks. And the reason for being is that we were able to separate the build from the content, which means now that you can actually just regenerate your content without having to go to Webpack and without having to build the whole site and the assets and the etc with just generating the content and that makes it super super fast for for content regeneration. Bryan Robinson 17:36 Okay, so yes, it's like the build time is gonna be less for just kind of smaller, smaller changes, right? Debbie O'Brien 17:41 Yeah. And this was a big problem, especially with the agencies which I don't understand why right because it was like two minutes and they were like, oh, but it takes two minutes to build I was like, so what a coffee but for some reason, that was an issue and now we're down to like 10 seconds. So you know, if you're going to find would be 10 seconds, then you know, I can't do anything else. We know I think Bryan Robinson 18:00 the more at that point. Debbie O'Brien 18:01 Yeah, I think it's a big it's a, it's a big thing that a lot of people had, especially when you're working with bigger sites, why do you have to rebuild it just for, especially if you're working with a CMS, right, and you're just changing writing a new blog page or changing something in a CMS, you don't need to rebuild that that whole website. And most of the websites we've built for clients, you never need to actually build anything ever again, because that site is finished. And they're just changing minor content every now and again. So to be able to hand that over to a client and say, right, there you go, it's going to be super fast. In 10 seconds, you'll see your change. And also, we built in a live preview mode. So this is again, released only last week. And now you can actually live preview your changes in your API. So by using like a query Param preview equals true. And then you can actually see your live preview changes from your API. And then you can say, Yeah, that looks good. And then deploy, and then it's going to build it, and then you've got it. intensely. Cool. Bryan Robinson 18:58 Yeah, that preview such an important step and like especially like you've mentioned, like the agency lifecycle, like I have to be able to see the the change I'm making before before I can definitely approve it for production. Debbie O'Brien 19:11 Yeah. And it's pretty much the non developer people, right? And I get to because they're afraid of like, you know, they need to see you there. They're not like us who like don't mind or something's broken because we know can fix it. Whereas they probably can't fix something. So they just like I need to see it as it working. And then, so yeah, this this is going to be a big game changer. Bryan Robinson 19:28 Cool. So let's, let's pivot and let's talk a little bit about music. What's your actual jam right now? What what are you listening to when you're able to listen to things? Debbie O'Brien 19:35 Well, you see, I actually can't listen to music when I'm coding. Actually, can't I? Yeah, I need to. I need silence And yeah, so I don't have any sound at all except the birds singing outside my, my office. So I don't really listen to music when I'm coding. But when I'm cooking, I listen to music when I'm cooking. I can't talk just which is weird, right? Don't talk to me when I'm cooking because I can't I guess I'm just concentrating so much that like, you know, I can have music on Wi Fi and but I actually don't even know what's playing. And it's just there. It's background noise, I guess. So. I don't know. I'm pretty boring in that sense of like, what? Yeah, what music? am I listening to whatever Apple gives me or whatever Alexa gives me basically. Bryan Robinson 20:21 Hey, fair enough. We turn we turn a lot over to the robots anyway, might as well let the the musical choices happen there as well. Yeah. Very cool. That's, that's interestingly, I'm, I'm kind of in the same boat when it comes to cooking too. I need to I need to focus a little bit. I need to make sure all my timings are working out and all that all that good stuff. Debbie O'Brien 20:39 Yes. Bryan Robinson 20:40 Cool. So is there anything that you would like to promote in cow to the Jamstack community as a whole that you're working on right now? Debbie O'Brien 20:46 So I guess like, obviously, the, the full static that we released, so that's what check now in Nuxt. And especially if you've never built a static site, where you've built a start a site with next like, like a single page application or server side, rendering Like, it's so easy to change from one to the other, just by changing the target to static, once you've updated to version two point 30, and change the target to static, and then change the command to next build, and next export, and now you've got a static site. I mean, that's it. So it's not like, Oh my god, I have to like start from the beginning or refactor the whole thing. Like, literally, you don't. And I think that's what makes it really cool that you can just change from one to the other. So I would say to everyone to try and test out static sites and just give them a go. The content module as well, that we released for building your content. So you can have like a good base CMS inside Nuxt. So you don't need to like advocate by CMS, because we've got one like built in for you. Yeah, really cool features released. We're going to be releasing our new Doc's very, very soon as well. And we're actually changing our whole website to use the content module because actually, we built this for us, like like you said earlier. So we build the content module for the Nuxt Doc's to make our lives easier, and we're sharing it with the world to make the world lives easier. So if you like it as much as we do, then you you know, I'm sure you're gonna love it because yeah, it is it is fantastic. So Bryan Robinson 22:07 the nice thing is you've got your own use case for it. And you get to test it out and make sure that it's the right thing for for everyone before you even launch it. Debbie O'Brien 22:14 Well, that's pretty much everything we're releasing now is because it's what we want, locally that we have a lot of people on the team now. And there's a lot of great ideas. And we're just like, we have to do this again and again. And again. Why can we not just do something like this? And then we fix it for the world. So yeah, that's really cool. I would say sign up for our newsletter, and you can hear all the news about Nuxt. so you don't miss anything. Because we're releasing so much stuff that it's kind of hard to keep up with in the actual team. So I can only imagine outside what it's like. Bryan Robinson 22:42 Yeah, I mean, and especially if you're if you're paying attention to a couple different products, you're like, Okay, just let me know, bring it to my inbox. Debbie O'Brien 22:49 Yeah, yeah. And if you're an agency and you have to work with other like, you know, frameworks and technologies and stuff, then you obviously can't focus so much time on just one. So yeah, it's hard. It's really hard. To keep up and we're moving at such a fast pace, but it's such a great pace, right? Because we're creating great content and great modules, etc. But yeah, we're climbing climbing ladders. climbing mountains, I should say. Bryan Robinson 23:13 Even even bigger than ladders. Debbie O'Brien 23:16 Yeah. Well next is like the logo is based on mountain. So we're all about mountain. Bryan Robinson 23:20 Fair enough. And I I can see that. Yeah. Cool. Well, Debbie, I appreciate you taking the time to chat with us today and to share more about Nuxt and the things you're passionate about. I hope you keep doing some amazing things, both at Nuxt and kind of in the community as a whole. Debbie O'Brien 23:35 Thank you very much. It was great to be here and yeah, just try out next. I hope you you can just like create an excellent site yourself and you know, for this whole Jamstack podcast stuff up there. That would be cool. True, Bryan Robinson 23:46 true. Although I was rebuilding a house and Season Two was gonna have a new website and then I only got halfway through I said what I've got. Debbie O'Brien 23:54 That's always the way we're always too lazy in the end. Bryan Robinson 23:57 Exactly. Thanks again to Debbie for the awesome conversation. And thanks to all the amazing people in the Jamstack community that tune in Week after week. Before we get to our sponsor, be sure to like part star favorite or whatever in your podcast app of choice, and spread the word about the amazing people doing awesome stuff in our community. And now for our sponsor, if you listen to season one you're probably aware of take shape by now. But as a reminder, take shape is a content platform for the Jamstack take shape has a headless content management system and easy to use graph qL API, a static site generator and amazing new product called match a service that can tie together multiple API's into their handy graph qL interface if you're doing anything with content on the Jamstack Be sure to check them out at take shape.io slash That's My Jamstack. That's it for this week. Thanks again for listening. And we'll see you back here for the next awesome episode. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

8 July 2020


S2E4 - Obinna Ekwuno on the shift from engineering to the web, Gatsby and the incremental future

S2E4 - Obinna Ekwuno on the shift from engineering to the web, Gatsby and the incremental future

Quick show notes Our Guest: Obinna Ekwuno What he'd like for you to see: His Egghead videos His JAMstack Jams: Gatsby Cloud | Netlify His Musical Jam: KOTA the Friend | Fela Kuti Transcript Bryan Robinson 0:03 Hello, everyone, welcome to the next amazing episode of That's My Jamstack the podcast where we ask the age old question, what's your jam in the Jamstack? On today's episode, we talked with the amazing Obinna Ekwuno is a software engineer for Gatsby, a media developer expert, egghead instructor and an accessibility advocate. Bryan Robinson 0:24 Before we dive into that interview, let me take a second to thank our sponsor this week, TakeShape, stick around after the episode to find out more about their content platform, or head over to takeshape.io/thatsmyjamstack for more information. Bryan Robinson 0:40 Obinna, thanks for thanks for being on the podcast with us today. Obinna Ekwuno 0:44 Happy to be here. Bryan Robinson 0:45 Awesome. So tell us a little about yourself. What do you do for work? What do you do for fun? That kind of thing? Obinna Ekwuno 0:50 Oh, um, so I am a software engineer at GatsbyJS. I work on the DevRel team. I originally joined Gatsby to work on the learning team. Like building stuff with like documentation, writing some documentation and working on like plugin automating workflows and like all of those interesting stuff, trying to like make like documentation better for like people to, like, get more information out of out of Gatsby. But now I work on like the DevRel team, which is like really cool, because like, I still do some of the learning work, but like also, like more DevRel right now. Um, that's what I do for work. Obinna Ekwuno 1:25 For fun, like, I like to write poetry. So I just, you know, write poems, hang out my friends. I I started getting into gaming a few months ago, my friend gave me his ps4 to like, try out some games. So yeah, that's that's what I do for fun right now. Bryan Robinson 1:41 So what kind of poetry are you writing? Obinna Ekwuno 1:44 I'm mostly like mostly melancholic poems like just, you know, I'm just writing I'm documenting like, life as a Nigerian boy growing up in Nigeria and you know, just just, you know, writing more for my myself, my future self done, like anybody really Bryan Robinson 2:01 Awesome, I believe of everyone that we've, we've talked to you're the first person who said that poetry is what you do in your spare time. So that's, that's awesome. Obinna Ekwuno 2:09 Thank you. Bryan Robinson 2:10 And then with Gatsby, so you said you were originally on the learning team and the devrel team. That's been an interesting thing that I've heard about Gatsby, what's the main difference between, say, the Education team and and DevRel? Because I've always felt that those kind of overlap in some ways? Obinna Ekwuno 2:26 Yeah. So like, there's not like so much difference is because when working out like when I was working on like, the learning team, because we're still trying to like flesh out the DevRel team at Gatsby, so learning was more like, you know, writing documentation, speaking, podcasts, all of those interests interfacing, like the community, so it was kind of like, it was more like DevRel but then at the same time, like actually having to write documentation as part of your job. But, so like, that's like, those, those are like the, the parts are like overlapped but like so that's why it was really easy for to transition from like learning things. There. Because like it was just same thing I started doing originally, but like, you know, with like, Oh, this is not what you're supposed to do full time. Bryan Robinson 3:07 So let's, let's talk about the the Jamstack a little bit. So what was your entry point into this idea of the Jamstack? Or maybe your static sites? How did you kind of enter this world? Obinna Ekwuno 3:16 Yeah, so, um, I think that was like, two years ago, when I had been writing, like, React for a bit. And, you know, it was really, um, it was really because I had to, I don't, I didn't have like a traditional entry into like tech. Obinna Ekwuno 3:30 I studied engineering in school, and like, it was really in uni. And like, it was really confusing to like, learn how to code. So I was writing, like, React after learning, like a lot of JavaScript. And then, you know, someone just came up one day while I was like, hanging out my friends from computer science, and they were like, hey, look at this cool stuff called Gatsby. Like, what is like The Great Gatsby like the movie, like who would name something who would never framework out of like a movie, but then you know, that then I you know, got into like the documentatioon. And you know, just really just kept going from there. So like Gatsby was like my first introduction to like, oh, when I saw that I think the thing that really got me into it was seeing that I didn't have to like worry about routes anymore. The whole the whole put put the file in the page folder and becomes a router. It got it got me. I was like, What? Yes, this is how I want to build Bryan Robinson 4:20 It definitely. Like I when I got my first intro into like some of the React stuff. I just, I didn't want to handle routing. That was like the worst thing about building a single page application. And now with Gatsby is just drag and drop almost Bryan Robinson 4:33 So when you were studying at university, you said you were like software engineering. Were you specifically looking to get into went into the web world? Or were you looking to do other things with that? Obinna Ekwuno 4:44 So um, I was studying electronics and computer engineering, and you know, like having having so I was doing more of like, smaller electronics like, you know, smaller sector boards, how do waveforms work, all of those things. Interesting stuff that I never really paid attention to. Well, but the thing is like with me, like naturally, I'm just really I'm really curious. So at first I didn't even want to like I didn't know what tech was about, I just really just wanted to be a network engineer. So I was learning a lot about TCP and IPs and network layers and all those like interesting stuff, Voice over IP, you know, the cool things for me at that time, then, I got into like tech, when one of my, my classmates was because I was just going to like, the classes to get my degree, like because I was good at math and physics. And you know, engineering just came like, Oh, that's what you're supposed to do. Obinna Ekwuno 5:34 But then when I really go into like, my classmate taught me to write HTML. And I learned HTML, I was like, Oh, my God, then I go, I go to CSS and I'm like, what's sorcery is this? How, how does this happen? You know, so I've always I think the thing that really got me here was like, always wanting to because everything excites me with like, when it comes to like tech, so like, always know, what's the next thing I can do? How can I use this in another way? So like, that's like, what's really interesting That's, that's what really got me into like, where I am now. Bryan Robinson 6:03 Very cool. So obviously working at Gatsby, your day to day deals a lot with the Jamstack. But how specifically, are you using the Jamstack professionally? How are you using it personally? What are you kind of doing nowadays? Obinna Ekwuno 6:15 Yeah, so um, I first like my, like building on stuff like Jamstack was like kind of building stuff for Gatsby was how I got to like the Jamstack. I like now because like, I work on the on the documentation. So like before, you have to actually write documentation, you kind of need to like test out or you're writing about and actually know if it works. So that's like most of the stuff that I do professionally with the Jamstack. So maybe if you're trying to document how a plugin works like you're actually running up a Gatsby, you're firing up a Gatsby demo site, trying to like implement this plugin, seeing use cases, questions that people might have about implementation and all of those like cool stuff. And mostly on testing out tutorials. When you write, you're trying to write a tutorial on how to use this With Gatsby, I would have to, like, you know, have to understand how this works, and then test it out, build it out and then write the documentation for that. So that's like how I work with it professionally. Um, and mostly just like educating people on it. Obinna Ekwuno 7:13 Personally, I have I have a personal sites that have I have been working my friend always laughs at me every time I mentioned my personal site, because I've been working on this site for like, for like, the past year. And the reason why I haven't really competed is that every time I feel like it's ready, I see some other thing I learned. I work on like, Oh, I want to add this to my site and then I just keep I keep test using it to test stuff. I do recent thing that is really getting me excited is Gatsby recipes. So like that's what I was like, oh, cool, how do I you know, just out of curiosity, how do I remove everything in the Gatsby config js and try to make try to see if I can make like a recipe out of like all of those things. So that's so that's how I use it personally, just I use my I use my site, as like a testing field for everything. Bryan Robinson 8:02 Very cool. I've actually seen a lot recently about how your personal site should be your, like development garden. Like you shouldn't think of it as like a final final place for things that just you should be pruning it and planting new seeds and all sorts of stuff. It's a cool analogy. Obinna Ekwuno 8:18 A good a good example would be this a colleague of mine, Josh. Josh writes a lot about his, um, his like, on this personal site and he adds like a bunch a lot of like, awesome features on that. And like I just whenever I think of my personal site, I'm like, I want I want my sites look like Josh is on. Because he just, you know, he works on like the cloud team, I got to be and then every new awesome feature that's coming up, he just uses a site to test it out. So yeah, Bryan Robinson 8:48 So obviously you're working at Gatsby, but what what would you say kind of your jam in the Jamstack?What's your favorite service or product? Or maybe it's like a philosophy what what do you enjoy the most about the idea of the Jamstack Obinna Ekwuno 9:00 I love that like the Jamsttack community is kind of like it because it's like relatively new, per se. It's like a place where people, you know, the entry level is like, it's not it's not so high. And like the community is really willing to like help people learn more about it because the community is actually just green. I think of like the the companies actually like leveraging of the Jamstack like Netlify, for example. It's like a company started in 2014. Gatsby gate became a company in 2018. Most, most of the technologies that we're using and stuff that we're still figuring out how do we want to make this like, for like, the, what's the code for like community, so I love that, like, the Jamstack community is really, um, it's really trying its best to educate and curious people along and make things simpler. Obinna Ekwuno 9:46 Um, my favorite service at this time and I don't mean to sound salesy, but then I really am in love with like Gatsby cloud, to be honest, because like, like, it's done like, I mean, the first time I heard about it, I thought it was I thought something else, like I don't know what it was, but like right now I'm just appreciating what's like what it does, we like build times and how it helps what's it called: developers like interface with content creators and all of that. I also really love Netlify, because like, I could host stuff without even without even understanding what CI and CD, like all of those DevOps, whatever related, you know, and I just really love that like, um, another thing I love about the Jamstack is like, the thing it does with so I can have different services coming to like a website's site without having to like worry about how those services run under the hood. Like I could host images on Cloudinary. do stuff like Gatsby, try new stuff for like, Auth0, you know, just what I need into where it is. Bryan Robinson 10:51 So out curiosity, so obviously run the speed of Gatsby Cloud is kind of important. It's obviously tooled up to run Gatsby? But kind of how have you been feeling? That's a relatively new product. And I don't actually know a whole lot about it like, What? What's been kind of some of the biggest advantages that you've seen playing with it? Obinna Ekwuno 11:11 Yeah, so, um, Gatsby cloud launched like last year. And like, we recently just shipped a new feature called incremental builds, which is like, really what excites me the most, because what incremental builds offices, so usually whenever you have to, like build, like a site, you know, static sites are fast, like relatively fast, depending on how much data you have, like there. It's, it's fast, but then gets me with incremental builds is trying to like push the limits of what we actually call fast. Obinna Ekwuno 11:43 So incremental builds, like what Gatsby does is also you've built a site, and then cool you build a site in like 22 seconds. That's all right. And then you want to make like a content change. So for example, you kind of do like a content change and then usually what will happen is that your site will be Build for every content change you make. But then what incremental builds offers is that for every content change, it really just compares, like the difference between the first build, and like the new edits that you've done. So I like to think of it in the react and the virtual DOM, um, play of how hot reloads of like, Oh, we measure what's what, what change versus what was, and then just build whatever changed. And that will reduce like, build time. Obinna Ekwuno 12:25 So you could have like, the first build is 22 seconds, the next build can be five seconds. And when you think obviously, like five, six pages, it's, it's, you know, it's cool, but then think of it in like 1000 pages, that that would save you like a lot of time and Gatsby also launched something will it build, which is like, a, like a benchmark site to see, to kind of know how many so if I had like 2000 pages on my on my sites, how long would it theoretically take to build this? So you can actually see that and then yeah, that's that's really wasteful. To me like, and it's awesome when you get the opportunity to walk for a product that you really like love that really just makes you happy. So yeah, definitely. Bryan Robinson 13:09 Yeah. And that's like one of the one of the biggest naturally one of the biggest arguments, but one of the one of the strongest arguments against some, like the static site generation stuff is, well, you know, it's great for little toy sites. But when you get editor, enterprise sites with thousands of pages, it can take forever. But if it's incremental, and it's only generating one new page when you do that, that's beautiful. Obinna Ekwuno 13:29 Exactly. Yeah. That's what makes me happy about that's what I love about the Jamstack. Like, we're always just trying to look for new ways to make things better. So when you so when you think when you think this cannot go past this level, boom, it's something else. Bryan Robinson 13:44 Always kind of standing on the last iteration, and making it better for the for the developer to work with it but also, because it's so powerful and because like the Jamstack is so so quick for performance and all sorts of stuff ends up making the the end user happier, too. Bryan Robinson 14:01 So what's your what's your actual jam right now? What is what's in your headphones where you listen to or your favorite artists? what's what's going on there? Obinna Ekwuno 14:08 So, um, um, cuz because like I write like a little poetry, I tend to listen to a lot of like, poets. Mostly I listened to poetry but like, also listen to rap because I like I call it conscious rap was kind of like those kind of rap songs where actually you kind of feel like you're in tune with the artists. And it's not just the beat that you're listening to. So currently, right now, I listen to a lot of Kota the Friend which is like he's he's like an independent artists out of New York. You know, he's rapping about, you know, trying to raise his son, you know, and all of like those really deep stuff and like I really resonate with him. I also listened to a lot of Fela - Fela Kuti, which, which for me, is is like education because like, cause Fela, Fela like comes from like, a place of What's it called, um, being African and being in Africa, so I'm over a more of a introspective person. So I like to like just listen to people that actually just take time to block out the noise. And like, put all of like all the noise aside and just really just be real with you. So that's so I listen to a lot of different fella could see Kendrick Lamar? Yeah, most of like, yeah, my, my music. My taste in music is actually just very random. Bryan Robinson 15:29 Yeah, sure. No, that's me. I think everyone's got, you know, the the certain artists that they that they really like, and they can span multiple, multiple types of music. So I really appreciate like the idea that like, getting in tune with the artists because that's always that's always like a nice thing to be able to like hear someone that is is as introspective or as thoughtful as you are. Obinna Ekwuno 15:53 Yeah. Thank you. Bryan Robinson 15:55 Cool. So So is there anything that you would like to promote that you're doing anything you want get out to the gym. That community as a whole. Obinna Ekwuno 16:01 Yeah, so I tried to like I try to like create like content because, um, because like I'm really curious so I just really just try to like put stuff together and just you know, I blog a lot on on LogRocket. And then also like I recently go into screencasting so I'm like doing all of that to egghead and I just make community resources because I feel like I really feel like as much as the information should be free as much as like you know, content creators actually need like some support but then yeah, that's it just just put out the content because like people because I love like the community really helped me while I was transitioning from being you know, solving a lot of math that I honestly didn't know that I think of it honestly didn't care about. You're just solving a lot of math and then moving towards like a computer science like background understanding abstract syntax tree all of those like awesome stuff like that. My my friends helped me like understand like, it was for my community resources. So I really just, you know, make resources on egghead basically any blog that would like allow me to, I used to write a lot on Scotch. That that was like the first place to actually like, wrote stuff on. Yeah. Bryan Robinson 17:12 Cool. So as you're kind of transitioning from, from kind of written stuff to the screencasting a, how's that been for you and be? How did you learn? Like when you said, like, all these community resources were important. Did you read more? Or are you more of like a visual learner and followed like, screencasts like what you're doing now? Obinna Ekwuno 17:31 Oh, so I'm transitioning from like, transitioning from the roots into like, screencasting. So writing was like, it comes natural to me. Because like, because like, I write a lot of forms. But then screencasting was something I was like what I did a lot of like, a lot of like, you know, iterations with Zac. Zac works at Egghead. Shout out to Zack because that really helped me because I I would do a video I did have like, oh no this. This is nice and I could say, Oh, no, because you know, people are watching this on your phones, and all of that. So, it was it was really frustrating. But then it got to the point where, you know, Zac, Zac had a lot of corrections for me. And I was like, ah, maybe this isn't for me. And then one night, I'm just laying down and I and I say to myself, you know, it really just boils down to how bad you really want to, like, do something to be honest. And then, you know, I just, I just go to did the recording once and sent it to Zac. And he was like, awesome. I was like, What? Obinna Ekwuno 18:28 So, so that and from there, like, I just, I have like, two videos, I don't know. And I have like, three more coming, you know, just really just looking for how to like, do that. And then I think the second question was, how did I? How was it for me learning to code? Yeah. So um, I first like I started off with like the under law. I did this under law training, where I can't remember I'm talking about my work, and then our learning community. So like, they really just go a lot of mentors and I told us Oh, you know, you're learning HTML today, I did a lot of like Google sponsored things on Udacity. And then at some point, like the visual, the visual learning wasn't really working for me because all I got was like, the perspective of people. And I wanted to, like, understand how it worked. So I, I, I started reading like documentation. Like even right now, like I'm learning I'm learning a bit of like view. So before going into like funding masters or trying to find like a course on Udemy I'm trying to get like documentation because I because as much as I don't think every documentation is that great like this, this this has been a really good experience like so I'm more of like, I like to read documentation and then get opinions, listen to podcasts, you know, talk to people all that so that's that's how I learn and and learnings are continuous for me. Because like, I don't I don't really feel like there's a place where you get to be like Oh, yes now and I I know it's all Bryan Robinson 20:01 I know everything now! Obinna Ekwuno 20:02 Yeah. Yeah. Bryan Robinson 20:05 Nice. Well, as you said, like even with the technologies that we're all kind of playing with, there's always something new like, you know, react with hooks A few years ago, Gatsby now has recipes. Like there's always something new. Obinna Ekwuno 20:16 Before create react app, there was Webpack, configuring Webpack for like a react. I did I did that. And then I was like, No, I never went back again. Bryan Robinson 20:27 Cool. Well, I appreciate you taking the time to talk with us today and kind of share your stories. And I hope you keep doing some amazing things at Gatsby and writing more amazing poetry and stuff. Obinna Ekwuno 20:36 Thank you. Thank you so much for having me. Appreciate it. Bryan Robinson 20:40 Thanks again to Obinna for the great conversation. And thanks to you our dear listeners for tuning in Week after week. Before we get to our sponsor, be sure to like heart star favorite or whatever in your podcast app of choice and spread the word about the amazing people doing awesome stuff in our community. Bryan Robinson 20:58 And now for our sponsor, if you listen to season you're probably aware of TakeShape by now. But as a reminder TakeShape is a content platform for the Jamstack. take shape has a headless content management system an easy to use GraphQL API, a static site generator and amazing new product called Mesh - a service that can tie together multiple API's into their handy GraphQL interface if you're doing anything with content on the Jamstack Be sure to check them out at take shape.io slash That's My Jamstack. Bryan Robinson 21:27 That's it for this week. Thanks again for listening. And we'll see you back here for the next awesome episode. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

1 July 2020


S2E3 - Jayson J. Phillips the early, intermediate and current eras of the Jamstack

S2E3 - Jayson J. Phillips the early, intermediate and current eras of the Jamstack

Quick show notes Our Guest: Jayson J. Phillips What he'd like for you to see: The Media Developers Discord | His Live coding on Twitch His JAMstack Jams: Getting back to simplicity on the web | Tools like Netlify His Musical Jam: Bootsy Collins - I'd Rather Be With You | Karen Harding - Say Something Bryan Robinson 0:05 Hello, everyone, welcome to another fun packed episode of That's My Jamstack, the podcast where we ask that difficult question, what's your jam in the Jamstack? In this week's episode, we chat with Jason J. Phillips, Director of Engineering at a 2U, boot camp instructor and a media developer expert. Bryan Robinson 0:23 Before we dive into the episode, I wanted to mention our sponsor take shape, stick around after the interview to find out more about their content platform or head over to takeshape.io/thatsmyjamstack for more information. Bryan Robinson 0:41 All right, Jason, thanks for being on the show with us today. Jayson J. Phillips 0:43 Appreciate you, Bryan. Glad to be here. Bryan Robinson 0:45 Cool. So tell us a little bit about yourself. What do you do for work? What do you do for fun? Jayson J. Phillips 0:49 Yeah, so by day, I am a director of engineering for boot camp applications at 2U. We house a lot of boot camps web development. FinTech, UX, and a couple others through extension schools at universities. And so at night, I also teach web development and data visualization boot camps, most recently through the UC Berkeley Extension. And University of Denver was my most recent class. Bryan Robinson 1:18 Cool. So you're doing actual technology for companies that are doing boot camps through schools? Is that right? Jayson J. Phillips 1:25 Yeah. So the team that I that I oversee and manage runs a slate of applications that's for all parts of the learning aspect. So we build tools for instructing as we build tools for our students in our boot camps. We integrate LMS as for our learning platforms, so everything from the student is already enrolled to the student graduating, my team plays a role in their software journey. It's never a dull moment, pretty awesome. Bryan Robinson 1:53 So what do you do for fun outside? Obviously, if you're if you're teaching at nights too, then there's not a whole lot of room for that but what's what's your idea of fun. Jayson J. Phillips 2:00 Yeah. So I tend to run far away from technology for fun. While I do enjoy programming and you know tinkering around on my off time, I tend to be away from the house. So hiking outdoor activities. I'm a big cyclist and runner. I'm still trying to eventually chip away at hopefully running for the half marathons in 50 states I've allowed nine states now. So yeah, I try to make up for all the sedentary sitting at the desk by running myself until I can't run anymore. Bryan Robinson 2:36 Cool, so do you do like competitive or re you just doing it like those half marathons just to do the half marathons? Jayson J. Phillips 2:43 Yes. So my tagline is I don't run fast I run far. So that not competitively but I definitely enjoy a lot of the runs for fun and just to beat my my own personal times and then doing some team adventure races. Like there's a series called Ragnar where it's a team of 12 split between two vans and you run 200 miles over 36 hours. Bryan Robinson 3:09 Wow. I'm out of breath for a mile. And that's about that's about as much as I can go. So that is super impressive. Jayson J. Phillips 3:15 I mean, those races is all about the team. Because again, I run far not fast. So on the wrong team I can be probably very disruptive to a group, but it works out well. Bryan Robinson 3:26 Very cool. So So tell us what was your kind of entry point into the idea of the Jamstack or into static sites or wherever you found your way into this cool community? Jayson J. Phillips 3:35 Yeah, so I think the thing that hit me right away about Jamstack is that my first experience on the web, you know, was all static. Back in about 2001 2002, there was a popular platform called Graymatter written by this gentleman on Noah Gray, and it was written in Perl, but it it would take all your content, as text files and all your comments and actually generate static output for your site. So while the compilation step because it would recompile your entire site. So if you had thousands of pages as a blog, and you know, hundreds or thousands of comments, it would take forever. But once it was done, you had this beautiful site that just ran. It had the notion of templating. So I was like really one of the first experiences I ever got of playing around with a static site in any form. And so jumping back into like the modern era, I think it was around 2013. Before then I'd play around with Jekyll and Octopress for a couple years to replace the WordPress sites I've been working on. And then I dove into Wintersmith and Blacksmith was like some of the firt like early NodeJS, static site generators I've worked on. Bryan Robinson 4:46 So I'm curious real fast, because this was actually a conversation I had the other day about Wintersmith and Metalsmith and all all those kinds of first node static site generators and kind of the idea of like, why didn't those take off? Whereas potentially, like, now we've got stuff like, you know, eleventy kind of taking that role. But then on top of that, you know, obviously Gatsby and, and Nuxt and all that. Do you have any thoughts on that? Like, having used that, I used it a little bit, and it was over my head at the time. But like, what, what do you think about that? Jayson J. Phillips 5:20 Yeah, I think the barrier to entry lowered in terms of the setup, right, so I would say the first time I encountered Wintersmith and Blacksmith and a couple other of those types of sites, it was the same thing. It's like, Alright, this seems like a lot of configuration. I got these crazy Gulp processes or some other build process where now, especially with the advent of create react app and other tools, even in Angular and other ecosystems. It's much easier to get a common set of defaults that are a little bit opinionated, but enough that you don't have to mess with it to get started and you can kind of customize as you go, and I think that is what allowed Jekyll to take off when it first came out. Was that outside of a few hours sensible configuration in a YAML file, you could just write markdown and run it as default. It took very little in the way of getting started with it. Bryan Robinson 6:11 Yeah, the configuration is definitely it was a it was a big pain. I mean, honestly, some days when you're just trying to work on a project real fast, it can still be a pain if you don't actually reach for all these tools. Jayson J. Phillips 6:20 Yeah, I mean, it's, this is like the beauty of the the abstractions that we love building on top of, right, let's say, I really think it was just a maturing of the node ecosystem. And also just now we're within arm's length of a tool in almost any ecosystem now, but especially within JavaScript, Bryan Robinson 6:37 in fact, like the cool thing is like we're seeing projects coming up that are like refactoring Jekyll like there's Bridgetown nowadays. That is, you know, trying to say all right, we need a modern Ruby static site generator and Jekyll is just been around the block a few too many times. Yeah, that's Jayson J. Phillips 6:53 And I love to see it right. I think Jekyll for you know really brought static sites back into the forefront. And also outside of purely technical circles, you know, for other people to actually understand the care about it and see what the benefits were. So I think, you know, as we have these round Robins of, hey, this community is pushing that community ideas further And beyond that, who knows where we'll end up in 2025. It'll probably be something where we think the page gets created and the site's updated in like nanoseconds, Bryan Robinson 7:23 hey, there's that there's a JavaScript library for for reading brain process. So who knows? So I'm also curious. So So you've been you've been doing static sites for a long time with with Graymatter kind of being that that first entry point way back in the day. My first entry point was a little bit later, a few years after that with movable type blue. I'm wondering like, like, obviously, we're way better than those systems were back then. I remember I had a blog. They had thousands of posts for newspaper I worked for and it was like a 40 minute compilation step to deal with that. Do you think? Do you think that that timing was kind of the the downside of the static stuff? And is that is that why you think maybe we went dynamic for a number of years and only now coming back with the speed that we've got? Jayson J. Phillips 8:13 Yeah, I do think it had a lot to do with the company system, when b2, which was like the precursor to WordPress first came out, right, like it was competing with MovableType and a couple others at the time, and those were winning out. But then once someone saw that, hey, you could install this on a server and click a button and now you have a blog. And it starts out right away and you can add post right away. I think that's where the shine of the newness of this dynamic content sites came into play. And then I think there was also the piece of we didn't have, I think as advanced ways, generally available to structure content in static sites, whereas WordPress made that a bit easier to reason. So the tools like Drupal, where you could create structure around your content and understand like, what do I mean, when I'm creating a blog post? What do I mean when I'm creating a static page? And I think we will type in those tools as they moved along that over time, didn't have that really as well along with the long compilation steps. Bryan Robinson 9:17 Well, I know even like, later in the game with WordPress at the agency I worked at, we use a plugin called Advanced custom fields, almost any WordPress site we built had that by default, because that structured data was so important. And WordPress, I mean, out of the box didn't give give you a whole lot of structured data. So I think that's an interesting thing as well. But that's that's seeing a resurgence as well in terms of like, we want granularly structured data. Jayson J. Phillips 9:42 Yeah, and especially with a lot of the headless, headless CMS tools out. The awesome part is that there's a lot of different options that allow you to structure that content based on who's structuring it right. So like, with Sanity, you can reflect that in JavaScript files with other tools reflected in the CMS itself. So at the accessibility of structuring that content is really available to whatever type role needs that level of granularity to control it. So I think those tools also helped a lot. And, you know, even like, the pushes that we've had for Semantic Web and semantic structuring of content, even in just markup files and talking about what was it, like microformats, and all these other things, like a lot of that has kind of pushed us to where we are today. Bryan Robinson 10:28 Totally agree. So So we've mentioned a lot of different technologies. We've mentioned a lot of different things from from honestly, the history of the past almost 19 years now. What what's kind of your jam in the Jamstack? What's your favorite service or product? Or maybe it's just a philosophy or a framework? Where are you digging on right now? Jayson J. Phillips 10:45 Yeah, I think for me is getting back to this the simplicity of index page on the web. You know, like a lot of the things that we talked about, I that's what I enjoy most about the philosophies and the approaches of Jamstack You know, as an example, there was a client that I worked on back in 2008. For Fairmont International, a huge international chain of hotels. Every single page was its own index page. It was Yeah, every single page was a folder with an index page in it. For every single locale, language pair, they support it, which was over 50. So at any given moment, I was SFTPing like, hundreds of files, if we haven't changed a global header, and it wasn't a server side include, we had to change it on hundreds of pages. So I think just this approach that we can take these modern tools, and still come up with the simplicity of just another static page is super awesome. Outside of that, I am a huge fan of Netlify. We use it a lot at work to for like AV testing and for launching a bunch of previews for for our deploys for some of our front end applications that are built in react, which allows us to quickly test for UX changes Things like that. So, yeah, Netlify has been increasingly, I've been increasingly using a lot of the portfolio tools. So I, I dig it a lot for my personal blog and other things. Bryan Robinson 12:10 It's really hard to beat. Just the fact that it's all in one like you want you want serverless function, no problem. You want forums, no problem. You want just simple deploy of an HTML page. No problem. Jayson J. Phillips 12:22 Yeah. And I think also, even with stuff like forms, right, I think that solves a problem too, that we had back in the MovableType and other eras. And also in the first wave of static blogs, where we had to rely on Disqus or all these other external tools to get comments and then injected back into our sites. Now we have the full control of being able to build what we want, and or integrate suites. Like I know Gatsby studio is like kind of building up as well. Vercel has got a great, awesome set of tools, with Now or I guess they call that Vercel Now as well. But yeah, I think, you know, with these all in one suites that are leveraging these other platforms, they also make it easier for us to deal with lambda without having to jump into the AWS world and learn about security groups, everything else. So it's pretty awesome. Bryan Robinson 13:10 I had never touched a serverless function until Netlify rolled out their functions, just because it was just too big a pain to go into the into the GUI interface and deal with all that nonsense. I was like, Oh, I have it in your GitHub repository. No problem. Jayson J. Phillips 13:23 Yeah, just that that hole, just put it in a in a single folder. Let us know what folder it is. and it pulls up. I wish we had that when lambda was first being talked about, because that probably would have gotten a lot more adoption. Bryan Robinson 13:35 That would probably be two or three years ahead of where we're at right now. Jayson J. Phillips 13:37 Yeah. It's because I tried lamda once before that, and it was like, and it took me this long, a few years before and I just started playing with Netlify functions maybe like two weeks ago. So and I love how simple it is. Yeah, Bryan Robinson 13:52 You can just a Hello World example takes you know, five minutes to get up and running. It's beautiful. So So how are you using these kind of Jamstack philosophies at work, you know, with all these boot camps, and also, you know, personally, you mentioned your, your blog, but but kind of browse through what you're what you're using right now and how things are going for you. Jayson J. Phillips 14:11 Cool. Yeah, so. So at a previous job, we're using a lot of static page generation for our marketing site and letting that be cached in our system. So that marketing site was lightning fast. It was all static markup. And then we just use the API's for our back end financial platforms to integrate with authentication or integrate stock tickers, all those types of things. So what it enabled us to do was to quickly iterate on our marketing pages, and let the actual full, single page application stay on its own structure. And then it allows us to play with things like mono repos, which allowed us to have like share the common elements between all the different sites, but split architectures where needed at my current role one of our student facing platforms, we use the branch preview feature with Netlify to steady generate our sites and That's probably saved us, I can't tell you how many hours from our own QA process to now, and has made it so much easier to be able to switch between branches change, see the changes, see what changes look like in an integration branch before we actually roll that into master and release it. Jayson J. Phillips 15:16 So that's been super awesome. And then personally, so I do use Sanity.io for their headless CMS solution. I've really enjoyed having a clean interface to go in and write push a button and save it and push another button. And it goes off to the races to build everything. And so just this notion of my site can statically regenerate it whenever I want it to be like, it doesn't have to be recompiled unless I push that button also gives me an interesting level of control over content publishing that I didn't have before. Right, instead of me worrying about some systems timing. I can just say, all right, I release pages every Friday, but I can create my own editorial process around that before we statically build that site on the production. So that's been super awesome for me as well. Bryan Robinson 15:59 The whole idea of having an editorial process and all that is definitely something that is super powerful when it comes to especially like you mentioned, the deploy previews and all that, like you can send it, you can send preview links out to like, get feedback on a post before you launch it. Jayson J. Phillips 16:12 Yeah. And it makes it also makes code reviews, much more accessible and less obstructive, right. So if your reviews are really going to be around the functionality of the code, you can, instead of having to pull it down, you can review the code within GitHub, which is expanded their like code review tools a lot, and just the ease of reviewing code in the site. But then you have the fully launched version on that deploy branch, which, again, just makes that much easier. And then it allows you to do things like hey, I have a similar branch that we can wire up for the API so we can test that API changes. It's just it's just being able to split concerns where you need to at different parts of the process is pretty solid. Bryan Robinson 16:54 So out of curiosity, since since you're doing tech for a lot of these boot camps, and you're and you're teaching web development, Are these things being taught in the boot camps and in the classes? Or is it more traditional Dev, and then oh, by the way, don't forget, there's this new thing coming out, too. Jayson J. Phillips 17:09 So I think there's a mix. For our classes in particular, we do start with a static approach by telling them all about GitHub Pages and getting them used to that for their first set of sites. So for, I could say, probably their first 10 to 12 weeks, every homework, every page, every project they do is being deployed and GitHub Pages statically. And then we make the connection to them of the other tools later in the course. But we never actually get to come back and say, all right, you can launch here but when they get to their second or like end of class project, we have a lot of our students who end up deploying on Netlify or using like Firebase Hosting or even using Heroku and like static generating webpages and and just having it hosted via static folder. So some of the students end up deeper in Jamstack because of their own research, but they definitely get that hint of that throughout. course by talking about GitHub Pages and talking about what that means, and what Jamstack will be for them. Bryan Robinson 18:06 All right, well, so So let's talk about actual music now. What's your actual jam? Where are you listening to what's in your headphones on daily basis? Jayson J. Phillips 18:12 All right, so my favorite song of all time is Bootsy Collins, I Rather Be with You, there's just says something about that intro to I hear that anywhere I stop. And I just end up swaying slowly. As far as songs as I've been listening to you, like, for the last few months, is an artist by the name of Karen Harding, who had some, some really nice like Deep House hits, and one is called Say Something. And it's just a really kind of upbeat, quick, simple song that I hear it and it's like, Okay, I'm ready for the gym. Or I hear it and I'm ready for like, three hours of coding. Or I hear it and I'm like, Alright, 30 more minutes. I'll get on my live stream. Yeah, like it just it's my musical rebel. It's all I love that song. Bryan Robinson 18:59 So, so Also, you know, what are you - What are you looking to promote right now? What What do you want to get out to the Jamstack? community? You know, what, what are you doing that you want to get out there? Jayson J. Phillips 19:06 Yeah, I think first and foremost, which we're both members of, is the awesome media developer experts community. Yeah, we definitely want to make sure folks understand that they could join the discord even if they're not an expert, come join the community to talk about media, especially now that we are moving with heavy Jamstack and we're in that's gaining a lot of steam, that media handling and media expertise is going to be much more important because now image sizes matter when everything else on your page is code split and, and so much smaller. So now we need like a renewed focus on media. Jayson J. Phillips 19:40 The second thing is, you know, I've joined in toss my hat into the Twitch arena. I think for me, I'm sticking a gearing to towards really early stage to mid level engineering. So we'll talk about a lot of topics. I've been working on a movie Tracking site application just giving everyone a piece of functionality every week that we work on and on the stream. So that's been pretty awesome. So if you want to give a kid a follow up, come check it out. Jason J. Phillips, we'll make sure we give you some notes. But uh, yeah, that's, that's the things I've been up to recently that I've definitely want to get out there. Bryan Robinson 20:18 Very cool. I love the live streaming community. I've been a part of it for a couple months now. And it's just absolutely amazing. And I'm glad that you're a part of it. And I'm gonna go click that. That little heart button here in a couple minutes. Jayson J. Phillips 20:30 Yeah, definitely need to swing by, a few others, too. I've loved seeing the individuality amongst everyone. Yeah, when we're all talking about similar topics. It just makes that that ecosystem and that community so vibrant. And folks are so super supportive. It's like, if you're looking for like environments to to learn code, or to even stream code yourself, live streaming, especially on communities like Twitch and I think there's some fun Doing it on Mixer (editors note: Mixer just closed after recording) as well. It's, it's a good place to start and kind of get away from some of the toxicity you might see in other platforms. I don't doubt that it ends up on these platforms as well. But the communities right now are just so helping inclusive and like internally boosting each other, which is super dope. Bryan Robinson 21:19 I love it. Like there's so little judgment that happens. Like, I'm not always the best, like hardcore programmer and I've actually had chat debug my code for me, it was great. It was like a beautiful moment. Jayson J. Phillips 21:30 Yeah, I think the thing I love about that, is that, for my former students, I always model for them a lot that, you know, no matter how experienced you are, you're gonna make you're gonna make errors, you're gonna have bugs, right? The point is for us to kind of learn from those and not repeat it the same way. Right. And so, I do love that there's this freedom to just be yourself as an engineer on a live stream. Yeah. And, I mean, I've definitely had a moment where we were sitting in for 20 minutes trying to figure out why something wasn't working. And it literally was, I refer to the model in my code wrong. And I was like, Yeah, thanks. That's 20 minutes of me sweating and getting frustrated for no reason. Bryan Robinson 22:12 And there is sweat involved. It's it's it can be nerve-wracking in front of in front of a crowd. Jayson J. Phillips 22:17 Yeah, but it's a it's a it's a weird kind of scary freedom. or something. We're like, Jason, I don't get it. I'm like, I know. But there's just something also empowering when people do come in to chat. And you know, there's a message of support or a message of, hey, you missed something like just that. Automatic, like, leaving the house help is super awesome. Bryan Robinson 22:39 Yeah. And like, it's just like sitting in a room with you know, with other developers thinking through a problem it can be just super helpful just to talk to somebody about even that somebody can't talk back. Yeah, Jayson J. Phillips 22:49 and it's, and the community also isn't looking for like the super. Like wunderkind. I've been programming since I was two. So I never heard A bug in my C sharp, right? It's a lot of folks are just looking for folks who look like them or sound like them or have life experiences like them, and actually be able to see them writing code. And I think that's super empowering for all of us to play a role in. Because we don't know who were inspiring next, or who just needed that little bit of validation of, oh, Brian talked about his story. I will link to Brian's story. I could do this, right. And that that for me is like the, the main like, just thing that pulls me into education and into like, live streaming. Bryan Robinson 23:40 Yeah. Or like, Hey, you know, Bryan spent 20 minutes finding a typo in his code. I've done that like five times, maybe I am a programmer. Jayson J. Phillips 23:47 Or someone's like, Oh, I'm not a real programmer, but I'm building a tool to and this is a real thing that happened. I'm building a tool to screenshot my screen. Use OCR to look at my code. And then Tell me if there's better ways to write those functions. Like when you think you're not a real programmer, get out of here, you leave right now. Like, man, you should get on stream and I'm gonna follow you nervous now. Bryan Robinson 24:15 I'm not a programmer, but I wrote this entire thing that honestly, I couldn't do. So that's, that's super impressive. Jayson J. Phillips 24:21 Yeah, it's, uh, it's, it's, it's been amazing. So yeah. For folks out there, and especially in the Jamstack community, if you're looking to do that. Everybody's voices needed. You know, streamers, watch each other. People will watch each other stream. It's a super awesome thing. Bryan Robinson 24:36 Yeah, definitely. Cool. So I appreciate you taking the time to be on the show with us today and to share your thoughts and experience so keep doing amazing things on the web in the Jamstack. Jayson J. Phillips 24:44 Bryan, appreciate you. I love what you're doing here and thanks for having me on the show. Bryan Robinson 24:54 Hey, everyone, it's Bryan again. I want to thank Jason again for being on the show and I want to take a moment to thank you are listening community is one of the many things that makes the Jamstack shine. And you all keep me coming back week after week. Before we get to our sponsor, be sure to like part star favorite or whatever in your podcast app of choice, and spread the word about the amazing people doing awesome stuff in our community. And now for our sponsor, if you listen to season one you're probably aware of take shape by now. But as a reminder, take shape is a content platform for the Jamstack take shape has a headless content management system, easy to use GraphQL API, a static site generator and an amazing new product called match a service that can tie together multiple API's into their handy graph qL interface if you're doing anything with content on the Jamstack Be sure to check them out at takeshape.io/thatsmyjamstack. That's it for this week. Thanks again for listening. And we'll see you back here for the next awesome episode. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

24 June 2020


S2E2 - Espen Hovlandsdal on mixing static and dynamic, content management and more

S2E2 - Espen Hovlandsdal on mixing static and dynamic, content management and more

Quick show notes Our Guest: Espen Hovlandsdal What he'd like for you to see: Sanity.io His JAMstack Jams: Mixing Dynamic and Static together | NextJS His Musical Jam: Russian Circles | Godspeed You! Black Emporer | If These Trees Could Talk Bryan Robinson 0:03 Hello, everyone and welcome to another exciting episode of That's my JAMstack - the podcast where we ask the fun filled question "What is your jam in the Jamstack?" I'm your host, Bryan Robinson. And this week, we have the amazing Espen Hovlandsdal from Sanity.io. Bryan Robinson 0:17 Before we dive into that interview, we'll welcome back our sponsor for this week TakeShape. Stick around after the episode to find out more information about their content platform or head over to TakeShape.io/thatsmyjamstack for more information. Bryan Robinson 0:33 Well, Espen, thanks for being on the show with us today. Espen Hovlandsdal 0:35 Sure, glad to be here. Bryan Robinson 0:37 Cool. So can you tell us a little bit about yourself? What do you do for work? What do you do for fun, that sort of thing? Espen Hovlandsdal 0:41 Sure. So my name is Espen. And I work as a software engineer at a company called Sanity.io. Most people will probably call Sanity, a headless CMS. But I tend to think of Sanity more as a platform for structured content. So we have like a hosted database in the cloud. And you got like an asset pipeline and a rich set of API's to talk to that database and to all like surrounding services. And of course, it's also got the actual open source, headless CMS that's based on React, which then talks to those API. So we're kind of a headless CMS built on the Jamstack. So it's been fun. Bryan Robinson 1:23 Cool. So how would you How would you differentiate - since you said you like to think of it as a structured content or structured data platform - how would you differentiate that between that and a CMS? Espen Hovlandsdal 1:34 So our API is kind of the first piece that we built. So we put a lot of effort into making sure that the API's are really like, great to work with. They're very flexible in terms of how you can query for data, how you mutate data that's based on like a very fine grained patch system. And you also have like transaction history. So you can go in and see all the changes that have happened over time to the document. And so it's sort of building the API first and then putting a sort of CMS on top of that, that talks to those API. So we sort of dog food all the all the API is through that product. Bryan Robinson 2:15 Okay. Very cool. So so it's it's more of an API that happens to also have a product in front of it that is a CMS. Espen Hovlandsdal 2:21 Yeah, kind of. Yeah. Bryan Robinson 2:22 Very cool. So what do you do for fun? That's what you do for work. What were you doing in your free time? Espen Hovlandsdal 2:28 I moved to San Francisco from Norway in August last year. So I've been sort of getting to know the city and the country. So that's been interesting. Now with the Corona lockdown and stuff. I've had less time to explore the city, but I've been playing a lot of video games for the past few weeks and also try not to do too much coding in my spare time, but that's like, I feel like I have a valid excuse for that these days. At least. Bryan Robinson 2:58 True. Yeah, I can definitely understand that. What games are you playing right now? Espen Hovlandsdal 3:02 I've been going back to The Witcher 3, which I'm quite fond of, and playing a lot of Civilization as well. Bryan Robinson 3:10 Civilization if you if you have spare time, and you just want to get rid of that third time, that's the game for you. Espen Hovlandsdal 3:16 Eight hours fly by; your whole weekend this there. Bryan Robinson 3:21 So so obviously you're well versed and kind of in depth in the Jamstack world being part of a structured data company such as Sanity, but what was your entry point into the idea of the Jamstack or static sites? Espen Hovlandsdal 3:34 Good question. Jamstack is kind of a loose term. So it's kind of hard to know what people put into that. But I guess when I was 13, and I made a bunch of like fan pages for all my favorite video games. So does that count that's like static HTML uploaded to an FTP right? Bryan Robinson 3:52 When I was 13, I made fan sites for anime and all sorts of stuff. So hundred percent it counts. Espen Hovlandsdal 3:59 Joking aside it's, it's kind of funny how we went from all these, like, static HTML sites that were just super easy to host. And then, at some point, we, for some reason thought that everything had to be server rendered and dynamically generated. But, uh, yeah, I used to work at this. There's a newspaper company in like a large online newspaper in Norway, they had so much traffic that, uh, that they built this, they built and funded the Varnish project, which is like a cache layer in in the form of a reverse proxy. And even with that, in front front, we kind of embraced the concept of building as much as possible into static copies of pages. So I've been working in that kind of paradigm for quite a while. Espen Hovlandsdal 4:46 But with like, more increasingly dynamic and complex pages, it's got gotten harder and harder to do, right until we got these static site generators. I think I think I started looking at it. Well, what most people think of as Jamstack back when Kyle Matthews started tweeting about building Gatsby, he was a huge fan of React ever since, like 2014. Yeah, when he when he started building Gatsby, he was tweeting all the while he was creating it about, like, why he chose to use GraphQL as a data layer and all the kind of choices that went with it. So I was kind of, I was really intrigued by it. And when I finally got a chance to try it out, I was just really impressed because it's kind of always what I wanted ever since I started with React, the ability to just build this static site in React and then have that mounted on the on the client side. So you can get that like dynamic stuff as well. Bryan Robinson 5:40 Yeah. Best of Both Worlds in that. Yeah. Cool. So yeah. So you went you basically straight up static, like way back in the day with HTML, and maybe and some CSS thrown in through server side render and dealing with all the cache and then into the Gatsby from there. Espen Hovlandsdal 5:56 Yeah, I was starting to work at Sanity and And I was following the Gatsby development. And initially, one of our community members made a source plugin for Gatsby. And I was really happy to see that. And then I discovered some really cool things that Gatsby plugins did like internally. So I saw some overlap there and some potential that we can improve the plugin with some of the core features of sanity. So I kind of built a our like official Sanity, the Gatsby plugin as well. Bryan Robinson 6:28 Oh, very cool. And have you have you noticed a lot of like, community contributions in the Jamstack versus like server side world? Is it a different feeling? Are there more, fewer? Like what's that kind of feel? Like you said, like, the community actually first created that? Espen Hovlandsdal 6:46 Yeah, it's been it's been really interesting to see a lot of contributions to both the Gatsby ecosystem especially, I mean, they're really, really good on getting contributions from people and really generous interest. of recognizing the work that's been done by people and sending swag and all kinds of stuff. And also would like frameworks like Next and Gridome and you see a lot of contributions. Not sure if there's a more, but I guess it's easier to get started with contributing to those frameworks since you've got it all running locally. And it's very easy to, like, run through the build and see that it works as expected. Bryan Robinson 7:25 Yeah, that makes sense. So how are you using, obviously, at Sanity, Sanity is a is a Jamstack company. But how are you using kind of philosophies both professionally and personally of the Jamstack? Espen Hovlandsdal 7:35 Well, professionally, we're maintaining all these starter project templates and stuff. So we get to play with a lot of approaches to how you want to structure your data and how you want to pull that in and how you want to build these things. So we've got I've been playing with all sorts of stuff like Gatsby and Gridsome, Sapper, 11ty they've all got, like slightly different ways of approaching stuff. Like 11ty, For instance, has a, it's kind of one of my favorites right now, because because of this, like simple nature of it, it doesn't like lock you into anything. The only thing that I really, really appreciate you be using React just for that, because I'm so familiar with JSX. But apart from that, it's it's really refreshing to see a different take on the whole data just being whatever way you can get data from some service and then render static from that Bryan Robinson 8:32 Those JavaScript data files are pretty great. Espen Hovlandsdal 8:34 Yeah, absolutely. So yeah, it's a guess we try to build as much as possible using the static like, thought they went into, like our website is now running on next year's and I think we're trying to move as much as possible to using static statically generated things there. There are still a couple of reasons why dynamic content makes sense in terms of previewing drafts and all kinds of stuff, but for the main reason, for the main part, it's should be able to just work statically. Right. Bryan Robinson 9:09 So out of curiosity, you're you're working at kind of a big, structured data company, or maybe we can we can simplify and say a CMS for the, for the current question. That's typically been kind of the purview of a dynamically generated site and a server, you know, server rendered site. What are kind of the challenges that we that we face in kind of coming from traditional like server side stuff and moving into this static realm, like, what, what, what feels different, what feels the same between those? Espen Hovlandsdal 9:43 Well, the big point is always going to be the build times. And when you're used to like the server rendered approach with your changes are just immediately visible. So I'm glad to see a lot of work has been been made. Now into Gatsby incremental builds and also Next is working on and Vercel is working on being able to invalidate data quite like granularly, so you be able to only regenerate the parts that actually changed. I think that's the probably the like, by far the biggest change in terms of differences on the actual client site is just so it's just a lot easier to host these things. Right. It's, it's probably one of my favorite features about the Jamstack is just the how easy it is, once you've got the site built to actually maintain it or not maintain, basically, you just let it run, right. Since it's all static, so that's been really cool. Bryan Robinson 10:45 You said you used to work at a news organization. And you had to like do the heavy front end or the heavy you know, server cache with Varnish and all that. Do you foresee more news organizations going in this direction. I'm a little nerdy when it comes to news because I used to work in news as well. And we definitely had our own issues like we migrated to WordPress for blogs. And then we had a blog that kind of blew up. And it was its own fun adventure. But do you see the Jamstack as being an ideal space for news? Or is it more always going to still be in that kind of dynamic CMS range? Espen Hovlandsdal 11:23 I think it's actually a pretty good fit. As long as you can work out the incremental builds. It's, it's there's no good reason why it shouldn't be just static content, especially when you've got these layered approaches like Next uses where you can have a app that's both, like partially server rendered, partially client rendered and partially statically built that's just like, the flexibility that gives you is just perfect because it allows you to send down just like a lot of pages or can be fully static, and for the ones that can't be at least you're able to like incremental Build your way out of the super dynamic realm and into a more static way of thinking. And I think the same is true for for Gatsby, and probably more frameworks coming up. Like I see the Vuepress is working on quite some, some quite impressive things where they ship like a tiny amount of JavaScript to the to the client. So that'll be interesting to see how that plays out over over time. Bryan Robinson 12:29 Yeah, I love the idea with that, that they're, they're optimizing that kind of load you get from a too big JavaScript bundle, too, which is amazing. They're thinking about that. Espen Hovlandsdal 12:40 Yeah, it's been one of the more like recent criticisms is just how much data you're sending back and forth. And for a lot of pages, you're just rendering the same, like you're getting a JSON blob and then rendering the same thing on the client, which is kind of wasteful if it's fully static, right. So being able to flag something as just being the system Just this won't change and don't rerender this part of the page, that's also going to be really nice to to get at some point built into the frameworks. Bryan Robinson 13:09 So we've talked about a decent bit of stuff already but what would you say is kind of your your jam in the Jamstack, what's your favorite service or product or philosophy even what's gonna keep you coming back to the Jamstack year after year. Espen Hovlandsdal 13:21 There's so many of these things now that I just kind of love to see the ecosystem grow and, and see all the like, different frameworks to inspire each other and kind of steal features from each other, which leads to quite a interesting space. Right now I'm really into NextJS. Just love all the, like I said, all the dynamic bits that you can combine with the static bits and also the sometimes I really do want some kind of server side logic. And the fact that that's sort of a first class citizen like built into versatile and it's just easy to deploy a static site, but with some, like server functions that are running serverless functions is, that's just great for most of my use cases, Bryan Robinson 14:08 Especially when you can kind of combine in those serverless functions, and they're kind of co-located. They're not a separate thing. Espen Hovlandsdal 14:14 Yeah, exactly. It's just so much easier to introspect what's going on and, and keep them all in the same repository. Bryan Robinson 14:20 Cool. So it's kind of that that interplay, that you kind of see that as the future like the interplay between dynamic and static as the way we're gonna go forward. Espen Hovlandsdal 14:29 I think definitely. I can't see that it has any real drawbacks. When you have that amount of flexibility, you're, you can kind of pick and choose what you like, and easily migrate between those different paths if you need more or less dynamic content. So I really, really like that. And as long as we managed to like, stick to the ease of deployment and ease of running these things, it's probably going to be a be around for quite a while. It's kind of the future. Bryan Robinson 15:00 Very cool. And I don't know if anyone has actually kind of put it in that way on the podcast yet. So I kind of have to ask, like, part of the beauty of the Jamstack is the resiliency. Do you see that that that future could have some issues around that? Or do you think that with the serverless stuff as long as you've shipped a solid serverless function, you should be safe? Espen Hovlandsdal 15:21 Good question. I mean, there's a lot of lots lots of stuff to still figure out. I think there's best practices that are missing for a lot of these things, especially in terms of security, I find a lot of serverless functions are basically open to the public if you know the route sometimes. So educating and making some best practices for how to secure stuff and, and make things more resilient and also being able to easily see what's actually going on inside of these serverless functions. I'm not sure how many people are actually tracking like errors inside those functions and how often they're crashing. So I think there's a lot to be to be done still on, on educating people on this thing been, but in general, I'm very positive as to the future of these things. Bryan Robinson 16:13 Yeah. I love the idea that they can interplay together so easily. It's a cool look towards the future. Espen Hovlandsdal 16:19 Yeah, absolutely. Bryan Robinson 16:21 So what would you say is your your actual jam right now your musical jam, what's your favorite song or musician that you're listening to right now? , Espen Hovlandsdal 16:30 I kind of listened to a bit of everything tends to be based on my mood. Lately, I've been listening to probably my favorite genre, which is post rock and post metal. So there's a lot of Russian Circles and Godspeed, You! Black Emperor, and If These Trees Could Talk, things like that, but I tend to go back and forth. I listen to a lot of old school dub and old school punk rock. Sometimes I need some metal just to get some frustration outs. Yeah, yeah, jump back and forth. Bryan Robinson 17:07 Very cool. So is there anything that you'd like to promote that you're doing right now anything you'd like to ask for the Jamstack world as a whole? Espen Hovlandsdal 17:12 Well, sanity.io, obviously, I really am in love with this product. Even though I work there. That's a that's not just a promotion, I really do think it's a great product. And also, we're hiring. So if you want a job, go check out Sanity.io Bryan Robinson 17:27 So I'll make sure to post that link in the show notes. And I want to thank you for taking the time to come chat with us today and kind of share your perspective on the jam stack world. Espen Hovlandsdal 17:35 Thank you. It's been a pleasure. Bryan Robinson 17:39 Thanks again to Espen for being on the show. And to you all of our dear listeners for tuning in each week. Before we get to our sponsor, be sure to like heart star favorite or whatever in your podcast app of choice and spread the word about the amazing people doing awesome stuff in our community. Bryan Robinson 17:55 And now for our sponsor. If you listen to season one you're probably aware of TakeShape by now. But as a reminder, TakeShape is a content platform for the Jamstack. TakeShape has a headless content management system an easy to use GraphQL API, a static site generator and amazing new product called Mesh, a service that can tie together multiple API's into their handy GraphQL interface. If you're doing anything with content on the Jamstack, be sure to check them out at takeshape.io/thatsmyjamstack. Bryan Robinson 17:55 That's it for this week. Thanks again for listening and we'll see you back here for the next awesome episode. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

17 June 2020


S2E1 - Tim Benniks on playing, scaling and business in the Jamstack

S2E1 - Tim Benniks on playing, scaling and business in the Jamstack

Quick show notes Our Guest: Tim Benniks What he'd like for you to see: His YouTube interviews with notable developers His JAMstack Jams: Lambda Functions | Connecting various technologies His Musical Jam: Fantastic Negrito Other Technologies Mentioned Gridsome NuxtJS Jekyll Bryan Robinson 0:03 Welcome friends to season two, That's My Jamstack. If you'd like season one, you'll get more of the same out of season two, me talking to developers and designers in our amazing community talking about their passions in and out of the Jamstack. Bryan Robinson 0:15 I'm your host, Bryan Robinson. And this week we have the amazing Tim Benniks on the show. Tim is director of web development at Valtech, part of the Cloudinary media developer experts program, a speaker and much more. Bryan Robinson 0:27 But before we dive into the interview, I want to welcome back into season two, our amazing season one sponsored TakeShape. Stick around after the episode to find out more about their content platform or head over to takeshape.io/thatsmyjamstack for more information. Bryan Robinson 0:44 Today, on the podcasts we have Tim. Tim, welcome. Thanks for coming on the podcast today. Tim Benniks 0:48 Thanks so much. I'm really happy to be here. Bryan Robinson 0:50 Awesome. So can you tell us a little bit about yourself? What do you do for work? What do you do for fun? Tim Benniks 0:54 Yeah, sure. So as I said, my name is Tim Benniks and I was born in Amsterdam, but now I live in Paris. And here in Paris, I'm the director of web development at an agency called Valtech. Which is kind of a global agency where we do big platform builds, for big ecommerce and stuff like that. And so I'm doing a whole bunch of different web development things and the management and things like that. Tim Benniks 1:21 And what I do for fun changes all the time. Actually, I've been a lifelong musician, so that always stays. I always enjoy making music. But lately I've actually done a lot more content creation and I've been doing stuff like speaking in conferences, so I really enjoy that aspect now like figuring out what gear to use to record something actually being able to speak in front of a camera and not be boring, like so for fun I tried this kind of stuff now. Bryan Robinson 1:53 Cool. Yeah, I definitely I can I can get behind that is once you go down the gear rabbit hole of like audio recording and video recording. There's there's no hope for you anymore. Tim Benniks 2:02 This is a trap. And the worst is, as a musician, I've recorded a whole bunch in studios, but also at home back in Amsterdam. And then when we moved to Paris, I decided to either sell stuff or just gave it to friends who needed it. Because I was going to a small apartment, I couldn't make a lot of noise. So I had this nice stuff. And now that I'm back in a place where I can actually record, I don't have the stuff. And now I'm like, oh, but I don't like the cheap things, because I'm used to all this nice stuff now. So it's, it's a double trap for me. Bryan Robinson 2:35 Nice. So what kind of what kind of music do you do? I mean, we'll talk about what you're into in terms of listening. But what kind of instruments do you play? Or what's your musical style? Tim Benniks 2:44 So I'm a guitarist. And not much more. It's one of those like, if you ask me to sing, it will be awful. But on a guitar, I'm fine. And when I started out, I was like a session player. So I would play anything someone would like and i just i Like that. So I would be like, all over the place in all different kinds of things. But after a while, I noticed I just want to settle for something I really enjoyed, which was blues music, like the old school Chicago, 1960s blues, that's really where it's at. For me, I really enjoy that. And then when I'm on stage playing that it doesn't really matter anymore how technical you are. It's much more about the vibe and the feeling and timing and having fun. And now that I don't play as much if I grab a guitar now I just play that and I'm happy. Bryan Robinson 3:34 Very cool. So obviously not music podcast, it's a Jamstack podcast, let's talk about like, what was your What was your entry point into the idea of the Jamstack? Or maybe it was static sites when you got into what what's your entry point? Tim Benniks 3:46 This is years ago. Now the works jam stack were never uttered at that time. I'm kind of a dinosaur in our industry. And I'm really... I started with all the basics, right? Like what does HTML do and woah we have CSS now stuff like that. Tim Benniks 4:02 And so at one point, I found this thing called Jekyll and it's still around. And Jekyll is this static site generator. I think it's built in Ruby, I'm not even sure anymore. And it was also used for GitHub Pages back in the day. And I always made my own websites with this. Tim Benniks 4:21 Everything at work was always more enterprise level, or more creative or more, let's say let's do a campaign for Chanel. We wouldn't be doing this, we always had like, big enterprise system. So in my own time, I wanted to do something simple that had like super good performance and stuff like that. So I started with Jekyll and I used that for years. Tim Benniks 4:42 And at one point, of course, I was kind of forced into VueJS land because of work. And because I was also always a vanilla JS guy. And I really started to enjoy that more and more and then NodeJS became big and then suddenly there was Nuxt. So next year is kind of it looks like next year, so a little bit on the on the React side. And they had this way to generate your website statically. And of course, when that came out Jamstack existed. And I didn't know it was Jamstack, I just still generated my site statically because it was fast and it was all good. I could have cheap hosting. I didn't get hacked all of that. Tim Benniks 5:24 And my latest one is now that i i found Gridsome and if you're in Vue land Gridsome is great for Jamstack-like projects. And every time I need to to up something that has static content in it and maybe some microservices around it, I tend to use or Gridsome or Nuxt and then just fill it up with some data. And the rest would be way more fancy potentially. But this is still my base. So that's how I entered this this realm of awesome. Bryan Robinson 5:53 Very cool. Yeah, like that. I think that's a for a certain generation of static site people, Jekyll is very much the entry point like that was that was my entry point. We've had a few guests on that said that that was there's all from that kind of background of, you know, I used to write HTML and CSS and I needed something a little bit more and it became Jekyll. Tim Benniks 6:13 Yeah, I truly... I loved their template language and how that all fit together and it felt like black magic back then, because I didn't really care about how it was built. It just worked and it had like a CLI and that was new to me. And it's just pure gold at that time. Bryan Robinson 6:29 Yeah, definitely. Cool. So So nowadays you're you're in Gridsome you're in Nuxt, how are you using it personally, but also like, are you using it professionally now? The Jamstack and Gridsome and all that good stuff. Tim Benniks 6:41 Well, this thing is clearly seeping into work now. So what I'm working on generally are big platforms. Let's say for a client like let's say, EasyJet, which is like a big airplane company or we have L'Oreal that has like 15 or 20 brands that all need websites. And like we have like 3-400 instances of websites in one system. So they all use this big enterprise stuff. And we are seeing more and more that the performance needs. And the KPIs for good websites nowadays are much closer to what a static Jamstack site would do. Tim Benniks 7:19 And also for business, right? Because we are also thinking about performance, scalability, cost uptime of servers. And so slowly but surely this is is going into the work life now. We don't really go fully Jamstack just yet. But things like microservices, lambda functions, cloud connections, things like that. They really come into the picture now. And it just kind of if I just give it a year, and most projects will be some sort of a Jamstack approach. I think Bryan Robinson 7:54 That's awesome. Yeah, I did agency work for about six and a half years and managed a team and It was right before I got fully into the jam stack world. I had Jekyll blog and all that, but I really wish I had dug in and we had started working towards that when I was still in agency lands, I think it would been awesome. Tim Benniks 8:11 Ah definitely, I'm in a place where there's this is still led by big business. And if you have a contract that you pay 2 million for a couple of years, you're not just going to say "Okay, how about we ditch that CMS system and now we go for something else." Tim Benniks 8:26 So what I have to do is find creative approaches to to give them the opportunity to want to change, but not that cost them too much money and that. Let's say we did this recently for Louie Vuitton, which is like a super fancy brand of luxury stuff in Paris. They have this old ecommerce system with like a monolith. And what we did for them is we they knew they wanted to change because one release was like 25 hours and it would not always go right it was fairly challenging and they wanted to release every week. So we lost half our week on releases not even coding. Tim Benniks 9:04 So what they said, we're just going to need to separate the front end from the back end. So we have more flexibility on doing front end changes, design things, A/B testing, stuff like that. And so we came up with a next system for them. That would be its indexing universal mode. So we're not really in jam stack land just yet. But these guys, they now have the opportunity to say okay, so we have this big ancient CMS system behind us, we built on top of that and API layer that goes to the NuxtJS. Now, we are suddenly in the position to say, let's swap this old system out for a new one that's cheaper and lighter. And then so we gave them the opportunity for innovation on their tech stack, and it's so much cheaper now. And they can do it hosted in the cloud rather than on like a co located server somewhere in the basement. Right. So all of that starts to work. And I'm quite sure that most of their content pages will be some sort of a statically generated system, where then their ecommerce pages are more Nuxt in Universal mode. And I'm seeing that for the future, I think. Bryan Robinson 10:14 Awesome. That's really cool. So would you say that the NuxtJS and Gridsome are your jam in the Jamstack? Or, or what you know what sort of service or product is kind of what, what makes you love the Jamstack? Tim Benniks 10:28 Um, what I like most is like, let's let's think because the Nuxt and the Gridsomes, and maybe even Gatsby, or all of those, they work really well. But they work so well they're like black magic. And they're almost commonplace now, which is totally cool, right? It just works. So what excites me more are things like lambda functions, and how do I connect extra things against this stuff that just already works really well. Tim Benniks 10:56 So for example, I've built this little app. I've built a couple of apps to just figure out what this cloud stuff does, like I did for a talk, I was preparing about Jamstack, I actually built an application that connects to my Strava server. So Strava is where if you do a bike ride or you're running, they track your pace and your GPS and stuff. But then, if you want to embed what you did on your blog, it didn't work well. But I was running marathons. So I wanted to write a story embed a training run and talk about it just because I'm a nerd. I like data, right? It didn't work. So I decided, Okay, I'm just going to build my own embed. And I will query Strava to get all the data and then I will show my run on a 3d WebGL globe and you can follow me live. Tim Benniks 11:46 Just good fun. And that teaches you WebGL, it teaches you about how time works on a globe and like how do you plot GPS, all that craziness, but what made it fun Was that I decided, Okay, I, I don't want to have one node or PHP server or whatever that gets me all the data and then renders the front end. No, I want to do this in the Jamstack way where I have a single page app that's statically rendered. But that still does AJAX calls or some sort of REST calls to get the data and so I came up with something like four or five lambda functions. We use Azure Functions for this, because where I work, we get a free Azure subscription, which is great. And these guys are running fast. They do a lot of cool stuff nowadays. Tim Benniks 12:36 And so I had to learn like how do these function as a service thing kind of work, but I managed to do my auth authentication with token exchange with one function to get the list of my activities with another function, and then to grab the data off an activity and morph it into another type of structure. sure that I could use in JSON, for my representation on the 3d globe, the funny thing is like you only log in once, right? So that or maybe twice, whatever. And you only get the list of all of your activities maybe once or twice, but then you can click on every activity and you get them a lot. So if you need to scale you, you only have to scale the one where you get the activity all the time, but they don't know about each other. You just have to give it a token, and it understands what to do. Tim Benniks 13:32 And I also added a little bit of cache in front. So but there was also a redistributed cache. So it was not centralized. So there was nothing central there. And if I wanted to change my login flow, or add maybe a twitter login or a Nike login, I could do that because I used those lambda functions. So at the moment, that's my jam to see how can I put this together? How can I orchestrate it and how can I have fun with it and especially having let's say Web hooks in between those things. Like they can suddenly do things on their own, without me actually orchestrate Bryan Robinson 14:06 The robots taking over the world at that point. Tim Benniks 14:10 Oh, yes. Exactly. Bryan Robinson 14:13 So it's kind of the putting the pieces together and finding new and kind of expressive ways to build out fun applications. Tim Benniks 14:20 Exactly. And because at work, I have to do all these serious ecommerce things that also also, they all need to do this kind of stuff. But then they have extremely expensive monolithical systems that do this. But you know what, you don't really need it. Because if you want to scale a monolith come Christmas time, that's so hard to do that you have to put them on multiple servers, then you have load balancing, and then how do you maintain a session or a cookie, you have to share them between those systems, then you need to hire a company that does that for you. So that's so expensive and so bad for the environment. actually having these lambda functions that can scale indefinitely because they're so small Having your website as a static bunch of files, if you want to scale that you just put it in more places on the CDN. Right? So I really want to make sure that at work, this kind of thing starts to seep in. So it's not just playing anymore. This can be actual business. Bryan Robinson 15:15 Yeah, and especially, especially the e-commerce that Christmas time example is 100%. Like, how do you scale that without spending thousands or hundreds of thousands of dollars in a short period of time? Well, you can do it in lambdas and small functions. Tim Benniks 15:29 Yes, exactly. The only drawback is like, what we see in Jamstack is we tend to do this to simplify our lives, right? We don't want to have those older servers everywhere to keep stating the complicated stuff. But the drawback is you also have to orchestrate and maintain that all those small services keep working. And if one dies, what happens because you don't always notice, because if something is a monolith, the whole thing will likely die. In this case, it's just one island that silently drops off but you don't see it anymore. Which is pretty cool because it's very stable. But you're going to need to have some sort of a way to maybe deploy different versions of it or have a monitoring like if it's down or not like, there's all this extra stuff. So it's still probably expensive, but it's more of a one time thing. Bryan Robinson 16:18 Yeah. Cool. So So what is your actual jam right now? What's your favorite song? What's your favorite musician? Where are you listening to right now? Tim Benniks 16:27 So lately, I really, my dad actually put me on to this like, this is it's a little story that I that I have is like when I was young, in the Netherlands, in Amsterdam, where I grew up, you always take your bike to work as a young child, or not to work to school. That's what you do. So no school buses or whatever you just go, but my dad, when he had time insisted to take the car to bring us because then he could play us blues music. It was able to give us a sense of music and I love that so much. Now now that I'm 35, he still does that he still sends me stuff. So he sent me something called Fantastic Negrito which is quite modern approach to how you would play blues music. And it's very raw, and but it also kind of fits in a pop sense. He has a really cool political views, but it's also a gritty, it's a bit of like, I don't know, I cannot say that it's like Gary Clark, Jr. But what it means it's on the same kind of level. And it's kind of acceptable for people who are not blues fans. And I'm totally into this. And I can play a whole bunch of styles of music, but he has this energy that I just don't have, so I wouldn't be able to play that. And if it's something that's super technical, I can generally just practice until I have it with this guy that's just not there. It's all about the feeling. And this is why this is such a fantastic musician. So if you have the chance and you like blues, music or bit rock stuff, you should really try to listen. Bryan Robinson 18:02 Amazing. Awesome. So is there anything that you'd like to promote something that you're doing that you want get out into the Jamstack community? Tim Benniks 18:09 Actually, I would, and it's not specifically Jamstack focused. But recently, as I said, in the beginning, I've been I've been trying to record things and figure stuff out about content creation. And one of the things I I have always loved and now I'm trying to do is doing interviews with people a little bit like you are doing with me now, but then on YouTube, and I'm not here to just plug me in go to my channel. It's kind of more the people I get to interview. And because what we do is we go over how it has happened, that they are on the place where they are, like, how did they become so good at conference speaking or at teaching, or at, you know, open source contributing. Tim Benniks 18:55 So I have a whole bunch of VueJS core team members, I have developer advocates at Microsoft, like people who are quite far ahead of me, like they are on point like they're there for a while. And I'm lucky enough that they get they want to speak to me. And what we try to do is figure out how they got there. What is their story, and find kind of tips and tricks for people who aspire to do this, that they can do. Just the things that they say try it. And the most amazing stories come out that like, we would go to a cafe and drink something together, they wouldn't tell me and then on this interview based on a certain line of questions, or questioning, stuff comes out that I didn't know about, which is amazing. Tim Benniks 19:40 It's like there's people who were very depressed, couldn't get their job done and suddenly found this this way into tech and change their lives around or someone who was a single mom very young and didn't know what to do and is now the lead evangelist at Sitecore. Like these are amazing stories. So, what I would love to plug is just have a look at those interviews. And it's not just me, the guy who asked the questions, but listen to the people with their stories. I think that's worth your time if you're in our community. Bryan Robinson 20:14 Yeah, definitely. That sounds that sounds amazing. Well, we'll put a link to that on the show notes. Awesome. Thanks. Very cool. Well, thanks for taking the time and and being on the show with us today. And I hope you keep doing amazing things both as your agency and then kind of your personal time. Tim Benniks 20:27 Thanks a lot for that I had a blast being on. Bryan Robinson 20:31 Thanks again to Tim for being on the show and to you, our dear listeners for taking the time out of your week to listen in and find out more about our amazing community. Before we get to our sponsor, be sure to like hearts star favorite or whatever in your podcast app of choice and spread the word about the amazing people doing awesome stuff in our community. Bryan Robinson 20:50 And now for our sponsor. If you listen to season one you're probably aware of TakeShape by now. But as a reminder, TakeShape is a content platform for the Jamstack. TakeShape has a headless content management system an easy to use GraphQL API, a static site generator and amazing new product called Mesh, a service that can tie together multiple API's into their handy GraphQL interface. If you're doing anything with content on the Jamstack, be sure to check them out at takeshape.io/thatsmyjamstack. Bryan Robinson 21:20 That's it for this week. Thanks again for listening and we'll see you back here for the next awesome episode. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

10 June 2020


Kathleen McMahon on writing docs, helping others learn and design systems

Kathleen McMahon on writing docs, helping others learn and design systems

Quick show notes Our Guest: Kathleen McMahon Her JAMstack Jams: MDX | Gatsby Special thanks to Kathleen for doing the transcription for this episode Transciption Bryan Robinson 0:03 Welcome to another jam packed JAMstack adventure on That's My JAMstack — the podcast where we ask the fantastical question, what is your jam in the JAMstack? I'm your host, Bryan Robinson. And on today's episode, we had the amazing Kathleen McMahon. Kathleen is a developer and design systems guru and I had an amazing conversation with her. But before we dive into the interview, I do want to mention that our amazing sponsor TakeShape is back again this week. Stick around after the episode to hear more about their amazing content platform for the JAMstack, or head on over to takeshape.io/thatsmyjamstack for more information. Bryan Robinson 0:39 All right, Kathleen. Well, thanks for joining us today on the podcast. Kathleen McMahon 0:41 Thanks for having me. Bryan Robinson 0:42 Cool. So let's, let's talk a little bit about you. Tell us a little bit about yourself. What do you do for work? What do you do for fun, that sort of thing. Kathleen McMahon 0:47 Okay, so alright, let's break this down. For work, I am the Tech Lead for the O'Reilly Media Design System. So that's an internal open source project. We're trying to get you know, just a consistent look and feel for our components and our just our materials. I don't know if you've ever heard of design system, kind of a hot topic lately, but yes. Bryan Robinson 1:10 A little bit. Kathleen McMahon 1:11 So that's what I work on. For fun, in the fall mostly, I race cyclocross — very badly — on a single speed in the back of the pack, because everyone laps me twice, and I wear costume to make everyone that passes me laugh. And I also put tunes in my back pocket. So we have, you know, soundtrack, we have costumes. Everyone knows me because it's a person who wears, you know, like this... it looks like this lit up thing of like — spaghetti — with like a Spam costume backwards or an M&Ms costume backwards, you can be entertained! Bryan Robinson 1:51 Have you ever caused any wrecks with that? Like have people like laughed so hard, they fall off? Okay. All right, good. Good. Bryan Robinson 1:56 No, no, no, I've been doing this for a very long time. Like my, I'm much better at soccer, but I love to I love and I love soccer, but I love to bike. I'm just horrible at it. And it's fine. I just like to be at the back while everyone else is racing like going hard. And I'm back there just chilling out. Bryan Robinson 2:14 Nice and you get out you get outside, you have some fun, and you have let other people have fun while they're competing, too. Bryan Robinson 2:19 Yeah, exactly it's this huge camaraderie. And you know, who's coming, everyone announces they're coming and just you hold your line and someone else passes you and, you know, you making sure you're not holding back the leader. Everything's good. Bryan Robinson 2:34 Well, very cool. So... so let's talk a little bit about the JAMstack. So what was your entry point into this idea, either JAMstack or static sites or wherever you kind of started with it? Kathleen McMahon 2:42 Ah, that's a very good question. So, um, how I got into JAMstack was... so our design system has documentation. And our documentation site was built before MDX came out. So before JAMstack was really a thing. So it was around 2018 when MDX spec was really starting to get, you know, baked in a bit. And the way we were generating our documentation site is we had a separate repo. In that repo, we were using react-docgen, to generate our, our component. Kathleen McMahon 3:24 For example, our component pages. So we could use Markdown and it was awesome, but we had to use it in a very brittle way. We had to, we had a script to scan through our component files to you know, create, you know, data for props, tables, spit that into an object. We would have. We would use our Markdown files to write down like, you know, this is your primary button. This is the code for it. This is how you should use it. But we had to write our Markdown in a very specific order. We had to have like an h1 for our, our component name. We could have one paragraph — but only one paragraph — of intro paragraph. When we had two, you know, you could write it, but only the first one would show up from our script. And then we would have, you know, every single variant had to be written as an h2 with, you know, the variant, but not to be... only one paragraph, only one variant, and you couldn't put any h3s in there, you couldn't do anything else. And the minute you started, being freer with your Markdown, things would not render. And you couldn't even bring in rack rack, I'm sorry, you couldn't even bring in React components at all into the Markdown. So you were... you would have this one file for the information that was in your Markdown, and you'd have another file that would grab everything from your React components. Put it into a different object, and you would cobble them together in this very just... it was so hard to work with that... Kathleen McMahon 5:05 Even as someone who was used to the code base, it was hard. And for people that were contributing, they would flee. I just did a talk about this in early February for Gatsby days. I was talking about this whole journey and it was just I use a lot of penguin gifs. Penguins, you know, fleeing and running away and just like, you know, just hitting their head against the glacier because everything was brittle. So this is why once the MDX spec matured, I was like, "wow! We could do some more, so much more now. We can write what we want to write. What we write will show up on the page." And this is so much more exciting to use. And now we can have contributors that want to come in and say, "Oh, you know, I found a typo." Just you know, fix the typo, push up a commit. Bryan Robinson 5:42 And don't worry about the actual structure of your markdown. You're good to go. Bryan Robinson 5:45 Right. You're good. Yeah. Bryan Robinson 5:47 So, so that's MDX and obviously, Are y'all using Gatsby then for the design system documentation? Bryan Robinson 5:54 Yes. Bryan Robinson 5:54 Very nice. Kathleen McMahon 5:55 Yeah. Bryan Robinson 5:56 Kind of walk through that a little bit for me. Bryan Robinson 5:59 Um... Do you want to me to walk you through my learning curve? Or...? Bryan Robinson 6:04 Well just kind of like I guess transitioning from the React docs to Gatsby. Bryan Robinson 6:09 Okay, so that was a two weeks of pain that was so worth — it was so worth it. Um so what I did the transition was I... went to Gatsby. Of course my cat is meowing right now. That is Thor if you ever hear him meowing. That is Thor, the Mighty Thor. What we, what I did was... I went into the Gatsby site, I did their tutorials. I went to tutorials one through eight and um, you know, made myself a site. And after following that, tried to figure out what was missing because that — you know, that the tu- tutorial, you know, walks you through, this is how you get started, you know, doing a blog post and all these other things. And it started with with some Markdown. But it was missing some stuff. So you had to like write down what what everything, you know, everything that you missed. And I would get stuck on certain things like either creating pages, or the GraphQL query. Because you had that, you had to figure out like where, where you had to modify either the Gatsby node page, or the Gatsby browser page, or the Gatsby config. And you had to do it in a certain way. So, once I found out the right combination of understanding that I had to adjust my config, so it would support like post — because we just use postCSS in our projects. How to use themes because I watched a Twitch livestream stream with Jason Lengstorf and Chris Biscardi, and they were talking about the experimental themes. So I followed, you know, what they were doing and made a theme within a theme while it was still experimental phase. Grabbed that into our doc site, tried to make things work, and the hardest part was trying to — it wasn't where you would make your, you know, your source pages and, you know, just generate your files — it was talking to the separate directory where our components were because... We wanted our components, we wanted a better separation of concerns of documentation for just a general doc for general docs, one location. And not in a separate repo anymore. In, it's just this separate directory in this one repo. But our, our components are hosted in a source repo. And so we have it for better separation concerns we have, you know, the button component is in a folder with all you know, all its files. And so you can always keep everything you know, all you know test files and CSS files and you know, Storybook file, and the Markdown file all co-located in, you know, one location. So make, you know, make maintenance easier. Now, with that the hardest part was trying to figure out, "okay, how does Gatsby talk to this source folder?" And once you found the right combination of, you have to do a query this way, and you have to point it to the right you know you have to use these plugins like the Gatsby... Gatsby file, plugin and you add/use, you know, this other plugin which I could pull up the code base to to remind you of all the words right now, but I can't because MDX right now it's on my brain, and I'm very excited about it. But! I'm figuring out and looking at it right now. Ahh. There we go. So with with the config, you know, you have things like the page creator, the file system, you had to learn, you know, how to resolve your paths. And if you were, if you were new to you know how to use Node at all, it's a learning curve for anyone. Or if you haven't done Node, for a while, you're like, Oh, what is this like, __dirname? What does that mean? You know, how does this do things? So it was pretty cool. Once you figured it out. You're like, "Okay, this is what works", then comment the heck out of it. So everyone else will know how to use this. So once you got everything set up for like, how to handle postCSS, how to compile ES6 packages, because that's what we're using in here. How to autolink headers because you want to make sure that your your headings are accessible and you can link right to them and share those links. And how can you point to the data file, because we're still using that data file to generate props tables. And but also point to the source folder. So we can grab any MDX files from the source folder. Once you figured that out, it was, everything was happy. And then all you had to do was in the Node file, do the... do the gatsby-node file is make a query to find the childMdx body, which was awesome. And then you would just create the page and point it to the template you were using. So it was like "this is magical!" All you have to do this thing on everyone else just have to do like npm run, you know, npm run docs. Like what? Yeah, everyone else is gonna be not like, you have to do this npm link, npm link to this and da-da-da-da. You're like, "no, no, we just want to do one thing. One, one command." So we got down to that, and it was just very exciting. And you learned a lot about Gatsby because like the stuff where you're doing it like a... Bryan Robinson 11:02 Like either a static query or page query because there's two different ways you can do, depending on if you're in a layout file or other files. We had to do this particular query in gatsby-node because we're pointing to a separate directory, because there's a lot of stuff that gets done under the hood. And their docs are getting better. The team there is great. And like they've been incrementally making everything so much better. That back, you know, back in 2000, there was almost a year ago that we convert our docs. Back then it was you had to, you know, if there was anything missing in the docs you had, you're kind of on your own. But now it's a lot better of like everything's pointing where it needs to be pointing now. And which is interesting, because I'm going to divert into a different direction. Gatsby's had this 100... 100 Days of Gatsby and it's almost finished. It started January 1, no, mid like a Wednesday at the very beginning of January, because I signed up for it. So I'm like, I'm going to go through this again. See what I missed. See what I learned. And I went through it again, I've been writing down notes of everything that's missing in the docs, because I'm gonna make PRs. Like, you know what, these are the things that weren't clear to me. And it will help, you know, contribute back, say, "hey, this is what I learned. This is what I missed." And, you know, there's ways that we can add that back to the docs. Bryan Robinson 12:14 That's kind of awesome. I feel I feel like one of the big things in the JAMstack right now is just this open source community and how like, everyone wants to make it better. And it's not like a complaining mechanism. It's like, "how can I go in and make the next person have an easier time?" Is that, is that kind of been your experience as well? Bryan Robinson 12:30 Oh, totally. Because it's your your, everyone's trying to learn this at the same time. And these products that are coming out are amazing, and they are doing a lot of stuff under the hood for you. But there's also things that are missing. It's more of a — and it's not intentional — but it's more of an assumption of you already know these things already. You already know that... if someone says Yarn and you're using NPM, you use NPM. And you understand the dangers. of using Yarn and NPM at the same time, but if you've never used that, you know, you have to go back to approaching it or like, what if I've never seen this, but what if I've never seen you before? I don't know, I'm just gonna follow the instructions verbatim. Why is this breaking? I don't know. Or, you know, just things were even, like, there's gonna be a lot of people coming from, you know, self taught, you know, or any other, you know... It could be a bootcamp, or where you get thrown in, you know, four hours of HTML and some other some other questionable practices. Um, but yeah, um, but it's important that the community give back and start talking to each other. And that's one of the reasons why I love Gatsby so much is because the community over there is amazing. And the team over there, they walk their talk. They are always helpful in finding ways to make sure that, you know, if something's missing, they either encourage contributions. They're willing to pair with you, and help fill in those gaps. So yeah, I love the community. Just for that reason. Bryan Robinson 14:01 I'm kind of curious. So... so we're talking about, like, the docs in general. And I feel like — and maybe you've got an opinion on this — like, we were at a point in, you know, quote unquote, the JAMstack, right, where it was a very, very, like heavy developer-centric ideology for a while. But it's starting to get this massive adoption. So we see a lot more beginners coming in. And it's very curious to see how we have to adapt to that. Because you're right, like, I see some docs who say, you know, run NPM this or you or Yarn this. But then I see some that just spit out one or the other. And I'm wondering, like, how we can facilitate a bigger or a quicker adoption of like, a beginner-first mentality in a very developer-centric area. Bryan Robinson 14:43 Ah, yeah. Bryan Robinson 14:46 That's almost like the question of all time at this point. Um, yeah. You know, it's one thing is making those... making the time to write the docs. But other is — a lot of part is — the feedback. Like, a lot of like, personally, I see a lot of people can complain about something, but they won't offer a solution like, "hey, I, you know, I didn't understand this", or, "hey, I didn't understand this. I wish I, you know, rather than I wish it told me this, because once I figured this out, you know, it really helped me." Some people are solving it by when they learn they blog about it. So that's great. But then you have to like search for the blogs. So it's like, how do you combine you know, all that knowledge that is on the interwebs, everywhere, and but also find a way to get it back into the docs? Because when you are on a, you know, smaller, smaller startup team or even open source, anything you have to rely on your contributors to, you know, get your work done. Bryan Robinson 15:46 Yeah. So that makes a lot of sense to me. And I wonder if more places should actually be linking to all those great blog posts. Of course, there's still that findability issue. Like if you're a maintainer, you're not just actively searching for blog posts about your stuff, although maybe you are. But like, I'd be very interested to see it like a push that's like if you write a blog post, keep it on your site, but like, let's link to it. Like let's build a, a repository for each framework in their documentation of like, articles on X, Y, and Z. Bryan Robinson 16:14 That's very interesting. For example, accessibility project does that right now. Like accessibility project is really great about I mean, they have articles on there, but Iit will also link to different like, individuals tend to blog a lot. I do know that Gatsby has their own blog, so that you know, isn't just gets the employees that are blogging. There are individual contributors that are blogging to so maybe that's the way to do it. But how do you get that out there? How do you get that... that knowledge that hey, you know, because guess these philosophies, you all are welcome here. Everyone is welcome. Right. And maybe I haven't been reading closely enough to like read the blog where it says, "hey, you know, you can blog for Gatsby because of this. I mean, I just need to read more closely to say, wasn't like written there? Or is it more of a, like presumption? Or something where you can like, share that information out to people like, "hey, you learn something new? Why don't you post it on, you know, the blog" or like a lot of people are posting on Dev.to. Bryan Robinson 17:16 True. Yeah. Kathleen McMahon 17:17 And they will, they will do, you know, they will do tags to stuff, you know, then you can start searching by tag. Bryan Robinson 17:24 I wonder if you could, at that point, like build a React app into Gatsby and into their site or into into what you know, what, whatever open source thing is it to like do a search for Dev.to tags. Like I'm an Eleventy buff, so it's like, if they just pulled in like an Eleventy tag, then I don't know that'd be really interesting. Kathleen McMahon 17:43 It's almost like like the arcgis like the COVID map. The legit one, not the one that's like that asks you to download stuff — shady stuff — to your computer. Something like that, because there's a lot of, you know, there's a lot of crowdsourcing stuff out there just to share the information. So yeah. That would definitely be a good thing to do. Bryan Robinson 18:01 Yeah. But viral spread of helpful... Kathleen McMahon 18:05 Not that! Not, no... not the vir-- yeah. Yeah. No need to download anything. Bryan Robinson 18:11 Exactly. Bryan Robinson 18:13 Cool. So uh, so I assume so professionally, you're using the JAMstack in this kind of Gatsby docs way. Are you anything personally? Or is it all just kind of that that professional aspect. Kathleen McMahon 18:23 For now it's professional, but I'm, I'm — in my copious amount of free time, you know — still working through those 100 Days of Gatsby because, you know, you're learning how to approach using JAMstack in different ways. So once I figure that out, I have two sites that I could potentially convert because one of them is a WordPress site. And so that's the site I've had, you know, for my, my freelance design business, you know, that I've had for a long time. It's a... 2011 WordPress theme, and you know, I literally have like three blog posts, but you know. mostly it's a portfolio site. So I could migrate that over. And then you know, my other dev site, I could potentially make that JAMstack too. I'm just trying to figure out what I want to do. Because I think the dev site is like, combine JAMstack, or like, even my projects, like, do one project three times, like, this is how you can do in vanillaJS. This is how you can do it in ReactJS. This is how you can do it in Vue. So it's, there's different ways you can combine things. But yeah, I have, I think I want to try converting my WordPress site over. Bryan Robinson 19:33 I'll say from from my experience, it was actually pretty easy. And this was even like, I converted mine over about two and a half years ago. And it was not bad and they're better tools now. So like, that's a great way of thinking. Kathleen McMahon 19:45 Yeah, it's like I have a site just convert it over. hardest part is like figuring out the whole portfolio part without redesigning. It's like you wouldn't, "you will not redesign your site. You will just port it over." Bryan Robinson 19:59 As a fellow designer, there's almost no way that happens, you know, it feels good to do it. I don't know, Kathleen McMahon 20:05 It does but maybe I should scaffold first at least. Scaffold first and see how much you can do with Mark-- with MDX though. Because MDX... the way that one of the things I've been really loving about MDX is like how the, the, the team that is working on the spec, what they're doing with it. I mean, the things that you can do, where you can take MDX syntax, and even Mark like Markdown syntax, and you can like swap in certain things with React components. They call it shortcodes now, but you know, if you can swap shortcodes in is magical. And the way that you can — I saw one of the Gatsby employees, Kyle, not, not Kyle Matthews. I think Kyle Gill was tweeting about this last week, and I bookmarked it or like a week and a half ago, and he was showing how he was learning that you could import MDX files, like a Markdown file into a Markdown file. Bryan Robinson 21:08 Right? Yeah. Kathleen McMahon 21:09 Yeah! And it wasn't just like importing a React component, you were importing an MDX file into an MDX file. It's just like, "Whoa!" So you couldn't... you don't have to have necessarily like, you know, this very, very long scroll forever page. You could be, you know, putting them up into smaller chunks. And people can, you know, won't be overwhelmed when, again, making new docs, someone can start editing something, and then they just pop in that file. Bryan Robinson 21:35 And they're done. They're good to go. Yeah, Kathleen McMahon 21:37 Yeah. Yeah. It's amazing! Bryan Robinson 21:38 I also have a friend of mine who has redesigned his personal site like 15 times in the past three years. And his his take this time is he's actually taking the default Gatsby theme, the thing that like comes baked in, and he just started with that cuz he was like, I have to finally get it live. Like I've redone this 15 times I have to make it live. And so he's just incrementally changing that design, changing that like... structure, and he's also that kind of designer first and then has become an engineer since then. So like, we like to do custom stuff and then we never launch it. So... Bryan Robinson 22:11 Incremental builds are nice. Kathleen McMahon 22:13 Yes, they are. You just push it up and it's like, oh, well, it's already up there. Sweet! Bryan Robinson 22:18 I'm Done! Good to go. Cool. So it'd be fair to say that the Gatsby is your jam the JAMstack, we want to go all the way down to like MDX as your jam in the JAMstack? Like what would you consider your main top thing? Kathleen McMahon 22:28 Okay, my main top thing first is MDX and then, and then Gatsby. Okay. Just because MDX I've been like experimented with code blocks and learning... learning from like watching other people do it and like wow, like how much I can like, make a code block better. And I want... I want to — I'm in the middle of trying to make a code block that is... You have... Formidable has a package react-live and like bringing that into code blocks is awesome. And they also have prism-react-renderer, I believe, is another one so you get the syntax highlighting in there. But um I'm working on making a component that will, when you have the block, you could have it editable, but maybe you could — I'm trying to find a way that when you, you know, click on a button, you could see what the rendered code is versus like, just, you know... using ReactDOMServer to show the rendered code. Like, this is the semantic structure that gets rendered under the hood. So you can see what classes get, you know, because that's — a lot of times people want to, they want to either dig into the code base, but you got to click here. It's like, "if I write this, what code will I get under the hood?" But also have that and also have the code block, you know, like, have display of the component, but below it has — and you'll see this often — if you have the code, you know, the code there, but sometimes that code block will get really long. So have that collapsible. But also then people forget, have it keyboard focusable, so you can tab through everything. And if there's a focus trap, make sure you can get out of the focus trap and move forward. So I'm looking to make an accessible code block thing. And once I get it, I will put it somewhere up on NPM and people can use it. Bryan Robinson 23:59 So that is very cool and, yeah accessibility on that sort of thing. People... people don't realize it's not always easy — especially when you want to do like the really nice, usable, fun interface. To make accessible you got to put the work in or... have somebody do an open source package and download it. Which is always a nice thing Kathleen McMahon 24:18 And make it feasible so they can like, override themes but also you know, maybe if there's a way we can when they do the theme go "hey, those color combinations may not pass... if you do it that way." So... Kathleen McMahon 24:31 but start with an accessible you know... Bryan Robinson 24:33 Exactly. Accessible start and then then progressively enhance from there. Kathleen McMahon 24:37 Yes. There's a way like we can add tests for like what has, you know, accessible violations but I think there might be a way that you could look, maybe have some sort of contrast... Because there are these other tools we could have contrast checkers where you can do eyedropper things. Maybe there's a way to do like a... 'cause I know BlocksUI is working on that right now. BlocksUI is working on like when you put text over, you know, something, they'll immediately give you alert like, "hey, this is not following things." Yeah, but this is a component This isn't like a whole like UI, you know, like WYSIWYG system here so it's a little different, but maybe if they do the tests.. if they do the test, you know, that could be a way. Bryan Robinson 25:12 Yes. Cool so so what's your actual musical jam right now? What's... what's in your earphones? What are you listening to regularly? Kathleen McMahon 25:19 So um, when I... when I am well either coding or just in dance mode, I have a thing for Soca and Dancehall. And so I always excited when, I'm always excited on Carnival season comes around. I got first got turned on to it in the 90s with a band called Krosfyah. Krosfyah, which it's k-r-o-s-f-y-a-h. And their song was Pump Me Up and it was just like... once I heard that I was hooked! And then I discovered Lady Saw and Buju Banton and I you know, some other ones that were really great, and like one one that I really liked... but then he wasn't really... nice to the community so I can't like him anymore. But ever since then I've been always following, you know, these different you know, artists and lately it's Machel Montano is my favorite. Bunjai Garlin and Shal Marsh Marshall. So say Shal Marshall right now this is one — that's definitely Boston, Boston accent there — I apologize. Shal Marshall. And one of his songs is Splinters and it is great. And Miachel Montano's — one of them is Brace Up — is one of my favorites lately. The other one is with Calypso Rose. Leave Me Alone. The other one he does and other ones with these. I have a couple of ones that are like the ones called Possessed. With Kerwin Dubois and Machel Montano. He'd likes to do compilations with people and it's just these like, happy and some of them were just like, "I'm focusing, leave me alone" but um, you know, "don't... don't mess with me because I'm you know, I'm partying" and yeah, so that's that's me. It's just happy music. Happy music. Kathleen McMahon 27:15 Yeah. Bryan Robinson 27:15 I like it cool. So is there anything that you'd like to promote and get out to the JAMstack community as a whol? Anything you're working on? Kathleen McMahon 27:20 Um... Well I'm trying to get that um, that code block component out there. I would have, like, promoted the conferences but I'm... they're all being postponed right now. It's like, I'm waiting to hear from a couple of them, because they haven't officially postponed but I think they will. But the other two, like one is Self Conference is postponing for a year. And there you know, I would definitely like, if you can have a chance to get in Detroit, that's one to watch. And the UIArch Conf, which is supposed to be in April, and I was gonna do the Web Accessibility Conference there. That is postponed for now, to November of this year. The other two, three, you know, you haven't heard the postponement date, but I'm assuming. Because otherwise, I wouldn't be able to get back into the country. Which fine, but at the same time, not... Bryan Robinson 28:12 Fine, but not fine. Kathleen McMahon 28:14 But not fine. Bryan Robinson 28:17 Cool. Well, I appreciate you taking the time to talk with us today and keep doing some amazing stuff. I'm really looking forward to that accessible code block, too. Kathleen McMahon 28:24 Wonder... wonderful. And it's, it's an honor to be asked to speak on the topic and to talk about the JAMstack. So... Bryan Robinson 28:34 I want to thank Kathleen again, and thank all the listeners around the world for making the JAMstack community, one of the best developer communities on the web. Be sure to start heart favorite or whatever in your podcast app of choice, and spread the word around for those that haven't yet heard. With that it's sponsor time. And I wanted to talk about TakeShape. TakeShape is a content platform directly designed for the JAMstack. They have a super simple GraphQL API, a static site generator, and a CMS all ready for your use. They're also working on their mesh product, which allows you to mix and match multiple data sources into one easy-to-use API. Definitely worth checking into. Head on over to takeshape.io/thatsmyjamstack for more information. With that, I'll bid you adieu until next week, and implore you to keep making amazing things on the web, and to keep things jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

8 April 2020


Aaron Frost on creating Scully, working too much and the merits of ice fishing

Aaron Frost on creating Scully, working too much and the merits of ice fishing

Quick Show Notes Our Guest: Aaron Frost What he'd like for you to see: HeroDevs doing Extended LTS Support for AngularJS | ScullyJS His JAMstack Jams: Scully His Musical Jam: Lizzo Miley TayTay Freddie DeadMau5 Our sponsor this week: TakeShape Welcome to another jam-packed JAMstack adventure on That’s My JAMstack, the podcast where we ask the fantastical question “What’s your jam in the jamstack?” On today’s episode we have the creator of the Angular JAMstack framework Scully: Aaron Frost. I’m excited to dive into Scully’s creation and find out more. Before we get to the interview, I just want to mention our sponsor this week: Take Shape. Stick around after the episode to find out more about their Content Platform or just head over to takeshape.io/thatsmyjamstack for more information Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

1 April 2020


Eduardo Bouças on dynamic static sites, Staticman, Sourcebit and more

Eduardo Bouças on dynamic static sites, Staticman, Sourcebit and more

Quick show notes Our Guest: Eduardo Bouças What he'd like for you to see: Hear thoughts on Sourcebit and contribute to the project His JAMstack Jams: 11ty | Netlify | Stackbit | NextJS His Musical Jam: Hozier Other Tech mentioned Jekyll Staticman Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

18 March 2020


Bolaji Ayodeji on using the JAMstack before you know about the JAMstack, Gatsby, Hugo and more

Bolaji Ayodeji on using the JAMstack before you know about the JAMstack, Gatsby, Hugo and more

Quick show notes Our Guest: Bolaji Ayodeji What he'd like for you to see: HashNode's DevBlog His JAMstack Jams: Gatsby | NetlifyCMS Our sponsor this week: TakeShape Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

11 March 2020


Todd Libby on 11ty, Gatsby and the tough choice between them

Todd Libby on 11ty, Gatsby and the tough choice between them

Quick show notes Our Guest: Todd Libby What he'd like for you to see: His Twitter (and upcoming community) | His blog | His Cotton Bureau Grid Shirt Eleventy | Gatsby His Musical Jam: His Lo-fi/Chillhop playlist Other Technology Mentioned Jekyll Hugo Netlify Our sponsor this week: TakeShape Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

4 March 2020


Jenn Creighton on Gatsby, SPAs, conference speaking and more

Jenn Creighton on Gatsby, SPAs, conference speaking and more

Quick show notes Our Guest: Jenn Creighton What she'd like for you to see: Her Twitter feed | React Day NYC | Thinkster React Component Course (coming soon) | useReactNYC Her JAMstack Jams: Gatsby | Netlify Her musical Jam: Halsey's You Should Be Sad Our sponsor this week: TakeShape Transcript Bryan Robinson 0:04 Welcome, welcome everyone to a new episode of that's my JAMstack the podcast where we explore the deepest parts of the developer psyche by asking, what's your jam in the JAMstack. On today's episode we're chatting with Jenn Creighton, Jenn is a conference speaker and the organizer of useReact NYC. She's also the front end architect for The Wing. Bryan Robinson 0:23 Also, this week, we have our amazing sponsor TakeShape. Find out more about their JAMstack content platforms stick around after the episode or head over to takeshape.io/thatsmyjamstack. Bryan Robinson 0:36 All right. Well, thanks for joining us on the podcast today, Jenn. Jenn Creighton 0:38 Thank you for having me. Bryan Robinson 0:40 Thanks. So tell us a little bit about yourself. What do you do for work? What do you do for fun, that sort of thing? Jenn Creighton 0:45 Sure. So I am a front end architect at a company called The Wing. We work on building out co working spaces that are really geared towards women. So we're thinking a lot about what women need in those spaces, and also there's a lot of networking events and things like that in our spaces. Jenn Creighton 1:03 So I'm the front end architect there, I lead all of front end. I help ensure our system stays healthy. I work on our technical decisions there. You can already tell I'm a lot of fun because I really love tech. And honestly, like what I do for fun, I'm usually at a conference. I'm usually speaking at a conference, I really, really enjoy giving technical talks. So you will find that I'm often at a conference, I travel a lot to do that. I did 14 conferences last year, which I won't be repeating but it was a lot of fun. I had a good time. And if I'm genuinely not doing any tech related things, I am probably with my cats or my puppy or I am sewing. I really enjoy sewing. Bryan Robinson 1:53 So I saw and I think this is on like your Noti.st profile, is your dog's name really Sailor Moon because that's amazing Jenn Creighton 2:00 Her name IS Sailor Moon. She is named after the you know, Sailor Guardian Sailor Moon and she's a little blonde dachsund and, and I grew up watching Sailor Moon. I loved that show. I would watch it so much. And when I was thinking of names for her, I really want something kind of fun. So I picked out that it's really great too, because when you tell people her name, you can tell if they watch the show or not. Because they're either That is amazing. Or they're Wow, that's a lot of a name. Bryan Robinson 2:35 I'll be honest, do you just call her Sailor Moon all the time. Jenn Creighton 2:39 We usually call her sailor or if she's being a bit sassy Miss moon. Bryan Robinson 2:43 That works that work. And any fun sewing projects that you're working on. Jenn Creighton 2:48 I actually haven't sold in a long time because of the mentioned 14 conferences. So actually did not so I think anything last year. No, that's not true. Wait, I took a sewing class in November as my like, you're gonna do it and I sewed a pair of pants for the first time I took a sewing class to like force myself into a non tech hobby, which is a good thing to do once in a while. Bryan Robinson 3:17 Yeah, especially 14 conferences in 12 months. How many how many months were filled with more than two conferences? Did you did you group together and how exhausting was that? Jenn Creighton 3:28 Some months were grouped together. Um, let's see, I think I know at least I did, in September, I did two. And I traveled really far for them. So I did JS Conf Korea, and Components Comf in Australia together. And I think I had some some weeks and breaks there but a couple of them were like, in the same month and so I would knock out like two or three in the same month and then have like a little bit of a break which usually Wasn't a break. Like between Components Conf and React Conf. I actually had to write my React Conf talk. Bryan Robinson 4:09 The glamour of being a conference speaker! Jenn Creighton 4:11 It's so not glamorous, it's so exhausting. And yet, we can like people who enjoy it can't stop doing it. I don't know if you remember this, but there was a survey that came out many many years ago that said that people are more afraid of public speaking than they are of death. And so conference speaking is actually like a near death experience. As you get like this ridiculous rush, you're terrified you feel great afterwards. You're like, I'll just do it again. Bryan Robinson 4:44 I just watched the the Imagineering story the the story of all like the Disney theme park building and all that. And it talks about all the all the rides and how the goal is to make people feel like they're about to die without getting them actually all the way to death. So it's the same basic principle just with public speaking. Jenn Creighton 5:01 I think that happens with code too, Like, I just spent two days solving this issue of my tests failing on circle ci when they weren't failing locally. And I wanted to die. I want to lay down and die. I was like, take me, Lord, now and then I figured it out. I felt great. Bryan Robinson 5:20 So this is a JAMstack podcast, let's talk about the JAMstack a little bit. What's been kind of your introduction into that world or into static sites or wherever you kind of came to it from? Jenn Creighton 5:30 I think with static sites, the first time I remember seeing like a static site generator was Jekyll. And this was back at a startup many, many years ago. I remember we used it for I believe our marketing site, which was like pretty typical. And I really didn't know that there would be static site generators. It was kind of surprising to me. But I also didn't really play with it because I was just trying to learn JavaScript. I was like, this is where I'm like, trying to figure things out. The actual JAMstack, you know, JavaScript API's and markup, my introduction to that has come a lot later than I think a lot of people I actually just started, I'd say late last year getting interested in the concept and starting to learn about it. We use it at work for our marketing website. And then personally, we've used it for a meetup that I run here in New York called useReactNYC. Bryan Robinson 6:28 What's sort of technology stack are you messing with right now? Jenn Creighton 6:32 So both of them are using Gatsby, but the marketing site is Gatsby plus Contentful. So that of course, our marketing people can make their own changes to the site, and we don't have to be, you know, nudged. "Hey Can you do a thing?" Bryan Robinson 6:48 "Please deploy, please, deploy!" Jenn Creighton 6:49 "Please make this change." So it gives them the freedom to do that without having to wait on us to make changes. It gives us the freedom not to think about the marketing site, very much. Then for useReactNYC, we wanted to create a website for the meetup so that people could learn more about us what we're about, and also join our community, both by attending the meetups, but also by joining our slack community, and also by helping us to build the site. And since we're a React meetup, it made a lot of sense that this would be a static site, and that we would make it with Gatsby. Bryan Robinson 7:27 Very nice. And any sort of ... Is there any sort of like API integration? Are you pulling in like meetup information from a third party? Or is it all just manual entry into into Gatsby? Jenn Creighton 7:37 Right now let's just manual entry. We definitely want to expand it at some point. We're just not sure that we have the time right now between the five organizers that there are, we actually took on another organizer this year to make five of us Yuraima joined us and we have just all been really stretched thin. So even with the fifth organizer, we're still like "huuu", but we're hopefully gonna start recording the meetup soon and hopefully we'll also host them there so that people can view the content. Bryan Robinson 8:08 Pretty cool. I definitely understand that. That meetup organizer life where you're like, hey, PRs are accepted, and then no one submits a PR. Jenn Creighton 8:16 Yeah, we did have a particular member of the community, Nick, who came in and helped us really do a lot of work on the site, when we were all stretched very thin. And my very good friend Melissa, helped us actually by creating the design of the site, and it's really beautiful. She did a wonderful job. She also designed our stickers. So really, like all community events, it is really like we wouldn't have done it without the community like helping us out. That's was important. Bryan Robinson 8:45 Cool. So uh, are you You said that the marketing site at The Wing is currently built on Gatsby. What other sorts of projects do you work on at The Wing other than obviously getting the word out about these kind of co-working spaces? Jenn Creighton 8:58 So what what I personally work on is that I work on our single page application. So Gatsby is for our marketing site. But we do have a single page application that is for our members. That's our members portal as well as an admin site for us to handle things like applications or members, information, adjusting settings for them, so on and so forth. But our members portal is where everything really happens for them, they're allowed to find other people in the community and chat with them. There are job postings on the site as well. And there are a lot of events at The Wing that are very specific to what our members want to hear and see. And so they can RSVP for those as well on the site, as well as just the general thing of like adjusting settings or registering guests. So I work on all of that and as we try to build out new features that are going to help our members connect more and forum like real in life connections are putting a lot of those in this single page application. Bryan Robinson 10:01 Very cool. And so just like -- I have a degree in philosophy, so I have to sometimes dive into philosophy on the podcast -- So where would you kind of consider kind of breakpoint, because you said, you know, I'm using the JAMstack for the marketing site. And for the meetup site, I've always kind of thought of any SPA as having JAMstack asked qualities. Where do you kind of draw that line? Like, what what's JAMstack versus non JAMstack for you. Jenn Creighton 10:28 So the reason that I qualified as a single page application instead of anything to do with the JAMstack, is because it's built using create react app. And so it actually has a server. So nothing's actually served by CDN, which I think is an important component of JAMstack sites, you know, they have to be served statically through CDN or some means of static. So they're not pre rendered. They're not static. It's it's an actual serving of just an index.html, and then we fill in the JavaScript for everything. Bryan Robinson 10:59 I gotcha. Cool. That's the the kind of fun thing about running this podcast is that I hear lots of opinions. And they literally run the full gamut of like, everything's the JAMstack to like, even smaller like subsets. And it's just yeah, it's awesome. Jenn Creighton 11:15 Yeah, I mean, and when you hear like that it's JavaScript API's and markup, you're like, well, how is this not every single page application? And that totally makes sense. Definitely. I think the JAMstack has some really specific qualities to it, though, that are very different from something built with like create react app that actually does have a server that you're not actually serving at statically. And you're relying on the JavaScript to do all the heavy lifting of creating all the page. It's not pre rendered. You know, we certainly don't have the ability for... One of the things I really like about the JAMstack is that it closes that gap for the user, right like they get the stuff immediately. And also how your deploys go. You know, you can roll them back and there get based. But you don't have that with the single page application. And sometimes I was wondering with that I was like, does this need to be anyway, I was like, but I'm not rewriting the whole thing. And that decision was made before I came into the company. And I was like, You know what, it's, it's fine. Bryan Robinson 12:22 And still React. So you still get to work on react. Jenn Creighton 12:25 Yeah, and I love I love react. So that like, is a joy for me. Bryan Robinson 12:29 And so is there anything that you've that you've been learning based on your work in Gatsby that you're bringing back into the the server side and the Create React App side of all that Jenn Creighton 12:41 Not specifically? I think Gatsby comes with a lot of wonderful things that are not even technically part of JAMstack, right. Like I would say I would say that there is a great amount of focus on accessibility and Gatsby I really, really appreciate that. And that is something we're really focused on at work. So like many startups, so our product team is really new at the way. And like many startups, the first version of our product was built externally by a third party. And so we're now as a product team, picking it up and sort of changing the architecture and making it more of a long term scalable application. And that includes taking a look at our accessibility and realizing that we're really far off the mark right now. And we need to do something about that. I really appreciate that Gatsby, in addition to using JAMstack is actually really like moving forward with accessibility and giving you a lot of information about that along the way. Bryan Robinson 13:46 Yeah. And the great thing for me is that there's so many people jumping on Gatsby right now, just in terms of like, it is like probably one of the hotness is in the JAMstack right now. And to have that their focus so that people who might not have learned about accessibility in the are getting those tips and tricks just by having that in their code base by default. I think that's amazing. Jenn Creighton 14:05 Yeah, exactly. And that's one of the things I really enjoy about that project. And that's one of the things like, as you're working on that, you get to learn that you can bring that to all your future projects. It's not specific to the JAMstack. It is all about the web. Bryan Robinson 14:19 Best platform there is... the web. Jenn Creighton 14:21 Yes. Bryan Robinson 14:22 Cool. So So would it be fair to say that in the JAMstack, the Gatsby is your jam? Are there any other technologies that you're really interested in right now? Jenn Creighton 14:30 I think Gatsby is the main one. Obviously, we're really enjoying also Netlify and being able to like push things out really easy. So we use Netlify also for our preview links at work which is really great. So just definitely enjoying that. But yeah, I think definitely Gatsby considering that I've used it at work and now in this useReactNYC project. Bryan Robinson 14:54 Nice and so work when when people are saving into contentful, are y'all deploying Preview deploys to send them links at same time. So like they can see it live on the site before they publish it. Jenn Creighton 15:06 I think so. Yeah. I forget because I haven't worked with it in a hot second and if anyone's changed behind my back, but yeah. Bryan Robinson 15:14 You never know. Jenn Creighton 15:15 Honestly, with a startup you never know. Bryan Robinson 15:18 It's so easy to deploy, right? Jenn Creighton 15:20 Things happen in a startup that I'm like, wait a minute, you're doing what now? Can we just Can we just grab five really quickly and make sure this is a good idea? All the time. Bryan Robinson 15:30 Okay, gotta move fast, right? Jenn Creighton 15:32 Yes. Move fast break. Things. Break. ... Both of us are like "arrrrgh no!" Bryan Robinson 15:39 Yeah. Don't Don't tell QA that you broke it. It's fine. Jenn Creighton 15:44 Yeah. Bryan Robinson 15:46 Cool. So let's, let's talk about actual musical jams. Then what are you listening to right now? It's in your headphones. What's going on there? Jenn Creighton 15:53 So my number one thing right now is Halsey. Which is strange. I didn't listen to her before, but I actually so I'm a big fan of Saturday Night Live. I love Saturday Night Live. And she hosted not that long ago. And she was the host and the musical guests. And I wasn't familiar really with her music, but she had this song on there, You Should Be Sad. And I just fell in love with it. So I've actually been playing that on repeat for like a while. I love her vocals on it. It like just makes me feel really good. Bryan Robinson 16:28 Yeah, so specifically that song but then kind of the whole, her whole artistry. Jenn Creighton 16:34 I let I let that song play and then I'll listen to like a lot of the other ones on the album and I'm finding that I really enjoy her songs, which is really great. Jenn Creighton 16:44 And just depends on what mood I'm in. Bryan Robinson 16:47 What other moods strike you for, for other musical tastes. Jenn Creighton 16:51 And sometimes we like to go old school like country. Little little like kind of plucky banjo sound You know, really enjoy that sometimes. So I went through an Iggy Azalea phase. That was an interesting period of my life. Bryan Robinson 17:10 I think we've all been through that sort of phase. We've all been there. Jenn Creighton 17:14 Sometimes my my discover weekly on Spotify, I think is consistently confused. It's like, remember when you were sad? Well, here's all the sad songs and I'm like, oh, but Spotify. I'm not sad anymore. It's like, Okay. Here's poppy feminist music. I'm like, no, we're not in that mood. We're angry, now. Where's the angry? It's like, I cannot help you, I'm sorry. Sorry, Spotify. Bryan Robinson 17:39 The algorithm can only do so much for you. Cool. So is there anything that you would like to promote something you're doing something you want get out to the JAMstack community? Jenn Creighton 17:47 Well, first of all, if they're interested, they can follow me on Twitter. My handle is gurlcode girl with a "u". I'm also going to be speaking here in New York at React Day New York. Later in September, I'm going to be speaking about some things I have learned going from React to React Native, which is a whole new world for me. And then I'm also developing a course on React component architecture. That's my, my favorite sort of subject. I'm developing it for Thinkster. So that should be coming out, I think in a few months, if I have enough time to do all the recordings Bryan Robinson 18:24 Very cool. And also, I haven't watched it yet, but I'm super excited now that I've seen it to go watch your the "What happens next", the choose your own adventure with iterators. Like, I have to go watch that I saw that topic. I said, Okay, carving out the time for that one. Jenn Creighton 18:39 I love iterators I love them so much. They're wild. They're in so many things that we use in JavaScript, and we have no clue. And that's what that talk is about. And also it's like ridiculous and silly. You're on like an alien planet solving a mystery. And I had this artists do this beautiful work for it. So it's ridiculous, but yeah, Bryan Robinson 19:00 Ridiculous is the best way to go. Jenn Creighton 19:03 Yeah, it's like funny and weird. I enjoy it. Bryan Robinson 19:06 Well, I appreciate you taking the time to talk with us. And we'll be sure to link all those, all those amazing things that you're doing up in the show notes. And yeah, thanks for taking the time. Jenn Creighton 19:14 Thank you for having me really enjoyed it. Bryan Robinson 19:16 And as always, thank you to the amazing JAMstack community, your continued support via shares, likes favorites, and all those mechanisms is so incredible that I literally just don't have the words to deal with it. Bryan Robinson 19:29 With that it's sponsored time, and we're talking about the amazing content platform take shape. This week, I want to mention their amazing GraphQL API. It's not an afterthought, but a fully realized part of their platform. It means that whether you use their CMS or another platform entirely, you have an incredibly easy access to all your data in one simple API call. Do you want to see what that's like? Head on over to takeshape.io/that'smyjamstack to sign up. And with that, I'll take my leave of your ears. So until next week, Keep doing amazing things on the web and keep things Jammy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

26 February 2020


Denis Kostrzewa on JAMstack-first agencies, finding your stack, talking with clients and more

Denis Kostrzewa on JAMstack-first agencies, finding your stack, talking with clients and more

Quick show notes Our Guest: Denis Kostrzewa What he'd like for you to see: The Bejamas blog and Twitter His JAMstack Jams: Gatsby | NextJS His Musical Jam: Maceo Plex, Mind Against, Apparat, GusGus Our sponsor this week: TakeShape Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

19 February 2020


Colby Fayock On Mapping (like… the world), Gatsby, science and more

Colby Fayock On Mapping (like… the world), Gatsby, science and more

Quick show notes Our Guest: Colby Fayock What he'd like for you to see: His blog posts His work to help JAMstackers use Leaflet: His Gatsby Leaflet starter Getting started with Leaflet Santa tracker with leaflet NASA GIBS for map imagery His JAMstack Jams: Gatsby | Netlify His Musical Jam: Patterns - Dangerous Intentions Our sponsor this week: TakeShape Transcript Bryan Robinson 0:02 Welcome everyone to another episode of That's My JAMstack the podcast where we explore the inner psyche of JAMstackers everywhere asking the simple question, what's your jam in the JAMstack. On today's episode, we talked to Colby Fayock, a senior front end engineer with element 84. But before we dive into the interview, let me shout out to our sponsor take shape. Stick around after the episode to learn more about their content platform or head on over to take shape.io slash That's My JAMstack for more information. Bryan Robinson 0:31 Colby thanks for being on the show today. Colby Fayock 0:33 Thanks for having me. Bryan Robinson 0:33 Alright, so let's let's start out tell us a little bit about yourself about what you do for work, what you do for fun, that sort of thing. Colby Fayock 0:39 Sure. So I'm a senior front end engineer and UX designer at Element84. For a little bit about us, we focused on bringing remote sensing and Life Sciences data to the cloud. So that's usually like satellite data and health data. But once that's in the cloud, that's kind of where I stepped in and put you eyes in front of that. So some things that I'm working on right now are a dashboard. Colby Fayock 0:59 For testing a commercial satellite, and we're also working on a mapping interface for helping first responders tackle natural disasters like Wow, so like a big use case for that was working with people who were actually in it for the campfire California wildfires. Bryan Robinson 1:16 Oh, wow. Very cool. So I curiosity. You're building interfaces? Do you consider yourself more on the design side or more on the developer side, even though you're working in code, obviously. Colby Fayock 1:27 Yeah, so I definitely am more on the front end engineering side. It's kind of funny because I started off more on the design side, but as I kind of learned and learn, I've just slowly moved the needle to the engineering side. But that said, I still thoroughly enjoy both aspects of it. And usually I'm still the one doing the wires and such on the projects that we're working on. Bryan Robinson 1:48 Cool. Now, what do you do in your in your free time outside of work? Colby Fayock 1:51 So a lot of the times when we when we can figure it out, I like to travel with my wife. We just got back from a trip to Southeast Asia, which was pretty cool. Colby Fayock 2:00 But aside from that, you know, I, I do really enjoy coding, but probably spent too much time watching TV movies. And lately, I've been trying to push myself to write more. So I've been putting a lot of articles up on Free Code Camp. And that actually inspired me from a co worker who kind of gave me the idea that, you know, there's a lot of ways to look at different articles, right, rather than I kind of had that imposter syndrome. But I'm able to get past that. And it's been successful. So far, Bryan Robinson 2:27 I'm a firm believer that anyone who's writing code can benefit from their own blog in the future. Like if you're if you're writing and you saw the problem, write about it, and then you Google it down the road, and you'll be the response. Colby Fayock 2:39 Right, exactly. That's a good book kind of way to bookmark your solutions. Exactly. Bryan Robinson 2:43 And so what's the what's the best place you've traveled or your favorite place to go when you're traveling? Colby Fayock 2:49 You know, Southeast Asia was probably my craziest experience. And I say crazy just because it was so different from anything I've ever been to. But I've been to Brazil cuz my wife is Brazilian and Colby Fayock 3:00 I really enjoy Brazil, the people, they're just so awesome. The food is amazing. Bryan Robinson 3:04 So that's probably one of my favorite places. Go and what's the what's the best Brazilian dish? Colby Fayock 3:10 Oh, man. Well, Brazilian barbecue for sure. Cuz I don't know if you've ever been to one of the Brazilian steak houses in the United States, but it's just incredible. Bryan Robinson 3:19 Nice. Very cool. So let's talk about the JAMstack a little bit. Obviously, that's what this podcast is all about. What was your entry point into this philosophy of the JAMstack or maybe static sites or wherever you want to call it? Colby Fayock 3:30 So it's kind of funny because I listened to a couple of the other podcasts and a lot of people seem to be getting into development from the old MySpace days. So when I was in high school, I would do the I would hack over divs on top of the profile, people saw me doing that and I actually made a little bit of a side hustle out of it, redesigning some people's profiles, but from there, you know, just creating Counter Strike Team pages for the teams I was on. Colby Fayock 3:53 But more on the professional side, you know, down the road. I worked at a an e commerce company called thinkgeek was a geeky niche products Bryan Robinson 4:03 I've bought from thinkgeek in the past. Colby Fayock 4:05 Well, since then, they were bought out by GameStop. But we don't need to get into that. But it was interesting because they weren't a JAMstack site. But we were trying to cash the front, the front end so heavily, where it was just being served statically from fastly. But we redesigned the checkout and basically use the jam site principles of reaching out to their API's and stuff to build that. But it was definitely at the time, since it was still kind of a relatively newer idea for an architecture. It was rough to try to get the convinced that our engineers to support the API's to that fashion because it's traditionally a pearl house. So building out the that's how the pages were typically rendered. Yeah. Bryan Robinson 4:44 And modernizing that stack would have been quite fun. Colby Fayock 4:47 Yeah, yeah. Bryan Robinson 4:49 So kind of so so from there. What what are you currently working and what are your favorite jams, tech technologies or philosophies? What are you using professionally and personally that sort of thing. Colby Fayock 5:01 Yeah. So, personally, when I'm bootstrapping sites, I usually just default to Gatsby. And that if I just because it's, it's so easy, you know, static sites are just much easier to manage from a resource perspective, in my opinion. And, you know, it's super cheap and other buzzwords, like infinitely scalable. But as a primary engineer, you know, I don't need to worry about figuring out the server side server side of things. So I just kind of dumped my static assets. I still have like two WordPress clients, but I've since moved them to lightsail, which has made it a little bit easier since it's more managed on the AWS side. And I joke about the buzzwords part of it, but really, that's compelling for from a customer perspective, right? Because being able to use those phrases like infinitely scalable, secure and cheap is just so valuable, Bryan Robinson 5:46 Especially on like, I'm bigger clients where they're like, worried what if I get a traffic spike? Is the server going to go down? Colby Fayock 5:53 Exactly, and it's a realistic scenario. And even if you have the most complex caching system, things can go wrong. So That's what, that's a big thing of what attracts me to it. But with Element 84, you know, it switches a little bit where we got most of it into s3 instead of using something like natla phi, but we're big AWS house. So JAMstack sites, kind of pulling those five fundamental pillars for AWS, which is like for good software architecture. So it makes it really easy to kind of push that Bryan Robinson 6:24 Hit me with the the five pillars for AWS, I'm not actually great with AWS. Colby Fayock 6:29 So I wrote this down because I had a feeling you would ask me. Operational Excellence security, which is a big one, real reliability, performance and cost optimization. So pretty much exactly. It takes the ticks the boxes of every single one of those. Yep. Bryan Robinson 6:45 Very cool. And so what are y'all doing other than obviously, if you're on AWS, you're pretty much jam packed at that point. How is element a for utilizing this kind of separation and how are you doing like mapping and stuff like that in a JAMstack world so interesting. Colby Fayock 7:00 Maps kind of inherently fit into the whole static site idea. We use a library called leaflet which it attaches itself to a static element inside the DOM. So imagine just a div kind of like you would with a react app, right. Colby Fayock 7:14 And it just kind of plays from there pulling in the API's for things like matte tiles, and any kind of data you want to visualize on the map. But really, we can build out these applications completely static and pull all those API's and stuff around on the client, just like a, you know, normal JAMstack app. Colby Fayock 7:31 But it's, it's made it easy to kind of fit it in there. And it's tough with leaflet sometimes because it relies on the window. So if you're kind of building it within a react application, you kind of have to get some past some of those challenges like particularly Gatsby. When you compile, it runs the code, right? So the window is not available. The leaflet library assumes it is and you can run into competition areas with that. So it has its challenges, but it's it's interesting, and it's provided some really powerful stuff. Yeah. Bryan Robinson 8:00 And we were actually just talking on last week's episode about replacing create react app with Gatsby and how like one of the big hiccups is there's no window and Gatsby. Colby Fayock 8:09 Yeah, it's it's a real problem. And they provide a solution where you kind of set I I don't know what's actually happening, but you set the loaders to know in the in the web pack configuration that resolves it. Colby Fayock 8:22 But of course, then you don't actually get the library for any kind of compilation but since it is just a client side only library it's it's okay for that particular piece. Bryan Robinson 8:32 Very cool. So let's let's talk about what is what is your actual jam and the JAMstack? What's going to keep you coming back JAMstack year after year? Going into the future? Colby Fayock 8:41 Yeah. So I think generally the amount of options that are coming up to just quickly spin things up like I kind of mentioned Gatsby Netlify I'm pretty sold on that combo right now, just because it's made my life so much easier to spin things up where both me and the 14 like we can focus on the things that are different, right? Like we don't have to spend our time bootstrapping the app, creating a custom web pack configuration and all that. So it really makes it lets us focus on things that are different. I advocate a lot for Netlify simply because of those kind of things. Colby Fayock 9:13 I think being able to play those tooling pieces heavily, just gives us a lot of power to push things forward. Bryan Robinson 9:21 Nice. And where do you kind of fall on, like static rendering on the server versus dynamic stuff, obviously doing mapping stuff, you're doing more stuff in the client? is there is there any way to offload that before built like during the build that you can kind of have the map in place before the client takes over? Colby Fayock 9:37 Not from my experience, mostly because of the window issues. But I haven't looked too much into that aspect of it just because the library so heavily rely on the window and the DOM. Colby Fayock 9:49 But that said, like, just generally with rendering on the server versus pre compiling, I like pre compiling because it you're doing as much work as you can before that server hits, so Colby Fayock 10:00 Anything you can do before the actual server request or, you know, serving them. statically is just ideal, in my opinion, talk about buzzwords. Bryan Robinson 10:09 And the five pillars performance is a big deal there. Colby Fayock 10:12 Exactly. I mean, just getting that first paint, you know, trying to avoid any kind of server processing before it hits the person in the browser is important. Bryan Robinson 10:20 Definitely. Uh, so so you're using leaflet for mapping, Gatsby and a lot of your prototyping anything else you're kind of exploring right now. Colby Fayock 10:30 Nothing too heavily. We're building a component library based off of the leaflet of just trying to make things a little bit easier for people to interface with it because of some of the problems I mentioned. We're hoping to eventually open source that but you know, the whole, building something and open sourcing is isn't always as straightforward as you might want it to be. Colby Fayock 10:50 But hooking the maps into other kind of data technologies, such as one particular pieces STACK API, which is already Bryan Robinson 10:59 I wrote this down because I wouldn't remember the acronym, its spatial temporal asset catalog. So it's essentially Yes, it's essentially collecting metadata and the imagery along with the satellite imagery and provide it providing in a way that you can actually search on it. So being able to pull up those results, make dynamic searches on those maps is important to be able to help provide these people, like scientists ability to actually look at the data, right? So using tools like that helps us a lot Bryan Robinson 11:25 Cool. And I imagine like when you're talking about scientists, and we're talking about climate stuff, and we're talking about all these like, heavy big sets of data, like how do you how do you deal with that large of a scope in a modular kind of tinier way? Colby Fayock 11:42 Yeah, so probably our bread and butter with Element 84 is the data processing aspect of it. So that's a completely different component in built in our kind of architecture, where we have our data pipeline that pulls in and processes the data. Then we have a back end team which might be the same people that builds, like one particular instances, Elasticsearch, right putting that in front of the the main metadata repository. At which point for me, it's really just a bunch of API's that I'm able to search on. So coming from a UI perspective, I don't have to worry as much about those complexities. But it is interesting to see the pipeline of data coming through which we rely pretty heavily on Native AWS for goals. Bryan Robinson 12:24 So yeah, you're basically getting the Create your own like Big Data API set that you then just can go go home with and keep working on stuff. Colby Fayock 12:33 Exactly. Exactly. Bryan Robinson 12:34 Very cool. So let's, let's talk, let's talk music. What is your actual jam right now? What's your favorite song or musician? Are you jamming out to? Colby Fayock 12:43 Sure. So I am a huge blink 182 fan from the early days, so I'm still enjoying a lot of their music that they're putting out maybe not as much as some of the earlier stuff but a co workers would probably give me a hard time for saying this, but I still frequently jam out. So come and get it by Selena Gomez. Colby Fayock 12:57 But on a serious note, A shout out to probably my favorite album. It's an older one called dangerous intentions from a group called patterns has like a really cool retro vibe to it that I really enjoy Bryan Robinson 13:10 Retro like 80s vibe? Colby Fayock 13:12 I Yeah, I think so. Okay. Bryan Robinson 13:15 Retro could be like 65. And that'd be cool, too. Colby Fayock 13:17 That's true. That's true. And at this point, probably 90s, right? Bryan Robinson 13:20 Unfortunately, had a lot. I don't want to talk about it. feel weird inside. Colby Fayock 13:26 Cool. So is there anything that you would like to promote to the tech community something you're doing or more in general? Colby Fayock 13:31 Yeah, generally I'm writing trying to write a lot. So checking out some of the articles I'm writing but you know, I'm, I feel really strongly about maps and being able to give a lot of power to people with the tools in their hand, right, so scientists and such. So to try and help get things started I created Gatsby starter just gets me started for leaflet. It's pretty much called, which is up on my GitHub. I can also post a link doesn't come with a ton of features yet, but it really allows people to easily spin up mapping application. And the biggest takeaway that I'm trying to push, and it's kind of like Chef Gusto, from Ratatouille where he says anyone could cook, I like to believe that anybody can create a map, right. So just being able to have people easily be able to spin up an app, it might put more power in somebody's hands that they didn't really have before. over the holidays I created based off of that starter, I created a Santa Tracker, which people had a good time with, it was cool being able to see some of my co workers spend time with their kids actually walking through the same santa tracker. so just be able to do fun things like that is powerful, and shows what you can do. Bryan Robinson 14:35 And you completely destroyed my follow up question was just gonna be like, how do I get started in mapping, but so we'll, we'll throw it out that that that Gatsby started for the mapping. Is there any sort of like big hurdles to getting into leaflet or if you've got that starter? You can just kind of go to town with it. Colby Fayock 14:52 Yeah, I mean, once you get that, sorry, spun up. I have an example in there that it really just kind of zooms in on your current location if you allow it. Otherwise, I think it's D.C. Which is the area that I'm from. Colby Fayock 15:04 But be able to take that example and apply it with leafless documentation, I think is probably the biggest bet there. And I'm hoping to do more writing on more complex leaflet applications. But generally, I think that's a good starting place. Bryan Robinson 15:18 Cool and I curiosity, you might not have an answer to it. Where, where could somebody go to find maybe some data sets that they could play with, especially around some of these more scientific topics with mapping? Are there any open data sets that they can explore? Colby Fayock 15:31 Yeah, so NASA, actually, I, at least through their Gibbs program, and I know some of their other programs, they make a ton of data openly available for anybody. So kind of just searching on that is a good way to get your just kind of get rolling in it. I know. There's also some other teams like blanking on the name. They provide some open data for disaster scenarios, which is powerful because they enable people to do things that will help others actually work with some of these disaster scenarios, which is some of the data that we use with the disaster relief efforts we're working on. Bryan Robinson 16:10 Very cool. All right. Well, I appreciate you taking the time and talk with us today. And I'm actually very, very interested to go dive into that Gatsby repo. I want to check that out. Colby Fayock 16:18 Yeah. Awesome. Let me know how it goes. Bryan Robinson 16:21 Thanks and keep doing amazing things. Awesome. Thank you. Bryan Robinson 16:26 Thanks again to Colby for being on the show. And thanks again to you dear listeners for tuning in Week after week, be sure to leichhardt star or what have you in your podcast app of choice. And now it's sponsored time coming back this week is take shape. take shape is a content platform for the JAMstack. They've got a headless CMS, a static site generator and awesome graph. qL API is super simple to get started and to work with and if you're interested, you should head on over to take shape.io slash That's My JAMstack to sign up. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

12 February 2020


Khaled Garbaya on Gatsby, Create React App, modularity and more

Khaled Garbaya on Gatsby, Create React App, modularity and more

Quick show notes Our Guest: Khaled Garbaya | On Twitter: @khaled_garbaya What he'd like for you to see: Moving from create-react-app to Gatsby Course | JAMstack newsletter | Live streaming His JAMstack Jams: Gatsby | Netlify | Contentful His Musical Jam: Eminem's Latest album Our sponsor this week: TakeShape Transcript Bryan Robinson 0:01 Hello everyone and welcome to another episode of That's My JAMstack the podcast where we asked the pressing question, "What is your jam in the JAMstack?" I'm your host, Bryan Robinson. And this week I'm excited to have on the show the amazing Khaled Garbaya. Khaled is an engineering manager at Contentful and runs an amazing JAMstack newsletter. Bryan Robinson 0:20 We're also welcoming back this week TakeShape as our sponsor, stick around after the episode to find out more about their content platform or head over to takeshape.io/thatsmyjamstack for more information. Bryan Robinson 0:34 Thanks for being on the show today, Khaled. Khaled Garbaya 0:35 Hey, thanks for having me. Bryan Robinson 0:38 So tell us a little about yourself. What do you do for work? What do you do for fun, all that stuff. Khaled Garbaya 0:43 So my name is Khaled. I'm originally from Tunisia, which is like a small country in the North Africa. And it's been I've been living in Berlin for over six years now. I am an engineering manager at Contentful And I love learning and building and public. And I also traveled for food. So that's that's usually my life. Yeah, that's, that's basically me. Khaled Garbaya 1:17 I started, I don't know if this is relevant or some people might not even remember the days of Flash. So I started as a Flash developer and moved my way there to like gaming and then now it's more like web and servers and now people debugging people instead of code, which is also a lot of fun. Yeah, and I do also like some live streaming, and I teach some web development related and JAMstack related topics over on Egghead or YouTube or I also do some streaming in Twitch so I'm all over the place. Bryan Robinson 1:57 Cool. Make sure you give me those links. I'll pop them in the show notes. You say you, you travel for food? So how much are you traveling and maybe what's your What's your favorite country or city for food? Khaled Garbaya 2:10 I mean, my favorite city is definitely Italy so far. I mean, not city but like an entire country. Yeah, my, the best city like I go there every year. We must go there at least for a week. It's Sardinia it's like a small island in Italy by the beach, and there's some great food and I want to be like always, like relax. So that's my style of vacation. I'm no hiker, or I do sometimes, but I'm just I'm lazy. I don't want to do a lot of activities. Bryan Robinson 2:45 I can definitely get that I spent a week in Italy and did way too much and would rather just relax on the beach. Khaled Garbaya 2:53 Yeah, so I visited few cities hunting for food. Napoli also I went to the Holy Land of pizza. Rome is kind of an open museum. It's an amazing country to music also my country's full of food. So it's a nice to always visit family and have some food. Whereas I went to the US few, like two times, but just San Francisco. I don't know. I mean, usually, it maybe it's not the US. Bryan Robinson 3:25 Sure. Khaled Garbaya 3:26 And yeah, traveling through Europe because it's, I mean, Europe here is like, very accessible and easy to go through. It's not like 10 hours flight. I think the furthest country was Japan. Last year, it was like magical. Bryan Robinson 3:44 Very cool, whole, whole whole different kind of plane existence in a lot of ways. Bryan Robinson 3:49 Cool. So So let's talk about the JAMstack a little bit. So what was your kind of your entry point into this philosophy, whether that's JAMstack itself nowadays or static sites? Where did you start in this Khaled Garbaya 4:00 Yeah, so I had a blog and WordPress. I mean, this is sounds like you will hear the story a lot. When I didn't have time to, like, maintain it. There was a lot of bots, hosting a lot of files on my website. And it wasn't just like, I mean, I'm getting like 100 views a month on this blog post, why why do I bother even maintaining this stuff? And also open source like, I think the when, when JAMstack started rising like two, three years ago, I got involved a lot on open source, mainly with the Gatsby. So I was I did some pull requests to help the integration with Contentful to be like a little bit faster. And then I like fixed few stuff here and there. And they were like the Gatsby team was amazing and friendly. And my wife decided to build a food blog. So I was like, Yeah, okay, I was trying to save my marriage basically. Yeah, so I built her that blog and I kind of like geek out about it I use it like as a test space to try all of these stuff and then yeah, if I'm like very powerful low maintenance and also like low costs so I went all in in there and and started to explore it more and how to go beyond the static site basically. That's more what my god what like where my curiosity went. And yeah, since then, I'm a big fan of the JAMstack. Bryan Robinson 5:42 So So obviously, if you're at Contentful, JAMstack kind of a professional thing, too. But like, yeah, how we're using it there. How are you using it maybe beyond that food blog, or even what's kind of the stack for that food blog and you're in your hat personal endeavors? Khaled Garbaya 5:57 Yeah. So In Contentful, first I joined as a software engineer, mostly maintaining the SDK, and a lot of tooling, and most of it was open source. So it was like, oh, amazing, it can be like, I can get paid and then work on open source. And from there, like the involvement of Contentful, and the integration isn't all of these stacks started to appear to help here and there and the direct people, and so on. And to talk about like, usually my stack would be Gatsby. Because I know there's like many other options over there. But that's why I got used to and kinda like my comfort zone now and I know it very well. So that's what I start with. Netlify for hosting. I used to host stuff over at S3 and cloud like cloudfront. Khaled Garbaya 6:56 But then once I learned all of that, I was like, Okay, now let's Move to something easy Yeah, I use algolia for search. That's also really nice Netlify some several as functions I recently also use the Identity Service by Netlify. There's also like some other options like Auth0 which is really great and I think it generous. They give you a generous free offer for like users and so on but I don't have like that many users so I went with Netlify like a thousand I think it's more than enough for me and because it integrates well with like the whole hosting service and they can do a lot of powerful configurations through Netlify it made it made more sense. What else? Yeah, I'm I can't remember something But I'm definitely going to use a lot more API's Bryan Robinson 8:04 Definitely. And so that's a lot of technologies. What would you say is kind of like your one jam in the jam stack? What's that technology that you're always going back to the Gatsby? Khaled Garbaya 8:13 Yeah, I think it's it's it's Gatsby and Netlify these are like the my Gatsby, Netlify and then Contentful because I can also like bootstrap my content really quickly. And I can give it to someone that they are not technical and can they can write stuff in there. And I also like geek about like, this content modeling in general, because it's like it's a big topic. And me so I that's like the my top three stack always because you need them most of the time, you will need content. So I'd rather give it to someone who knows well about content and they like they have a platform for that already. Bryan Robinson 8:54 Sure. They like the contents that they type in some stuff. They click Save, and they're good to go. Cool. So you just wrote an article at the beginning of this year right on Gatsby as a as a replacement for Create React App. Yeah. So let's talk about that a little, because I'm interested in that. Khaled Garbaya 9:10 Yeah. So I like like I told you, I was curious overall in the JAMstack, how to go beyond, like a normal use case, like a blog or a marketing website, and so on. Because I think it's over. It's like, very powerful. It's, you can do more than that. And with Gatsby, which a lot of people they get wrong is like, yeah, it's another static site generators. But it's, it's more than that. Khaled Garbaya 9:38 So it will give you like a pre rendered website. But then once it's fully loaded, it will load also react and rehydrate everything to react app. So basically, you have this powerful app that's sitting there doing nothing, just displaying, you know, and also like bootstrapping Gatsby, what site and the whole plugin ecosystem. It's really powerful. So I was like, let's try build an app with Gatsby and not like, React create react app. And what I found there is like, I built the first like, kind of small Twitter clone using react. And I was like, Okay, let's try and see how how much go they can just copy paste from here to there. And it was like, sometimes it's like, the entire component, just copy paste it there. Khaled Garbaya 10:34 A few things to consider like the window object, when you when, when the process of statically generating the website kicks in, that's like a Node process. So the, the window object doesn't exist there. But other than that, you can use all the great features of react, you can use hooks you can use a lot of things. I mean, except suspense, because It's still not ready for, I guess, for us it and I don't know how long it would take. But looking forward to that. But also, I mean, since its react and JavaScript, you can load some more data. If you have a like dynamic stuff. Gatsby also has a powerful like API for creating pages. So you can create static pages, you can create dynamic routes. And since you you're able to use dynamic routes, and you can use actually reach router, which is embedded in there. Khaled Garbaya 11:35 You could do stuff like authentications, because all these routes will not get rendered as static, like set equation, because it doesn't make sense to render dashboards for every user that you have. That's not that's not the case. So using that and the combination of different API's and if you have for example, like payments I don't know like Stripe now is a great example for that. The way it works, they give you like a public key and a secret key. So you can use the public key in your front end, and that's fine. And then if you want to capture a payment, you can get some token and send it to your API. Khaled Garbaya 12:20 In this case, it will be like a serverless function using Netlify, and you can like capture the payment and you can do a lot of that. So I was like, asking over and Twitter like, hey, like, what's what's wrong while you're not like building with with a gaspee? And it turns out like a lot of people actually, either they had like a misunderstanding about like, the whole gaspee thing, or they actually building some apps with that and so on. So yeah, so I wrote that blog post about about that. And I'm actually like building a course around the the whole thing I'll send you the link later. And we can add it to the, to the show notes. Yeah. And then I will just break down the whole thing like starting from scratch, like how do you even start the website without even like using Gatsby to generate the templates? And how simple it is, and then we can go from there. Bryan Robinson 13:23 So I'm kind of curious. So, you know, obviously Gatsby is relatively strongly opinionated. Like, there's the Gatsby way of doing react and arguably is one of the better ways of doing react. I don't have a lot of experience with create react app. Is that that opinionated or is it more of like a "Here's some bootstrapping now you go do whatever you want." Khaled Garbaya 13:41 Yeah, I think I think there's some opinion in every tool and that's sometimes good. I think most of the time is good, because if you remember the old days with react, you need to do like Webpack and like, do some configurations and then all I need this loader and that loader and so on. So both Gatsby and react create react app, they solve this problem. They remove the whole, like the whole headache of like building an app. They make you focus on just react, how to build react, create react app, like the end result will be a react app. Khaled Garbaya 14:22 But Gatsby will be like more than that. So it'll be a static site that will transform later into react app. And, and then it doesn't also like stop there. So it gives you like another data layer, which is graph QL. And you can inject any data from any source in there. And that's a really mean graph girl proved to be like a great developer experience and user experience in general. And yeah, but the Create react app I think is like makes your life simpler when bootstrapping an app, have it running. You can totally build an entire app. That's fine. But it doesn't give you like, more. Bryan Robinson 15:06 I gotcha. So if you're making this like a really small app, you might still stick with create react app, but anything beyond that a little bit, you're gonna want go gafi route. Yeah, Khaled Garbaya 15:15 yeah, yeah, I mean, it depends always, like what I say always depends on your use case. Because I'm not just I'm not trying to bash any tool. Everything's like super great. You know, like, when you start this conversation over Twitter, people, like just jump in, you're like, Oh, my God, what are you saying every time? Yeah, it depends on the use case. But I think, since they offer, like the offer, like kind of equal experience at the beginning, why not starting with with Gatsby and and then in the future, if you need to get some more data or like, integrate an API. I mean, you can you can do it. Bryan Robinson 15:57 Nice. So I I've actually I've only done like, surface layer Gatsby stuff. I've created a couple of like small static sites and that sort of thing. Are there any Is there anything to be aware of as you kind of try to take it outside of that static rendering and move it in into like that rehydration process? Khaled Garbaya 16:12 Yeah. So that's mostly kind of done by Gatsby like the Gatsby runtime. One thing is some people, sometimes I see a lot of people asking like, oh, how do I do private routes? And Gatsby, or how do I do this and Gatsby? And actually, that question should be like, how do I do this in react? Because that's actually like a react app. Like you're dealing with react components? A few things like a gotchas. And all like the like I said, the window object. Yeah, the windows object. Sometimes you might be loading some apps that rely also on the window object, but you can in the Gatsby node, you can say, hey, what if you're loading this at in the SSR Phase ignore it or make it an empty modules yeah there's few things here there to watch out for while building but mostly also like you need to think about your your structure of the website what's what's what's really need to be dynamic and what what needs to be like static, like an about page or contact page or contact page. Yeah, maybe but that's also still kind of be can be static, and then inject few stuff in there. And then what's like dynamic and what do you what stuff you don't want to do. And also like Watch out from plugins, or wise Don't be like adding plugins left and right. Because again, it will be like, sometimes painful, a little bit painful when it comes to maintaining all of that. Yeah, and then push as much as you can at build Like the work you do the data processing and stuff, give to the user like a relaxed app, kind of like don't stress the app to show some user. Bryan Robinson 18:10 Yeah, a good progressive enhancement kind of ideology there. Cool. So kind of going forward, you know, next three or four years. Where do you kind of see the tech stack going in a way that's going to keep you in the JAMstack? Obviously, you're doing a lot of stuff in it right now. What's gonna keep you coming back year after year? Khaled Garbaya 18:30 I think modularity. That's that's one thing. I like that every API and product or any company that's producing that they're only focusing on one thing, and that's proven to be always great. Like focusing on one thing and doing really great. I love like, hand handing over a lot of work to experts to do that for me. Yep, so yeah. As long as that's the idea and also also like about the community and it needs to be like an inclusive community and inviting more and more people to contribute and build nice tools in there. Yeah, that that's what keeps me there. What keeps me in the jam stack. And I'm not usually driven by hypes I love to kind of, because there's a lot of hype around like new tools and so on, I use only what I need. And jam stack allows me to do that. And I can replace some components with something else really quickly. And that's going back to the modularity. So that's what I like about Bryan Robinson 19:41 who I am when one new like hyped up thing goes from being hyped to being actually good and you know, ready for production, then you can just switch that into as you go on. Khaled Garbaya 19:50 Yeah, yeah. Yeah. I mean, I can also like, even if I like the idea behind it, I might experiment with it before. Yeah, I like to I mean us things and then I don't really like bash tools on online and I have strong opinions because I was like, yeah, it's assuming the best intention always this is probably solving a problem for someone else. Not me. So I use it if it makes sense. I can include it. Otherwise I can just move on. Bryan Robinson 20:19 Nice. So So JAMstack aside, what is your what's your jam and like in your ears right now? What's your jam in music? Khaled Garbaya 20:26 Oh, man, um, the new Eminem album is nice is on fire. I think is is passing Kanye West. Kinda. Yeah, but I also like, listen to Cardi B. I like some some sort of, you know, rap and hip hop and stuff. Sometimes. I don't know like, It's weird. Like these old suggestions from Spotify. I just listened to them. Yeah, I listened to whereas like, sometimes Ed Sheeran, there's like some some cool songs. He did one with Eminem. I mean, I'm like, I'm like from the 90s. So I listen a lot. And, like, I'm kind of a little bit of old school and yeah, whatever. Spotify tells me to listen, sometimes I was just like, ok Bryan Robinson 21:17 yeah, give the music over to the to the algorithm and say, give me what's best for me. Khaled Garbaya 21:26 Yeah, make sure to listen to few music I like and then the rest will come. Bryan Robinson 21:30 Exactly, exactly. Our robot overlords are taking care of you. Khaled Garbaya 21:34 Yeah, exactly. Bryan Robinson 21:36 Nice. So is there anything that you want promote and get out there to the JAMstack community? Khaled Garbaya 21:40 Yes. Uh huh. Let's see. So, currently, back to the topic of the Create react app, and Gatsby. I'm doing a live stream every day for like an hour, we are actually building an app called RubberGoose.dev. So you know the concept of rubber ducking? Yeah. So I think the name rubber duck is like trademark to something, so someone was like, yeah, maybe rubber goose. And yeah, the app is live. And we already made some great progress there. There's a landing page is capturing email, push it to Convert Kit. It has authentication, it has stripe billing, and plans or subscription all of that. And I didn't even build the content of the app. I was like, the stripe stuff so that you can find it over twitch.tv/kgarbaya. Or if you follow me at Twitter, which is @khaled_garbaya. Khaled Garbaya 22:56 And yeah, and if you Go over sort learnjamstack.com I'm running a weekly digest for like some nice resources I find useful. In there also, on the top, you'll find a banner getting you to like the course if you want to get some, like some info about the course of the progress, I share some nice free previews and materials already about that. Yeah, and my website is k4d.dev. So I was like, you know, the four letters and between the K and D. I was like, like the Kubernetes or something. So yeah, that's like, my main website. So yeah, I guess if you follow me on Twitter and like, look around, you can find all the other links. Bryan Robinson 23:49 Sure. Awesome. Well, I really appreciate you being on the show today and sharing your your expertise around great react app versus Gatsby and all that good stuff. And thanks for doing And all the cool educational resources you've been putting out there. Khaled Garbaya 24:02 Yeah, man. That's my pleasure. Thanks for having Thanks for having me. Bryan Robinson 24:08 Hey, everyone, it's Bryan again. And it is time to talk about this week sponsored TakeShape. They're a really well crafted content platform made specifically for the JAM stack. So what's a content platform? Well, take shape doesn't just provide a CMS, though, you can certainly just use their CMS if that's all you're interested in. They also have a static site generator, a GraphQL API. And this really cool new Mesh product just growing by the day, which you can use to combine multiple API's into one really easy to use GraphQL-based API. So if those things strike your fancy, and for me, most of them do on one level or another, head on over to takeshape.io/thatsmyjamstack to sign up. Bryan Robinson 24:48 And of course, don't forget to star heart favorite, subscribe, all those lovely things so that more people can find out about the amazing work that we're all doing in this great JAMstack community. So until next week, keep doing Amazing things on the web and keep things JAMy Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

5 February 2020


Jason Lengstorf on the edge cases, rediscovering common knowledge and much more

Jason Lengstorf on the edge cases, rediscovering common knowledge and much more

Quick show notes Our Guest: Jason Lengstorf What he'd like for you to see: His Egghead courses on JAMstack and Gatsby | His Gatsby and JAMstack courses on Frontend Masters His JAMstack Jams: "But yeah, I'm a big fan of, I don't know, I just like playing this stuff." So here's a list of the stuff Gatsby Svelte Eleventy NuxtJS Gridsome His Musical Jam: "Final Form" by Sampa the Great Other Technology Mentioned Hasura OAuth OneGraph Our sponsor this week: TakeShape Transcript Bryan Robinson 0:02 Hey everyone, welcome to That's My JAMstack, the podcast where we dare to ask the question, what is your jam in the JAMstack. I'm your host, Bryan Robinson and today I'm super excited about our guest. He's a principal developer experience engineer at Netlify and the host of the great video series Learn with Jason. I'm talking of course about Jason Lengstorf. Bryan Robinson 0:22 But before we dive in, I did want to mention our sponsor TakeShape is back again this week. I'll tell you more about them after the interview. But if you're interested in learning more before that head on over to takeshape.io/thatsmyjamstack to find out what their content platforms all about. Bryan Robinson 0:43 Alright, Jason, thanks for being on the show with us today. Jason Lengstorf 0:45 Yeah, thanks for having me. Bryan Robinson 0:46 Awesome. So so I would hope that a lot of people in the audience know who you are, at least from the past couple years, but go ahead and give us a shout about who you are, what you do for work, what you do for fun, that sort of thing. Sure. Jason Lengstorf 0:57 So I am a developer experience engineer at Netlify, which means that I'm kind of in between engineering and Dev Rel. I also host a show called Learn with Jason where I pair program with people in the community. We learn something new in 90 minutes. I am also a occasional blogger I'd write a lot about sometimes about code mostly about the the process of coding so kind of the meta work or the Yak shaving so to speak. Jason Lengstorf 1:30 For fun, I am a I call myself a mediocre bartender. I love food. So I we cook a lot. You know, I'm kind of deep down a rabbit hole, I make my grind my own meat and you know, do that. We make bread from scratch and I like to do cocktail like you know, bartending kind of stuff like that. I make my own cocktails and stuff. It's good. Bryan Robinson 1:51 So what is the tastiest cocktail that you make? Jason Lengstorf 1:54 Okay, the taste is one that I make. I will usually I just make other bartenders, good cocktails. I have I made one up. My partner asked me to make something that tasted like Christmas. And so I did kind of a riff on on like a classic Negroni build, but it was rum and spice liquors. So it kind of has this really Alpine kind of Christmasy flavor. Bryan Robinson 2:21 Alpine like a taste like a pine tree or... Jason Lengstorf 2:23 So the one that I use is called blur Bluebird, Alpine liqueur, which it's got, like all spice and some kind of like fresh herbs and stuff. So if you had fernet Branca? Bryan Robinson 2:35 Nope. Jason Lengstorf 2:36 So fernet Bronco, kind of tastes like mouthwash. This is like a a very, like, tune down version of that. So it's it. It has a hint of pine not like the taste of them. Bryan Robinson 2:48 And what's the what's the hardest thing you've ever cooked? Jason Lengstorf 2:50 Ooh, great question. Um, I would say probably the hardest thing I've ever cooked is. Well, I mean in terms of complexity, just Thanksgiving dinner, because you you effectively have to Gantt chart that you know, you've got one of in one stovetop and 15 dishes to cook. So how do you make sure that everything comes out on time still warm, that you're not like trying to stack something that was supposed to cook it for 50 and an oven, it's only a 325 you know that that kind of stuff is all very challenging. Jason Lengstorf 3:18 In terms of most complicated single dish, I any type of curry dish is really challenging. It's like, well, it it's not challenging in the sense that it is. It's not like French cooking where the the techniques are challenging. It's like a billion and a half ingredients and a lot of them are hard to find or something you've never used before. So there's a lot of like, not only learning how to use a mortar and pestle to make curry but like trying to understand what an ingredient is supposed to taste like. Jason Lengstorf 3:51 Because you know if you've never used like Thai basil or if you've never used Thai seasoning sauce or You know, all these these ingredients that you'll find in Asian food, like, you're like I don't even have the context to know when this is like I don't know what right tastes like so you're making a lot of wild guesses and hoping the end product tastes like the thing that you love from the restaurant Bryan Robinson 4:15 Do you do have to make your own curry powder because I know that's like the best way Jason Lengstorf 4:18 I've done it a couple times and it is definitely amazing it is so much work like it's it's one of those things that I feel like if it would be one of those things it would make sense if you had a bigger family so it's just me and my partner and to make it at the scale that we would need to to justify doing as much work as it is we need to eat it like every day for two weeks. And so typically what I found is that the level of effort that goes into the really, really intense stuff like making your own like making your own gyoza skins for like pot stickers and stuff, quality difference between buying them at the store Making them at home is noticeable. But marginal. The level of effort is totally, totally doesn't justify that little bit extra flavor. Unless you're doing it for like a special occasion. Bryan Robinson 5:12 Even still, I might say depends on how special occasion I guess. Jason Lengstorf 5:18 Yeah, fair enough. Bryan Robinson 5:20 So, so obviously, we're not cooking today other than some delicious jam stack recipes, but, uh, what what is kind of your entry point into the jam stack or in the static sites if you are old enough to deal with that? Jason Lengstorf 5:31 Yeah, so like entry point, like how I got into it. I mean, the way that I really got into it was once upon a time I was in a band, and I started by customizing the CSS for MySpace. That was really what it was, was like customizing my band's MySpace profile. And then I wanted to build an actual website for the band. So I built a, you know, totally in, like TextEdit wrote all the HTML all by hand and then just uploaded into a FTP folder on. I don't even remember what the host was some some cheap hosts BlueHost or something like that. Bryan Robinson 6:09 True static sites. Jason Lengstorf 6:11 Yeah, real like true static site. So I just uploaded something into a folder. It was it was gnarly. It was this table base like this is before that, you know what this was before CSS or before I knew how to use CSS. So what I was doing was doing like table based sliced images, to position things on the screen old school. It was rough. It was rough. Bryan Robinson 6:32 Nice. So So what about modern JAMstack? What was kind of your entry point into into the past like five years of technology? Um, Jason Lengstorf 6:41 so I was working at IBM. And we were dealing with, I worked on IBM's cloud services, IBM Cloud, and we were building dashboards out and a lot of these dashboards it was just a very complicated dev stack, right. So IBM Cloud is microservices. So each team owned a route. So you would own slash dashboard or slash account or whatever. And we owned slash account. So we were trying to speed up we had some performance issues where we were just it was taking way too long to load a page. And when I started digging into the tech stack, what I realized was that the way we had done microservices was to give each team a full node Express server. And then that was setting up these proxies that were wrapping other microservices. And so we had these kind of daisy chained microservices, then and a lot of it was just so that our local build was easy to manage. And you know, I have to like air quote, easy because it was still to get a dev environment setup. You had to add a bunch of environment variables you had to configure nginx on your machine. had to run, you had to have a reverse proxy running. And all this stuff was really, really painful. And all we were doing at the end of the day, was writing a react app that sent off calls to internal API's. Jason Lengstorf 8:13 So I, I attacked this from from two ways. So my first talked to my team about GraphQL. And we wrote a middleware kind of thing. That was a, it was like a normalization layer over internal API. So instead of having to write these proxies in each microservice, we built a normalized graph qL layer so that the the front ends could just call GraphQL. And then once we've done that, we've successfully decoupled them so I started trying to build up proofs of concept where the front end teams weren't shipping node anymore. They were just shipping like static compiled assets. The graph qL was successful. The static shipping was not Jason Lengstorf 8:55 We we hit Like, I mean, there are a million reasons for it, right? Like there's there Lots and lots of people who have very valid reasons for going lots of different technological directions. IBM's got 700 something engineers, or just on that team like on IBM Cloud 700 something engineers, and you know, they're architects at different levels. So I had my what I consider to be incontrovertibly correct opinion. And then there was another team that was doing more stuff with with like, sort of like graph, not graph qL, but like graph databases, and that was very server driven. And so they had what they consider to be incontrovertibly correct reasoning for doing that. And we just kind of stalemated while I was doing that, though, I was just kind of getting burned out on the the bureaucracy and the slow pace and the the the inability to like, do stuff. I always felt like I was getting close to doing something cool. But then it would hit this, this wall and it would just chug along and it was like okay, we're going to Do six months of meetings to do six weeks worth of work and that's not fun. Jason Lengstorf 10:05 So around that time, I started looking at Gatsby as an option for the static builds. And I was talking to the Gatsby team, and through, you know, just good timing. They had gotten funding and we're starting to hire at the same time that I was starting to reach the end of my tether at Gatsby or at IBM. And so I made the jump over there. So that was that was kind of where I got officially officially into the JAMstack Bryan Robinson 10:28 Perfect timing on on everything. Bryan Robinson 10:30 Yeah, yeah Bryan Robinson 10:31 With 700 devs on a Team. Things are gonna move, move pretty slow. Jason Lengstorf 10:35 Yeah, yeah. You know, the the the trade off that you get for like building enterprise enterprise grade software is it's going to be relatively solid because you have so many people to cover so many edge cases. But it moves glacially. Bryan Robinson 10:50 So So obviously, you were you were working at getting IBM into the JAMstack. Then you move to Gatsby and you were using pretty much primarily JAMstack technology at that point. How are you? Nowadays working at Netlify using JAMstack professionally using it personally what what kind of projects are you working through with that? Jason Lengstorf 11:07 Um, I mean, I I feel like I was pretty, pretty convinced on the jam stack as an approach before I went to Gatsby that was, you know, I made a big bet on Gatsby when I went there. And moving to Netlify felt like a logical next step for me because what I, what I really believe is that JAMstack is something that's going to give anybody a very easy on ramp into putting things on the internet. And I feel like that's a that's a gap that was closed in the Hostgator, use text edit and drop an HTML file into FTP. And then we we created that gap again, when we got too much further beyond like the the PHP LAMP stack kind of stuff. Because now it's like, Okay, well, I don't know exactly how to provision a node server or how to configure a remote, I, you know, I don't want to have to SSH into a box to change something so that I can deploy it. And there are services that manage that for you, but they were all kind of, like expensive. And so Netlify has has democratized that a little bit by offering this, this free hosting for jam stack sites. And the jam stack in general simplifies the stack. Jason Lengstorf 12:24 So for me, it's very like, okay, we've we've created a landscape that is more friendly to more developers. And now I'm just kind of in my personal stuff, and in professional stuff. I'm playing with the edges, because, you know, JAMstack is a tool, it's an approach, and it's not going to solve all problems. So I'm currently in the phase where I am trying to treat JAMstack as a hammer and attempting to see every problem is a nail. Because I want to I want to see like, where does it really fall down because there are obvious things that it can't do like You're not going to do a real time stock ticker, with, with static files, if you need that to be, like server generated, like, there's just you're never going to rebuild that fast, or at least not with current technology. Jason Lengstorf 13:11 But there are a lot of things that people say, Well, you can't do that with jam stack. And I'm just trying to ask the question like, why not? Like, what what stops us from doing that? Jason Lengstorf 13:22 So you know it you can do a lot like we're doing real time sound effects. We're doing persistent data where you can track things like Kyle Shevlin's, got a cool thing that he did on his his blog, where, if you read one of his posts, and you like it, you can stroke his beard, which is a weird thing to do. But he managed to make that persistent. So he's got a button that you can click, and it'll increment the count and say, like, Oh, this, this post has gotten like 57 beard strokes, which is really cool. And that's all done again in the JAMstack, Jason Lengstorf 13:22 So, so like, right now I'm building a JAMstack powered site, where I used a Hasura to set up a database. And then I built the JAMstack site, that log I use OAuth through OneGraph, which is an amazing tool if you haven't used it. So OneGraph logs into my Netlify account, and then it logs into my twitch account, and then pulls in. Like from whatever site I specify serverless functions, which is a way for JAMstack to do like dynamic things. And then I'm able to using a JAMstack site triggers Sound effects on my live Twitch streams based on this like jam stack setup that I've got. Bryan Robinson 14:37 Highly interactive. Jason Lengstorf 14:38 Super interactive. Yeah, you can do comments, you can do all sorts of things that that I think are typically typically thought of is like, Oh, you need a server for that? Well, this the software as a service landscape is so robust now. You almost don't need a server for anything on print. Like you don't need to roll your own server. The vast majority of services now Have a software as a service like implementation you can do comments over over SAS, you can do you know real time income increment, you can do databases you can do. Everything that you can imagine is probably got a SaaS solution, when that really opens up the landscape for the jam stack where you can do so much without ever having this to stand up a server Bryan Robinson 15:20 Yeah, those edge cases are getting smaller and smaller by the day. Jason Lengstorf 15:23 Yeah. Bryan Robinson 15:24 Cool. So uh, what would you say that your, your jam in the JAMstack is? What sort of technology or philosophy process what were you really digging on? Maybe in the past year or so Jason Lengstorf 15:36 Yeah. Well, so I think there's, there's like the professional interest and then there is the, like, I am excited about this interest and, and I have the benefit of like, through running, Learn with Jason. I get to effectively play with new and exciting stuff constantly. And so I've seen a couple really exciting things like Rich Harris came on the show and taught me about Svelte. And Svelte is incredible. It's this, you know, it's this magical disappearing framework that you write Svelte code, but then during the build process, it compiles away all of its code and shifts next to nothing. You got these tiny little bundles and it's amazing for performance. They they use it for data visualization and animation. It's it's really, really incredible. Jason Lengstorf 16:26 But then you've also got like Eleventy from Zach Leatherman, which is this, this amazing framework that is completely unopinionated. Like the Zach told me, he can't even tell if a site was built with eleventy because it doesn't ... like there's no framework there. It just generates whatever you tell it to. And so those are really cool in terms of flexibility in terms of power. I haven't really used them at scale, though. Like I've used them for a little fun projects. And and I like them. I think they're super exciting. Jason Lengstorf 16:56 For production stuff. I'm still using primarily Gatsby. I think that Gatsby has a, the the, the way that Gatsby has approached data management where you move things to a centralized centralized data layer, and then you work as if it's a, you know, a live, you know, database powered app. And then when it builds, it kind of packages up that data to go to the site. That, to me is something that we were still not really seeing, you know, in a lot of the JAMstack ecosystem. And that makes Gatsby like, you know, it's a little complex to set up because you got to learn graph qL you got to do all the, your you've got tools under the hood. So it's hard to tell where the boundaries are between like Gatsby and reach or between Gatsby and relay between Gatsby and and what, you know, react. So what are you Where did you hit the issue? Right? So there are some, it's maybe not as beginner friendly as well. Nothing is beginner friendly anymore, because everything's like, you know, it's turtles all the way down, right? like everything's an abstraction of an abstraction of an abstraction. So beginners are going to start wherever they are. And they're going to learn their layer of abstraction. And then like, if there's a need, they're going to go deeper. Jason Lengstorf 18:10 I think the Gatsby has an incredible tutorial, incredible documentation. And so to me that that makes it the safest production top choice for react based developers, like, you know, if you're, if you're Angular Dev, like, I think Scully just shipped which is really cool. And if you're a Vue dev, there's like Nuxt and Gridsome that both have really cool options. So you know, I think there are a lot of really fun ways to solve these problems. But yeah, I'm a big fan of, I don't know, I just like playing this stuff. Bryan Robinson 18:44 A big fan of everything, right? Jason Lengstorf 18:47 Yeah, I like it all. Bryan Robinson 18:48 Cool. So let's, let's talk about music. Then. what's what's your jam right now? In your ears. Jason Lengstorf 18:55 Um, I have been listening to just so much We like stuff. So I kind of went down this rabbit hole right so I got really into Anderson POC, because I just never really heard anyone who did what he did. And then like I also started taking music lessons from this, this guy named Joe in Brooklyn who's a producer and he works with a lot of underground hip hop acts and like smaller names, but he's worked with people that people who are into hip hop may have heard of like Earl Sweatshirt and folks like that. So through that, I've been on this very odd adventure. Let's just fall down the the Spotify, rabbit hole of all of these really, really interesting things. And I just found an artist that I love. I gotta look up her name though, because I am blanking on it right now. Samap, the Great or Sampa the great, I don't know how to how she actually pronounces her name, but yeah, like this track called final form. It is unbelievable. It's so good. I can I'll send you link to it. It's like, kind of it's like in the Kendrick Lamar vein of, of hip hop where it's like solid wordplay. It's, it's pretty, like, you know, it's like, cool, it's, like socially positive, or largely socially positive. And, you know, it's, it's really, really, it's good. Bryan Robinson 20:18 Nice. Alright, so is there anything that you would like to promote to kind of get out to the jam stack community as a whole, Jason Lengstorf 20:26 Keep, like, keep trying things. One of the things that I think is really, really important as JAMstack developers is, keep in mind that this is still a relatively new approach. And that a lot of the the, we're taking a lot of things that were common knowledge and we're rediscovering and so part of what I think is important as we get into the JAMstack is is first don't treat this like it's brand new. It's not this is this is stuff that we have been doing for a long time. So instead, start looking for like, Where Where do the abstractions make sense. And were like, what is it comfortable to do? So not what can we twist jam stack to make possible but like, where does it really feel right? You know so with the the SaaS based stuff are using software as a service as a data layer to back this completely static front end like to me that feels great. It It seems to solve all the problems that I want it gives me It gives me really good control. So I would recommend like go check out some of the the various software as a service platforms if you need a good idea of what some of those are. Jason Lengstorf 21:34 Just go look at Gatsby's datasource plugins because it's going to list just a ton of services and things that they do that you could integrate directly into a Gatsby site right now. Or with a little more effort you could you could integrate into any JAMstack solution by just using their API's at build time to go play go do some dynamic stuff because it's it's so much fun. Jason Lengstorf 21:56 If I can self promote a little bit yeah, I have on on Front-end Masters and on Egghead some courses on both Gatsby and the JAMstack where it talks through how to like we walk through projects that do some of the more dynamic stuff so you can get an idea of how it works. And then just go out and continue pushing those boundaries. Bryan Robinson 22:15 Awesome. You'll send me those links, and I'll put them in the in the show notes. Jason Lengstorf 22:18 Absolutely. Bryan Robinson 22:19 Awesome. Alright, well, thanks for taking the time to talk with us today. And I hope you keep doing amazing things that all the different jam tech companies you've been with, but with metla phi going forward. Jason Lengstorf 22:27 Thanks so much. I appreciate you having me on. Bryan Robinson 22:33 Hey, everyone, it's Bryan. Again, I want to point out two quick things before I let you go first, I want to point out that people discovering podcast can often be you know, review and ratings based. So if you got two minutes today and are enjoying this podcast, head on over to to the Google Play Store, Apple podcasts or really wherever you're listening to the show right now, and and write a short review. It'll help more developers find out about this amazing community that we're all living in. Bryan Robinson 22:57 The second thing I want to talk about is of course, our sponsor TakeShape. They're really well crafted content platform for the JAM stack. And what's a content platform? Well TakeShape doesn't just provide a CMS, though, you can, you can certainly just use their CMS if you want to. They also have a static site generator, a graph, qL API, and a new Mesh product, which is working to combine multiple API's into one easy to use GraphQL based API. So if any of those things strike your fancy and to be honest, all of them do for me, head on over to takeshape.io/thatsmyjamstack sign up. Bryan Robinson 23:32 As always, thanks for listening, and we will see you next week with a new interview. Until then keep doing amazing things on the web and keep things jamee Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

29 January 2020


Aisha Blake on accessibility, easier education and musical conference talks

Aisha Blake on accessibility, easier education and musical conference talks

Quick show notes Our Guest: Aisha Blake What she'd like for you to see: Gatsby Days - Feb. 3, 2020 Who got Aisha into the JAMstack: Working as a volunteer, creating websites in Jekyll Her JAMstack Jams: The way it makes teaching easier Her musical Jam: Dear Evan Hansen Soundtrack Other things mentioned Gatsby Title of Conf self.conference Transcript Bryan Robinson 0:03 Hello and welcome to another episode of That's My JAMstack the podcast asked the age old question, what's your jam in the JAMstack? On today's episode, we've got the amazing Aisha Blake. Aisha is a member of the Gatsby learning team, as well as being a teacher, speaker and conference organizer. Bryan Robinson 0:20 Now this episode is jam packed with JAMstack goodness. But before we get into that, I wanted to welcome back our wonderful sponsor TakeShape. Stick around after the episode to hear more about their content platform or go ahead and head over while you're listening to TakeShape.io/thatsmyjamstack for more information. Bryan Robinson 0:40 Hi Aisha, how's it going today? Thanks for being on the show. Aisha Blake 0:42 Everything is great. Thank you for having me. Bryan Robinson 0:44 All right. So So obviously, you're on the show to talk about the JAMstack stuff, but go ahead and give us a little introduction for who you are, what you do for work, what do you do for fun and that sort of thing? Aisha Blake 0:52 Absolutely. So I am a brand new senior software engineer on Gatsby's learning team. I am -- I do a lot of things. I do a whole lot of things. I am an organizer for two conferences in Detroit. One is called self conference is half tech talks, half people focus talks. It has really, really great community and one is new. I am also organizing a conference called <Title Of Conf> after one of my favorite musicals, which is going to be a musical tech conference. Bryan Robinson 1:33 What?! Aisha Blake 1:33 Oh, yes. Yes. So all of the performances, they'll be performances are going to be musical and/or theatrical, similar topics to any other tech conference. So the idea is that we're teaching people through performance art. I'm really excited about it. Bryan Robinson 1:56 I'm now like, run through like, how would I do that? Like, because I speak at a few different conferences, how would I artistically render CSS talks Aisha Blake 2:05 It was largely inspired by TailCall Optimization: The Musical, which was a brilliant, brilliant Disney parody. So three different Disney songs, teaching you about tail call optimization. At !!con last year. And I have been surprised like I this is like the intersection of everything I love. And I've been surprised how many people were already doing this kind of thing. Like, it's, it's really cool. Bryan Robinson 2:41 Very nice. And when's that coming up? Aisha Blake 2:43 That's going to be May 7 in Detroit, and self.conference is actually the following two days. So anybody who is interested in attending either one, you will have a little bit of a discount on the second ticket. Bryan Robinson 2:58 Nice, very cool. Alright, so So obviously, we're not gonna be doing a musical here today because no one wants to hear me sing. That's for sure. So let's go ahead and talk about the JAMstack a little bit. So what was kind of your entry point into this idea of the jam stack or static sites? That sort of thing? Aisha Blake 3:13 Yeah. So as far as static sites go, and it goes back to when I was learning to be a web developer, I was a volunteer, a Jesuit volunteer here in Detroit. That's how I actually came to the city. And I knew that I wanted to be a web developer, but I didn't really have I didn't really know how to connect to the skills that I had. So I have an Information Science degree. But I really didn't know how to take the computer science concepts that I had learned and apply them to something that was practical in my immediate life. Aisha Blake 3:57 So during my year of service, I got started. started doing like small freelance jobs. And one of the one of the things that was really helpful was working with Jekyll at that time, and so I did a handful of static sites for people that I found either through word of mouth or through fivrr. It was, it was interesting. Aisha Blake 4:22 So getting introduced to like, the more modern, what you think of is the JAMstack, though, was actually Jason Lengstorf. Jason has been like one of the guiding lights of my career in that he was the one that got me started speaking conferences. But he also actually turned me on to Gatsby. Like, before he even he was working at the company. He was like, hey, yeah, I've been you know, working on this project. The people working out seemed really cool. They're been really helpful. And, you know, then he was working at it. Gatsby for a while. And that was what got me interested in Gatsby as a tool and as a company to begin with. Bryan Robinson 5:08 So, it's a very similar pattern that I've seen a few different times. Hey, I got started in static sites long time ago, it was Jekyll. That's pretty typical. And then, oh, let's figure out what's new. And what's what's really happening. And Gatsby tends to be about 50/50 what I'm hearing from people. So so you, you kind of did you dive in the Gatsby a long time before you obviously got hired very recently by Gatsby. What was your kind of your career pre employment from Gatsby with Gatsby, Aisha Blake 5:38 So I had no professional Gatsby experience before being hired to get speaking. I was working on a react project. Part of the project was in React. It was a really large metrics app that I was working on full stack, our full stack anyway. And so I had react. experience and then sort of on my own, I was like, well, I need a new blog. Well, my conference needs a website. And like, just sort of getting bits and pieces, and really enjoying the developer experience. And so when I saw that there was an opening on the learning team at Gatsby, and it's really this combination, much like title of calm. It's a combination, like all of the things that I love to do in a job. It was, I knew that I would regret not not applying. Aisha Blake 6:30 And on top of that, Marcy Sutton is my manager. Yeah, she's so I have from my entire career been really heavily interested in and, and passionate about web accessibility. And so Marcy Sutton is continues to be now that she's my manager. Bryan Robinson 6:59 Well, and the cool thing It's like you learn all sorts of stuff from someone like Marcy too. like I follow her on Twitter. I didn't even know there's accessibility about hashtags on Twitter until I followed her. Aisha Blake 7:08 Yeah. So it's been really incredible to be able to learn from her. And I can only imagine what's going to happen past my first three weeks on the job. Bryan Robinson 7:19 Sure, yeah. And the amazing thing to me is watching Gatsby specifically hiring people who care about this sort of thing and and there's perhaps a misguided stigma around react that react sometimes isn't always like JavaScript isn't always the most accessbile unless you really know what you're doing. And so I love that probably the premier company that's using react and the JAMstack is focusing so heavily on that. Aisha Blake 7:44 Yeah, and there's definitely a long way to go. To be clear. But the but we do have Marcy, as well as Madeline working really hard to get us to a point where we can say yes, like by default Gatsby is going to be a really great choice for somebody building an accessible application. Bryan Robinson 8:07 So what's a little bit of your of your history with accessibility? Cuz I know that you you have talked about it and worked on it in the past. Aisha Blake 8:14 Yeah. So I got started with web accessibility through. I'm actually wearing the sweatshirt right now a goalball, sweatshirt. goalball is a sport for blind and visually impaired athletes. Okay. And I was for a really long time, a volunteer for the New York goldball team. And before that point, I really didn't know anybody, personally, who needed assistive technology to access the web. And when the guys on the team asked me about potentially making a website for them, which I never wound up doing. I was like, Okay, I could do that, but I'm not sure You're I can't I don't know whether or not that website is going to be usable for you. Because I'm used to building websites from the perspective of a sighted person. And so that was kind of where I started delving into like what it means to build an accessible website and or web application. Aisha Blake 9:25 And so I've started watching watching Marcy Sutton videos, I start reading Hayden Pickering book, and just sort of picking up bits and pieces as I go along. And of course, talking to my friends on the goldball team, like Hey, does this work for you? And it was a really, it was eye opening in a couple of ways. One, I was just learning a lot but also the realization that Lot of actual web developers because at this point I'm, I'm aspiring a lot of, you know, actual employed, web developers are not doing these things. And I was sort of like, Well, okay, well, I guess I know, kind of what I can do what I can bring to the table from the beginning. Bryan Robinson 10:23 The interesting thing to me also is that it's not always even just a employed web developers. It's also web designers like knowing, knowing what to do is a design task as well. And I've managed a team of designers in the past and pretty things aren't always accessible things. Yeah. So yeah, having to think through all that is a is a task, but it's an important one. Aisha Blake 10:43 Yeah, absolutely. Bryan Robinson 10:44 Cool. So so let's let's get back into the jam stack a little bit. Obviously, you're going to be using the jam stack pretty heavily in your job at Gatsby. I assume you're going to be continuing in the jam stack for for your side. projects for your conferences up in up in Detroit. But what's going to keep you obviously other than employment in the jam stack? And what's kind of your passion in the jam stack right now? Aisha Blake 11:10 I think for me, it it's been partly about the fact that it makes my work as a teacher easier. That has really made it easier for me to kind of bring people into the fold who are interested in beginning to their like web developer journey or even just getting into tech in some form. I've found that in teaching and teaching the jam sack specifically, it gives people a more complete way to build a site so you have a working site that you could launch and also that gives me a jumping off point then to teach you about react to teach you about JavaScript. But you still get those quick wins, that you're able to get when you begin teaching, using methods that are not necessarily teaching people how to build production ready, application. Bryan Robinson 12:22 Yeah, the thing I really like is that you can just you can upload HTML and you have a website and then you can add the next thing and the next thing to the to the learning process. Absolutely. So where are you teaching and how are you? Are you mentoring what what sort of teaching are you doing? Aisha Blake 12:37 Yeah, so right now I am teaching part time at a coding boot camp called grand circus here in Detroit. And that was actually my first job was at Grand circus on the instructional stuff. And I was out for I was gone for three years, came back part time, teach at night, did not anticipate how difficult those two jobs when I happens to get the get the job at gaspee Around the same time, which was certainly not my intention. But it's been really, really challenging, but also really wonderful to be back in a classroom for that length of time again, because in between, you know, I'm teaching workshops, and I teaching online, and all those things, and those are wonderful, but to have a class have a course, where you're interacting in person with people. It there's something there's something special and important about that, in my opinion, Bryan Robinson 13:44 and so nice to actually like get next to somebody and be like, Oh, no, that you forgot the semi colon or capitalization matters or, you know, stuff like that. Yeah, Aisha Blake 13:52 I joke that I'm a professional rubber duck Bryan Robinson 13:56 Yep. I taught a an HTML and CSS class and I walk over to the students computer and like two seconds later to be like, you should have like an aura around you that makes it work like Well, no, but Sure, I like to think that maybe sometimes. So are you actually teaching jam stack there? Or is it more full stack or front end? Aisha Blake 14:14 So the so the course is a front end course. And it's actually focused on Angular. But a lot of folks are interested not necessarily in getting entirely new jobs specifically with Angular. It's more about kind of becoming programmers. And so it's been really cool to see them go from. I just don't know what I'm doing at all. I don't know what any of these words mean, to getting getting used to the idea of a JavaScript framework, any JavaScript framework, and then being able to translate that. So while I'm teaching them while the curriculum is an Angular curriculum, they are now branching Now into all these other things are they're getting interested in react? They're getting interested in Gatsby. And those are and those especially using Gatsby, those are accessible now. Because they've got that T's, they can now go off and start building these side projects, even though they've only just begun to learn kind of what a framework is. Bryan Robinson 15:27 They've got the taste for side projects, though. Exactly. It's pretty easy to get that taste as a developer. Cool. So uh, what sort of technologies are you really into in the jam stack? I mean, obviously, Gatsby, and we could talk forever about Gatsby or anything else Aisha Blake 15:43 like that. And so that's really my kind of pet battle right now. That is like, I'm very focused on learning as much as I can to be the most effective learning team member. So really, it's Combining, combining Gatsby in different ways, so really using that content much to the fullest. So, and I and I have so many ideas for things that guess really lends itself to. So we're kind of starting, we're starting at the ground level. So building more intro projects in service of learning materials. So you know, we have plenty of like building build your first blog with Gatsby, but also getting into and you can also use Gatsby as an application. So I'm focused right now on ecommerce with Gatsby. So all of the various ecommerce tools, bringing them in and making sure that we're presenting an experience that makes it makes it straightforward makes it a little easier for people to to get going and potentially then make money. themselves off of the side fresh chicks. Wouldn't that be nice Bryan Robinson 17:03 is nice when that happens. Cool. So while kind of keep keep our episode length in check a little bit. So let's go ahead and talk about what your actual jam is right now. What's your musical jam? What were you listening to? Aisha Blake 17:17 So, you may have already guessed based on my title of information earlier, but I am very much a theater person. And so most of what I listened to is show tunes right now. I am listening to Dear Evan Hansen. It's coming to it's coming to Detroit soon. And while the story is pretty twisted, obviously, the music is beautiful. And I'm really excited about seeing the show. And it's also given me a lot of inspiration for my own parodies, which is I'm unlike it's not my thing I don't I don't write a lot of musical parodies. But it's been really fun to to do that for the conference. And it has given rise to yet another side project that I'm using gets before. Perfect. Bryan Robinson 18:15 Awesome. Cool. So so let me put you on the spot then. So you're big in the in the theater. What is the best musical in your opinion of all time? Aisha Blake 18:24 Oh, my God. Aisha Blake 18:25 Okay. Aisha Blake 18:27 I think Aisha Blake 18:31 that's that's a tough question. I don't know that I've ever been able to answer that question. I will say, my dream role. And one certainly one of my favorite musicals is would be Aida, Bryan Robinson 18:46 that's aspirations right there. Right? Aisha Blake 18:49 For sure. Bryan Robinson 18:51 So So let's talk about is there anything that you'd like to promote to go to the jam stack community at large? Aisha Blake 18:56 Yeah, absolutely. So we do. I'm not sure when Air. We do have Gatsby days coming up at the beginning of February. And that's going to be a really great way to connect with the whole team. We're going to be, we're going to be in LA. And we are going to be presenting two workshops. So one is going to be an intro to Gatsby, and another is going to be building accessible applications. Matt will be with Marcy. So it's a really, really awesome opportunity to come hang out, learn more about Gatsby and what's coming next. And connect with the community. Bryan Robinson 19:42 Amazing. All right. Well, I appreciate you taking the time to talk with us today. And I hope that you keep doing amazing stuff, both the Gatsby and just I. I'm hoping that at some point, I can see title of cop because that sounds amazing. Yes. Aisha Blake 19:56 Thanks very much. Awesome. Thank you. Bryan Robinson 20:00 And of course, a big thank you to the JAMstack community for listening, subscribing and sharing. This podcast is an absolute blast to host and produce. And it's because of the amazing community that we're all part of. Bryan Robinson 20:11 With that it's time to talk about our sponsor this week, TakeShape.io. They're a content platform for the web, with a developer, and user friendly, headless CMS, which isn't always easy to do a GraphQL API and a powerful static site generator all built in all kind of one piece that you can use on your project. Now, if that sounds like exactly what you need, head on over to TakeShape.io/thatsmyjamstack and find out more. Bryan Robinson 20:39 That's it for this week's episode. So until next time, keep doing amazing things and keep things jamy. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

22 January 2020


Ahmad Awais on the elegance of Markdown, education and simplification

Ahmad Awais on the elegance of Markdown, education and simplification

Quick show notes Our Guest: Ahmad Awais What he'd like for you to see: That it's important to keep educating and not overcomplicate things His JAMstack Jams: Markdown and all it's incredible uses His Musical Jam: The Greatest Showman Soundtrack Other Technology Mentioned Stripe VuePress React Our sponsor this week: TakeShape Transcript Bryan Robinson 0:02 Hello everyone, welcome to another episode of That's My JAMstack the podcast where we asked the deep and complex question, what's your jam in the JAMstack? In today's episode we're talking with Ahmad Awais. Ahmad is a developer relations engineer at Cloudinary, a Google Developer expert and a prolific teacher. Bryan Robinson 0:19 I'm also happy to welcome back once again, our sponsor TakeShape. Stick around after the show to learn more about their content platform or visit, takeshape.io/thatsmyjamstack for more information. Bryan Robinson 0:37 Thanks for being on the podcast today. How's it going? Ahmad Awais 0:39 I'm doing good. Thanks for having me. Bryan Robinson 0:41 Great. So tell us a little bit about yourself. Tell us what you do for work, what you do for fun outside of technology and all that sort of stuff. Ahmad Awais 0:47 Awesome. Awesome. So I'm actually right now the principal Developer Advocate for Cloudinary. I advocate for Javascript and open source. I have been spending a lot of time for the last years on being a full time open sourcer, where I build a lot of things related to web sort of a web purist, which has also kind of led me to be a Google Developers expert for web technologies. And I serve on the Node JS community committee. Ahmad Awais 1:17 But I spent, I spent like this past life or about 13 years or so contributing to the WordPress core software, to WooCommerce into all sorts of things WordPress, but been always kind of directed for JavaScript. So when kind of JavaScript kind of took off, I knew that getting a promotion, I definitely moved to the React JS community. And then from there to NodeJS, I'm handling all of this and then JAMstack came into being and it's like what we always been doing, but with a better name, a better community and with better, you know, tooling and practices. Ahmad Awais 1:56 So that's me apart from that. I come from a family Teachers, both my grandparents, both my parents. So teaching is sort of a genetic bug in me. So and I like to be sort of funny, at least I try to be. So I call this entertaining, education plus entertainment. So I entertain a lot in this course out on VSCode.pro, teaching people how I do a lot of development in less time, like 200 plus development workflows, and whatnot. So that's me. Bryan Robinson 2:28 Nice. And now, outside of like the teaching and the and the technology, what do you do for fun? Ahmad Awais 2:34 Ah, that is actually a tough one. So I'm actually an electrical engineer. They're like, they're, like 15 or so electrical engineers, my family before me. And all of them graduated from the same universities when I asked what should I do this at electrical engineering is what you should do. It's the mother field of computer science and everything. So but my hobby was actually writing blogs. I've been writing content for over 16 years now. So writing blogs, I ended up being a designer, the end front end developer then full stack. So that was the road that took me towards where I am right now. a software developer web developer, per se. So this used to be like my hobby that I used to do. It's now my job so I'm officially boring. But for years now I've been trying to pick up one another one other hobby, you know, for, for take something beyond this, but that thing came out to be teaching, but it's also related to this. So I organized a lot of meetups I go to, you know, different local events in talk about, you know, brain dumping what I did last week and whatnot. Beyond that, I used to play a lot of football back in the day, trying to pick that up nowadays again, because I can put on so much weight since then. Ahmad Awais 3:57 But that's me. My hobby became a job and I'm boring. Bryan Robinson 4:00 That's, Hey, there, there are worse things to happen. Right. Cool. So let's, let's talk about the JAMstack a little bit. So obviously, you've been doing JavaScript for a while you've been in the developer communities for a while. What was your entry point into this idea, this methodology that is JAMstack, static site, that sort of thing. Ahmad Awais 4:17 Okay, so as I mentioned, I love blogging, and blogging and like, with, with time, blogging has become more and more complex. It's like, you cannot just have one single theme for all of your ideas. So that's that's me. You know, sometimes, while I love the site that I built for my blogs, and whatnot, sometimes an idea would come into my head and it would need a different concept would need a landing page of its on its own sort of thing. But I wanted to integrate that into my current workflow, being a WordPress developer that helped a lot like I was kind of building the core and the REST API was kind of being worked on for WordPress. Ahmad Awais 4:59 So we could Probably build static pages inside of WordPress as well. But at the same time, I was doing all lot of demos, I would go to these events in talking about stuff. And I never liked kind of software that I use for presentation. So I wrote this small sort of, you know, me specific presentation module that was web, HTML, JavaScript and CSS in it, you on too many other open sourcers, especially my wife, we actually met through open source. So she had well a static site generic called Poodle, which would help her in many other teachers in her startup to teach but, you know, developers about building small stuff. Ahmad Awais 5:48 It was this was before codepen was like the go to, you know, sort of thing online. I think debate was around. It's not around anymore. Lea from Prism kind of build it. But that was the idea behind it. You know, when people are learning Android development, it's, it's, I think it's relatively easier like, you learn this language. And this is your IDE and go build something when they are learning native applications. It's, you know, learn swift or learn c++ and then go build something. But when you invite them to the web developers, it's like, you learn HTML, but it's not really a language, you learn CSS. It used to not be a language, you can now write follow ups on it. There are pre processes post processes, then, you know, it's a giant big mess. Ahmad Awais 6:39 And then comes JavaScript, and the frameworks and now matter frameworks, so it quickly becomes a cumbersome job to not only teach, but get students excited about what web is. So I initially kind of became a very big fan of the zero configuration sort of tooling. Because at the core of my heart, I'm actually a lot more into automation than even teaching or anything, I automate a lot of my workflows. So automating, you know, Webpack, or some sort of configuration, automating modern cutting edge stack, kind of introduced me to JAMstack, you know, that that is how I got into how I want to build cutting edge landing pages or cutting edge web, cutting edge progressive web apps, but I don't really want to care about upgrading, Webpack configuration and whatnot. But I really want those new features that Dan Abromov just kind of announcing in React. But I don't have time to go ahead and improve that on all my apps. So that is how I ended up the JAMstack. Bryan Robinson 7:50 Nice and a lot your students I'm sure to like they don't want to have to deal with with any of that. I just want to be able to like here's the little bit of code that we're learning today. Hey, it works. Ahmad Awais 7:59 Yeah. My I remember that in back in 2011, I will ask for you know, raise your hand if you want to become a web developer and like, there will be one or two people, everyone was into image processing, machine learning. And at least from my meetups in my conferences right now, when I asked this question now they're like, 90% plus audience are like, yeah, I want to React. I want NodeJS. So that excites the hell out of me. And I think stacks like JAMstack, have something to do with that, you know, making it easier for developers to kind of show off what they are made of you know? That's It Bryan Robinson 8:39 Yeah, get get to writing features faster. Ahmad Awais 8:42 Yeah, it's, for example, right now. a pupil of mine kind of reached out to me. And he asked, Is there a no-code way to build JAMstack? I said no. And that kind of that kind of kind of like I started thinking about it. Okay, JAMstack is, I know JAMstack is new but JAMstack is the way V developers were using cutting edge front end or trying to express themselves. And for at least for now, it's not really accessible for folks who are not like, developers. Ahmad Awais 9:15 So so it has sort of kind of, we've sort of kind of pivoted to this stack, which is like developers friendly. In the moment, you'll kind of hear that, okay, here's a site is built on JAMstack, you kind of get to know that. Okay, he's definitely a developer. So it this is sort of a I think community spirit that is happening and where, like, not every other stack like this. I don't I'm not saying it's good or bad. I'm just saying that. This is it. How it is I perceived that front-end developers nowadays, for things that are either production friendly or not production friendly, are expressing themselves through JAMstack. Bryan Robinson 9:53 Yeah, and the great thing is like if you notice a little bit about those web technologies, you can upload us a site and it's a JAMstack. So At that point, like, do you know a little bit of JavaScript? You're good to go? Ahmad Awais 10:03 Yeah, definitely. If you had a static website, I see like a couple of really senior engineers at Google. I think, Paul, he was kind of converting his old static website demos to JAMstack. And you're like, Okay, this is fun. Now, I can do this with this. Okay, I just added this bottom board and our progressive, as well Bryan Robinson 10:26 So kind of how are you using the JAMstack professionally nowadays, cuz obviously, you're with Cloudinary. You're making a whole bunch of demos, how are you actually piecing all that kind of work together using the jam stack? So a Ahmad Awais 10:38 Good question. Personally, I kind of was for what gets me early on, like, I use markdown a lot. So I use my time for stuff that should not be. I write my production emails in markdown. So and that is a really interesting use case. And then John came along and he built MDX, and then writing your emails with MDX it was really awesome. But to kind of render MDX, you kind of need to attach yourself to some sort of stack, I ended up Gatsby. And then I was releasing this course last year. This is actually a very big, giant mess of over engineering. If you kind of look at look behind. It's you know, stack it's, it's PHP, LAMP stack, LAMP stack, and then go microservices, the Node JS API's, and then it's, the front end is in Gatsby so ... Bryan Robinson 11:37 it's a little bit of everything. Ahmad Awais 11:38 Yeah, I spent a lot of time just building in elements that would be mine. For the sake of over engineer, I am, you know, we I would just, you know, write small markdown in just send it out through a bunch of Amazon, SaaS API's to just a couple thousand users who are subscribed to me. So so definitely When I was building the fernan I didn't really want to mess around with CMSs you know, I like them, I know their value, I do not want to be alerted one day okay, the site you're selling your course on has been hacked You know, there's a massive update that you need to take a look at. Ahmad Awais 12:19 I just wanted to kind of produce a static page and be done with it because there are good parts of JAMstack from production from security point of view. But because of those static ness of JAMstack, there are things that you need to rely on like. Like for example, services, you know, SaaS for example, you are use Stripe for payments, and then different sort of ideas kind of come into being if now you are kind of using a backend-less site, but now if you need a backend the old backends might not be that friendly, with the JAMstack, so you need something like, which is friendly for example, I ended up joining Cloudinary because they they do not know right now with their sort of Serverless media platform, you know, like the JAMstack. Ahmad Awais 13:12 The biggest issue that I had was coming from WordPress market to JAMstack is being managed by media so I used to have this awesome gallery that would kind of produce for example, when I upload an image in my blog in which is based on WordPress, it for just use Amazon cognitive services to fill out the alt text automatically. That's really helpful for me, you know, it is, is that accurate kind of throwing a ball so it was really good for accessibility. But with JAMstack, I didn't want to maintain my infrastructure for media. So I ended up looking at different services in that can actually help you land a job there as well. So I've ended up using JAMstack For my VSCode.pro site and for I have for, you know, developer DC demos like for example, developer advocates build a lot of proof of concept demos that they want to kind of showcase to different developers throughout the community when they present when they go to meetups of endearing workshops. I think JAMsstack is like, really good use case there. You end up building something that is performant out of the box, even if you don't want to have time to care about performance. Bryan Robinson 14:33 And the nice thing about the JAMstack in terms of like demos and stuff is that you could actually build a site, house all those and write a whole bunch of stuff in markdown and then inside of markdown break out into HTML, if you needed to, to, like showcase another piece of a demo. Exactly. Ahmad Awais 14:47 You know, people are doing all a bunch of things like I just saw it, it was this project running on GitHub, which would life transform mark down inside of you company you just in it is like like you can put it out there on your website and people would uttered markdown and it would render react base component. So that that's super awesome. Bryan Robinson 15:11 Cool. So So what is your kind of one, you know, jam in the jam stack? What what's the technology that you're loving a lot right now or the philosophy or what is keeping you in the JAMstack community right now. Ahmad Awais 15:26 I want to see, I came here because there's no denying about it. And then there's like, there are unintended consequences, which I'm said like, when you start building on JAMstack, you have a better chance of convincing your team your backend engineers that your API should be architected in a good way. Ahmad Awais 15:48 So before there, it was just you against them kind of debate. Now. It's a community of LAMP stack that understands that this is what they need. And so if he's sort of Like first class citizens a game for front end developers, even if they do not care about it, because they know stack and cares about that. Ahmad Awais 16:09 But for me, it's, it has always been about Markup. You know, if I have to pick one, Markup is, like, I love Markup, you know, even I have installed extensions customize them, like, for example, if I'm sending you code through my gmail account, I have built this theme called shares of purple, that my, you know, my code that I send you an email would be highlighted with my theme. So that kind of helps me do that. assembler graphics engine that will kind of when I click Send, it will render that component to HTML and send it to you via email. So So markup has been my go to thing I think, a lot of times, we developers, especially developer relation folks, a developer, advocates and evangelist, we are less productive because we automate everything Except for Markup. Ahmad Awais 17:01 Like, we would have all sorts of automated migrations going on and whatnot, and, you know, NPM modules and NodeJS, and whatnot. But when it comes to writing documentation, we're like, Okay, I have to open up that old SaaS software go into their UI in deal with that. So I have been able to be more characters and more newsletters, right, more documentations through sort of markdown markup automation that I cooked up, like, on top of, you know, my IDE is informal snippets and whatnot. And the same snippet library that I built for over like, over a decade or so, it's now useful in the context of jobs act, because like, I just converted to, you know, to any way through MDX or to other, you know, back home like for example, document building a documentation site used to be not so fun job, but now Vuepress. And I'm saying this as a React developer, you know, I am not a Vue developer. When I'm like building small demos, and my team needs a documentation site, I just go to Vuepress, they have an awesome presentation layer, and I really need to write as markdown. And it also kind of keeps my projects diverse. Like I'm using Node JS, js and VueJS in the same project. So Markdown, it is like, I think Markdown has gotten a lot of attention because of JAMstack. If you are in JAMstack community, in not paying a lot of attention to Markup, I think there's a lot that we can do there. Bryan Robinson 18:39 Yeah. And the nice thing is it doesn't really care what your framework is what your other technologies are. You can just write the same thing and port it from technology to technology. Ahmad Awais 18:48 Exactly. Even for them. But if you have this editor, or ideas that I write, and just markdown, I can write it anywhere from my tablet to my phone But I know it is going to be published really well in it has also kind of allowed me to kind of convince many other services that they need to support markdown. And if they don't, it's easier to kind of contrast from markdown to HTML and then send it to their API's, which they kind of need and James again helps me that doing that I don't have to bear that infrastructure. Bryan Robinson 19:23 Alright, so what is your like actual musical jam? You're outside of technology? What are you listening to? What's your what's your musical tastes favorite artists or favorite song? Or what are you into right now? Ah, Ahmad Awais 19:36 when I when I was hearing your forecast, I knew this is going to be the toughest. Because I hear all sorts of music journalists, I'm not native English, as you might have guessed already, so mostly, you know, songs in my language, but they would not resonate with the audience as much but for sake of tech That we do like for JAMstack I think I am a big fan of like every song that was written and the you know that feature of him The Greatest Showman I heard heard them so many times like I none of other you know songs could beat the rankings in there for iTunes for my personal setup and even you can find it in my you know teens blogs as well for example, if you take a look at my Create button blog project and you take a look at the change of section you will see I'm quoting a million dream song like it's at so perfectly mastered our you know, technical community like it's every night I lie in bed. The brightest colors fill my head, a million dreams are keeping me awake, you know, for the world. We are going to make it this is jam packed. So, you know, we're kind of reinventing how we used to do web. We moved from static to dynamic sites, and then started cashing the number Dynamic sites to static sites. And now we've ended up with this idea that that's not enough, we need to move back to static sites and let API and JavaScript handle everything. Well, we only write markup for. So a million dreams like of what is going to happen next, the kind of SaaS companies that are going to be built on top of jam stack that are going to make our jobs as the, you know, the experience of operational experience of our websites easier for end users. So it's amazing. So I've been listening to that a lot. Bryan Robinson 21:35 Nice. Alright. So what's something you want promote something you want to get out to the JAMstack community raise the attention of, again, Ahmad Awais 21:44 I think JAMstack is really awesome. But I kind of fear that for the sake of revenue generation, many companies are headed the same way. The way as we kind of came out of You know, for example, I don't know if this will catch on. I don't know if this is politically correct, but I want to dumb it down a little, you know, like, if we are reinventing how we did front end frameworks to meta frameworks, which are JAMstack frameworks, we do not need to create more complexity in there, even if there is a need further, I think the scenes not options, philosophy of purpose, books are really well, you know, make a decision for your audience and go with it, instead of introducing like 10 different ways of doing market with, you know, our framework, maybe have one recommended way of doing things. If that flexibility, nobody's going to hurt with that. Ahmad Awais 22:44 But having recommendations the scenes, and not making it complex, again, would really be helpful to you know, to the jam segment into a younger generation that is going to be that has already kind of fed up with, like, I, I gotten this question million times that how do you really keep up with the growth of humanity? So I don't know do not have a definite answer to that. I think we can keep up with the growth of our community. If we don't break down a little. Bryan Robinson 23:18 Yeah, yeah, make it make it simpler, make it easier to get into and then there's the advanced topics later that people can can dive into once they've gotten in exactly Ahmad Awais 23:27 like, if after learn react, and then the framework that was built on top of react, then the framework is not really useful. That framework I should be using their framework to augment what is complex to take the scenes for me that if concurrent mode is needed here at not, if if how I should be sending fetch request here in it is switching. My context has been switched from SSR to SSE. How the scene is like on mean, to know, what is the right way to face that API right now? I think if we are going to move into the direction of making things more complex, like, for example, there was this young apprentice of mine. He said that we used to live in a world of service hydrograph. I said, No, we used to live in several rendered apps server side is like new. So. So I, what I really want to happen as we make decisions for our users, so that things get easier for them. But help them kind of grow, you know, the makes their apps stays their apps. performance. Yes. Let's talk about best practices, not necessarily the thousands of ways you can do it. Exactly, I think, solutions instead of configurations as a good idea. Bryan Robinson 24:51 Yeah, exactly. So that's the call to action for the episode right there is go out and make simple documentation for the jam stack. Awesome. Cool. Well, I appreciate you taking the time. Time to be on the show today and and keep doing amazing things that cloud Neri and your personal stuff and all the writing that you're doing. I really appreciate you getting the word out there about all this cool stuff. Ahmad Awais 25:09 Thanks a lot for having me. Bryan Robinson 25:13 And as always, thank you to our listeners, thank you for listening. Thank you for viewing, liking, subscribing, all that stuff. It helps us keep pushing forward in this amazing JAMstack world. Bryan Robinson 25:25 Now it's time to talk about our sponsor a little bit. This week's sponsor is TakeShape. TakeShape is a content platform for the JAMstack. They've got a super user friendly CMS, a nice static site generator, and a dev friendly GraphQL interface. They're also working on their Mesh product, which helps helps you combine multiple API's into a single GraphQL API. So if you're interested in all that, go ahead and check them out at takeshape.io/thatsmyjamstack. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

15 January 2020


Sam Julien on authentication, Gatsby and the serverless methodology

Sam Julien on authentication, Gatsby and the serverless methodology

Quick show notes Our Guest: Sam Julien What he'd like for you to see: Auth0 Community Forum | His Gatsby Course on Thinkster | Get a Job in Tech His JAMstack Jams: The methodology and not needing to stand up a server for every little thing His Musical Jam: "Not" by Big Thief Other Technology Mentioned Gatsby Jekyll NextJS AirTable Twilio Our sponsor this week: TakeShape Transcript Bryan Robinson 0:02 Hello, everyone, and welcome to the first real episode of 2020 you're listening to That's My JAMstack, the podcast where we dare to ask the question, what is your jam in the JAMstack. I'm your host, Bryan Robinson. And today on the show, we have a speaker, author, teacher, a developer relations engineer at Auth0, Sam Julien. Bryan Robinson 0:24 I'm also pleased to welcome back to the show are sponsored TakeShape, find out more about their content platform after the episode or head over to takeshape.io/thatsmyjamstack for more information. Bryan Robinson 0:39 All right, Sam, thanks for joining us on the podcast today. Sam Julien 0:41 Yeah, thanks. I'm really happy to be here. Bryan Robinson 0:43 Cool. So tell us a little bit about yourself. What do you do for work? What do you do for fun? That sort of thing? Sam Julien 0:47 Yeah. So I am a Developer Advocate engineer at Auth0, which is just sort of a fancy word for Developer Relations. And so basically, spend my time I'm doing a lot of interacting with developers who use Auth0 the product and then kind of taking that feedback back to the different teams. Sam Julien 1:11 And so I, I do a lot of speaking at events and things like that and working on basically combining x technology with Auth0 and trying to find the problems with it. Sam Julien 1:22 And then for fun, I actually live in a rural area of the Pacific Northwest. I live on 10 acres of land with my partner. And then we have some friends who also are in the own the land with us, and so they come up on weekends and stuff. And so we have, we have 20 chickens that we raise, and we're getting some eggs from and yeah, and so ever since moving on to this land that's sort of taken over as my hobby. I feel like I was a lot more interesting when I lived in Portland as far as like hobbies and activities but that's aside from taking care of the property.I see you have a Breath of the Wild artwork on your wall. And that's basically my current hobby is playing Breath of the Wild. Bryan Robinson 2:13 You could think almost a lifetime into that. So that'd be fine. Sam Julien 2:15 Yeah, it's pretty crazy. I don't know if I'm gonna go ... So we only got a Switch a few months ago. And I don't know if I'm going to go for completion on it. But Amy is definitely. She's already I think she's already got like, 105 shrines or something. And she's, she's going for 100%. Bryan Robinson 2:36 You could spend a long time going for 100%. So you eat a lot of the eggs that you get fresh from the chickens? Sam Julien 2:43 Well, we we just actually just started laying. Like a week ago, actually, we got them when they were chicks. And so I think we've almost got a dozen at this point. So we're probably going to start eating them pretty soon. There first ones are always kind of duds because they're like trying to figure it out and not fully formed. And so but I think we're just about there to start eating them. Bryan Robinson 3:10 All right. Well, this is this is neither a chicken podcast nor a gaming podcast. Let's let's talk about the JAMstack a little bit, right. Unknown Speaker 3:17 Bryan Robinson 3:20 So what was kind of your entry point into this idea whether there was static sites back in the day, JAMstack nowadays? What's your what's your entry point? Sam Julien 3:28 Well, I mean, aside from, you know, the, the, the real static site being like, index.html and everything. Aside from that, I would say my introduction to the JAMstack was through Gatsby, and my introduction to Gatsby was just through, umm... So before I was in Developer Relations at Auth0, I was on the content team. So I was writing tutorials and stuff and we sort of went through this process. The blog at Auth0 is in Jekyll, and there's sort of this ongoing debate internally of whether to migrate to Gatsby or not. And I don't, I don't know if they're going to end up doing it or not. Because you know how it is with wanting to rewrite a platform. It's like, it's like, is this a good idea? Like, legacy code is still, it still works. So. But uh, so anyway, so that's so some colleagues on that team, were telling me about Gatsby. Sam Julien 4:24 And so I started looking into it. And I kind of just like instantly fell in love with it and started messing around with it and building stuff with it and looking at everybody else's blogs and portfolios that they were making with it. And it just really like scratch the itch for me of both being a developer and a writer, and I just really liked it. So then that kind of led down the path of the rest of the jam stack and all that. I guess Bryan Robinson 4:51 So, when you got into Gatsby, had you done a lot of react previously or was that new too? Sam Julien 4:56 It was actually kind of my way into React. Because I, I'm historically an Angular developer, like I came from C# and then like C# and Angular kind of go really well together. And so I've done I had done a bunch of Angular over the last few years. And then, but Auth0 basically uses React almost exclusively internally. And so I was, it was already sort of on my list of things to learn. But Gatsby was sort of a nice, like way into react because it handled all the tooling and everything, since it's just, it's basically just a supercharged create react app. And so it sort of gave me this nice platform to just dig into react, while not having to kind of worry about the all the tooling involved. Bryan Robinson 5:50 it's also got, I think, I think, a pretty strong set of opinions to which helps kind of guide on best practices. Sam Julien 5:56 Right, exactly. And an Angular like, angular has A ton of strong opinions. And so that's sort of what I was used to. I mean, it's sort of there's pros and cons to both approach both approaches. But I think when I was first starting to learn react when I joined Auth0, I was a little like dizzy by just how many different ways you can slice and dice react. And so Gatsby really did kind of help just kind of narrow the focus of like, here's like, a set of tools, like a ready made thing for you now just write some react and and figure it out, you know. Bryan Robinson 6:31 So, how are you using the JAMstack professionally? I mean, I know you said that they're debating coming to Gatsby and they are on Jekyll. But you're not on that content team anymore. Are you doing some JAMstack type things and your developer relations that Auth0? Sam Julien 6:46 Yeah, so I I, I'm sort of doing both stuff personally and professionally with it from the professional side at off zero. It's mostly I've been really kind of digging into What authentication looks like in the jam stack because it's kind of an interesting. It's an it's an interesting, new problem set, because it's sometimes it's more like a traditional web app. And sometimes it's more like just a single page application. And sometimes you have these serverless models that you have to authenticate and stuff like that. Sam Julien 7:23 So so I'm sort of in this research phase right now if like trying to build different prototypes with Gatsby or Next or you know, things like that and wrap my head around what the problem set looks like of like, when is it more like a traditional web app? When is it more like a spa? When is there sort of this in between weird case of serverless stuff and all that and so that's sort of what I'm doing now is is figuring out how Azzurro fits in with jam stack stuff and how we can make it easy for developers and that kind of thing. And then from the on the personal side of things, I'm using Gatsby to build, build, I'm rebuilding, I am rebuilding my own personal site with Gatsby, which is I still am not convinced it's a great idea, but I'm going to do it anyway. And, and, and then I built I loved Gatsby so much, but I, I couldn't find exactly like the way of teaching it that that I liked. And so I built a course for a platform called things through.io on Gatsby just sort of like getting started with Gatsby. And so that's minute sort of another side project endeavors this, this course and different content, I ended up doing a couple egghead lessons on some Gatsby stuff. And so that's sort of my Gatsby sort of fueling my side hustle as well as my day job right now. Bryan Robinson 8:57 Cool. So uh, so what is kind of the thing that brings you to the JAMstack in terms of what do you love about it? What's your what's your jam in the JAMstack? Sam Julien 9:07 I really think this whole concept of not needing to pair a server with a front end is really nice. I just think that nowadays there there are so many different like SaaS products and like serverless products and things like that, that like, it seems like for a lot of cases other than complex enterprise stuff. You don't really need to spend a lot of time messing with building your own server and all of that, you know, it's just like, if you're just doing if you're pulling in data from outside, you know, like Twilio or wherever, you know, or AirTable or things like that. Sam Julien 9:53 Or if you're just making like a recently, a lot of developer relations as you know as building a lot of sample apps. And so recently I've been thinking I would always build like a little Express server to serve up data and stuff like that. And now I'm sort of like there's not really any point, I could just put this in a serverless function and reuse the same thing over and over again, and I don't really need it. So I'm really liking that, that the JAMstack has sort of opened up, like it's making so much stuff easier for a large a large percentage of apps that people need to build, you know what I mean? Bryan Robinson 10:31 Yeah, and so so you come from like a C# background so you're obviously not afraid of server side languages. I myself, deathly afraid serverside languages, so kind of, do you have a point where you would go and spin up your own server now or are you going to just be going in this serverless way going forward? Sam Julien 10:49 Well, I mean, I can see so like my my previous jobs were at like in doing like line of business applications for like bigger companies. One was like a finance company one was like a renewable energy nonprofit. So there, those places have a lot of complex business logic that has to happen, you know, with a bunch of data in a database where you have to manipulate and run a bunch of business rules and stuff like that. And to me that, that seems like kind of the obvious use case for like a real server where you actually, like, have a lot of stuff that has to interact with the database and, you know, sort of the more traditional route of, of servers and databases and all that. And so, but I think for a lot of modern stuff that's not enterprise level, the serverless JAMstack stuff works pretty well, you know, and especially with having node I mean, you can sort of just use JavaScript all the time and it's just things are just so much easier. It's It's really nice. Bryan Robinson 11:54 Front End Dev and designer like me, like it just makes my life so much more pleasant Sam Julien 12:00 Yeah, for sure. Definitely. Bryan Robinson 12:02 So so the kind of the whole methodology of that is is where where you're going with your jam, right? Sam Julien 12:07 Yeah, yeah. Basically the whole philosophy. Bryan Robinson 12:10 Yeah. So. So in terms of serverless and all that, right, so you said you started exploring authentication in this world for all zero. How's that going? Because I'll be honest, I haven't done a whole lot of research into it yet. Sam Julien 12:24 It's interesting. And one thing we can link to is one of our architects named Sandrino wrote this really cool article on NextJS and Auth0, but I mean, it's with Auth0, but it also anytime we write about Auth0, we try to also have things that are basically broad, more broad for authentication in general. But we're sort of figuring out that there's these like I said, sort of three different models basically, of like, sometimes it's more like a traditional web app because you're basically, if you're if you're doing everything server side, then it's sort of more like a traditional web app, right? Because you're, you're not really running anything in the browser. I mean, you're running it in the browser, but you're not. There's nothing dynamic happening in the browser. And so you would kind of go with the standard, standard web app approach. Sam Julien 13:21 And then there's things like Gatsby are sort of like Gatsby is interesting, because it's, it got its start as like a static site generator, but it's never actually like, holy a static site, right? Because it's still react, running, you know, like as a spa. And so that sort of this weird case where it's like, it's kind of a static site, but really, you would authenticate it just like you would a spa, pretty much. But then there's this like Next has this whole thing with the serverless deployment model. And from there, you sort of have to determine like where I need The authenticated data like do I need it when the page first renders? Or do I need it later? and Sandrino, you know, has some nice diagrams in that article that will do a better job of explaining it than I can in audio. Bryan Robinson 14:14 Lovely Mouth Blogging as Dave Rupert would say Sam Julien 14:16 Yeah, yeah. Yeah. So that stuff's really interesting. And I'm still sort of wrapping my head around at all and building out sample apps and stuff like that. But but it's, it's interesting. And it's definitely as the JAMstack continues to be as popular as it is more and more people will need to understand how to protect all their data and everything. Bryan Robinson 14:39 And Auth is probably the one of the biggest challenges to like adoption in the JAMstack right now to like, how do I protect pages when it's just static? Sam Julien 14:47 Yeah, yeah. Yeah. Our architecture and content and developer relations at Auth0 have all been sort of mulling this over for a little while, because I think actually, for this article, Sandrino was talking to people outside and stuff because it's sort of like how do we want to do this? You know, like, what are the best practices here? Bryan Robinson 15:08 Let's create some standards for it and kind of go Sam Julien 15:12 Yeah, exactly. Bryan Robinson 15:15 So let's let's talk musical jam now what are you listening to? what's what's your favorite song or musician or genre? Sam Julien 15:23 I finally I have a great answer for this now and it's because So have you ever heard of the band Big Thief I have made so they on their last on their most recent album, their their single is called Not. And it's got it's like one of the my, like, favorite songs that I've heard in several years. Like there's something very emotional about it. That is just really awesome. And it's nice because I yeah, I just haven't I haven't felt that kind of like connection to a song. In a really long time so I've been I've been playing that a lot not by big thief. Sam Julien 16:06 Let's see what else what else have I been? I feel like as I get older I have less and less like emotional connection to things because I'm not young and nostagic anymore but let's see what am I've been listening to you other than that. I like Tool's new album a lot. I liked Angel Olsen's most recent album, I'm a really big Angel Olsen fan. She's sort of like the singer songwriter type, but her album couple years ago, called What was it called My Woman in 2016. That was a fantastic album, if you haven't listened to it. Bryan Robinson 16:46 That's actually my favorite thing on the podcast other than learning about new technology is learning about all these like drastically different musical tastes and going and listening to what what everyone says. Sam Julien 16:53 I love that. I think that's a really great when I saw that question in the invite. I was like, Oh, that's cool. That's Great I like that. I'd be curious, what's what's your current jam right now? What are you listening? Bryan Robinson 17:05 You turn the tables on me! Sam Julien 17:06 I'm turning the tables Bryan Robinson 17:07 First time! You know, I just I'm behind the times always like that perpetually. But I just this past summer went and saw Hamilton, the touring company came around, and I didn't think I was going to... Like, I thought I would like it; like musical theater well enough, but like, I am in love with it. And it gets me going in the mornings like it really pumps me up. And then I go and research all the founding fathers and realize how horrible they were. But it it gets me going at least. Sam Julien 17:36 Yeah, now, Hamilton; Amy was really into Hamilton. And so I kind of I'm like neutral towards musical theater. Like, I don't I don't dislike it. I don't you know, but Amy was really into it. And so when it came to Portland, I got us tickets and we went, and I'll admit, like, I loved it. I thought it was like it was not overrated at all like I kind of went into it expecting it to be a little overrated because it's so popular, but like, I thought it was fantastic. Bryan Robinson 18:07 There's a reason it won all those awards. Sam Julien 18:08 Yeah, I mean, some some things are hyped up because they're actually that great, you know, like, like Beyonce. Bryan Robinson 18:17 Yeah, exactly. I found that running to it actually works really well, too. So I'm trying to get into running and that has just the right beat for how bad I am at running. So Unknown Speaker 18:26 Bryan Robinson 18:46 I didn't even know he had written anything before that. And I researched what he had done was like, Oh, you've done this before. Okay. Sam Julien 18:51 Yeah, yeah, he's Yeah, he's super talented. But that one is about like Washington Heights in New York and stuff like that. It's really great. Bryan Robinson 19:00 For someone indifferent towards towards musical theater you you've got at least that much now. Sam Julien 19:05 Yeah, that's true. I I kind of Yeah, I would say. Other than that though I'm I tend to be pretty neutral about about theater, I could take it or leave it. I respect it. And I respect that other people love it. It's just not it's just not my thing. Not my jam... Bryan Robinson 19:24 All right. And so let me let me ask, Is there anything that you would like to promote? Get out to the JAMstack community? Anything that you're doing that you won't get out there? Sam Julien 19:30 Yeah, I'll say on the on the professional side. Yeah, just keep an eye on Auth0 for JAMstack stuff because we're actively working on it. And, and if people have like input or things they want to talk about, we have a great community forum. So if you're running into authentication problems in JAMstack stuff, like definitely let us know because we're always kind of putting our ear to the ground and trying to figure out what problems people are having. So we can Try to solve them. Sam Julien 20:02 And then personally Yeah, the the Gatsby course on Thinkster. I'm really proud of it. I think it's a good course. And so that would be good. I'm also I just started, I'm starting this new project called Get a Job in Tech. I'm a self taught developer, I transitioned from finance. And I was lucky because I had some mentors that sort of shepherded me along the way, and not everybody has that. And so I'm starting this new, it's still really early, but basically, I plan on I'm already like, right, sending out emails and stuff and writing content for it, but it's basically to help people with the like, meta skills of getting your first job because I feel like a lot of people think, you know, they learned they learned some stuff on like, Free Code Camp or any any other great site on learning to code and then they sort of get stuck because they're like, okay, where's like, how do I actually get the Job, and you just sort of throw your resume up on a lot of places. And then you get these rejection letters that are like, you don't have any experience and you're like, no duh don't have any. Bryan Robinson 21:10 It's a Junior position, come on! Unknown Speaker 21:12 SamJulien.com so you can always go there and I have an occasional email list and stuff like that. So if you ever want to keep up with talks I'm doing or lessons I'm publishing on egghead or thinkest or anything like that. Bryan Robinson 22:00 Perfect. Yeah. Awesome. Well, thanks for taking the time to talk with us today and share your insights. And I hope that you keep doing awesome stuff at all zero and that your chickens eggs are delicious. Unknown Speaker 22:09 Bryan Robinson 22:12 Yeah, no problem. All right. Well take care. Bryan Robinson 22:18 All right, it is sponsored time, I want to take a second and thank this week's sponsor TakeShape. TakeShape calls, their offering a content platform. And that's, that's really the best description. They have a handy CMS, a static site generator, and a simple GraphQL API all ready to use on the JAMstack. Bryan Robinson 22:35 Beyond all that they also have new features coming in all the time, like their new Mesh product that allows you to mix and match data from multiple sources into one neat GraphQL interface. If all that sounds interesting, you be sure to go to takeshape.io/thatsmyjamstack to find out more. Bryan Robinson 22:53 And as always, I want to thank the JAMstack community for listening for responding on Twitter for talking about things in communities. Just for being an amazing place to work and to play and to spend my time. So if you like this podcast let me know by hitting the like, subscribe, all those good things and whatever podcast app you use, and until next week, keep doing amazing things and keep things jamming. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

8 January 2020


2020 JAMstack Year in Preview

2020 JAMstack Year in Preview

Transcript Bryan Robinson 0:00 Hello, everyone, and welcome to a very special year end episode of That's My JAMstack. I'm your host, Bryan Robinson and instead of our usual format of a q&a with just one JAMstacker, I've asked one question of many of our guests from the past year, that question very simply was, "What are you most looking forward to professionally and personally in the JAMstack in 2020?" Their answers were all amazing. So buckle up for a good ride. Bryan Robinson 0:23 We'll be back next week with our usual format. So be sure to like, subscribe, review and all that. But without further ado, let's go ahead and dive into all those answers. First up, we have Andy Bell, a designer and developer who was as it turns out our very first guest on this podcast. Andy Bell 0:43 The thing I'm looking forward to the most is totally a professional thing with the JAMstack. I'm working on some "STUFF" shall I say that hopefully will help people to make money on the web easier and the JAMstack plays a rather large part in that. But at the same time, the real interest is how a central system can play well with both the JAMstack or more traditional stacks, the focus being on making certain things as easy as possible for everyone. Andy Bell 1:22 Now I'm being very vague about what I'm talking about, because the plans that I've got in place are still very vague. But the important thing is, is that the JAMstack has paved the way for this sort of thinking to happen in the first place. Because the JAMstack's a completely different way of thinking to what we've been used to thinking in the past where the power is being put back in the hands of front end developers. So exciting stuff and the JAMstack is only going to keep getting better in 2020. Bryan Robinson 1:58 Next, we've got Laurie Barth. When we chatted with Laurie in Episode Three of the podcast. She was a software engineer at a company called 10 Miles Squared. Now she is an engineer at a little JAMstack company you may have heard of called Gatsby, Laurie Barth 2:11 There's a couple of things that I think are really interesting. I think we're moving away from this kind of default assumption that JAMstack means static content, and kind of everything done at build time. And into more dynamic functionality, serverless functions and lambda functions and all of that, and allowing us to make full applications that are really the same as kind of RESTful applications. But with the benefit of performance. Laurie Barth 2:43 Kind of on the flip side to that is we are making larger and larger sites with more and more static content where we can which is fabulous, but that's a lot of build time. And I love that we're starting to see people you know, I'm biased because Gatsby Cloud is doing this, but are starting to see people take a look at what that build time looks like and making that more efficient. And deciding and determining that being able to see real time preview and all of those things is still super important. But we still want to get our performance benefit of doing so much of this up front in the build versus the runtime step. So I'm excited to see both of those things kind of they've started but I think they're going to become a little more robust and talked about and common to the larger tech community. And I'm excited to see what people do with those possibilities. Yeah, so looking forward to 2020 Bryan Robinson 3:48 Next up from Episode Seven, we've got Gift Egwuenu. Gift is a software engineer and one of the Co-organizers for Concatanate Conf and JAMstack Lagos. Gift Egwuenu 3:58 I am really excited to continue working with the JAMstack in 2020. And recently, I've seen a couple of services pop up in my reader that I'm excited to try out and also do a lot more with serverless architecture because I feel like I've only touched the hem of the field. I want to do a lot more. Gift Egwuenu 4:23 And also there are other things I'm looking forward to try out as well. There is the Netlify Build plugins that just got to know about recently. I feel like the JAMstack is evolving over time. And 2020 is going to be the year of adoption because I feel like so many people right now adopting the JAMstack it makes me so happy. So yeah, I'm looking forward to these things in the next year and super happy to continue working with the JAMstack. Bryan Robinson 4:53 And now from our eighth episode, we've got James Quick. James was a software engineer at FedEx when we last spoke, but now is a developer evangelist with Auth0. James Quick 5:03 So what am I looking for most in the jam stack in 2020? Well, for me personally, you know, I've got two two projects that are on Gatsby static sites, using Netlify as a host using some lambda functions and Netlify to kind of support some of the backend stuff. Looking at really making improvements on those websites. So just kind of improving my brand, but also taking advantage of more of those features out there in the JAMstack. James Quick 5:25 I'm really a big fan of the lambda functions in Netlify. I think I can kind of fill any gap for the most part that I need with some sort of back end functionality. They can fill it that way with functions and just kind of take care of it and not have to run my own server and I have to do all that stuff. Just basically to find that one function and have Netlify serve and host it for me. James Quick 5:44 Really excited for just like company wise, I want to see what Netlify does this year. I want to see what Gatsby does. Those are the two two big technologies that I follow in the JAMstack. And I think they they both got funding this past year. They both have lots of things in their backlog. I don't know what those things are at all. I don't have any personal insight, but you can tell that they're really excited for the things that they're going to do going forward. And I'm just excited to see see what that turns out to be, you know James Quick 6:08 And the Angular side, Angular just came out with a static site generator. So now you've got them across Angular, React and Vue, looking into going to probably spend some time looking into Vue this year. So I want to see what kind of the static site aspect of that is. I don't really have any insight into it at all at this point. James Quick 6:24 But yeah, I think for me, just the community is going to keep growing, you see more and more conferences, you see more, more blog posts, more podcasts, more people are talking about it. And this really feels like, like people were talking about it last year, and maybe started really talking about it the year before last year kind of had that consistent growth, it really seems like it's almost at a peak point where you're going to see a lot of a lot of people converting over and really not just asking the question, what is JAMstack, we're really diving into leveraging it for their own systems. And I just I'm excited to see how that grows. All the tools that come out, get play with new stuff, and to get to add extra features to to my sites and other people's sites as well. So I think it'll be a big year for the JAMstack in 2020. And I can't wait to see what happens. Bryan Robinson 7:08 Now we've got Brian Rinaldi, a developer advocate for Stackbit that I chatted with in our ninth episode. Brian Rinaldi 7:14 What I'm looking forward to most for JAMstack in 2020 is moving from a curious niche in web development to becoming one of the primary ways developers architect websites. It felt as though 2019 was a turning point for JAMstack. Tools gained adoption, new companies developed in the ecosystem. And people started to really notice it. For example, I had a conversation with a well known company about a year ago that thought it was a fad unworthy of their attention. And that same very same company this year, told me they're ready to invest in it. So I think you know, if you think about the technology adoption curve 2020 will be the year we cross from the early adopters to an early majority and see that adoption increased dramatically. Bryan Robinson 7:59 Our Next answer comes from our guest for Episode 10. Tamas Piros. Tamas is an educator at JAMstack.training and a Cloudinary developer evangelist. Tamas Piros 8:10 I actually look forward to two things in 2020. One is related to static site generators. And the other one is related to API's and headless CMS. Tamas Piros 8:22 Basically, I believe that today, one of the key issues of the JAMstack, and the static site generators that are out there today is the fact that they can't do differential builds. What I mean by that is, if you have a site and you make a very simple change somewhere in the site, or just update a single blog post, static site generators will then rerender the entire site, which means that it's going to be potentially time consuming and there's absolutely no need to do that. So I know that Gatsby's been working on a solution and I hope that Other tools that are out there will also come up with their own solutions to do some sort of incremental builds, based on changes or based on maybe a user configuration. Tamas Piros 9:13 The other thing that I look forward to is, as I said, related to headless CMS and the media, I find that today, the web is really visual. And therefore every website that we use, and every website that is being developed has a lot of images and videos. And of course, when you think about a content management system, regardless whether that's headless or something like WordPress, or or some others, they also need to have a way to allow users to utilize images and videos. Now today, there are only a few headless CMS out there that actually allow you to manage images and videos and I hope that more of them will have integrations with tools like Cloudinary, for example, for allowing the users to embed images in blog posts or in product descriptions or any other place. Bryan Robinson 10:12 And our final answer comes from the future. Believe it or not, in next week's episode, we'll be talking with Sam Julien from Auth0. He was kind enough to send me an answer to this question before he was officially on the show. Sam Julien 10:25 What I'm looking forward to in the jam stack in 2020 are a couple of things. First, there's a really cool project in the Angular community called ScullyIO, which is sort of going to be an iteration or a version of Gatsby but but with Angular instead of React. It's not exactly the same as Gatsby. But it's a JAMstack or static site generator for Angular. So that's one thing. Sam Julien 10:53 I'm also just generally excited for the direction that the JAMstack is going to go on the front end. I think people are finding there are a lot of benefits to Next. And there's a lot of benefits to Gatsby. And I think the community is going to continue to evolve and sort of merge together some of those feature sets as devs hammer out what works the best for doing static sites or server side rendering along with serverless functions for the front end. And yeah, I think it's going to be a great year. Bryan Robinson 11:25 So that's it for our 2020 year in preview for the jam stack. Like I said at the end of this episode, we'll be back next week with our usual format. Until then we here at the That's My JAMstack podcast are wishing you and yours a happy, prosperous and educational New Year. We'll see you next week. And as always, thanks for listening and making this community amazing. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

31 December 2019


Daniel Olson on Wordpress as an SSG, Third-Wave web dev and much more

Daniel Olson on Wordpress as an SSG, Third-Wave web dev and much more

Quick show notes Our Guest: Daniel Olson What he'd like for you to see/remember: Use the term "static" sparingly | Join in the community and share problems, solutions, etc. His JAMstack Jams: Wordpress (headless and/or as a static site generator) | Netlify's build process/hooks His Musical Jam: Poolside.fm Our sponsor this week: TakeShape Transcript Bryan Robinson 0:02 Hello, everyone, welcome to yet another episode of That's My JAMstack. I'm your host Bryan Robinson and this will be the last regular episode of the year will be back to official episodes of The New Year. But we'll be tiding you over with a special holiday slate of episodes where various guests from this past year will be talking about their thoughts on the JAMstack in 2020. Bryan Robinson 0:20 This week, though, we have the COO of a company called DigitalCube. He's a self taught web developer and a JAMstack enthusiast I'm very pleased to have on the show Daniel Olson. Bryan Robinson 0:29 I'm also pleased to have back this week our sponsor TakeShape. You can hear more about their content platform after the episode or head over to takeshape.io/thatsmyjamstack for more information. Bryan Robinson 0:44 Daniel, thanks for being on the show with us today. Daniel Olson 0:46 It's a pleasure. Bryan Robinson 0:47 So tell us a little about yourself. What do you do for work? What do you do for fun, that sort of thing. Daniel Olson 0:52 I'm the Chief Operating Officer at DigitalCube. I get to work on all the products we develop and travel a bit sharing some of the work that we do. One of those products I work on is called Shifter. It's a static site generator for WordPress and some might say it's a serverless hosting platform. Another product I get to work on is called Animoto. It's a managed WordPress hosting solution built for enterprise. We're only limits the options that AWS can offer us, which is a lot. But my my role is a bit of a variety show. Like many companies and the growing JAMstack community, we wear many hats. Most days I work on MVPs and do feature development. And the way I like to do that is through customer feedback. So my kind of my main jam is finding gaps where our products don't like cover and then building solutions with the designers and engineers around that. Bryan Robinson 1:44 Cool so what do you do outside of work? What's your favorite thing to do when you're when you're off? Daniel Olson 1:48 What do I do? Also a bit of a variety show. I'm in the kitchen a lot. I make a lot of food. I like to dine out and like You know, try different foods. I'm also a big beer guy, I run like a beer website on the side. And that's kind of my life is around like, you know, enjoying tastes. So if there's something to like something new to try, like if when I when I travel a lot, my co workers like to like push the boundaries a little bit, and they'll try to get me to eat like strange things, but it never really works out because I always enjoy it. Bryan Robinson 2:25 So what's your favorite cuisine that that you've tried? Daniel Olson 2:31 Maybe I don't hate me. Maybe some of vegetarian listeners might be upset. But I did go to when I was in Japan with my co workers after a meetup. Someone asked me if I liked sashimi, which Yes, I love sashimi. But we were in Fukuoka, which I didn't realize that sashimi me has lots of different meanings. And I've learned that in Fukuoka, sashimi could mean raw horse meat. Which is pretty, like common in Japan and in certain regions. So, I mean, you know, I'm game if everyone says it's good, I'll give it a try. And I was very impressed. I learned a ton about this, like, you know, like food category I never really knew anything about or I thought I knew about. But I would go back like in a heartbeat. I would love to do that again. Bryan Robinson 3:22 Interesting. Interesting that that surprised me. You caught me off guard with that one. Daniel Olson 3:26 Yeah, and you can eat all of it. There's certain there's certain pieces or certain cuts that must be grilled. And some of them you can or you don't have to so like they basically bring out like a like a grill. And you can use chopsticks and you just give it like a little bit of heat. For some of the pieces, some of the sausages you have to cook thoroughly. But most of it you can eat with you know, Ginger or rice or like pickled vegetables. It's it's a I think it's a good experience. If you're, if you have the opportunity, I recommend it. Bryan Robinson 3:59 Interesting. Cool. So obviously not not a food podcast, more of a more of a tech podcast here. So let's, let's talk about your, your enjoyment of static sites or the JAMstack, what was your entry point into this kind of philosophy of building sites? Daniel Olson 4:13 It's kind of a funny story. Um, my introduction to static sites was at, I worked at a branding agency for a number of years, and we're pretty small team, one of the other developers I worked with, he was, you know, kind of more familiar with the static sites and the services generators out there. And he told me about them and you know, we are WordPress shop. So thinking about, you know, the value or, you know, what the clients would need. It was always really difficult for me to, you know, jump ship and recommend that to our clients because at the end of the day, they're the ones who have to live with these sites and edit them and, you know, help like grow them. Daniel Olson 4:53 So, you know, writing markdown using like, a non familiar CMS backend other than WordPress. was kind of a hard sell. But we it still was in the back of my mind. But when I went to a conference in Philadelphia, where I'm from, and I met this group of, you know, Japanese developers, and they were working on this interesting product, and they introduced it to me as a "Third Wave". They're like, this is this is going to be the future. And they kept trying to explain it to me, I didn't quite get it. And I didn't actually really understand it until like a year after. But what they were trying to do is to bring some of the approaches that status like static site generators were doing to the WordPress community and like bridging that gap. And it didn't click at first and it really made no sense to me because it was explained as the third wave, but, but it makes total sense in hindsight now. Daniel Olson 5:52 So that was that was my first introduction. It was like I was kind of like I fell into it. But I also was like, living amongst it for For years not really paying attention to it, Bryan Robinson 6:02 So with with that what they were doing was that before WordPress had the API stuff was that before you could go headless with WordPress, or is that they were doing their own thing around that. Daniel Olson 6:12 It was it was kind of alongside so there was these, you know, two communities within the WordPress ecosystem at that time. And it was people who are developing, you know, they're like power users are using plugins to do things. They're doing theme development. And then there's this other track where, you know, they're a group of developers are really trying to push the boundaries of what WordPress can do just as a blogging tool like they're using it as a full featured CMS. And that was when headless really kind of took off the REST API was getting a lot of attention. Daniel Olson 6:41 Some of these other projects, and even plugins, were using the REST API, but it's I think, I call them that like their technology magic tricks, like, yes, it works. And then like you build a little demo, and then let's see how far we can take this magic trick and like you build out these incredibly large sites using WordPress. Completely headless. But it's really just, you know, an extension of that first demo, like, are you doing anything different? It's just the implementation. Daniel Olson 7:08 But when I learned about the the project that these guys were working on, it was totally different. It was kind of a mix between the two. Yes, we want to give users the same experience that they're familiar with in the back end. But we also want to deliver the benefits that these other ideas can offer, like the benefits that jam stack has, or the benefits that headless has. So it was like kind of a cross between the two. But it was the WordPress REST API that actually enabled it. Bryan Robinson 7:40 True. Yeah. Cool. So would it be fair to say that kind of this idea of WordPress headless is where is where you kind of got into everything? Daniel Olson 7:49 Yeah, yeah. And it was, um, you know, we, at the agency I worked at we built a lot of just, you know, demo sites and like little product sites for clients and it at the time, it was like a total experiment you couldn't even do it natively in WordPress, it was an extension like you had to install a plugin to enable the REST API. It was that early. And now it's a part of core and we talked about it. It's, you know, this ubiquitous thing that, you know, everyone's familiar with it if you're in this community, but at the time, it was like, What is REST? What does that mean? And yeah, so it's, you know, I'm, it feels good to be a part of something that I've got to see grow over time. Bryan Robinson 8:30 Cool. And so so I'm kind of curious about about headless WordPress. I've only I've done magic tricks with it. That's about as far as I've gone into that world for, for WordPress in the JAMstack. What are some, some challenges y'all have been overcoming? What are some, some things for people to kind of be aware of if they start playing with this idea? Daniel Olson 8:48 So headless WordPress is I would consider that it's its own category. And the work that I do in the kind of the world that I live in, within like the development community, there's it's really three distinct categories. So you have like traditional WordPress, which is what, you know, people are familiar with that. And then you have headless WordPress which is decoupled. You're building your JAMstack site and using WordPress as your CMS or back end. And then you have static WordPress, which is kind of the in between. So we're using WordPress as a static site generator. So it's that's like its own special category. You're, you're not converting or building a new site using WordPress as your back end. You're using WordPress itself and generating the static site from that. That site itself, it's not there's no Developer Tools involved. It's just native WordPress. Bryan Robinson 9:46 Oh, interesting. So instead of like a cash, you're and then you're building in your build step from the actual WordPress files on a Linux server. Daniel Olson 9:54 Yeah, so it's actually the way that we do it is the the approach is service. So the end result the way that it's delivered. And the product itself is built as service. So we were using AWS lambda. So we're an AWS advanced technology partner. So about 50% of our team are just AWS engineers who have a deep understanding of those technologies and the infrastructure. And then about the other half are WordPress developers. So we work really tightly together to develop solutions that take advantage of what AWS has to offer, and kind of leverage all these capabilities for WordPress. It's not, there's like there's two ways to do WordPress in AWS, you run WordPress, just as a layer on top, and it's just there. And then or you could actually kind of integrate it into the services and just get a lot more of opportunity, a lot more power out of it. But the way that we're doing it is we use the WordPress REST API, which like I said, it was basically that was the catalyst that made this possible. Daniel Olson 10:59 The WordPress REST API the way that we use it, we use that to get to get a list of links from the WordPress site. So we we can, like at a quick glance, see every page that exists by hitting a certain REST API path. And then we pass that to AWS lambda, which then queues up a list of URLs to crawl. And then it crawls each URL seems it to an s3 bucket. And that gets served with CloudFront. So at the very basic level, that's kind of how it works. Bryan Robinson 11:29 Very interesting. And so you're, you're you're still using like WordPress, his own templates and all that, right. Daniel Olson 11:35 Yeah. So if you want to use the themes, same themes and plugins, you are free to use those as long as they there's certain exceptions like contact form plugins, they naturally in the WordPress world, they want to post data back to the WordPress database, which, at that point in time, doesn't exist because you've now created a static site and WordPress is no longer in the picture but There are some like opportunities and shims that exist. One of the I developed a couple of plugins that will swap out like action URLs within forums to send those to third parties, whether it's, you know, jam stack friendly, like forums as a service sites like a forum spree or form kit, or basin or even that with five forms. Bryan Robinson 12:22 Interesting. So I want one things I've always wondered about headless, headless WordPress is the idea that if you're using WordPress headless, and you're doing it like with your own static site generator on the side, you're really getting like 25%, maybe 30% of benefit of WordPress, that sounds like y'all are closer to like, 75 or 80% of all the benefits of WordPress, because I was I was always like, why would you ever use headless WordPress if you're only getting a small portion of the benefit of it? Daniel Olson 12:46 Yeah, and I see that too. And having like, really, like dived into the JAMstack ecosystem, seeing the tools that are out there, it's still growing. There's still a lot of rooms who for it to mature, and they're like things like gaspee the plugin ecosystem is like booming, there's, you know, there's a lot of stuff out there. But there's still more stuff in the WordPress world. So I get why people still want to use it like the theme themes are one thing, but also plugins, like having the opportunity to just search the plugin directory of the 50,000 plus plugins that exist, there's going to be some solution in there for whatever problem you need. And most of the time, it will work in that scenario, like even as a headless option. If it's a popular plugin, they probably have developed REST, like paths for it, to interact with it in a headless manner. Bryan Robinson 13:39 Yeah, but even then, like if you're if you're interacting with it in the headless manner, you then have to build that functionality into your templates unless you're using WordPress as its own static site generator at that point. Daniel Olson 13:48 Yeah, and in that case, you just use it natively, how you want to, you know, experience it naturally in the WordPress world. And then you just click a button and then we crawl your site generate a static version. And then power down WordPress. Bryan Robinson 14:02 Awesome. So So it'd be fair to say that headless WordPress is kind of your jam in the JAMstack, or do you have any other like products or tools, services philosophies that you're really digging right now. Daniel Olson 14:14 Um, I was introduced to. It's kind of funny. It's like, it's a feature that we developed. But I didn't really get much use out of it personally, until a customer had a very unique request. And it was the integration between our product and Netlify web hooks. And I started to use Netlify web hooks, just so you can basically build your static WordPress site on Shifter and you can deploy it to Netlify so if there's like, you know, I want to use Netlify Forms, I want to use Netlify analytics, I want to use the basic auth or I have another application and I want to keep all of my sites in one place. You can do that. Daniel Olson 14:57 But one of the things that I didn't really dive into was there build tools. So when when you do the web hooks, and you can customize the Netlify Builds you can get like really granular with all the different things that happen during your build runtime. And I like I don't know why I just never really got into that. But I, one day, I just kind of spent all day reading about it and, you know, learning about it and testing it. And I was like, blown away by all the options that they have in there. It's kind of it's a, it's a hidden gem. Like I recommend spending a little time reading about it. Bryan Robinson 15:28 Well, I'm nowadays they even have the ability to plug into into the build process. They have variables, you can set up to do a whole bunch of stuff that they're testing out. Right now it's in beta. Daniel Olson 15:40 Yeah, yeah, it's a it's a lot of amazing like fun stuff that's going on. And also the forms and the way the analytics work. It's like It's like analytics is such a difficult thing for a lot of web developers because of ad blockers and like proxies and networks. But if you're running your analytics like Netlify does based on Like the server stats itself, like you, like you're making a connection to this site, whether you blocked an ad script or not, that analytics reporting tool is still going to measure all that data. It's not going to give you like, as much as something like a google analytics that you're allowing to track you. But it's still a valuable tool for developers and even like, you know, if to run your business like what's going on in my application, you can cost optimize and and see what's really happening Bryan Robinson 16:29 And doesn't affect front end performance. Which is great, too. Daniel Olson 16:32 Yeah, it's something that happens naturally, that data is logged anyway for the server itself. So you know, just providing access to it is it's crazy like it's they're providing access to it. It now has become a product. Bryan Robinson 16:45 Yep. Oh, yeah. Gotta find ways to monetize and keep the keep the doors open. I want Netlify around for a long time. Daniel Olson 16:52 Yeah. And keep keep your customers happy. Bryan Robinson 16:55 Exactly. Cool. So So what's going to keep you in the JAMstack? Obviously you It's important you right now, which is great, but like, what's the core philosophy that you're gonna dig into in the next couple years? Daniel Olson 17:06 I am a, my, my core philosophy is the rule of least power. I think that a lot of times we, you know, hit solutions with the hammer instead of like, figuring out a different approach, like every problem is a nail. Like the, the idea of applying JAMstack has, like an approach is really appealing to me because it focuses on something that I also really appreciate. And that's design thinking. So rather than just applying a solution, or you know, throwing more power at something, or making it like overly complicated jumps that can can be quite elegant, because it's using only things that you need. Daniel Olson 17:48 So as opposed to what you know, like WordPress is traditionally a monolith. It comes with a lot of things that you don't necessarily need or may ever use. But JAMstack is like, All right, I'm building this site, I need comments. Just add the comments you need. I need ecommerce right now I'm just going to add ecommerce, but you don't need other features. They don't exist you didn't build them. And that's what I love about the the JAMstack community is it gives us the opportunity to pick and choose and kind of build exactly what we need. Bryan Robinson 18:22 I actually the rule of least power is one of my guiding principles actually wrote a blog post about a year ago on it. One of my favorite things that came out the development of HTML and, and and the web. Daniel Olson 18:34 Yeah, and like I always kind of,I always get stuck like whenever there's a new app or new tool out there, like Yeah, but like this thing does it but also there's no UI for it and it runs faster. And I like I'm just kind of geeking out over that stuff like a Hyper, like Wes Bos on JavaScript courses he uses Hyper a lot. And like, I love looking at it. Hyper is like a beautiful terminal. But also it runs JavaScript and like it kind of takes a lot longer to open then just like my terminal with nothing in it. So that's like, those are my daily struggles. Bryan Robinson 19:13 The new cool versus what's the most efficient for you? Daniel Olson 19:16 Yeah, don't go overboard. Just use what you need and get the job done. It's also I think it's good for me because I work with a lot of customers to on their servers. And like, if you're logging into a server, you don't have the luxuries of your like your customized bash scripts. And these, you know, like pretty UI is like you just have to know what you're doing. And like just kind of using the basic tools to get the job done is has really paid off for me. It's it's taught me a lot. Bryan Robinson 19:46 Having the same tools that everywhere definitely makes it easier when things go wrong in the non fancy places. Daniel Olson 19:51 Yeah, I sometimes I think of it as like a little form of torture for myself just because I'm not giving myself like an advantage but it's it pays off in the long run Bryan Robinson 20:01 definitely alright so so let's let's talk music what's your actual jam right now what what musician or song or type of music Are you really into right now? Daniel Olson 20:11 My my musical tastes vary throughout the day some days I wake up listening to like Wilco on all my Alexa devices just blasting throughout the house. And then maybe by lunch I'll be listening to like little Wayne's the Carter three and I'll just have like genius up like the website genius and just I'm picking apart all the rap lyrics. Um, but yeah, like I I, the thing that I really enjoy right now is and it's the perfect background noise for me. It's this thing called poolside FM. And there's a website for I think it's just poolside.fm but it's a it's a website that kind of looks super 80s and it plays music videos and also music along with it, but the music videos are like clips like old VHS random clips almost like everything is terrible. But I don't know it's just like the perfect background noise when you're like coding or just need something on while you're cleaning the house. And I've they never show like the what's playing are actually I listened to it on my Alexa but they never show it's playing so I'm always like asking my phone like, What song is this Bryan Robinson 21:22 as a little mystery to your life? Yeah. Cool. So is there anything that you would like to promote that you're doing right now that you want to get out in the world? Daniel Olson 21:31 Um, actually, I want to give a shout out to to Phil Hawksworth from Netlify about I want to like throw back to one of your previous episodes and something he said that it's it's funny when I listened to the episode I I've said the same thing in a couple talks and it just resonated with me so I want to call it out again. Daniel Olson 21:52 He he said something he's very careful about using the phrase static sites and I totally agree with that. And the reason that I agree with that is one of my favorite sites jamstack.org, which is kind of like a manifesto for me. It's like we are the JAMstack party. This is what we believe. But the most important part of that website is what it actually does not mention, it doesn't mention any specific frameworks. It completely focuses on best practices. And if you search the site, for the word static, it only appears once. And it says, I'm pretty sure it says probably static. Daniel Olson 22:33 So it's like kind of like, you know, going back to it. This is not, we're not purists. This is an approach. It's a philosophy. And then it's a way to build something better. But yeah, that's kind of that's a that's I just wanted to mention that But yeah, I don't really, I don't really have anything to promote, like we we have, we're in the WordPress community. But we're kind of like we straddle those two things like WordPress and jam stack but I just think that, uh, the WordPress community and also the jam stack community has a lot to learn from each other. I think that Jeff slack.org is a good place to start. I think that really focusing on the approach rather than the tools is something that is really important that that you should do, and that you can learn a lot from. And also just talk to other developers see what they got going on and see what problems they have to solve. Maybe you can help them maybe your experience is valuable. Bryan Robinson 23:26 And we all kind of have different problems. And we find the right solutions for them no matter what the stack is. Daniel Olson 23:32 Yeah, yeah, in in the WordPress world, like I've I've developed plugins, and some of the plugins that I've developed. I tried to build them so that they work in both environments, whether you know, you're running on Shifter, and we create a static site from that from that site for using WordPress. But you can also build that plugin so that it can work natively in a native WordPress and like hosting environment. And I've learned that building Something that applies to both types of like hosting platforms, it actually just makes it more performance overall. And like, you don't need to, it doesn't need to be static, but the way that you've built it, it could be static. And the end result is just more performance. So why not build it this way? anyway?. Bryan Robinson 24:19 Well, I appreciate you taking the time out of your day to talk with us. And I hope you keep doing some amazing stuff on the jam stuff. Daniel Olson 24:25 Thank you for having me. Looking forward to it. Bryan Robinson 24:30 All right, it's sponsored time, I want to talk today about a specific feature in TakeShape, which is our sponsor, for this episode. And that's the API Explorer. Inside your TakeShape dashboard, you'll find the Explorer and it's a really great tool for a GraphQL novice like myself, but it also has lots of great features built in, like some autocomplete and built in documentation. It makes it really incredibly easy to find all the pieces of data that you want to include in a GraphQL query, and then it's going to build that query for you. It's a simple copy and paste away from your static site generator. So makes it really, really easy to interact with, TakeShape's API. They have a lot of other great functionality as well, you should definitely go and check them out. And you can do that by hitting up takeshape.io/thatsmyjamstack. Bryan Robinson 25:21 I also want to thank our guests, Daniel again, and thank all the amazing listeners in the JAMstack community. Remember, if you're enjoying this podcast, give it a star a heart an upvote or review in your podcast app of choice to help new folks find their way to listening in and with that, we're gonna see you in the new year but I hope you keep doing amazing things in the JAMstack. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

18 December 2019


Francois Lanthier Nadeau on decoupling in the JAMstack (and life), ecommerce and more

Francois Lanthier Nadeau on decoupling in the JAMstack (and life), ecommerce and more

Quick show notes Our Guest: Francois Lanthier Nadeau What he'd like for you to see: Snipcart V3 | His blog where he talks about destigmatizing mental health His JAMstack Jams: The Decoupling Philosophy of the JAMstack | Stackbit | Netlify | Sanity.io His Musical Jam: His "Is that Soul I feel in my guts" playlist Other Technology Mentioned Jekyll Middleman Nuxt Gridsome Our sponsor this week: TakeShape Transcript Bryan Robinson 0:02 Hello everyone and welcome to yet another fun packed episode of That's My JAMstack the podcast where we asked the age old question, what is your jam and the JAMstack. Bryan Robinson 0:11 I'm your host, Bryan Robinson and this week I'm joined by the former marketing lead now CEO of the e commerce startup Snipcart. I'm talking of course about François Lanthier Nadeau. Bryan Robinson 0:22 Also back this week is our amazing sponsor TakeShape. Stick around after the episode to hear more about their content platform or head over to takeshape.io/thatsmyjamstack for more information. François, thanks for thanks for coming on the show today. Francois Lanthier Nadeau 0:37 Yeah, you got it. It's my pleasure. Bryan Robinson 0:39 So I've been following following you on Twitter for a little while, but I go ahead and give us an introduction. who you are what you do for work what you do for fun. Francois Lanthier Nadeau 0:45 Yeah, good. Same thing actually been following you on Twitter for a while to listen to some episodes recently. So yeah, I'm CEO at Snipcart, it's an ecommerce solution for developers and then also the organizer of the JAMstack Quebec meetup that we host here at the Snipcart offices in Canada, in Quebec, Canada. For fun I play video games I read, I listen to audiobooks and podcasts I write, and I try to spend as much time with meaningful people like my girlfriend, family and friends. And that's pretty much it. Bryan Robinson 1:24 And what kind of things do you write? Like, is it is it tech stuff? Or is it not tech stuff? Francois Lanthier Nadeau 1:28 It's actually both. I come from a marketing background. So sometimes, all right, I don't know tactical stuff on content marketing or SEO. But sometimes I'll write more personal stuff. I kind of have this semi official mission of talking more openly about mental health. And I've had some personal issues with this in the past and I try to share stories and tips and lessons regarding this. So yeah, sometimes it's more in that order. Bryan Robinson 1:59 Okay, great and That's definitely a an important mission in tech. There's a lot of people not talking enough about it. Francois Lanthier Nadeau 2:05 Yeah, I think men especially sometimes, sometimes we have a harder time. So I don't know. It's Yeah, I find some some value in Redemption of my own and trying to do that. Bryan Robinson 2:17 Excellent. All right, so So let's talk about the JAMstack a little bit, It's a JAMstack podcast. So what was your What was your entry point into the JAMstack or into the idea of static sites or whatever you like to call it? Francois Lanthier Nadeau 2:30 Yeah, we used to call it something like modern static site. It was Middleman and Jekyll. Mostly that got us into this space. So when we were just starting out as a SaaS, ecommerce, Saas for devs, we were just, you know, trying to get some traction to our site and some signups and stuff. So we were experimenting with different content marketing, strategic And at one point, I was asking our developers about tools they love and our co founder and lead developer, Charles mentioned Middleman. And he was saying that it was gaining a little traction and popularity through the dev community. So we we tried to build a site with it and integrate Snipcart with it. And it went just fine. Francois Lanthier Nadeau 3:23 Yeah, Snipcart is a front end centric, e commerce shopping cart that lives basically just in your front end. And we do all of the back back end logic. So it was a good fit from the start with the JAMstack approach. But it wasn't designed as a JAMstack ecommerce tool. We kind of stumbled upon the whole paradigm and tooling to these marketing experiments, if you will. Bryan Robinson 3:53 Cool. And Snipcart started in what? 2013? Francois Lanthier Nadeau 3:59 Yeah. Yeah, that's about right. Late 2013. Bryan Robinson 4:03 Okay, and and so so through that, that experimentation? Did y'all shift away from middleman? Are you still using that sort of thing when you're playing with your marketing stuff? Or is it in the new? The newer stuff that's coming out? Francois Lanthier Nadeau 4:16 Oh, most definitely. So we try to evolve and experiment alongside the community with tools that were popping up. So we kind of created open source demos and get them repurposed for established tools like Jekyll. But we also, I mean, we also, for instance, experimented with Gatsby when it was just an open source repo with no website, or branding, or it wasn't that big of a deal, you know. So, yeah, I mean, it's, it's part of our DNA to try and experiment and have thousands of side projects. Like developers usually do. So we thought we might as well try to harness this into, you know, attraction channel that brings us people and that also helps the community when we do these tutorials and and GitHub repos and stuff. Bryan Robinson 5:15 So obviously, being not necessarily a JAMstack company, but a company that is very strongly tied now into the JAMstack. How are y'all other than the side projects approaching the philosophy of the JAMstack? I'm real curious about e commerce and the JAMstack. I think that's going to help us take take it to the next level. Francois Lanthier Nadeau 5:33 Yeah, ecommerce is... it's a complex based. And you can you can see that just by looking at the wide spectrum of solutions that are offered both to developers and non developers. In terms of influences and application of the actual philosophy, I'd say we, we really embrace or try as much as we can to embrace DX first philosophy. So it's as JAMstack caught popularity and fire and everything because it offered a good developer experience. And that sense, we're kind of trying to do the same thing with Snipcart. And we have been from the start, it's always been a developer first solution, something that is not constraining. It lets you work with the tools you love. And that's lightweight that improves your workflow instead of constraining it. So that that strategic in that approach of like the bottom up influence in terms of business, so we first try to influence and convince a developer that it's a great tool. And then we leverage the developers authority and influence inside a company or towards his client, their client. Francois Lanthier Nadeau 6:55 To make make sure the managers and merchants are on board with that tool. Also. So this this the, the dx is something we're really trying to focus on right now. And you see, it's funny because the dx is great. Like it's important to provide a good developer experience. But then if the end of to some non technical client or some marketing team is done, and they do not have like the ease of use that developer had when they were working on on their stuff, it's not it's not good for the gemstone. It's not good for the old ecosystem was tooling. And that's why you're seeing a lot of tools pop up, to cater to this problem. So editing CMS site building, hosting, one click deploys, all of that stuff is is is layered on top of the the core dx experience of the jam stack. And yeah, we do the same thing with the hosted merchant dashboard. So the developer works with snap cart, they integrate it on a static site, let's say or with a headless CMS. And afterwards, the merchant is off is offered a hosted dashboard to manage the e commerce operations. So they don't have to play with code or get repositories or whatnot to manage your sales, ecommerce. Bryan Robinson 8:25 And so, one of the great things, especially on the developer experience side of thing is this kind of whole host of API's that are available for us. I'm kind of curious for your perspective on on. There's been some pushback from non JAMstack developers about kind of this this fractured ecosystem not fractured, that's a bad word, but like a multi faceted ecosystem. Are you experiencing that with, with people with clients, like oh, well go login to Snipcart for your ecommerce dashboard, but over here to manage the other side. Francois Lanthier Nadeau 8:56 Yeah, that's that's actually a great question and I was talking was, there's this pendulum in tech that I feel is swinging between monoliths and then thousands of SaaS that are fragmented, like you were saying, but so some people would prefer the administration part to be enabled in one single place for their clients. And for these people, if they're motivated, and I don't know, talented in terms of the tooling they're using, they can, of course, integrate a lot of Snipcart functionalities inside a CMS directly. So we expose we have an API for this and we've seen it done on various sites. CMS, like Craft CMS is one of the first that did it well, so there are some plugins for snip card into some other cmss that can help in that regard. We tried to develop them ourselves in the beginning, but we realized it was just a whole mess, like maintaining everything we're developing with the other plugins that are specific to a certain CMS, for instance. So yeah, I'd be lying if I said, sometimes it isn't a pain. But many times, the ease of implementation and customization of Snipcart is a bigger benefit than the pain of having to login into an extra dashboard. Bryan Robinson 10:30 Sure, and I mean, from from my experience in agency world from a few years ago, we would create a Shopify site, but then also use another CMS through the marketing side, and that itself was a pain too. Francois Lanthier Nadeau 10:40 Yeah, it can happen. But you know, Shopify is a great tool also. And I'm not like, I know that we used to say it was a very closed ecosystem and whatever in the beginning, but I think it's evolved a lot and some developers, they get so it also depends on It's so it's so complex choosing a tech stack nowadays because of this whole host of options. But the I think the thing that's very cool with the JAMstack is that it can grow well, it can evolve well, so you can start with a minimal number of tools, and then build upon them. And maybe when once you get to a point where you have enough revenue enough traction, maybe then you you move to a platform that's more monolid. So yeah, I don't know, I think it's a very solid entry point for web projects. Bryan Robinson 11:38 And it kind of I feel like e commerce especially it's this kind of world where you can ramp up complexity super quick. You can start very, very simply, and even like Shopify in terms of its you know, quote, unquote, simplicity is relatively complex and you get stuff like big commerce and Magento. And I shudder anytime I think about e commerce personally, but It gets complex fast for, for that end users. But for customers at that point? Francois Lanthier Nadeau 12:07 Oh yeah, most definitely. I always joke about. So a Snipcart, we built an e commerce tool for developers. So developers don't have to worry as much about e commerce as they they could have. But if we were to start again, we probably build another product, because it's super complex. And I hear these kinds of echoes from people who are building on top of email Also, sometimes. Yeah, I mean, it's infinite number of features, feature requests coming in from every angle. And having just stepped up a CEO slash product owner. Geez, I can tell you that prioritizing and saying no, and developing the right stuff that benefits both the clients and the best Isn't this? It's a challenge. Yeah, Bryan Robinson 13:04 Especially since you've got both you got to maintain that perfect kind of developer experience and give, you know, user experience for the e commerce managers to Francois Lanthier Nadeau 13:12 Oh, yeah. Oh, of course. And, like, we're, we're proud of what we built. And it's a good product. But I'm not the I'm not. I don't know. I don't have pink glasses. I know that it's an imperfect product. And also, like, we come from a place of a hybrid bootstrapped start. So we were bootstrapped inside a web agency in the beginning, like six years ago, but we soon grew into our own company that's distinct and profitable and whatnot. But we're still a bootstrapped player in a mostly non bootstrapped world, the e commerce giants and whatnot. Most of them are VC backed or have big money. So the challenge in terms of what we're working on, that becomes critical. And in a sense, in other areas it served as well to have this proximity and smallness and agility. So, Bryan Robinson 14:17 So so with Snipcart being adjacent to the to the JAMstack. What's your current jam in the JAMstack? What's your favorite philosophy or product or technology? Yeah, that's, Francois Lanthier Nadeau 14:27 That's, that's, that's a question that you record it and then a few months later you might want a new answer. But one of the philosophies that I like the most about the JAMstack is the notion of decoupling. Francois Lanthier Nadeau 14:41 So, I try to mimic this into my work in my personal life too. So at work, you know, we're trying to do wanting well, and not to be over to place product. And it's hard since we're doing e commerce and e commerce is all over the place. But in terms of management, and internal Team, we're also trying to delegate and trust other parties to do their job well, so we can sync up when it's time, but we don't walk on each other's shoes. And you know, in life, it's the it's the same thing. I think the non technical and non startup part of my life really feeds back into the work one. So I'm trying to decouple officially some activities and relationship and discussions. So so I can, you know, work on some other skills and stuff and then have a different point of view in a different energy when I come back into the business and development world. Francois Lanthier Nadeau 15:41 And yeah, so to answer the question in terms of tooling, more specifically, Stackbit that was on the podcast, I think the last one or one of the last ones. That's that's very good tool. And we were talking about layering some user friendly tooling on top of dx. Cool for dev tooling. They're doing a great job at this as a not not not developer, I can like build a JAMstack site, and in minutes. So this is great Netlify for developers. Also, they're building a platform that's becoming very rich and useful. And internally, we're using more and more Sanity as a headless CMS. And Nuxt, to generate the static site. And some more dynamic functions in the fronted. So we've used this for our new documentation. We released the V3 of Snipcart, a few weeks ago or months, and yet we're using this for this and we'll probably use anything Nuxt to an or maybe Gridsome for the upcoming marketing site. So yeah, I mean, it's this is a dynamic ecosystem. People are motivated people are friendly when we were in New York, was speaking on a panel gems tech conference conference in New York for e commerce and I don't know it just it's a great vibe. And I feel like it's it's cool community to be a part of right now Bryan Robinson 17:06 How's the actual physical community for for the JAMstack meet up and up in Quebec? Francois Lanthier Nadeau 17:11 Oh, it's small but growing, and we're around 20 people when we do the meetup. And what's fun is that we've like we're always gathering feedback in iterating each meetup and some of the feedback we've been getting is, okay, so I know I can make my own blog with Gatsby and it's very cool and react and whatnot. But I want to do this in production. I want to do actual work for a client in my agency or as a freelancer with this. So show us some production examples. Francois Lanthier Nadeau 17:46 So we kind of decided to do some more real life technical demonstrations of look at this website and the wired we built, it is running for clients and some marketing people are using it. And it's a real production ready project here, how we here's how we bundled it. So that's great. And we're trying to push towards this like have more agencies use static sites for simple sites, have more agencies trying to experiment with headless CMS to decouple the front end if the clients that need to push some stuff on mobile on some some screens or some and desktop, so I think it's growing but it's Yeah, it's still a teenager in terms of adoption on its life cycle. Bryan Robinson 18:33 Alright, so I don't want to you know, blow our time estimate for the episode of the water but what's your what's your actual jam right now? What kind of music Are you listening to favorite song favorite artists? Yeah. Francois Lanthier Nadeau 18:44 I've been curating a Spotify playlist on my personal account that I titled, is that soul I feel in my guts. It's a weird mix that really makes me feel like alive and it's like the Janis Joplin and other Sam Cooke and other cool artists like this. So this is this is my answer Bryan Robinson 19:08 So you're going to give me that link right? Francois Lanthier Nadeau 19:10 Of course. Yeah. Bryan Robinson 19:11 Perfect, perfect because actually, I love that that type of music too. So got it. I'll be listening to that personally and then we'll put put it in the show notes too. Cool. Bryan Robinson 19:19 And so so finally, what do you want to promote today? What do you want to get out in the open in the community? Francois Lanthier Nadeau 19:24 Um, great question. Well, your podcast, it's good. Thank you for doing it. Much appreciated. Of course, Snipcart's latest version, the V3 is out, snipcart.com. You can check out the documentation and tell us which think other than that. There's this semi official mission of Destigmatizing mental health in tech and my personal life that if some people are interested, flanthiernadeau.com. So my name .com. I have written about this over there. Bryan Robinson 20:00 Great, and we'll put that in the show notes to to make sure everyone can find their way over. Cool. Cool. Well, I really appreciate you taking the time and talk with us today. And I hope you keep doing some amazing stuff over stuff card. Francois Lanthier Nadeau 20:10 Okay, well, thank you have a good day. Bryan Robinson 20:14 Everyone is Bryan again. And I want to take a second to thank this week's sponsor TakeShape. TakeShape calls their offering a content platform. And that's really the best description for it. They have a handy CMS, a static site generator and a simple GraphQL API already for use on the JAMstack. They may have all that power, but they also work within your current workflow. I'm currently converting one of my sites over to use the TakeShape CMS but because I can bring my own stack site generator, I don't have to rewrite a lot of code. I just changed where my data come from, and bam, instant upgrade to my CMS. Bryan Robinson 20:43 They also have new features coming on all the time, like their new mesh product that allows you to mix and match data from multiple sources into one neat graph qL interface, you can sign up for a beta of that new product over at takeshape.io/thatsmyjamstack. Bryan Robinson 20:59 And while you're here, don't worry Get to leichhardt Subscribe, all those great things that you can do and your podcast app of choice to the that's my jam sec podcast, the more likes and subscribes and all that good stuff that we get, the more people find out about this amazing new way of doing design and development on the web. As always, thanks for being a listener and we'll see you next time. Until then keep doing amazing things in the JAMstack. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

11 December 2019


Tamas Piros on education and the "A" in the JAMstack

Tamas Piros on education and the "A" in the JAMstack

Quick show notes Our Guest: Tamas Piros What he'd like for you to see: JAMstack.training His JAMstack Jams: "There's an API for that!" Formspree | Auth0 | Snipcart | Cloudinary His Musical Jam: Reggaeton in general, but J. Balvin specifically | And tis the season for some traditional Christmas Music :D Other Technology Mentioned 11ty Our sponsor this week: [https://takeshape.io/thatsmyjamstack]TakeShape.io Transcript Bryan Robinson 0:02 Hello, everyone, welcome to another episode of that's my jam into the podcast where we ask the burning question, what is your jam in the JAMstack. I'm your host, Bryan Robinson. And in today's episode, we're talking to a Cloudinary developer evangelist and awesome technical trainer, who just started jamstack.training Tamas Piros. Bryan Robinson 0:21 Today's episode is sponsored by TakeShape, a content platform made specifically for the JAMstack. Stick around after the episode to hear more or head over to takeshape.io/thatsmyjamstack for more information. Bryan Robinson 0:34 Hey, Tamas, thanks for being on the podcast today. Tamas Piros 0:37 Thank you very much for having me. Bryan Robinson 0:38 So if you don't mind, give us a little little overview of who you are, what you do for work, what you do for fun, that kind of thing. Tamas Piros 0:45 Sure. So I work as a developer evangelist for a company called Cloudinary thata does sort of cloud based media management -- media being images, videos. So been with them for Over a year, and before that I've worked at various other companies that can NoSQL company as a technical instructor. Tamas Piros 1:06 And as you know, as part of the role, I basically go and travel the world pretty much I attend conferences, I do talks and workshops at meetups and in various other places. And I also own a training company, which is called fullstack.training, where I basically try to deliver training courses about various pieces of web technologies. So that's what I do professionally. Tamas Piros 1:31 On the personal side of things, I always point out that I am a water polo player, which is a very tough sport for those of you who actually know it. And I like to say that as a coach, as a water polo coach, I have a gold and a bronze medal from some international tournaments. And as a player, I also have a third position in a tournament so I have a cup. So these are my little personal achievements Bryan Robinson 2:00 You're potentially the the best athlete we've had on the show so far. So that's, that's cool. I don't know water polo sounds incredibly difficult to me. Tamas Piros 2:10 It is it is. But you know, if you if you train and if you dedicate some time to it, then then it can be a little fun. Bryan Robinson 2:17 Very cool. So you're, you're working at Cloudinary. So obviously, professionally, you're doing quite a bit of JAMstack stuff, anything outside of work that you're working on JAMstack wise, or is it all just kind of that, that work environment? Tamas Piros 2:30 It's mostly the work environment. The other thing that I work on is I have you know, my own personal site, which is a site about me about what I do is like a one page thing. So I build that using 11ty, which is one of the static site generators and I'm hosting it on Netlify. The only thing that I do really, I also have, you know, my company's website and I have a blog on there, which one day if time permits and when you know, the wind blows from the right direction. I will also sort of transform into JAMstack site. But you know, I don't know what's going to happen. Bryan Robinson 3:08 Sure. So you've got you've got the full stack training company, but you're also doing some JAMstack stuff with that too, right? Unknown Speaker 3:14 Tamas Piros 3:42 So on that site, I basically have two free courses available at the moment. One is an introduction to JAMstack, which is it's really a non technical thing. There's, you know, there's no discussions about code. I just wanted to create this course so that anyone even coming from a non technical basis can kind of understand what the JAMstack is. The second course that I have there is how to create the blog using 11ty and some other services. And then at the moment, I am recording another one, which is create an e commerce store using Gatsby and Snipcart. I actually tweeted about that today. It's it's a Christmas store with all his Christmas ornaments and stuff. So it's basically pressuring myself to finish it before Christmas, Tamas Piros 4:30 Yeah, otherwise, it's not going to work. So yeah, I have that side. I tried to, you know, use that to educate people about the JAMstack. And as I said, all the courses there are for free. So it's, I'm trying to, you know, produce as many courses as I can for free and put them out there. Bryan Robinson 4:47 Very cool. And have you so you've only got a couple courses there so far, but how does it feel doing the JAMstack side of things in terms of education versus that full stack side. Tamas Piros 4:59 So with the fullstack side I was the courses that I had weren't always necessary about, you know, always full stack was sometimes just NodeJS, but I have to say it does help in a stance that in a very relatively short video course I can talk about like how to create an entire ecommerce site that involves, you know, how to develop it, how to sort of deploy it, how to enhance it by adding, you know, just, you know, snipcart, I mean, the whole experience of making this happen is is wonderful, right? Tamas Piros 5:39 Whereas before, I had a course where I was talking about, you know, angular and node and express and full stack JavaScript and this and that, and that's like a very long course to put everything together. And I didn't even talk about how to deploy that, right, because I thought, you know, let's not focus on that. Let's focus on the actual code, whereas now, I can very easily just talk about how to deploy stuff Bryan Robinson 6:03 It lets you give like that full application feeling to all the all your courses at that point. Tamas Piros 6:08 Exactly. Right. So in about 30 or 40 videos, you know, we start from nothing, and we end up having an app that works and is deployed, which is, I think, pretty amazing Bryan Robinson 6:17 I agree. That is kind of one of my favorite things on the JAMstack. Bryan Robinson 6:21 So let's talk about technologies. You've mentioned the 11ty, A little bit, Obviously, you're working at Cloudinary, what are kind of your jams in the JAMstack. What are your favorite technologies, philosophies, methodologies? Tamas Piros 6:32 Sure. So I really like the the letter A in the JAMstack. You know, the API bit, because, and I just did a talk recently, and I made the joke that you know, how about 10 years ago, we used to say, oh, there's an app for that, you know, just about, you know, Apple's iPhone app store, you could do whatever you wanted. Tamas Piros 6:51 And I think now, it's safe to say that there's an API for that, right. So it doesn't matter what you want to do, or how complex that thing is. I'm pretty sure that an API out there that is available for you. So, you know a few examples that I've used. And these are my favorite ones as well like Formspree. Like, the bane of my life was contact forms because I had to have a server it had to have some, you know, mail service up and running. And then you had to have something that processes the form and sends it and it's like, oh my god, And then with Formspree just have the form elements. You have the action attribute, and you literally say formspree.io/emailaddress, and you're up and running. I mean, how simple Tamas Piros 7:36 Other things like, Auth0 for authentication, traditionally speaking was always very difficult, right? With their API's. It's, it's really simple. Or the recent recording that I'm doing for the e commerce stuff, right. So as I said, I'm using Snipcart. I'm also using Cloudinary to display product images, right. Tamas Piros 7:58 So the combination of these two API's means that with Snipcart, I can just have an entire checkout flow, including you know, shipping, shipping details, payments, and everything embedded in my application in just like three or four lines of code, and that's pretty much it, everything works. And then they have their own dashboard where they have the stats, how many sales do this and then I'm also displaying products using Cloudinary which is, you know, displaying images and you know, videos on your website is traditionally speaking kind of challenging because you can go wrong with that. Tamas Piros 8:32 And so here's an example what I'm doing in this app. I have this sort of like a jumper on a lady that is like a Christmasy jumper that I'm you know, selling in this wonderful ecommerce store. And Cloudinary has a feature to replace the color with another color. So as opposed to me generating you know, five or six different images from the same product to say what was yellow should now be red, and it should not be green should not be blue, and then just display those like, and that's it, you know, they can achieve whatever I want, using the API's. Tamas Piros 9:06 And I can let all these companies to deal with, you know, scaling and security. And you know, because what happens when my ecommerce store becomes very popular, right? I don't need to worry about, oh, how I'm going to handle the increased load of the checkout flow, because Snipcart is responsible for that service. And I'm sure they're going to take care of that, right. So this is what I really enjoy and loving the JAMstack. So that's why I like to point out there, you know, I'm all for ace. And I'm sure there's an API for everything that I ever wanted to do on the web. Bryan Robinson 9:39 Definitely. And I actually really enjoyed the idea of the the Christmas shop, especially in terms of that scalability, because the Christmas shop may not do a lot of traffic from January to October, but it's going to ramp up real hard in November and so you have to be prepared for it, which would have been hard if you manage your own server. Tamas Piros 9:55 Exactly. And now everything is pretty much transparent to you. You don't you know, see You don't need to worry about it. That's that's pretty much it. Bryan Robinson 10:03 And I absolutely love the the "there's an API for that". I'm, I'm definitely going to be gonna be tweeting about that as for sure. Alright, so so I guess Tell me a little bit about how you're kind of advocating and cloud Neri and what sorts of technologies you're using. Obviously, we talked about, like the color change, but like, what other kind of big things are you kind of talking about in your professional life in the jam stack. Tamas Piros 10:28 So there's a first of all, because of, you know, me having this gem center training website, I tried to sort of explore all the static site generators, all the all the headless CMS is all the components, and all the tools that I could use under the JAMstack. I just like to explore these right and that's part of the role as a developer evangelist as well, so that you know, I'm kind of well versed in all of these different pieces of technology. Tamas Piros 11:00 So at Cloudinary, really, you know, be focused on media images and videos and how you store them, how you optimize them, how you sort of transform them. So we have, you know, API's for not only just managing these media assets, but also as I said, you know, to transform them into any way you want. We recently added lots of AI features. So you know, don't forget, this is all on our site. So all you need to do is modify the URL or make the right API or SDK call, and we do the job for you. Tamas Piros 11:33 So we have things like, you know, object recognition for about 20 or 30 items, so you can send an image to us and then we can find it, you know microwave on it. You can find the banana on it and then we can actually crop the image for you so that you know the banana or the microwave oven is going to be in the center of the image. And, you know, again, what do I need to do here? Nothing, upload the image, change something in The URL and I get the result that I wanted. Bryan Robinson 12:03 There you go. Yeah. And that's actually one of the one of the challenges I even had, managing an actual proprietary CMS was image cropping. And like dealing with all that, and figuring out where to crop the image, we put that on the user on our CMS users, and it never ended quite well. Tamas Piros 12:20 Yeah, I mean, you know, you can do that automatically with any of these AI features, or you could, you know, just manually, you know, say with height, crop, and then you know, you're good to go. It's, I do enjoy, you know, that side of things. It's really, really easy. And then, you know, there's the delivery side of things. So we also use a global CDN, which means that, you know, once you do a transformation, it gets pushed out to the CDN, it's always going to be returned to the closest requesting user. And also, if the same transformation is requested, we don't do it again. Right. So it's just going to be cached in the CDN. Tamas Piros 12:54 So it's the second time when you call the same image is even going to be faster and We do have automatic formatting features, which is basically says, if you're looking at this image from Chrome, we serve it as a WebP, if you look at it from a safari, we serve it as a JPEG right? And that's, again, completely transparent to you. Because otherwise, if you wouldn't have that feature, even have this sort of management tool available for you, you would theoretically if you want a website that performs well, you would have to create a JPEG file, a web p file, and you know, have the logic in place so that the right file is served to the right browser. Bryan Robinson 13:32 The whole CDN thing is, it's over my head, definitely. But it's very interesting to be that we have all these API's. They're doing CDN as well. So you've got Cloudinary on a CDN, FaunaDB has this kind of distributed database thing that we're fine with hosting on the CDN. And then putting all that logic at the CDN level just makes so much sense. But I could never set that up like that could never be me. So it's so nice to offload that to our various API's. Tamas Piros 13:55 And, you know, that's also one of the core ideas of the JAMstack i think is you know, Everything should be on an edge server. So there's really, you know, no more excuses for not creating websites that that perform well. Bryan Robinson 14:07 Exactly as quick as possible all over the world. Cool. So let's let's get to what you're actually jamming on right now in terms of music. What's your musical taste? What's your favorite song or musician? What were you? Were you listening to? Tamas Piros 14:20 So what I listened to in general, I have a weird set of music to listen to. It's really anything from metal music to reggaeton, reggaeton being my big favorite, right? So artists like J. Balvin, maluma, the Anki, these type of artists, and I love the music so much that I actually learned Spanish so that I can actually understand what they are singing about. And actually, I'm going to say this out loud now, so this isn't a recording. One of the challenges that I have for myself for the next year is to deliver a talk in Spanish. So I've been working on that, it's I'm getting there, I think but you know, 2020 is the year when it's going to happen. But yeah, so the big favorite that I have is really, you know, J Balvin. Anything from from J Balvin who is a Colombian reggaeton singer. I just love his songs. And I have to admit that, you know, we spoke about Christmas, it's Christmas time. I'm all for Christmas music. You know, it's Bring Crosby and Cliff, Richard and all of these. I'm going to start to play them very soon. Bryan Robinson 15:30 You know, I was at a cafe this past weekend, and they were playing Christmas music and I said, it's not Thanksgiving. So for us, right. It's not in the States. Not Thanksgiving yet. I feel like it's got to be December before we can listen to Christmas music. Yeah, Tamas Piros 15:43 it's Look, it's 10 more days, and I can, you know, have you told Bryan Robinson 15:49 I mean, I'm not gonna judge you could listen to it in July and I'd be I'd be happy for you listen to Christmas music done. Tamas Piros 15:54 I like Christmas. And, you know, I think Christmas music should be in December. It's cold maybe there's snow. It has a certain, you know, feeling for it. And I like that. Bryan Robinson 16:04 So last thing, anything you want to promote that you're doing right now, what do you want to kind of share with the jam stack world, Tamas Piros 16:10 I would just, you know, like people to check out jumps at the training, if you know anyone feels like they are for recording their own sort of video course, I'm more than happy to host that as well or help them, you know, ideate and help them to record stuff. Or if they just have an idea and say, Oh, I would love to see, you know, XYZ in the JAMstack. And I'm more than happy to at least try to somehow record that or accommodate those requests. But yeah, just, you know, as I said, it's all free. So I hope people will, will find value in what I'm doing there. Bryan Robinson 16:46 Excellent. Well, I appreciate you taking the time to talk with us today. Tamas Piros 16:49 Thank you very much for having me. Bryan Robinson 16:50 I want to take a second thing this week sponsor TakeShape. TakeShape they're offering a content platform and that's really the best description. They have handy CM,S a static site generator and simple GraphQL API that's all ready for your use in the JAMstack. Bryan Robinson 17:07 And they may have all that power but they also work within your current workflow. I'm currently converting one of my sites over to us to TakeShape CMS. But because I can bring my own static site generator, I don't have to rewrite a lot of that code. Just change where the data comes from, and BAM, instant upgrade my CMS. Bryan Robinson 17:22 They also have new features coming out all the time, like their new Mesh product that allows for you to mix and match data from multiple sources into one neat GraphQL interface. If that sounds interesting. Be sure to go to takeshape.io/thatsmyjamstack to find out more. Bryan Robinson 17:39 And of course, as always, I do want to thank you, our listeners You are the reason I do this. Be sure to like heart, favorite, subscribe, whatever you do, and your podcast app of choice to let me know that you want more and more and more episodes of the That's My JAMstack podcast. We'll see you next week and keep doing amazing things on the web. Transcribed by https://otter.ai Intro/outtro music by bensound.com Support That's my JAMstack by donating to their Tip Jar: https://tips.pinecast.com/jar/thats-my-jamstack

4 December 2019


Brian Rinaldi on proving the benefits of JAMstack, content editing and more

Brian Rinaldi on proving the benefits of JAMstack, content editing and more

Quick show notes Our Guest: Brian Rinaldi What he'd like for you to see: Flashback Conference His JAMstack Jams: Stackbit | Netlify | Hugo Other Technology Mentioned Jekyll Transcript Bryan Robinson 0:02 Hello, everyone, welcome to another episode of That's My JAMstack, the podcast where we ask the pressing question, what's your jam in the JAMstack? I'm your host, Bryan Robinson and on this week's episode, we sit down with Brian Rinaldi, a developer advocate for Stackbit. Bryan Robinson 0:21 Brian, thanks for being on the show today. Brian Rinaldi 0:23 Thanks. Thanks, Bryan for having me. Bryan Robinson 0:26 The "Bri(y)an" episode. Go ahead and tell it tell us a little bit about yourself what you do for work what you do for fun. Brian Rinaldi 0:33 So I am a developer advocate at Stackbit. So you know, I get to mess around with all the new stuff and I get to do all kinds of JAMstack things and call it work and experiment with it, and write articles about it and speak about it. So it's, it's a lot of fun. But for fun, let's see. I'm mostly I'd say I'm a gamer. I'm a console gamer. So I am on either my PlayStation my Xbox or the Switch playing something Bryan Robinson 1:06 What were you playing right now? Brian Rinaldi 1:08 I've been hooked on Apex legends for for a little while and that's kind of my main game but I still play Overwatch regularly. That's another one that is one of my longtime faves. Bryan Robinson 1:19 I've only ever played on the free weekends they've done throughout the throughout the life of it, but I've always enjoyed it. Brian Rinaldi 1:25 That's an overwatch I'm assuming. Bryan Robinson 1:27 Yeah, because Apex legend is free, isn't it? Brian Rinaldi 1:30 Yeah, it's free. Yeah. So yeah, it's one of those. What do you call? What do they call them? Like fortnite? Battle Royale? Yeah. Bryan Robinson 1:40 Well, very cool. Very cool. So obviously, this isn't a gaming podcast, although I could very easily talk for a long time about that. Brian Rinaldi 1:46 Yeah, me too. Bryan Robinson 1:49 So let's talk about the JAMstack a little bit. So what was your entry point into the JAMstack? Or if it was long enough ago, I guess static site generators and that sort of thing. Yeah. Brian Rinaldi 1:56 It was definitely long enough ago. I was probably an early adopter. I wasn't part of the beginning, but I was pretty early on. It was probably about six years ago that I really got heavily into static site. It's a bit of a funny story how I started. Brian Rinaldi 2:17 Because I mostly started because I was needed to launch the site for work. I had just gotten recently gotten a role at a company called till Eric, which is now got bought by progress software. And we were going to launch a new developer focused site called Telerik Developer Network. And I wanted to to avoid some issues of competitiveness between WordPress and our current CMS solution that we sold. I wanted to just launch the whole thing using Jekyll because I knew some Jekyll and I've been experimenting with it and I got a no. Brian Rinaldi 3:01 So nobody bought into this idea. And then we ended up using WordPress. But I kind of took that as inspiration to dive really, really deeply into disproving how wrong they were in making this decision. And it led to me presenting all over the place about static sites writing a lot of articles about static sites, you know, getting involved early on in the whole community. I wrote a report for O'Reilly about five years ago about static sites. And then I wrote a book with my friend Raymond Camden, about static sites I was about four years ago, I guess now, three, four years ago. Anyway, it's all been, you know, so I was Yeah, I was early on involved in that and, and have been, you know, dedicated to it since even though it's not until recently after joining Stackbit it was isn't necessarily part of my work day job. Bryan Robinson 4:02 And I feel like that's how there's a lot of great developer technology origin stories. It's like, it's like I had to prove them as wrong as I could. Brian Rinaldi 4:11 Yeah, exactly. It's It's definitely been a part of my, throughout my career, this has come up multiple times. Bryan Robinson 4:18 Cool. And I also didn't know that you would, you would partner with Raymond on a book. So what book was that you said about four years ago? Brian Rinaldi 4:25 Yeah, I think it's like three I think it came out like three years ago now. And we but we started running about four years ago. It's called Working with Static Sites. It's I think the only thing other than you know until Netlify released their thing through a O'Reilly it was the only book early had on the topic. We're we're hopeful that we may even get to revisit that because I wouldn't necessarily recommend it to anybody who's starting out today. The landscape has changed. So much since the time we wrote it, that I mean, a lot of things will still work but it wouldn't necessarily be the most recommended way of doing things today. Bryan Robinson 5:12 I got you and as a side note to all the listeners out there, be sure to go back I think it's episode three Raymond Camden was on the show, so be sure to check that out as well. Brian Rinaldi 5:20 My arch nemesis Bryan Robinson 5:24 Good natured sparring there? Brian Rinaldi 5:26 Oh, he and I go way back. So it's Yeah, yeah. Hey, we've been friends. Well, not to give not to give too much away. But since we both did ColdFusion Bryan Robinson 5:39 So obviously, Jekyll was kind of that the entry point and into the world but fast forward, you know, six years now. There's been an explosion of all sorts of stuff. Yeah, I assume Stackbit is high up on your on your list of passions in the JAMstack or what are you playing with or are enjoying right now? Brian Rinaldi 5:54 You know, One of the things I like about Stackbit. It is The ability to just; I've been passionate about the topic of, of the editing experience in, in the whole JAMstack for years. Even when I would speak about this, you know, four years ago, you know, it was basically like, "Listen, I know you all think markdown is super easy. And well, you could just you know, if I'm going to launch this site, and I'm going to give it to some editor, I'll just teach the markdown, it's just a few tags, you know, just a little bit of markup. It's really easy." Brian Rinaldi 6:31 And I'm like, but then if you want to do this in markdown, can you do that? No, you can't. So you have to do HTML if you want to do that. And I'm like, and so this now I got to teach you markdown plus HTML, which is not easy. And the whole experience has never been very smooth from an editing person, you know, content editors perspective. Brian Rinaldi 6:52 And I think so one of the things I've been passionate about is now with headless CMS and, or even like, you know, things like Like NetlifyCMS, which has kind of grown into a really, you know, great project. I think that's changed. And we now, you know, we now have the tools to make a really good editing experience with the JAMstack, which to me, that brings that brings us to the possibility of being able to, to, you know, bring this widespread, like, make make the adoption grow dramatically, because that has been one of the things that held the whole system back is, is this ability like even even now, like, oh, OK, I can change it on the CMS uncomfortable with the CMS side of it. Brian Rinaldi 7:40 But then, and then I make that change, I submit and then it's like, Okay, let me sit there and Is it is it live? Is it live? Is it live? Is it live, right? And then it's like, okay, it's like, oh crap, I screwed up. When we go back, you know, we fix that typo is alive, you know, and repeat the whole process. So having been a part of marketing teams and in content focused teams I know like the struggles those that that though they have with these kind of tools and I think we're finally making that transition out of that. Brian Rinaldi 8:13 But besides that I mean honestly I'm gonna I guess you might say old school kind of guy ice I still like Jekyll I still use it. I'd say most of the sites I build are still are in Hugo and I love Hugo and I've been using it for years and I maintain a like a bunch of sites that are built in Hugo. Bryan Robinson 8:36 I said I feel like on the podcast we've been pretty pretty much 50/50 from like that methodology of like the Hugo Jekyll 11ty, the kind of hand HTML to the browser and then 5050 on the other hand of doing Gatsby Gridsome those kind of React or Vue based situation so you kind of fall a little bit a little bit further on the HTML side of things on that on that more static static site. Brian Rinaldi 8:59 More static-y that yeah, I mean, I wouldn't call it more static, I think, you know, you can still do all those things. It's just, you know, it's done a different way. Right. So, you know, one of the things I love about Hugo is just, like everything run so quickly, and I'm able, like, I feel like there's a lot of power in the template writing. And that I can dig into, like, you know, things that, that I I don't have to mess with any frameworks or anything, right. Like, I can build it with a framework. I could not build it with a framework. I'm free to do whatever. It'll work. Yeah. Bryan Robinson 9:37 Whatever you're feeling on that given day. You're good to go. So so out of curiosity, you talked about the the marketing team and that refresh, refresh refresh refresh methodology. Is that constant the inspiration behind that stack bit live thing that the Brian Rinaldi 9:54 Right that's exactly it. So we have like, we already put out a control center that Will that you can get for free right now like you can just add it, if you're on Netlify, you can just add it to any Netlify site. And what it'll do is it'll automatically pick up like if a bill has been triggered, regardless of how that's been triggered. So like, you know, if it's been triggered by the CMS, or it's been triggered by a, you're checking in something to the GitHub repository, like it'll, it'll automatically pick that up, notify you and then you can watch as the build happens. And I'll tell you, okay, it's done. You can check the logs and so on. So that's part of like, that's the beginnings of that whole stack that live concept that we presented at at JAMstackConf in San Francisco. But it goes beyond that to whole editing experience that's going to allow you to edit things in line on the page. Bryan Robinson 10:45 Is that going to be as as agnostic in static site generator and CMS level as all the rest of it is or Yes, okay. Brian Rinaldi 10:53 Right. That's, that's kind of one of the keys I think, to their we're obviously not the only people doing these kind of things. So One of the keys to our solution, I think is that, well, it it doesn't matter which static site generator which CMS for the most part you're using, we will we can support that. Where there are some other great solutions out there, but they tend to be fixed towards a particular methodology. , Bryan Robinson 11:17 Cool. So, so you're using obviously JAMstack very hard professionally now, it is legitimately your job. You said, you get to play with all these cool JAMstack technologies nowadays. Yeah. Are you still exploring personally like outside you have anything running that way? Or do you get to just do everything professionally now and do it during the day? Brian Rinaldi 11:35 You know, I still do. I still do personally because all the sites I do outside of work, even our jam stack. So like I run a bunch of online like meetups every month, as well as like online events and in person events that I kind of do on the side. And that site is all built in ego and I'm continuously updating that and maintaining that as well. Bryan Robinson 11:59 So you're running a meetup groups and then online meetups. Brian Rinaldi 12:04 So I run Yeah, I do run meetup groups and I run but I run an online meetup. It's it's at like CFE.dev, if you go there. They I run a number of different things through that, like online trainings and stuff. But I have a free monthly meetup. That's for developers. It's on a variety of topics. Like, I don't, it's not JAMstack specific. It's just developer focused. Right? Bryan Robinson 12:26 Okay. Very cool. So what would it be? Would it be fair to say that Stackbit is your jam in the JAMstack? Are there other things that we want to kind of dive into in that way? Brian Rinaldi 12:37 Uh, you know, Stackbit, I'm, I'm still digging into. One of the things I find about it like, I've been using Netlify since honestly, since the very very beginning. And, and I've I've always been a fan of it, but I felt like they've been releasing a lot of things I never got to dig into some really having a lot of fun trying to mess with like service. Was Functions and our like I did a whole post about Identity and stuff like that, which I hadn't really gotten the mess with. I feel like there's a lot of pieces of nightlife I that I haven't haven't ever touched because you know, I could do what I wanted to do very easily but I never had an excuse to get dig into them a little further. And I'm having a lot of fun doing that too. Bryan Robinson 13:22 Cool. There's almost like ancillary to the JAMstack. Things that you really need the JAMstack to do. Those pieces are there for you. Bryan Robinson 13:29 So I'm also curious about what your actual jam is your musical jam. What's your musical taste? What are you listening to while you work while you play that? Brian Rinaldi 13:39 Oh, yeah. So So I've a lot of what I listened to is it's very electronic. So funny enough, Raymond Camden, I do this whole we have a newsletter. We put out I supposed to be bi weekly, but it's really kind of occasional, like every two or three weeks called CodaBreakers. Where we pick like New Music So I'm like really kind of focused on picking new songs all the time. I'd say lately my jam would be if I could say anybody in particular so so my latest jam like my jam lately has been LCD Sound System and which is not like new new stuff, but I I don't know why I've like rediscovered them and realize like, I'm like why did I not love them as much as I did when this the songs of some of these songs were newer? And and I've just really been digging that but, but other ones like I've really been into, what would you call it chill out music like Tom Cruise I've been. Caroline pull a check and if you ever heard of her, I've been listening to her cigarettes after sex. They're awesome. Very loungy sounding stuff. So yeah, I mean, mostly, mostly obscure, kind of music had tending towards electronic Bryan Robinson 15:00 And will we be able to know what your what your jam is on a on a bi weekly basis by following the CodaBreakers newsletter Brian Rinaldi 15:07 Yeah yeah so it's codabreakers.rocks and it is a jam stack site rebuilt it it's it's it's amazing it's you won't you won't believe it it's it's it's really impressive a single page but but it does actually he built it I mean it's nothing too exciting but he did actually tied into the MailChimp API. So every time we we just send a new newsletter it rebuilds and it it adds the newsletter to the list and everything. So things like that, Bryan Robinson 15:36 And is there anything that you would like to promote what you're doing? What's going on that you want to get out in the open? Brian Rinaldi 15:43 Sure. I mean, the big thing one of the big things I'm doing besides my work at stack bait is I'm running a conference here in Orlando in February. In check net is one of my sponsors. So we've got like Divya from Netlify is coming to speak. It's called Flashback Conference. flashback.dev, it's gonna be a lot of fun. I've got Kyle Simpson as a keynote, Estelle Weyl while as a keynote, I've got Ray's going to be speaking a lot of other really great people. So that would be kind of the thing I'm most excited about and what I'm working on, you know, when I'm not working for, for work, that's what I'm working on my free time. Bryan Robinson 16:22 Conference organizing is not easy. Brian Rinaldi 16:24 No, I've done a lot of them. I've been doing like 10 years or so. And I've done a lot of them. And my wife, my wife's always like, I don't know why you put yourself through this. You stress out every single time and then you're like, Oh, it's going to be a failure. It's gonna talk and then it all goes well. And then you start the process all over. Bryan Robinson 16:42 I've never organized the conference, but I've done a yearly hackathon. And until I get that, that like 10th ticket sold, I'm just like, no one's coming. Yes. And then we get like 100 Plus, and we're good. Brian Rinaldi 16:52 It's always like that in everybody waits to like the last two to three weeks to buy their tickets. And until then you're like, this is going to be a failure. Bryan Robinson 17:00 And you buy all your all your food and stuff, you know, for hundreds of people and you just know you're gonna have too much. Bryan Robinson 17:07 Well, I appreciate you, you taking the time and talking with us today. Hope to see you more stuff coming from stack but especially around that live stuff soon. Brian Rinaldi 17:13 Thanks. Thanks, Bryan. Appreciate it. Bryan Robinson 17:16 And as always, I want to thank you, our amazing listeners, knowing the folks are listening and enjoying the show keeps us coming back week after week. If you want to support that's my jam stack. Be sure to give it a light, favorite or review in your podcast app of choice. Until next time, keep things jamming. Transcribed by https://otter.ai Intro/outtro music by bensound.com

20 November 2019


James Quick on ejecting from Wordpress, Gatsby, Netlify and more

James Quick on ejecting from Wordpress, Gatsby, Netlify and more

Quick show notes Our Guest: James Quick What he'd like for you to see: His Learn Build Teach courses | Learn VS Code His JAMstack Jams: Gatsby | Netlify His musical Jam: Jason Aldean Transcript Bryan Robinson 0:03 Hello, everyone, welcome to another episode of That's My JAMstack the podcast where we asked the pressing question, what's your jam in the JAMstack. Today I'm joined by someone I've had the pleasure of knowing for a few years now he's a developer at FedEx, a technology speaker and educator. The one the only James Quick. Hi, James. Thanks for thanks for joining us on the podcast today. James Quick 0:26 Yeah, it's pretty cool to be here. Thanks for inviting me on. Bryan Robinson 0:29 Yeah, no problem. So So you and I have known each other for a little while, but tell it tell our listeners a little bit more about yourself. What do you do for fun? What do you do for work, that sort of thing? James Quick 0:36 Sure. So I think one of the biggest things is we have a lot in common, especially the last maybe year so we've kind of bounced a lot of ideas and stuff off of each other. So I, I work full time at FedEx as a software developer, do full stack, so front end, angular and then back end Java Spring Boot, microservices, pretty fun stuff, actually. But outside of that, I do a lot of stuff kind of going back to my days of evangelism at Microsoft, conference speaking, I've been getting back into been pretty heavy into my YouTube channel, written articles, online courses. Again, kind of the stuff that we have in common, focused on web development, design and developer tools. So I've been doing a lot of that stuff the past couple of years trying to be trying to be more engaged as active as I can. Bryan Robinson 1:23 Nice and what do you do kind of outside of the the technology realm, James Quick 1:28 just on a personal note, so we have three dogs, we spent a lot of time with our dogs play a lot of sports. My wife and I play on two different soccer teams together. Also, I'm playing basketball one night a week. Sometimes during lunch, we play basketball at FedEx, which is pretty cool. One kind of fun fact that I'm working on right now is building an arcade cabinet like an old school arcade cabinet using like a Raspberry Pi to put games on, and then actually doing the woodwork to build a cabinet which I've never done. So we'll see how that goes. Bryan Robinson 1:57 we won't be like an angle when you're done. James Quick 2:00 That might just be part of the challenge. We'll see how it turns out, but it should be fun. Bryan Robinson 2:04 That's awesome. That's that's very cool. Cool. So So obviously, we're talking about the JAMstack here today or static sites or whatever you like to call them. But what was kind of your entry point into this philosophy of development? James Quick 2:16 One I think you were you were probably one of the earliest people to kind of preach or start to tell me about it. I think a big one was also listening to the Syntax podcast. So with Wes Bos and Scott Telinsky, listen to their podcast a lot. And they, they kept talking about static sites and static site generators and JAMstack and Netlify and all these all these words, and I was kind of aware of what it was, but didn't really have the hands on experience that I think we'll get to in a few minutes. So yeah, I was just kind of word of mouth for a long time. And I was like, I don't really I don't really need to, like, get into that at the time and eventually did and I think like I said, we'll talk about that in a few more minutes. Bryan Robinson 2:55 Yeah, so so so it's kind of just in the ether around you. What was the actual tech like? What was your first project that you did on the JAMstack? James Quick 3:04 First project and I've got, I guess I've primarily got two, or at least two real ones. So both of my sites, Jamesqquick.com, and learnbuildteach.com, I'll go ahead and give my promotional stuff. Both of those are static sites using Gatsby. So I had gotten into React maybe a year and a half ago, React was one that I kind of, shied away from for a while as well, had done Angular work was pretty big into JavaScript just hadn't done React, got into it really liked it, started using it. And then when I heard about static site generators, and learning more about them, again, podcasts and articles and stuff, I realized that my two sites, those two sites, I mentioned that were on WordPress, had some really big flaws with just a lot really primarily around like the development process. James Quick 3:52 So I couldn't find a way to like check stuff in a source code and have that have any kind of automated deployments. I couldn't figure out how to like the version, the data that was a big problem. So like if I made if I was trying to do stuff locally, and I made changes based on whatever the database was here, how did that interacts with the database out there, like in the live site, and basically ended up finding, I can't even remember what the plugin was, but it just it doesn't lift and shift. So if I do locally, it'll have it'll wrap up my entire database, all the content, all the WordPress settings, everything and just push those out to production, which is it wasn't like that bad, but it wasn't ideal. Bryan Robinson 4:30 That sounds absolutely terrifying. Like put pushing from your local database to a production database. Just give me some heart palpitations. James Quick 4:38 Yeah, the good thing was it like the tool was really nice. So it was kind of like I could I could go to prod, I could do like an export button, and it would give me whatever, like zip it put everything in. I could load that into my local version. I can make changes, I could send it back. So it like in that sense. It wasn't really that bad just because the plugin was nice, but overall, it was a mess. It wasn't it wasn't ideal at all for the simple site that I was working on. Bryan Robinson 5:04 So So really the JAMstack was kind of your, your ejection point from the WordPress world. James Quick 5:09 It was Yeah. And I think I figured like, as, as a web developer, I could probably do something a little more like developer than WordPress, I was using Divi theme, and it's a visual builder. And you can do all these things. And honestly, as a developer, it was harder to like design stuff in Divi, than it was to just code it. So I figured moving away from that. And then also kind of jumping into this jam sack world where I can incorporate blog, I could have other types of static information and the automatic build process and all that kind of stuff. And really check stuff into source control and have everything in source control, including like data and assets and stuff was really, really cool. So Bryan Robinson 5:48 That was also something that I ran into a decent bit agency world was was a data changes that were important, like, how do you deal with that on a regular basis and how you deal with that without some sort of downtime. Everything's just in source control. You're good to go. James Quick 6:02 Yep. Yep. I don't know. I don't know if we have Should we go get into like some of the some of the workflow for how that is for my sites now? Bryan Robinson 6:11 Sure. Yeah. Be I'd be super excited here that cool. James Quick 6:15 So I've got two sites, like I said, one is learn build, teach sex. That's kind of like, that's kind of my motto for online learning and teaching. So I take time learning stuff, I use what I learned to build stuff. And then I take what I build and learn and teach other people how to do it and the community online and all that kind of stuff. So on on that site, it's pretty, it's pretty, pretty simple. I guess the one thing that kind of fell into the realm of static site generators was just displaying course content information. So I only had like four or five total courses. So if a few free ones on YouTube, and then a free one on you, to me, and a free one or a paid one on you to me, and just want to display the information, but in theory, like I'm going to continue to build courses, and I could go in and I can like Copy and paste the div and I could type in the information to change it and all that kind of stuff. But now I using Gatsby, set it up to just read from markdown files, which is typically I think, what people do. James Quick 7:11 And I just put information directly in a markdown file, it queries that using graphQL. That was actually another technology that I've kind of heard about for a long time. And I was like, I'm not that interested. And then it's tied into Gatsby. So I get to use that there, which is pretty cool. And so anytime I add a course I just add a markdown file, rebuild my site, and then it goes out there and it's live. And the build process is really cool. So I use, Netlify to host. Netlify is so so easy to just connect a website to a GitHub repo, you tell it, you can tell it a command to to run and I think mine I guess it's Gatsby build. And then wherever the output of that build, like a public directory, basically, you tell it this is the public directory that I want you to serve. So it's those two things, and telling it where the repo is and it's out there and it's built. James Quick 7:59 So anything I push the master branch it automatically rebuilds and start restarts my site as well with the new information. So anytime I add a course I add a markdown file, check it in, and I push it to master and it automatically goes out there and it resets or restarts the site after doing a build. So all the content is out there it's good to go. Again, going from being on WordPress and having these databases and differences between local and prod and all that kind of stuff to this where everything is just basically in like one neat little bow and my GitHub repo was super super sweet. Bryan Robinson 8:36 Also have probably having to deal with you're probably doing FTP stuff back in the day with WordPress to not even having that source control with either. James Quick 8:43 Yep, yeah, did some so before that plugin I mentioned I was definitely going in and like drag and drop and using FileZilla directly to the server, which is, I think on the Syntax podcast they talks about, like the horror stories. They did those recently and it was all about like people, like going in and doing stuff directly on prod and How they mess things up. And yeah, whatever. So I think I think with the workflow that I have now that's, that's probably at a at a minimum. James Quick 9:10 And one. So one other thing that I did recently, I was writing articles on a site called scotch.io for a long time, and really good friends with Chris, who runs that he kind of cut back on the amount of articles that they were accepting. And so I started to think about writing articles on my own platform. And then from you actually copying those over to Dev.to and having those you have to tell me that like syndicated Is that the right word. Yeah, sure. Again, like this is this is the knowledge that you dropped on me, but basically, like put them on my site and then have them copied over to dev.to and link back to my site. So I get credit for it. Bryan Robinson 9:47 Yeah, the canonical link the meta tag. Yeah Rel Canonical James Quick 9:54 So with that, I started writing articles on my James q Quick site, putting those on dev.to and then with James q quick ended up going through that same workflow of anytime I have an article, which I have one to put out tonight, is just put a markdown file in there, re rebuild the site. And that does it automatically by pushing the master and the site is up and running. And it's good to go. So, Bryan Robinson 10:16 yeah, JAMstack at its purist right there. And I think at one point, you, you and I have talked about a little bit, I think we're working on a MailChimp server list function of some sort. James Quick 10:27 yeah. So that's actually like a whole whole new dynamic. So with jam stack, one of the potential I'm doing quotes here for people on audio, the potential limitations is that you don't have a back end, necessarily, like you could have a completely separate back end, you could talk the API's. If you don't want to write a completely separate back in and Netlify they've got you covered. So you can write service functions. And service functions are basically just like you write an individual endpoint. James Quick 10:56 So you can receive a request. You can do whatever it is you want with that request. Then send it off. So what I did to add newsletter subscribers to my site, I created a server list function in nullify that when someone fills out their email, it will send their email to the server list function, the server list function has their credentials for my MailChimp. James Quick 11:18 So obviously with secret credentials, secret keys, credentials, you never want those checked into source control, you never want those available for someone else to see. You don't want them in your front end JavaScript. So with the requests coming in to the server list function, the credentials are in nullify so I get access to them and code. I can take the email, I can make the API request on the server to send off and register them as a subscriber to the newsletter and then just respond back to the front end saying Yeah, you're good to go. So any any sort of like extra piece of functionality that I need, I could just create an extra server list function. Have, like however many lines of code 10 2030 not a whole server. Just be good to go from Whatever that functionality is Bryan Robinson 12:01 nice. And so obviously, that's kind of the the personal side, are you able to use any of these methodologies at work? I mean, as as much as you can talk about with with FedEx, but like, Is there anything happening in that world? James Quick 12:11 Sure. Not, there's definitely some. So one of our teams is kind of like a best practices team. And they do pretty good documentation on their like standards and like, the cookbook is what they call it. So it's like recipes that other people can use to do X. And they actually I think they use Hugo as a static site generator. And I I'm gonna blank here on what language and what language it uses behind the scenes. Yeah, that's, that's it. Yeah. So it uses go has like template tags and like short code, abbreviation, whatever those things are called. And yeah, so they use that internally for some of the documentation that we just kind of like share. James Quick 12:56 We also have our own team version, that I just I probably just haven't spent the time to, like, get into Hugo and really understand what I'm doing. I'm sure it's not that complicated. I just like looked at it. And I was like, Yeah, I don't really feel like doing this. So I haven't done as much as that myself. But I think that's for the most part. As far as I know, that's that's kind of the static site JAMstack type stuff that we're doing internally at FedEx, none of none of the applications that I work on directly have any of those implications, I guess, Bryan Robinson 13:25 Hey, but internal documentation is a great use case for JAMstack. So yeah, more power to them on that. Yep, James Quick 13:30 Definitely. And that's what like all of the Netlify, and Gatsby documentation is all static site stuff. I think, obviously Gatsby is using Gatsby, which makes sense, but that like their documentation is great, right? So you can go out there, you can search for plugins, you can do all these things. And you would, I guess some people have this misconception of like the limitations of gems that but you can you can fill those voids in all these different types of ways something like service functions, to where you really like you don't think of it as like, quote unquote, just static site is like you can build powerful applications that happened to be static sites behind the scenes. Bryan Robinson 14:06 Yeah, preach on that. Bryan Robinson 14:09 So so obviously if you're using Gatsby on a couple sites Netlify is your host, but what kind of what what part of the JAMstack is really your jam like, Is it is it Gatsby? Is it Netlify? Is it the methodology, the philosophy? Where's your love for for the jam stack coming from? James Quick 14:26 Sure. So definitely, definitely the two tools that you mentioned, Gatsby and nullify. Again, Gatsby like static site generator using react, which is what I like to use using graphQL, which like, has some pretty cool stuff behind the scenes. For me, just like learning what graphQL is and how to work with it. They also have some like image optimization stuff built in, so into Gatsby, so you can like it'll do like image optimization in terms of like sizing and you give it an image and it'll do the random sizing and it'll choose the appropriate one. James Quick 15:00 Kinda like what Cloudinary does as a service or like you can use Cloudinary to do that. So that's a really cool feature. Anyway, so definitely, like I said, Netlify/Gatsby probably the the mentality of the development workflow, especially coming from like the WordPress workflow that I had before. Everything is in this GitHub repo. I know where all my data is. I don't have to have a database. I don't have to have almost anything installed on my local machine other than node and whatever. Like Gatsby, for example, like I don't need anything else. I can do it anywhere. I can check stuff in from anywhere I push and it gets built, and it's out there and it's ready to go. And if you've already got note on your laptop, you've got a way of getting Gatsby no matter where you are. Anyway. Bryan Robinson 15:38 It's all NPM based. It all just kind of works. James Quick 15:41 Exactly. Yeah. It's, it's, I mean, like the best development workflow that I could have dreamed of when I was struggling to figure out how people did WordPress successfully. Bryan Robinson 15:52 Yeah, struggling do WordPress successfully is the story of the first half of my development career. So I feel you on that, what's gonna what's going to keep You in the JAMstack? Like, obviously, you're enjoying this right now. But like, if you look a few few years down the road, where are you seeing how that develops for you personally, James Quick 16:09 I think one to continue on the same same idea of ease of use, right? I mean, that's a huge thing. I think the whole ecosystem is continuing to grow. Gatsby just got however, millions of dollars of funding, they have Netlify, just got however many millions of dollars they got. They're continuing to kind of add, again, like those quote unquote, potential limitations, people are continuing to add solutions to those. So you can build like all these really powerful applications, but still have that really cool like minimal streamlined development workflow. James Quick 16:41 A lot of a lot of that like comes into play with these headless CMS that are out there. So to kind of replace the backend of WordPress and you can actually use WordPress as a headless CMS. And just kind of forget the front end of that and just pull data into their API, but things like content full and cosmic is one I've worked on recently. And there's so many other ones. I don't know, there's just so many tools. People are loving it. Like, obviously, you're doing this podcast because you love it. You've got people that are listening and coming on because they feel the same way. And as a community as an ecosystem being online, the more you hear about something, after ignoring it for a certain amount of time you like you kind of have to say, well, there's there must be something to this, because of how many people are talking about it. And I think that's the stage that we've been in for a while. James Quick 17:28 And it just seems like it's going to continue to grow. And I think the tooling will continue to get better and better and potential limitations will be addressed. And I don't know, I think you'll find less and less reasons to not go this route. Bryan Robinson 17:39 Yeah, I completely agree with you on that. So yeah, so I don't want to take up too much more of your time where we're starting to get in that 1520 minute range that I'm trying to keep us in. So what's your what's your actual jam right now? What's your favorite song or your musician? Or what's your coding to on a regular basis? James Quick 17:56 Yeah, so the last I guess it's been like the last Two weeks I've been listened to Jason Aldean new album So Jason Aldean is a country artist. And I wouldn't say I wouldn't say country music like characterizes me as a person. But I certainly like grew up listen to country music went to school in Nashville, so got a lot like got even more in the country music at the time, and have always liked Jason Aldean. It took me a while to kind of just get to this album. And as soon as I did, I was like, Oh, this is this is really good. So I had I had a day when I was cleaning the house, like last weekend, Saturday, and I had like a portable speaker and just had one of the songs on repeat for like an hour and a half. Bryan Robinson 18:34 Really just just one song. James Quick 18:35 Yeah, I got that for my wife. She ends up like taking taking a song and playing it over and over. So I've kind of gotten used to doing that too. But Bryan Robinson 18:44 I suppose whatever works for you, right? James Quick 18:47 Yeah, whatever helps you kind of zone out and just kind of, I don't know, kind of forget about what you're doing in terms of being able to relax, I guess. Bryan Robinson 18:53 Yeah, gotcha. And and we've mentioned a couple things before but but is there anything that you want to go ahead and promote that you're doing Right now any any any big things on the horizon for you? James Quick 19:03 Sure. So I have my one paid course on Udemy is called learn Visual Studio Code teaches you in my mind, like everything you need to know about VScode as an editor, how to debug how to set up, prettier, and ES lint configurations, Git integration, all the shortcuts that you could ever want to learn are in there. So that's a big one for me. James Quick 19:24 I also have a free one on Udemy that is build a quiz app with JavaScript, HTML or HTML, CSS and JavaScript. So no frameworks, no libraries, just building a pretty cool application, I think, with just kind of the core HTML, CSS and JavaScript. James Quick 19:39 And then like I said earlier, LearnBuildTeach.com is where I reference all of my content. I'm working on some content right now hopefully have maybe a little bit more to share later on. But one of them is going to be kind of a MERN stack application. It'll be an Amazon price tracker. So if you've ever heard of like CamelCamelCamel, You can give it a URL, tell it a threshold price and have it notify you if the price drops. And so I'm working on building that basically with the MERN stack, so Mongo, express, react, and node, and then tying in Twilio for text message notifications. So that'll be a course that I don't have a link to yet but hopefully will be the next big thing that I advertised. So keep an eye out for that. Bryan Robinson 20:23 Probably on the Learn Build Teach website? James Quick 20:25 Yes, it will be on LearnBuildTeach.com Bryan Robinson 20:27 Beautiful, beautiful. Alright, well, I appreciate you taking the time out of your day to come and chat with us and share your experience. Yeah, James Quick 20:36 cool. Yeah, I enjoyed it. I glad I could help you kind of spread the positive word about JAMstack. And I will continue to roll on and use it on all my my sites. Bryan Robinson 20:45 Cool. Well keep doing amazing things. And we'll see you around the internet. Bryan Robinson 20:50 So now's the time on the episode where I ask all of you amazing podcast listeners in the JAMstack world. Go out to your podcast app of choice and leave a rating and review. So there are Hello JAMstackers out in the world have a way of finding this lovely little podcast. Thanks for listening as always, and we'll see you next time. Transcribed by https://otter.ai Intro/outtro music by bensound.com

13 November 2019


Gift Egwuenu on Gridsome, Netlify, Serverless and more

Gift Egwuenu on Gridsome, Netlify, Serverless and more

Quick show notes Our Guest: Gift Egwuenu What she'd like for you to see: Her Blog and her YouTube Channel Her JAMstack Jams: Gridsome and Netlify Her musical Jam: Gift's curated YouTube Playlist Other Technologies mentioned Hugo NuxtJS GatsbyJS Transcript Bryan Robinson 0:03 Welcome to another episode of that's my JAMstack the podcast where we highlight amazing people in the community and ask the pressing question, what's your jam in the JAMstack? This week's episode, we have one of the Co-organizers of ConcatenateConf, and JAMstack Lagos, the wonderful Gift Egwuenu. Welcome to the That's My JAMstack podcast. Thanks for being on the show today. Gift Egwuenu 0:27 Thanks for having me, Bryan. Thanks for having me. Bryan Robinson 0:30 No problem. So I've been following you on Twitter for a little while. But I want you to go ahead and introduce yourself to the audience. Tell us who you are, what you do for work, what you do for fun, that kind of thing. Gift Egwuenu 0:40 Yeah, sure. So my name is Gift Egwuenu. I'm a software engineer, and I work for a company called Andella and is based in Lagos, Nigeria. And I'm also a technical writer. I own my own blog where I write about technical topics, mainly focused on front end JavaScript, as well as JAMstack and accessibility. I also run several communities here in Lagos, one of which is the JAMstack meetup in Lagos, as well as a conference called Concatenate. I helped organize that. And for fun, I love photography. So I take pictures, majity street photography, but yeah, that's pretty much everything. Bryan Robinson 1:26 Very, very cool. So so you're pretty busy, especially with Concatenate just ending a few weeks ago, right? Gift Egwuenu 1:32 Yeah. You know about contacting? Cool. Yeah, it was amazing. It was amazing. Bryan Robinson 1:39 Yeah, this is the second year that y'all ran Concatenate? Unknown Speaker 1:42 Bryan Robinson 2:01 Very cool. So so obviously the JAMstack and static sites are what we're going to talk about today, what would kind of your entry point into the idea of the JAMstack or the idea of static sites? Gift Egwuenu 2:11 So I first time I actually heard about jam stack was from my Twitter timeline. So this was last year 2018. In last year, I was scrolling through Twitter and I saw the team jump stock and I was kind of confused at first actually wanted to know what this because you know, there are so many stocks, the mean stock, the lumps that I just wanted to know what it actually means. And and, yeah, so I just had to do like a Google search about it. And it was quite interesting. Gift Egwuenu 2:42 At the same time, I just started blogging. So I started my blog, the same time and I was actually scouting for topics to learn more about and also write about, and this was really interesting. So I did my research. Thanks to the jamstack.org site. was really helpful. And then I stayed doing a lot of research about it. And I wrote my first blog posts on the JAMstack. That was my entry points. Bryan Robinson 3:11 Very cool. And I saw I saw on your blog, you've got like a post about Nuxt, you've got post Gridsome you've got post about Hugo, what's kind of your favorite technology or your favorite piece of the JAMstack? Gift Egwuenu 3:22 Okay, that's, that's a difficult question. Cuz Actually, yeah, I've actually played with a couple of them. But right now I would say my favorite is Gridsome. Yeah. I initially worked with Hugo. This was while, I; This was I actually started working with Hugo without knowing about the JAMstack at first, because I had like, contracts gig where I had to build a custom Hugo thing, but then I didn't know have any idea about the JAMstack but I knew what Static Sites were. Didn't know there was something called the JAMstack. So I worked with Hugo. My first blog was actually a Hugo site because then I was pretty much invested in Hugo. So I had to like get my blog running on Hugo. I did I did that for pretty much one year before I started learning more about Nuxt and at the time, Gatsby was very, very popular even though I am also a React developer when I found out there was also a similar a similar static site generator like Gatsby and it was with some he was quite new at the time that I started using it. So I'd say it's just checked the docs, and it was really interesting. And then I decided at that point, I just say it's port my Hugo blog to Gridsome And ever since then, I've been loving it. Bryan Robinson 4:49 I only know a very little bit about Gridsome. And that's kind of it's on that. It's the Static site generator for Vue that Gatsby is for react? Gift Egwuenu 4:58 Yes is pretty similar to Gatsby because he has the same GraphQL integration that Gatsby has. So yeah, they are pretty similar but they just have different programming languages. React and Vue. Yeah. Bryan Robinson 5:15 And I assume you kind of started making that transition from Hugo over to over to Gridsome because you were working in JavaScript more than and what Hugo's in actual Go. Gift Egwuenu 5:25 Yeah, exactly. So I actually wrote I wrote a blog post on why I made the transition. Because Yeah, I was working with Hugo, I To be honest, I haven't really done anything with Go. So I was basically just doing things out of my own knowledge. I didn't really know so much about Go programming and it was very difficult for me to customize my blog at that point. So when I found out that Okay, there is Gridsome and actually love working with Vue. This is something that I can customize on my own without having to like Seek for extra help. So I just decided to make that transition. Bryan Robinson 6:05 Yeah. So so obviously that's that's you and your kind of personal and your blog site and all that. Are you using JAMstack philosophies professionally, at all Gift Egwuenu 6:14 So that's the thing. At my job. I really don't use the JAMstack. I only use it for Yeah, my personal projects on my blog. Bryan Robinson 6:25 Okay, cool. And do you find that as you experiment with these technologies, are you able to bring any kind of peace that thought process back over to kind of your non jam stack job? Gift Egwuenu 6:36 Yeah, so currently we are I'm working. I'm working with React at my job. But a couple of a couple of teams in my company, actually using Gatsby so which is great. My team currently only uses React. So yeah, this is something I can Maybe talk to them about if they're interested in making the switch. Well, yeah, that's though that's going to be long shots but yeah. Bryan Robinson 7:07 So is Gridsome what you would consider your jam the JAMstack? Kind of your favorite technology. Are there any other technologies that you're really passionate about right now? Gift Egwuenu 7:16 Yeah. Gridsome is one of them. I'm really, I'm really happy about scripts on my last season. It's then another technology that I love using is Netlify. Yeah, because Netlify was like the my entry into the JAMstack. I got to know about the JAMstack through Netlify, and pretty much works with a couple of Netlify products. I use Netlify for almost all my deployments, which is great. Yeah, so I love those two technologies a lot. Bryan Robinson 7:52 So you've been working in kind of the JAMstack for a couple years now. What's going to keep you there? What is it about the JAMstack That is is hopefully going to be the big future of the web? Gift Egwuenu 8:04 So for me basically JAMstack, I feel like JAMstack is still evolving because a lot of people are still trying to get acquainted with the whole knowledge about the JAMstack. I actually started working with JAMstack last year and so far it's been amazing and I feel like for the future we don't we can't we can't actually tell how much you can do with the JAMstack right now. Gift Egwuenu 8:32 You can do a lot. People actually just think JAMstack is all static sites is just for needing a basic web or a basic websites for know you can actually extend the the things you can do with JAMstack even now that you have like things like serverless, which I'm actually at this point I'm trying to learn more about the serverless architecture. So yeah, you can pretty much extend the use cases for JAMstack in whatever you're working with. Bryan Robinson 9:06 Yeah, definitely. And so with the kind of the serverless stuff that you're starting to explore, do you have a background in back end development or are you primarily front end? Gift Egwuenu 9:15 Yeah. I have a background in back-end. In my job I also do back-end development with NodeJS. Bryan Robinson 9:23 Okay. Very cool. So, so yeah, adapting that to serverless should be should be pretty simple and pretty fun. Gift Egwuenu 9:28 Yeah, it is. Like yesterday, I was going through, I think his name is Jason. So he had like a workshop on Front-end Masters yesterday and I followed through. And he also one of the, all of the amazing things about his workshop was when he was trying to teach us about how to get started with serverless functions. And it was very easy. It was it was very slick, like, I did not think it will be that easy. Yeah, just Amazing. Bryan Robinson 10:02 So, what, uh, what is your actual like musical jam right now? Where are you listening to what fuels your day? What's your favorite music or artist or song? Gift Egwuenu 10:12 Every day I have a playlist rights of Nigerian music, which I think I should share. Cuz it has pretty much everything that I love from R&B to Afro beats, mostly nigerian music. So yeah, it's a playlist on YouTube that I just developed for myself. And I use it mostly when I'm working. Bryan Robinson 10:38 Awesome. Yeah, definitely share that link with me. And we'll and we'll share it out because that sounds really amazing. Especially, especially like R&B and, and that sort of thing. I've always enjoyed that. Gift Egwuenu 10:48 Cool, I will share that. Bryan Robinson 10:51 So last, but certainly not least, is there something that you would like to promote that you're doing something you kind of want to get out there and share with the world? Gift Egwuenu 10:59 Yes, sure. I would like to talk about my blog. I know I've said a lot about it already. So I have a blog. It's giftegwuenu.com. And I also have a YouTube channel where I talk about tech, as well as my personal life. So it's on YouTube. I'm also Gift Egwuenu. So,that's my shameless plug. Bryan Robinson 11:22 Excellent, excellent. So yeah, and I definitely recommend, recommend that blog, at least. I haven't seen your YouTube channel. Go check that out too. But I love all the articles you've written on your blog so far. Gift Egwuenu 11:31 Thank you. Thank you. Bryan Robinson 11:33 Alright, well, we'll we'll wrap things up. I really appreciate you taking the time to chat with us today. And, and hopefully, we'll see you doing more and more amazing things, especially with concatenating jam sack Legos and stuff like that. Gift Egwuenu 11:44 Thank you. Thank you for having me. This was fun. Bryan Robinson 11:47 Yeah, I really enjoyed it. Thanks a lot. Bryan Robinson 11:52 Hey, everyone, it's Bryan again. And I want to say thank you to everyone who has listened to the podcast and asked if you enjoyed it, you head over to your podcast application. Give us a review or rating, how people find this podcast and learn more about the amazing community that we work in. Thanks for listening and we'll see you next time. Transcribed by https://otter.ai Intro/outtro music by bensound.com

6 November 2019


Brittney Ball on Gatsby, building and using learning resources and more

Brittney Ball on Gatsby, building and using learning resources and more

Quick show notes Our Guest: Brittney Ball What she'd like for you to see: Tech By Choice - Soon in Charlotte Her JAMstack Jams: Gatsby Her musical Jam: Lizzo Transcript Bryan Robinson 0:07 Hello, everyone, welcome to another episode of That's My JAMstack podcast where we profile amazing people working in this awesome JAMstack community. This week after the short hiatus, we're back talking with an amazing self taught software engineer from Charlotte, North Carolina. Everyone please welcome to the show the awesome Brittany Ball. Bryan Robinson 0:28 Brittany, thanks for joining us on That's My JAMstack today. How are you doing? Brittney Ball 0:34 I'm doing great. How are you doing today? Bryan Robinson 0:35 I'm doing well, doing well! Bryan Robinson 0:37 So um, I guess first let's start with just an introduction. Tell us a little bit about yourself what you do for work and fun and kind of who you are as a person. Brittney Ball 0:45 My name is Brittany Ball. I currently am a software engineer at a company in Charlotte, North Carolina called Skookum. They're a digital consulting agency and what I do for fun, I like poetry. So I do a lot of the, you know, open mic nights in Charlotte around Charlotte and I like to visit the different breweries. So that's a hobby of mine too Bryan Robinson 1:12 You actually go and perform poetry at the open mic night. Brittney Ball 1:15 No, I don't have that much courage, but I like to listen to others before Bryan Robinson 1:20 I was ready to be like, so like, impressed and just have to like leave the call. Because Wow, that would have been amazing. Cool. So, uh, so kind of what's your specialty in terms of software engineering? Like, what what do you primarily do back in front end? Brittney Ball 1:36 I'm a front end engineer. I love the design aspect of coding and you know, so I'm more into like, how everything looks and you know, functions on that that aspect. Bryan Robinson 1:48 Very cool. Very good. Me too. I like if I can't see it. I just I'm not interested in working on it. Brittney Ball 1:53 Exactly. Yeah. Bryan Robinson 1:55 Cool. So So obviously, this is a JAMstack podcast. So I guess what what was your entry point into this idea or this methodology or static sites or whatever you like to call it. Brittney Ball 2:05 I started to do research on Gatsby. And so that was like my entry point. And I really fell in love with how flexible it was. And, you know, the way that you could, you know, stack plugins, and, you know, the theme aspect of Gatsby and, like, Netlify and GraphQL. I just fell in love and like, I'm still, you know, learning, you know, it's so much you can do with it. So like, I'm still learning but I love it. Bryan Robinson 2:39 Very cool. and are using it personally or is it professional? Or where's that falling? Brittney Ball 2:44 Right now I'm using it personally to build learning resource that I'm working on. So it's like trial and error, some learning as I know this is something that I'm really passionate about. So Bryan Robinson 2:58 when you're building the resourcing Casspi, I assume, yes. Very cool and what sort of what sort of plugins are using, so you love that you can, you can kind of stack those plugins together. And I'm very interested in cascades plugin ecosystem. Brittney Ball 3:10 Um, so I'm using a plugin for that will. And so I have a blog aspect of this websites. I'm using a plugin to bring in our RSS feed. I'm also using a plugin that I actually worked with Jason Lengstorf who works for Gatsby, we built a plugin that would allow you to bring in things using a meetup API. So yeah, I'm using that plugin also. So like, I'm trying to like, it's a lot of things one into this learning resource. And so I'm having to like do a lot of research and if you know, it doesn't plugin, I'm learning to build my own and put it out there for others to use. Brittney Ball 4:10 Because Gatsby is somewhat new in some, some of the issues I run into. Haven't, you know, they don't have a lot of in the community they don't have a lot of answers for. And so I have found myself going directly to the people that work. There are the people that don't that, you know, the Gatsby theme, and you don't have questions, I go to the person that built it. And as you know, oh, you know, does this have this? No functionality yet, and getting answers straight from the source. So I like that they're really open to reaching out to you and like helping you with that. Bryan Robinson 4:50 Pretty cool. Yeah, I've actually noticed that too. Like, I run into a bug and there's like, maybe one stack overflow question about it. Like you can't find the answer. Yeah, that's actually something I've heard a few different times about Gatsby Is that like a lot of people in the ecosystem are real friendly, you can reach out to them. Brittney Ball 5:06 Yeah, they they are really friendly. And I just found out about Spectrum. And so on Spectrum, we have like a really big community and they're all open to answering questions about Gatsby and you know on Twitter if you you know, hashtag Gatsby have a question. So many people will reach out to you and like try to help you solve the issue. Bryan Robinson 5:29 So So what would be fair to say that Gatsby is kind of your jam in the JAMstack? Brittney Ball 5:33 Yes, it is. It is really is like I'm really falling in love with it. And like I really want to, you know, create something major with Gatsby. Yeah, I really love it. Bryan Robinson 5:42 I really enjoyed the fact that so like, I'm a static site guy, I've been using like Jekyll and 11ty, but I love that like Gatsby is the this thing that's kind of beyond that, right? Like it's static sites, but then it's like a static app builder. Almost like you can do so much with it. Brittney Ball 5:58 You do so much. Like I've been talking to like others and then like, I don't know about Gatsby aesthetics, I'm like, but it's like, so much more than just a static site. Like, it's so much you can do with it and like, just so awesome. Bryan Robinson 6:13 So the stuff you've been doing with it, have you been doing, like the full, like, single page application aspects of it? Or are you doing server side rendering with it or you actually kind of combining both of those? Brittney Ball 6:24 Um, it's a little combination of both. So I'm using like, Netlify. So yeah, it's a combination. So I'm trying to, you know, this is like my first Gatsby site, so it's like trial and error, figuring it out on what to do and what I like and what you know, after this, I think I'm going to build something else in Gatsby like to just keep building until I figure out what works best for me. Bryan Robinson 6:54 I get that that first and then second and third and fourth. And especially when you have side projects. Once you start from really hard to stop? Brittney Ball 7:01 Yes, yes, yes, I have like my GitHub, I have so many different ones. Yeah. Bryan Robinson 7:07 About that. Right. So before you kind of discovered Gatsby, and for you maybe got into this whole static site world, were you wanting to do side projects? And was it harder before you kind of discover this stuff? Brittney Ball 7:21 Yeah, it was. Yeah, it was a lot harder to like. So before, I was just working with like, another JavaScript. And so like, that was harder because it took a lot of more work. And we had to, like, you know, do a lot of the building yourself. Whereas the Gatsby, you can bring in a starter, and it's already like, pre configured for you. And if you add in things and functionality and like, you know, plugins, and it's, you know, it was easier for me to learn and, you know, I say break things and, you know, fix them, you know, So yeah, I think like, I recommend Gatsby to like anyone that you know, starting out and they want to learn something like Gatsby is so, like, easy. It's like really simple to learn. Bryan Robinson 8:15 And so coming in coming into this kind of world did you do you have much experience with back end technology or view just has brought in okay, because I got a little bit of experience and I hate it I hate back end stuff. Brittney Ball 8:27 Yeah, yeah, I had a little bit like starting out. I don't know if you know, but I'm completely self taught. So like I taught myself web development using YouTube. Yeah, and so I had to figure out a back end and front end and not like it was the line was kind of blurred for me. You know, which was front and back end, but I learned quickly the difference because front end is like so much more like a Filling to me. Bryan Robinson 9:03 And it gives you that quick feedback loop to like you you do something, you see it, it works. It's great. Or you do something you see it. It's horrible. You fix it. Yeah. So you mentioned learning on YouTube, but what were some of like your big resources? Or was it just random videos that you would find by googling? Brittney Ball 9:20 Yeah, random, random searches. So that's when that's before like Free Code Camp. And a lot of you know, the things that they have now to learn on. They weren't around back then. And so it's all like me, like you, YouTube being, you know, JavaScript and seeing what videos we had and like which ones were you know, the thing about learning on YouTube. A lot of people don't teach the same and they don't break it down so that newer engineers or you know, someone that wants to break into the end industry can understand. And that's where I want to help. Because I know the things that struggle with, you know, trying to learn. And so like, I want to be that voice or others that, you know, I want to break it down so they can understand and not use a lot of big terminology. You know, it kind of confuses so like, that's one of the struggles I face when I was learning on YouTube. Bryan Robinson 10:24 Definitely. And sometimes the definitions don't mean what people expect them to mean to that. That was like my first five years learning I was mostly self taught like with a couple mentors, and like they would say something and I searched for it and it actually meant something different and yeah, exciting. Bryan Robinson 10:43 so so you're using Gatsby you're enjoying it, I assume. So you talked about how much you love it. What what's going to kind of keep you in this obviously you're maybe not using it professionally right now. But what's going to keep you playing in the jam sack working with a jam tech what makes you like what gives you the Love. Brittney Ball 11:02 Um, they're always coming out with something new, some kind of improvement and so like, you know, because it's new or like, it's always something new to learn, like, and I heard, you know, they're doing something different themes now, you know. And so like, I'm just excited to learn what's new Gatsby? What you know what exciting thing I can do with it now you know, so they're always coming out with new ways to use it and so that's really exciting for me. Bryan Robinson 11:30 What Yeah, what's that new thing? Let me let me use that new thing Brittney Ball 11:33 that had no time to get boring because it's always something Oh, guess what you can do what gets me now like, Bryan Robinson 11:40 all right, so so you know I don't want to keep you too long. Keep it nice and short. But I do want to know what was your actual jam right now? Where do you jam and how to where you listening to dancing to? I don't know. Brittney Ball 11:52 So I have fallen in love with Lizzo, I love her. And I love everything about She stands for as far as like, women empowerment and you know, loving yourself and, you know, so I really, really adore this. Oh, you know, that's my jam, especially when I'm coding. Like, she just gets me pumped and excited and you know, proud to be a woman and like, I just love her Bryan Robinson 12:17 Very cool. And is there a sort of a thing you'd like to promote that you're working on anything that you want to share to the world? Um hmm. Brittney Ball 12:28 I am currently starting my own chapter of Tech By Choice. So it's a nonprofit that, you know, empowers women and anyone that, you know, classifies themselves as a woman. It empowers them and helps them on their journey throughout tech. So it's free, free, free to low costs, courses and classes and like you know, mentorship and you know, that kind of, you know, You're not alone in this. Bryan Robinson 13:03 Is that local to where you are? Brittney Ball 13:06 It's actually based out of California. But my chapter will be the first chapter outside of California. Bryan Robinson 13:16 Well, thank you for taking the time to chat with us. And letting us get to know you a little bit better. And I hope you keep doing some amazing stuff. And I'm going to be on the lookout for Tech By Choice. That's for sure. Brittney Ball 13:27 Awesome. Thank you so much for having me. Yeah, no problem. And we'll see you on the internet. Brittney Ball 13:32 Yes. Awesome. Thank you. Transcribed by https://otter.ai Intro/outtro music by bensound.com

30 October 2019


Phil Hawksworth on "static first," the future of the JAMstack and much more

Phil Hawksworth on "static first," the future of the JAMstack and much more

Quick show notes Our Guest: Phil Hawksworth What he'd like for you to see: JAMstack_conf San Francisco: October 16-18 | JAMstack.org/slack His JAMstack Jams: 11ty | Serverless Functions His musical Jam: Toto | Free Code Camp's Radio | Gaz Coombes Phil's post about dynamic 404 pages with Serverless functions Other Tech mentioned Jekyll Netlify Hugo Cloudinary Auth0 Transcript Bryan Robinson 0:03 Hello everyone, welcome to another episode of that's my JAMstack podcast where we are profile amazing people working in this awesome JAMstack community. In this podcast we ask the age old question, what's your jam in the JAMstack? I'm your host Bryan Robinson and today I'm joined by the ever amazing Phil Hawksworth. Phil is a member of the absolutely incredible developer experience team at a little JAMstack company called Netlify. Bryan Robinson 0:37 Hey, Phil, thanks for joining us on today's episode. Phil Hawksworth 0:40 Well, thanks for having me. It's, it's nice to be here. Bryan Robinson 0:43 Yeah, no problem. And I guess let's let's start. Hopefully, a lot of our audience knows who Phil Hawksworth is at this point. But I give us a little introduction. Tell us you know, what you do for work what you do for fun, that sort of thing? Phil Hawksworth 0:53 Yeah, of course. So say as you say, My name is Phil and I work at Netlify. So I'm kind of fairly well as a right in the middle of the the JAMstack kind of world really, I guess, been working in there for a little while. So I work as part of the developer experience team at Netlify. And I've been there for almost two years, I'm I don't quite know where the time has gone. But yeah, I've been there a little while now. But I've I've kind of been working on figuring out how to use Netlify as part of the JAMstack, finding out what people need from it, trying to find interesting ways to use it. And I've been, I've been interested in JAMstack and building kind of static sites, I'm careful of using the phrase static sites, it's so it's a dangerous thing to say. But I've been dabbling in that world for quite a long time, I used to work at an agency. So I did lots of work for doing architectures for different projects and clients there. And I kept on coming back to this approach that I now know to be called the JAMstack. Bryan Robinson 1:49 Cool. So you kind of already partially answered the next question. But your answer your point to the JAMstack was in this agency world? Phil Hawksworth 1:56 Yeah, I think really, anyone who's been doing anything like technical architectures in an agency, where the client often dictates the the kind of platform and the architecture you might use, irrespective of what the problem is you're trying to solve, I was in that world for quite a few years. And more and more often, I'd be thinking, we can simplify this, there's an easier way to build these things out. You know, often a project would have an aggressive lead time, but that didn't always marry perfectly with the lead time for the infrastructure you have to build on. So for quite a long time I was I was really curious about how we might simplify things, how we might pre render things, and then serve them from a much simpler hosting infrastructure. And to be honest, it was things like Jekyll and GitHub Pages that got me into this. I think that's probably an entry point for lots of people over the years. Phil Hawksworth 2:45 I think Jekyll was one of the first static site generators that made things really approachable, and was you know, felt mature and felt like it was well documented and had a nice on ramp, if you could get over one of the two of the wrinkles to do with Ruby. I'm not a Ruby guy. So that usually where I came unstuck, but once you got past that, I found that that was the that was the way in for me. And I got really excited about how easy it could be to generate a site and deploy it onto something like GitHub Pages at the time, which I think was pretty much at the forefront of automating kind of hosting a static site. So that's, that was my route in. Bryan Robinson 3:21 Okay, and how the clients feel about that. Like you said, like, they tend to dictate technology, irrespective of what they're doing. Phil Hawksworth 3:28 Yeah. And it, it really depended on the client. Some, some clients were much more open to it than others. But I found that the bigger the brand, and the big, like the more established they were in the market, the more likely they would be to say, Oh, no, no, that's not for us, we need an expensive thing. irrespective of how complicated the thing is you're making. Phil Hawksworth 3:50 So actually, that that became quite a difficult challenge, I found to to actually persuade people that they didn't need to spend a fortune on complex infrastructure and something simpler could could actually serve the purpose. And that that kind of played into the conversations I started having with Matt and Chris, the founders of Netlify back in the day, as, as they were trying to coin this term JAMstack, because they were having the same problem, you know, I was talking about static site architectures, and they were doing the same thing. And I think it's such a loaded term, the word static, that, you know, that's where the phrase jumpstart was kind of born from this, this, this desire to get beyond the kind of baggage that comes with the term static, which makes people think simple. Phil Hawksworth 4:37 And I think as the the ecosystem, and all of the vendors and tools have matured around this, that's what's takes JAMstack sites to something beyond static, you know, it's beyond what you might think of traditionally a static so that's, that's where that kind of term I think, was was born from, and that was my entry point into as well trying to find ways to convince clients, some of whom would be okay with it, some of whom would need some convincing the they could spend less and go faster, which seems like a sweet spot for me. Bryan Robinson 5:04 Well, yeah. And it's funny, because like, clients assume that the more you pay, the better the service is. And that's not necessarily true. In fact, it rarely, is. Phil Hawksworth 5:13 Yeah, there's, I think there's always this kind of feeling of finding something which is reassuringly expensive. I've definitely been in that world a lot where, by default, particularly the larger brands, who might go to a large, you know, big global agency, which is the kind of place I was working at, they, I think there's an assumption that they, they need the best in class thing, which has the biggest price tag. And often those are the things that are designed to do a wide variety of things for a wide variety of people. And that makes it hard for them to do the right, you know, the one thing that you need well, and so it's, yeah, it's definitely not like a perfect kind of marriage of what you pay more, you get something which is better. Phil Hawksworth 5:59 This is a great example, I think JAMstack's a great example of simplifying and focusing down on the on really what you need to do, and then building that out, rather than trying to use a product which can do everything for everybody, which, as we all know, is hard to do. Well. Bryan Robinson 6:15 Cool. So obviously, you are working at one of the bigger JAMstack companies in the world, but how are you using the JAMstack professionally? How are you using it in your personal life, that sort of thing? Phil Hawksworth 6:26 Well, I certainly am still using it very much in my personal life. You know, any sites that I that I make, either from my own blog, or any of my kind of side projects, what have you, I've got a handful of those. And I'm, I'm very promiscuous, when it comes to the static site generator, I use that I think we all kind of have our have our darlings that we like, over over and those kind of evolve over time. You know, I already mentioned Jekyll as the one that I started with him for a while I was also using Hugo a lot really got into Hugo. Phil Hawksworth 7:00 More recently, I've been using 11ty it on my own site and various kind of hobby sites of mine and kind of sites of side projects. But at Netlify I we also use all of the all of those as well, you know, we use our .com site is built on Hugo has been for quite some time. But we also use things like React Static, which is which I think is an excellent framework for things like headless cms.org, that's with react static and also static gen. Phil Hawksworth 7:35 So those, those are both websites that that Netlify put together so we use those static site generators. Aa bunch of templates and example sites, I use a 11ty on, which is there's all sorts all over the place. And and the only reason I feel kind of safe in doing that is one of these core properties of JAMstack sites in the you know, I don't need maintain that platform, once it's deployed. You know, if I've deployed something in one framework, one static site generator, I know that that's going to just keep working, as long as I don't, you know, I don't need to go back and keep maintaining it, I know that will be be fine. So I feel reasonably comfortable with, you know, trying out different static site generators, here or there. And knowing that once something's deployed, is just going to stay deployed. Phil Hawksworth 8:22 And that's one of the kind of nice attributes of this stack. And the the overhead really is in remembering how to maintain it. And if you want to make changes, remembering the different templates, and syntax is and those kind of things. But that's one of the hazards of being someone like me, who's kind of dabbling with lots of different static site generators and, and trying lots of different things out at the same time. But and I don't know, that's kind of that's kind of fun, it keeps it fresh as well. Bryan Robinson 8:46 So you're experimenting with a lot. So what what is your current jam, right? Like, what what are you really enjoying using at the moment, or, you know, in the coming, you know, few months? Phil Hawksworth 8:58 I feel like a lot of my colleagues, gonna make fun of me, because I'm always going on about 11ty. And I really enjoy it very much. And it feels, it feels to me a lot like Jekyll, in so much of as it's a it's kind of approach and the logic that sits down within it. But it doesn't have that Ruby speed bump that I mentioned. So it's very, very portable, in terms of both the output that it creates, like all JAMstack sites, but also the build environment is very, very quick and easy to get bootstrapped with it. Phil Hawksworth 9:29 So I've been having just a ton of fun with that, especially as the project's been evolving a little bit. And it started to add things like support for JavaScript in the data files. So that's a fairly kind of common convention, I think, for static site generators to have a folder full of data files that you can use in your templates. And I really like the fact that it will let you write those files with JavaScript, which could go off and make a request and return data. So it makes it very easy to pull data in from different points that build time. It just makes it loads of fun. So yeah, I've been having, I've been having a lot of fun with that recently. Phil Hawksworth 10:08 And the other thing I'd maybe call out is some I've been dabbling more and more with serverless functions, which I know kind of aren't necessarily kind of, from a purist point of view, part of the JAMstack, but they're, they're best friends, I think, you know, they complement each other really, really well. And so I've been having a bit of fun playing with things like using serverless functions as a fallback as a 404. Sso for any routes on my page on my sites that don't, that don't resolve to a pre generated page, sending those off to serverless functions instead, which can then dynamically render on the fly, something that's maybe hitting a data source or something like that. So it's an interesting kind of model. I'll publish some some examples of that. Hopefully, they'll be out by the time this is this is this is published as well. Bryan Robinson 10:55 I'm very, very interested in that. That's, that's a concept that I hadn't even thought about. Phil Hawksworth 10:59 Yeah, it's a really, it's really interesting, because I think there's this temptation sometimes to say, well, we could use serverless function to, to render things on the fly. So we're still kind of, you know, not having a web server. And you know, we don't you know, so we've still, we still got that kind of simplicity in terms of the infrastructure, but you're not pre generating them. So I'm always cautious. I like to try and pregenerate as much as possible. So if something fails, it fails in my house, not in the user's house. But it's interesting thinking of serverless functions as a fallback for 404s, particularly if you're hitting something like a database, when you're generating the pages, you know, what if you're adding content to the database, and while the site is regenerating, and maybe creating other pages, your 404s could hit that database directly. And then return pages is an interesting kind of model just to extend the reach of JAMstack. So yeah, I've been having a lot of fun playing with that recently, Bryan Robinson 11:54 And so so where do you you mentioned pre rendering, and how, you know, that's kind of your philosophy on it? Where do you lie when it comes to like pre render, and then taking over that render with JavaScript on the fly on the front end? Phil Hawksworth 12:08 I'm, I mean, I think that was great. I think it's, it's one of those things that, you know, it's all down to progressive enhancement, right? And treating things as, as a progressive enhancement, and deciding where your baseline is, what are you enhancing from, because you could very easily argue that a JAMstack approaches to render an empty body tag with a div with an ID in it, and then everything comes down the wire is JavaScript, and you do everything in the client. That's perfectly valid. And I think you know, it, there's this word again, it depends, right? Phil Hawksworth 12:42 You know, if you're building an application, maybe that would be fine. But I love to try and get as much pre rendered as possible. So that while you're going off and making the request for JavaScript, the user has something to see. And while your JavaScript being interpreted particularly on things like mobile devices, which we know not everyone's got a powerful iPhone in their pocket, there are lots of like, less powerful devices, even if the connectivity is good, the power that's required to pause and execute and do all this stuff with JavaScript can make things a bit slow. Even if we're doing you know, what feels like a performant thing. We're relying on JavaScript a lot, we need to be careful. So I like to pregenerate as much as humanly possible. And you end up in this position where there's a balancing act, isn't there? Phil Hawksworth 13:28 I mean, you've got to think about what's, what's reasonable, and what starts to add complexity for the sake of being a purist, and way that balance up. But yeah, I like pregenerating as much as possible. And then really thinking about progressive enhancement. And I'll always stand by progressive enhancement. I know, I know, there's some debates around that at the moment. But I think that's the right way to go. Bryan Robinson 13:49 So you've been professionally in this like, full on JAMstack world for a couple years now at Netlify. You were dabbling in it at the agency. Other than obvious being gainfully employed in a JAMstack company, what's going to keep you in the JAMstack going forward. What makes you just kind of deep down? know that that's kind of the future? Phil Hawksworth 14:08 Well, I think, I think a big part of it is seeing the, the JAMstack ecosystem. Gah, that sounds like a terrible, like salesy phrase, isn't it but there are so many tools and vendors now, really supporting this and being a part of it, whether that's the explosion in the different types of headless CMSs or things like image services from people like Cloudinary, or Authentication Service services from people like Auth0, there's so many things coming along people doing ecommerce, there's, there's so much. So I think seeing the advancement in each one of those areas, that's keeping it very interesting for me. Phil Hawksworth 14:48 And it's a I think it's a real validation that the approach is starting to reach critical mass, the fact that businesses are being formed and, and funded and you know, established based on these kind of models. And I think that's really exciting. There are so many people looking at different avenues now, here that we can all make use of that keeps it far from dull, and I love playing with all of the new services as they as they, they surface. It's nice. Bryan Robinson 15:18 So I think you might be uniquely situated to answer this question, which I haven't had a chance to ask before, which is, what are kind of the impediments to JAMstack flourishing in the future? Is it going to keep exploding? Are there any things we need to worry about in terms of hurdles? Phil Hawksworth 15:33 Oh, that's a good question. I mean, it, I always, I'm always surprised about how the boundary seems to seem to get put getting pushed back further and further away. Because you know, the more you look at it, the more you think of think of the model as kind of static first and, you know, approach the approach the architecture, as I'm going to assume things are going to be static, unless I reach something that I just can't make static, and then look at the alternatives, as opposed to doing the other way around, where we might traditionally have thought, Okay, well, I need, I'll have a dynamic back-end, but there might be some opportunities to do things that are cached or make static and what have you. And, and I think that's, that's the harder way to approach it, I much prefer doing it the other way and assuming static first. Phil Hawksworth 16:17 So the roadblocks seem to get pushed further and further away. Um, I think the, probably the ceiling that's hard to get through at the moment is sites that have many, many URLs, many, many pages. So I'm talking many hundreds of thousands or millions of pages, that's really tough to do from a pre generated standpoint. And static site generators are getting faster and smarter about that. And, you know, and I know lots of people are working on trying to get beyond the, this kind of hurdle of can be selectively generate different parts of the site. And it's a fairly complex problem, because the dependency graph of you know, all of your templates and pages isn't very nice, isn't necessarily very easy to visualize, or easy to understand. So that's an interesting challenge. But once we, once we get further down that line, and the site generators get faster and faster, I think that opens the doors to bigger and different types of sites as well that maybe have millions of millions of URLs, which at the moment is, is probably a bit of a ceiling for us. Bryan Robinson 17:20 Well, and really, I'm trying, I'm trying to think of what those sites would be other than, like big news organizations. That's about the only thing I can think of don't have millions of your eyes. Phil Hawksworth 17:31 Yeah, I think typically, that's that's the classic example, you know, news, news organizations, or publications that have, you know, many hundreds of thousands of pages. Yeah. And the other one, of course, is sites that have lots of targeted, personalized content, that can be challenging as well. But again, that starts to become one of those points of how you architect it and what you're what what you value. So for instance, Netlify the app itself and Neltify, you know, where you go and configure your sites and all of those things, that has hundreds of thousands of users using it. And they're all using content, which is specific to them, you know, it's the data which is specific to their sites. But it's a JAMstack site. It's a, it's a staticly served React app, which then talks to dynamic API's. And you, that seems like a good model, you aren't giving up the pre generated nature of every page that might then be cruel, callable by search, search engines and what have you. But that's fine. But in that kind of environment, you know, I don't want the admin view of my website, you know, admin console being crawled by Google. So it's, there's a balancing act, and it's trying to figure out what's, what's appropriate and what you actually want. But yeah, so serving personalized content to people and then having that crucibles because you needed regenerated. That's another challenge. But I don't always know if it's actually required. Bryan Robinson 19:02 And on top of that, like most of those personalized things, you don't want crawlable anyway. So you probably right, as long as as long as you are connected in a way that the user gets the content properly, then you're probably pretty good to go. Phil Hawksworth 19:13 Yeah, I think so. Yeah. So it's always a balancing act. And then I'm very cautious about describing anything as a silver bullet. And there are so many different ways that we can approach these architectures with the, with the tools that we've got in the jam stack. ecosystem, there's that word again. There's so many tools and approaches that we can take that we can kind of cut the cloth to suit what we need, I think, Bryan Robinson 19:34 So obviously, I try to keep these relatively short. So I'm gonna go ahead and move into the next question, which is, what are you actually jamming to right now? What what's your musical jam? Phil Hawksworth 19:43 Oh, this is a great question. Well, obviously, Toto is never far from the top of my history. It's amazing how often I fall back to having some Toto being played is particularly good on a Friday afternoon, I think, when I need a little bit of a spring in my step. Phil Hawksworth 20:04 But I one of the things I actually often find myself writing code to is the, the, the code radio that Free Code Camp provided. And if you've encountered that, it's just, it's just a YouTube link. And it's like this 24/7 music that's good to code by radio. And it's kind of nice as well, because you tuned in there, and you can see how many other people are listening as well. So even though you're not interacting in any way at all, you've got this kind of solidarity, which is kind of nice. Phil Hawksworth 20:34 So those two things, but the only other thing I'd probably mentioned his Gaz Coombes, who he used to be the lead singer of super grass going back way, way back. But he's, he's got some albums out at the moment that I really, really like, and kind of keep me keep me interested as I'm kind of writing things and and building code. So yeah, definitely recommend Gaz Coombes, I think called Matador that I've been listening to a lot. It's good stuff. Bryan Robinson 21:03 I'll find that and tuck that in the show notes. So anything that you're you're looking to promote, obviously, you're identified, but anything specific, you want to talk about Phil Hawksworth 21:11 the so there's probably just just two things. And depending on the timing of this, we've got JAMstack conference coming up in San Francisco, on the 16th, 17th, and 18th of October. So who knows, maybe this will squeak out into the world in time. Hopefully it's coming up very quickly. So that's, that's coming up. Phil Hawksworth 21:30 And the only other thing I'd call out is there's now a nice slack community growing for the JAMstack community. And there are already a couple of good places to talk like TheNewDynamic Slack is a brilliant place that I'd recommend to people. But also for people who are maybe going to JAMstack conferences and meetups jamstack.org/slack will get you into a good place for for talking about all things JAMstack, we, we foolishly didn't call it JAMslack, which I think Jake Archibald kind of mentioned was a huge missed opportunity but so be it will have to that's just that's just a mess that will have to live with Bryan Robinson 22:11 and I might be a little too kitschy for some people though. Phil Hawksworth 22:16 Yeah, we've we've stuck with just jamstack.org/slack Bryan Robinson 22:22 Alright. Well, I want to thank you for for taking the time and talking with us today. And and I want to say I appreciate all the all the different content that you put out. Phil Hawksworth 22:30 Oh, that's very kind. Well, thanks for this. It's, it's nice to get to talk. And yeah, I've really enjoyed listening to everyone you've had on so we're looking forward to whoever Transcribed by https://otter.ai Intro/outtro music by bensound.com

25 September 2019


Andrew Sprouse on specialized services, amazing APIs and a welcoming community

Andrew Sprouse on specialized services, amazing APIs and a welcoming community

Quick show notes Our Guest: Andrew Sprouse What he'd like for you to see: TakeShape's new Mesh service His JAMstack Jams: Netlify | Gatsby | And of course TakeShape His musical Jam: The timeless Metal of Iron Maiden and the Thai-inspired acousitc stylings of Khruangbin Other Tech mentioned Webhook CMS FaunaDB Amazon AWS Imgix Cloudinary Transcript Bryan Robinson 0:00 Hello everyone! Welcome to another episode of the That’s my JAM stack podcast where we profile amazing people working in this new methodology. In this podcast, we dare to ask the age-old question “What’s your jam in the JAMstack?!” I’m your host Bryan Robinson and today I’m joined by Andrew Sprouse. Andrew is a cofounder and CTO of the amazing JAMstack company TakeShape. Bryan Robinson 0:59 So, Andrew, thanks for coming on the show today. Can you give our listeners a little background, who you are what you do for work and for fun? Andrew Sprouse 1:05 Yeah, great. Thanks for having me, by the way. Um, so I'm Andrew. I'm the CTO and co founder of a company called TakeShape. And take shape builds tools for JAMstack developers. And outside of TakeShape. I like to cook I like to ride my bike. And I like to code. So Bryan Robinson 1:27 very nice. So that not not just coding, but also cooking and bike riding. What kind of stuff do you cook? Andrew Sprouse 1:32 Oh, I'm, I'm very passionate about barbecuing. So any type of you know, charcoal fires, smoking. I have like a wood pizza attachment for my grill. So it's that's like a fun project on the weekends. Bryan Robinson 1:49 Very nice. I'm from Memphis. So I take barbecue very seriously, we might not want to get into strong opinions on that too much. Andrew Sprouse 1:55 yeah, I think you would win on that one. Bryan Robinson 1:59 So obviously, now you're a CTO of a JAMstack company. But what was kind of your entry point into the JAMstack world? Andrew Sprouse 2:06 Yeah. So my introduction to sort of static sites and JAMstack goes back to 2010, when we first started using AWS at work, and at the time, I was working with my co founder, Mark, but at Newsweek magazine on the web team there. And so we found out that you could just put HTML files on s3, and then you could host them, basically with zero effort. And it was super fast. And so that was like, wow, if we could really do you know, the whole website this way, that would be amazing. Andrew Sprouse 2:48 So fast forward, like a few months, Mark left to pursue his own creative agency. And one of the first sites that he did was just some HTML, JavaScript and CSS on on s3. And it was the first proof where it was like it was this site for a charity called the Dobbs stories. And it was this first proof that, you know, you could build a full featured website, just with static files. And so that sort of influenced the way that we started to build from that, then on. Bryan Robinson 3:24 Okay, so So when you were at Newsweek were y'all using anything other than just hosting the static files on s3, were you going bigger? Or was it still like you had your content management system for the news? And Andrew Sprouse 3:33 yeah, so unfortunately, back then, we were using enterprise CMS called, it was called Day CQ5. Now, it's called Adobe, AN so since everything couldn't be static, we would spend a lot of time caching, like doing really robust caching. And so that was kind of like, the website, in effect was static. But it was just being served from a cache as opposed to proactively pushing it out to, you know, s3 or Netlify or something. So we we didn't have the tools back then to be able to make the whole site static. So we had to use this traditional CMS. Bryan Robinson 4:17 I actually worked in a news organization for about six years. And even like the side projects we did, we're still like database driven WordPress driven kind of stuff. And then we had our big content management system stack. Did y'all do any side projects like that on on static? Or were you like hosting in some other way? Andrew Sprouse 4:34 Yeah, so the discovery was for was for, you know, a side project was like, you could do a micro site with static hosting, but you can do the full blown media experience. Bryan Robinson 4:48 Gotcha. And so so there's that breakaway agency proof of concept. And then what was the big explosion point for you at that point? What what kind of tipped the scale into the giant, like static sites that you were doing? And then what was the JAMstack tipping point? Andrew Sprouse 5:04 So the tipping point really came along, when we found out that, you know, this is really clicking for the agency. So actually, fast forward a couple years, I joined Mark at the creative agency to help him with technology. And so we're working together. And we're realizing that every project that we do with static goes so smoothly. And you know, it's an amazing end result for the client. And so we start to push all of our clients to go static. And that just got easier and easier when there was more tools. And we had a really favorite tool called Webhook CMS. And it was sort of like a CMS and static site generator sort of built into one. And it was like that, for us was like, Whoa, if you combine this concept of Headless CMS plus static site generator, you get this amazing end result, it's easy to set up. And, you know, the the performance is great, and you don't get any calls, you know, late at night that the site's down or have any maintenance issues. Bryan Robinson 6:25 Nice. So so the JAMstack philosophy is professional, you've just been doing them for what sounds like like four or five years now as like your main go to what about personally or doing anything personally with the JAMstack and your side, like coding projects? Andrew Sprouse 6:38 Well, I'd love to have more side projects right now. But my, my main project is kind of my everything right now. So working on TakeShape. And actually building tools for the JAMstack on the JAMstack. Is is what I spend all my time doing nowadays. Bryan Robinson 7:02 So talk a little bit about that like building the JAMstack with the JAMstack. How does that work? How does that work? Andrew Sprouse 7:08 So TakeShape started out as a headless CMS. And from the very beginning, we wrote the API first. And so being in a jam, Sac State of Mind, we're like, well, how can we do this with no servers. So we built the back end all on AWS lambda using API gateway. So that was that was sort of the first step. And then we realized that our client app could simply be a static, single page react app that we host on s3. So it's actually using JAMstack techniques to build a CMS that's supremely useful for people who are building on the JAMstack. Andrew Sprouse 7:55 And we also incorporated just like our Webhook inspiration, we built a static site generator directly into the CMS so you could have the entire experience in one product. Bryan Robinson 8:09 I see that more and more in like JAMstack companies right now. I mean, Netlify is packing in like four or five different services. Obviously, AWS has a whole bunch of stuff built into it. And then I see you've also got the Mesh product, which is building an API's together, how's that been going? Andrew Sprouse 8:25 So the mesh has been an adventure. It's a problem that we've solved on our own many times, you know, for specific point to point things. But it's been an amazing adventure to try to figure out a way to generalize it and make it easier for everybody. So everybody can benefit from our experience, and frankly, our pain with integrating API's. Andrew Sprouse 8:51 So being able to use that mesh product in conjunction with our CMS product is just a, you know, it's the natural extension. So you have this idea of headless CMS with a custom data model. But then what our customers came to us for said, This CMS is great, but I have all these other things that I need to incorporate into my project. How do I do that? And what the best technique? And well, you know, as soon as we, our answer was, well, you have to launch a Netlify function and write all this custom code, and here's a sample project and then get repo that shows, you know, the sample people, you know, the eyes would roll back and, you know, glaze over. And they would sort of stop listening at that point, because they wanted it to be a plugin, or some sort of out of the box solu