469: Syntax Crossover with Wes Bos and Scott Tolinski
We're joined by Wes Bos and Scott Tolinski from Syntax.fm and chat about the fun of developing, SvelteKit, what tools Scott and Wes reach for when building a website, the WordPress developer experience, and some sick picks!
Guests
Time Jump Links
- 01:18 Guest introduction
- 03:45 Focusing on the fun of developing
- 06:55 What does Scott reach for to build a website?
- 08:40 What's Svelte Kit?
- 13:32 Sponsor: Hubspot CMS
- 15:35 What does Wes reach for to build a website?
- 19:22 What would Dave reach for to build a site with?
- 21:43 Trying out Astro
- 24:41 Keystone updates
- 29:29 Sponsor: Jetpack
- 31:11 WordPress developer experience
- 36:42 What's the point of our podcasts?
- 40:12 Learning new stuff is good
- 51:19 Sick Picks
Transcript
[Banjo music]
[Radio station changing]
Announcer: You're listening to Syntax, the podcast with the tastiest Web development treat--
[Radio station changing]
[Banjo music]
[Radio station changing]
Announcer: Strap yourself in and get ready. Here is Scott Tolinski and Wes Bos.
[Radio station changing]
[Banjo music]
MANTRA: Just Build Websites!
Dave Rupert: This is Dave Rupert. [Laughter] You're listening to--
You're listening to another episode of the ShopTalk Show with Dave--El Diablo--Rupert and Chris--El Chupacabra--Coyier.
Chris Coyier: [Laughter]
[Laughter]
Chris: Thanks, Dave. Wasn't prepared for that one. Couldn't say I'm ever prepared for what you're about to do at the beginning of a show, but that was a good one.
Was it a wrestling reference because we're going to invite two other wrestlers to the ring?
Dave: Oh, yeah, brother. It's toe-to-toe, head-to-head, 360-degrees.
Chris: East versus West.
Dave: Yeah! Canada versus America.
Chris: React versus Vue. Okay. Well, sorry about that, everyone, but this is a crossover show and a very exciting one that's been taking too long for us to get going, but we got it going now.
We have the fellows from Syntax on, another podcast with the tastiest treats for Web developers.
Wes Bos: [Laughter]
Chris: I think I have that right.
Wes: Nailed it.
Chris: But it's Mr. Wes Bos and Scott Tolinski. What's up, guys? Thanks for coming on the show.
Wes: Hey!
Scott Tolinski: Hey!
Wes: Yeah. Thanks for having us. This is going to be an exciting little crossover episode. Big fans of ShopTalk over here, so honored.
Chris: Yeah, if you end up publishing this, it'll be awkward that I welcome you to our show because, really, it's kind of like the same.
Wes: Oh, that's okay. Well, here. We'll welcome you.
Chris: We'll just handshake.
Wes: Thanks for coming on the Syntax podcast.
Scott: Welcome to Syntax.
Chris: Oh, you're--
[Laughter]
Chris: It's my great pleasure and honor to be on the show. I think there's a lot of crossover listeners between our two shows, but if you've never heard of these fellows, head on over to syntax.fm. They're the real powerhouse of Web development podcasts, I'd say. They have a nice website and stuff and they record more often than we do, so it's just kind of better, I'd say.
[Laughter]
Wes: No way.
Scott: I think Wes gets all the credit for the nice website. [Laughter] I pushed a couple updates here and there, but Wes is the real powerhouse of that website.
Wes: You guys have a nice website as well. Haven't you guys redone it a couple times? You've been doing it. How long have you been doing a podcast?
Chris: We just constantly do it. I know, because I've written it a couple times. It's going to be ten years in January, so we're at nine and a half years.
Wes: Holy smokes!
Chris: Yeah.
Scott: Yeah. I remember listening to ShopTalk at my first dev job.
Chris: Oh...
Dave: Whoa!
Chris: Oh... Right on.
Dave: Wow.
Chris: Sweet.
Dave: That does not make me feel old... It does. [Laughter] Yeah, ten years flies by, y'all. So, it's fun. I think, every week, we get a request that we should do a show together, so I feel like we're fulfilling a lot of user requests because not a week goes by I don't see a tweet of you.
Scott: We're closing about 20 GitHub issues right here, putting this together.
Wes: Yeah.
Dave: Yeah.
Chris: What I like about you two (among many things, though) is that you feel very modern in what you do and what you talk about. The topics are in the news, but you're not anti-anything, really. It seems like you do a lot of work in React. Maybe, Scott, you're doing a little more Svelte these days, but that's modern -- that's what front-end development kind of is these days, like it or not. So, you don't talk about it like it's this newfangled thing. You talk about it like the reality that it is, which I appreciate.
Wes: Oh, good. Yeah, we were actually just talking about that the other day on the podcast, how we don't want to be the "this thing sucks" podcast.
Scott: Yeah.
Wes: Because there's certainly enough of that out there. We want to be the people that are excited about new technology and praise the things that are doing well in our community and the tools that we like to use.
Chris: Yeah, but you've been around long enough and the variety of stuff that you talk about is maybe a little similar to us. You've done a bunch of shows on just vanilla CSS stuff. You know? I just listened to the Miriam show. It was great!
Scott: Oh, gosh.
Chris: Oh, my God. What a fountain of knowledge. But that stuff has nothing to do with React. Even though maybe that's a topic that hits your show a lot because I think you both write it a bunch, have a lot of experience in it, and literally sell courses. It's like your life's work.
Wes: Yeah.
Scott: Yeah.
Wes: [Laughter]
Chris: So, stuff about it, so maybe that's appropriate that you hit that topic and center around it to some degree.
Scott: I think it helps that that's our foundation, too. I mean my foundation is very much CSS and HTML, more so than JavaScript. My JavaScripting only really started heavy with Angular 1, really. I mean I jQueried it up a whole bunch. But if we're talking writing full apps or doing anything like that, I wrote some Backbone here and there, but for me, it was always foundational CSS, HTML, and that was my bread and butter. That's my favorite stuff to talk about, to be honest.
Chris: That's cool, right? You could imagine a show that's so newfangled that the topics of vanilla HTML and CSS are just not that interesting and, you know, for better or worse, just not talked about.
Wes: It's stuff that is constantly changing, too. It's kind of exciting. We did a show on HTML a couple of weeks ago and it's one of the best shows, like the most listened to. I think we called it "The Surprisingly Interesting World of HTML" because we were talking about, like, "Hey, we've never done a show on HTML."
I was like, "Well, what's there to talk about? You've got tags and a couple of attributes."
Then we went into it. We were like, "Holy smokes, this goes deep."
Chris: Mm-hmm. Mm-hmm. You could never do one. I mean it's really deep. The amount of HTML (like APIs), I'm sure it's not quite what JavaScript is, but it's far, especially if you're not just talking tags because tags is one thing but attributes are a whole other universe.
Wes: Yeah.
Scott: Yeah.
Wes: We have notes on a show on the link tag.
Scott: Yeah. [Laughter]
Wes: Like actual link tag.
Scott: Yeah.
Wes: There are just so many different attributes and it does so many different random things.
Chris: Yeah. Yeah. That's a weird one. [Laughter] I even think it's weird that there's been no evolution to try to bring together scripts in CSS. Like, why are those two different tags?
Wes: Yeah. [Laughter]
Chris: You know?
Wes: Yeah.
Scott: Yeah.
Wes: That's true.
Scott: Right.
Wes: [Laughter]
Scott: Yeah, that was one of the things that, when I was first starting out, I always reached for the wrong one, and then you're like, "Oh, I've got to Google which one it is." Right?
Chris: [Laughter] Gotta Google it. But I am curious about what your current, like, if you were going to sit down and build a website of significance, like, Scott, you're working on leveluptutorials.com, like your bread and butter stuff. Maybe you could even rewrite it from scratch, like free of the existing technical debt or whatever.
[Laughter]
Chris: Both of you, really. What's a hot stack right now? And not because it's popular but because you like it.
Scott: This is an oddly just timely conversation or question because I am currently rewriting the entirety of the front-end of Level Up right now in Svelte Kit.
Chris: Hmm.
Scott: Mostly just because I tried it and I was always joking that, like, "Oh, gosh. This is so good. I'm going to have to rewrite all of my stuff in it." Then I started thinking about it and I was like, "Well, maybe I'll just hack together something here just to see what that would look like."
The next thing I know, I was like three hours in and I had most of the difficult problems solved in it, like the auth stuff.
Chris: Wow! Yeah.
Scott: I was just like, "Oh, oh, crap. This is so good. I'm going to have to do it."
Then I presented it to some of the guys we work on the site with and was expecting them all to be like, "No, this is a terrible idea." At first, they were like, "That's a terrible idea."
I was like, "Well, let's maybe just hack on it for a week and see how it goes."
Chris: Mm-hmm.
Scott: I think everybody was so impressed with it that, oh, we're doing it.
Chris: So, it's not just Svelte. Svelte, we know as a kind of JavaScript framework that's an alternative to something like React or Vue because it's still component-based. It's still -- I don't know -- you can make a click button and stuff.
Dave: Single file.
Scott: Yeah.
Chris: But it has some great stuff. It has cool animation stuff. It has cool CSS stuff. I can't say that I get it as deeply as you do, but that's the category of thing that it's in.
So, what's Svelte Kit on top of that? It looks like the marketing says it's kind of like Next for Svelte.
Scott: Yeah. That's really it. It's a full-stack for building server-side apps. But what's cool is that you don't have to think about the output of it. There are little adapters, so if you want to output to it....
Chris: What does server-side mean? Do you have to put Node behind it or no?
Scott: You don't have to. They have these things called adapters where you just install an adapter and say, "Hey, give me the Node adapter," and then it spits out a Node app. Or "Give me the static adapter," or the Cloudflare Worker's adapter, whatever you want, and you can basically output to any of those.
Chris: What?! There's a Cloudflare Workers adapter? That rules.
Scott: Yeah, there's a Vercel adapter, a Cloudflare Workers.
Chris: Dang!
Scott: Netlify. I mean there are adapters for a lot of stuff, and it's still brand new. I mean the thing is in beta, but--
Chris: How have they got that kind of dev muscle on this brand new thing?
Scott: It's cool. Begin.com, they wrote their own adapter for it. I'd have to assume they're fairly trivial to get going, but I haven't looked at any of the adapters myself.
Chris: Oh, maybe that's why. Maybe it's easy.
Scott: Yeah. The dev experience for it, though, is just amazing. The amount of code I'm having to write for each of my components is probably a good amount. Maybe let's say 40% less on every single component, and it's extremely effective, so we're using that with a Fastify server to power our API.
Chris: Okay.
Scott: The API is GraphQL using something called Mercurius. Mercurius is basically just the Fastify GraphQL, like the Fastify GraphQL package, and it comes with a whole ton of stuff to make GraphQL servers a little bit easier.
Chris: You have a GraphQL server somewhere and then it does more stuff? Does it CDNI your API or something?
Scott: Yeah, and it gives us built-in support for things like loaders, so to avoid the N+1 thing that you get with GraphQL where you can end up accidentally doing 100 database calls instead of the 5 that you meant to.
Chris: Oh, really?
Scott: It has all that stuff baked in, so it made it really easy to get going. We have the Fastify API and then Svelte Kit site hits that API. Then we use something called GraphQL code generator to basically scoop up our schema--
Chris: Okay.
Scott: --and spit out all of the mutations, all of the functions, and in Svelte Kit, they end up just being a function, so we don't have to deal with a React hook where, with the React version of the same thing, it would give you a React hook, like a use, get user--
Chris: Yeah.
Scott: --or a use user hook that you then have to call another function that calls a function that eventually gets to your data. This is just a function that could either return a promise or an observable depending on what you want.
Chris: Oh, so it does some real-time stuff.
Scott: Yeah, so it ends up basically just scoops up our schema, scoops our GraphQL queries, and then spits us out a function. I just import the function and say, "Hey, get me the thing." It gets me the thing and then I render it, either server-side or client-side, however I want.
If I had to choose that's a stack of which I have gotten to choose. That's the stack I went with. Yeah.
Wes: [Laughter]
Chris: That is exotic, Svelte Kit Mercurius.
Scott: Yeah.
Chris: GraphQL Fastify. Woo!
Scott: Yeah, and it's pretty hot. I like it. The site how been on Meteor forever and ever and ever, so we moved off of Meteor onto the Fastify Mercurius, and now we're ripping out the front-end. After that, we'll actually get to iterate on some features, believe it or not. [Laughter]
Chris: I want to ask Wes the same question, but I do have one. I'm curious about these generated -- they're not hooks. They're generated mutations? What if you don't want--? You've never needed to write your own mutation or change a mutation to be like, "No, this generated one is not right. I want mine to be like--"?
Scott: You would still write a .graphql file that is the GraphQL mutation side of things. The previous way you would do it with Apollo or something is you would write that query. Then you'd either import it or use it as a string inside of a GQL function and then pass that into the use query hook.
Chris: Right. Right. Right.
Scott: This just saves that step where you don't have to have them live in your code somewhere. It doesn't save a crazy amount of steps. It's not doing what Prisma is doing. Is it Prisma or Prismic?
Wes: Prisma. Prismic is the hosted CMS.
Scott: Oh, yes. Yes. So, it's not--
Wes: It's confusing.
Scott: It's not what Prisma is doing where it's not writing anything for you. It's not saving you a ton of time, but it is saving you some maybe bloat in some of your files where you just end up having the same thing defined a few times.
Chris: I've never heard someone say, "Oh, hooks. That's too much boilerplate."
Scott: Yeah.
Chris: You know? Hooks were kind of like, whoa, this is easy.
Scott: Yeah. Yeah, I know. Yeah, it feels like it's overengineered compared to what we're working with now, though. I don't know if I would have said the same thing a couple of weeks ago, but now I feel that way. Definitely.
[Banjo music starts]
Chris: This episode of ShopTalk Show is brought to you in part by CMS Hub by HubSpot. Maybe you know HubSpot as a CRM. It is that. It has a bunch of different hubs, hence HubSpot. [Laughter]
There's a marketing hub, meaning lead generation and automated marketing type stuff. A sales hub, which is the CRM, which does stuff like schedules meetings with your leads and provides quotes and stuff.
They have other hubs, but CMS Hub is what we're talking about. It's a content management software that's super flexible. You can build whatever you want on it. In fact, it's like any other CMS. You work locally using whatever tools you want and then deploy to HubSpot, so it's your host and it's like a framework for content.
What's cool is that the CMS part of it is tied to the CRM parts of it, meaning that you can build a website that people log into and use in that way, but then you are also customizing it because you know who they are and the fact that they're a lead and you know some information about them. You can customize the website around that. That's pretty darn cool.
This is an interesting example, I think. They have a real estate site. Normally, you think of a CRM as people in the CRM. But in this case, properties are the things in the CRM, so like 123 Elm Street - or whatever. That way the website, powered by CMS Hub, is grabbing that CRM data and making a website of real estate listings. But the real estate listings are in the CRM, so you're gathering leads on it, like Julie wants to go see the property at 123 Elm Street. I think that's just a really cool and interesting idea.
It's loaded with other built-in features. This is pretty advanced-style hosting. They have serverless functions, for example, which is a pretty modern, cool idea that I use all the time.
It has membership management in there. Again, these are websites you log into, not just brochure sites or whatever.
There is search built in, for example. You don't have to reach for some third-party search. They've got search handled for you with it.
That's all I'll tell you for now. That's CMS Hub by HubSpot. Thanks for the support.
[Banjo music stops]
Chris: Wes, you did a thing where you used Apollo. Are you React Apollo? Is that your fav?
Wes: Yes. I've been dipping into Svelte as well because Scott won't stop gushing about it.
Scott: [Laughter]
Wes: I see where he's coming from. I was just working with it this morning and I was like, "Oh, yeah." There are just little things like the templating and working with forms. The API is really, really nice.
But, currently, all of the apps that I've built (and kind of the stack that I like) is Next.js. It seems to becoming pretty stable these days. They just announced Next 11 a couple of days ago, and there wasn't any fundamental, big changes. I think the big changes that will come are coming down the pipe when we get React server components. But it's becoming a nice, stable platform.
It's nice that you can just dip in and get serverless functions when you need it. The routing is built in. There are lots of libraries available for React, which is pretty cool.
Chris: It's nuts. I hate to admit how much I like Next, but it's just so good. Isn't it?
Wes: It's so good. The only thing I wish that they would do is -- I kind of wonder if they're going to do this because I wish that they would make a CMS because they just announced this real-time editing thing. I just looked at it briefly, but I was like, "Okay. I get this. You and the client can be editing the same thing at the same time. You can see where the client's cursor is."
I was like, "Is the next step that they're going to roll out some sort of data layer for React as well as some sort of CMS of client editing?"
Chris: Maybe. Isn't it interesting how Netlify never got into data, really? They're like, "Oh, just go somewhere else to store your data." It's either Markdown files in your repo or you're on your own.
Wes: Yeah. Yeah, they have--
Chris: The same with Vercel, though. They don't really have data.
Wes: It's actually kind of interesting. I personally have been really enjoying CMSs that are built on Prisma or just GraphQL. Keystone is one that I used on my last course, which I'm a big fan of.
I really like that it will generate all of the GraphQL for you. I've certainly been in a situation before where I've had to hand-code a lot of that GraphQL stuff myself and it gets really repetitive after a while.
Chris: Yeah. Well, you both agree on GraphQL. You probably agree on more than that, but aren't you thinking that GraphQL is the thing? It is relatively new. There could be something that replaces it. It could -- you know. But what do you think? Is Rest dead? [Laughter]
Wes: I don't think Rest is dead. I still reach for just popping a quick endpoint in. If I have a Next.js app and I want a serverless function, I'll just make a new serverless function and then just dump the JSON from that.
I think, especially if we start seeing a bit more of a swing back to server rendering, you might just be seeing people doing SQL statements right before they render. We were joking on the last podcast how everything we do in JavaScript world is sort of like, "Well, PHP did that 12 years ago." [Laughter]
Chris: Yeah. Indeed.
Wes: I don't know. I think GraphQL definitely, for a big project, that's the way to go right now, but I don't think Rest will go really anywhere.
Chris: Yeah. It's just a URL, right? It's not like URLs are going to die. Nobody mentioned Vue at all, but I know Dave likes Vue. Would that be in your kind of an ideal Dave stack these days?
Dave: Oh, yeah, Dave stack. [Laughter] I think my ideal is maybe nonexistent right now. I'm using a lot of Nuxt. Kind of went all-in on Nuxt using Prisma, which we talked about. It's cool. It's got quirks, but it's cool. I picked it up learning Redwood, I guess.
Wes: Mm-hmm.
Dave: It was like, "Oh, it's the Rails ORM, basically." [Laughter] But you do a little compilation step. But it's a really nice way to interface with your database, even a Rest API or Rest database. I just was like, "This is what I want."
But the more you use Nuxt, I feel like the more you feel like, "Oh, I would like this to be on Vue 3 in Vite rather than Webpack and Vue 2."
Chris: Hmm. I didn't know that.
Dave: Which I think that's all coming in Nuxt 3, but you start feeling it as it goes, you know. You know you get an error on runtime.js, runtime.minjs line 392, and you're just like, "I don't know where that -- that means nothing to me."
Chris: I hope these dev tools stick with that, that speed is so vital. I don't even think Next uses anything exotically fancy beyond Webpack, in fact.
Wes: Yeah, they just moved to Webpack 5.
Chris: Which is great but, like--
Dave: Okay. Yeah.
Chris: If Webpack gets leapfrogged (in speed) by something, which is kind of happening--
Wes: Mm-hmm.
Chris: --with esbuild and stuff, they should move to it because, when you're using a tool that has that fast of compilation, you're like, "Oh, mmm. Yes, please." [Laughter]
Scott: It's too fast. Yeah. It's updating before you can finish typing or thinking. It's so very fast.
We were doing full production builds of our server because it was just that fast. We didn't have to even think about it. It was still faster than what we were doing in the past. esbuild, to me, is--
Chris: What are you using? Did you say? Oh, you are using esbuild.
Scott: Yeah, we are using esbuild.
Chris: Oh, nice.
Scott: we're just using that to compile our TypeScript on the server-side. It's very good.
Chris: Ah, I got the perfect stack for Scott out of there, which was full of all kinds of exotic buzzwords, so I feel like that was worth it just for that.
Wes: Scott does that. Scott loves trying new stuff, and he has no problem dropping and rewriting everything. He's rewritten his course platform probably four or five times since we've started the podcast. [Laughter]
Chris: But isn't that cool? If he does that, then he has real-world experience using it and then can make learning material about that thing. It's kind of a cyclical bonus then, right?
Wes: Exactly. Yeah. Yeah, exactly.
Chris: That's cool. I was going to ask him and you, though. Have you seen Astro? I feel like I've become a dev evangelist for it. It's some next-gen stuff.
Wes: I haven't tried it out yet. I just saw yesterday that it is open to the public now, so I am also very excited about that.
Chris: Yeah, it's pretty cool. Even if you just like JSX and just wanted to stay in React, you just can. You know what I mean? You don't have to learn all this new stuff. The .astro components are cool and are JSX also and have some cool superpowers, but I think porting won't be so bad, like if somebody really wanted to move a CreateReactApp to Astro. It's going to be a bunch of work, but probably not as bad as it seems.
I don't know what it would buy you over Next because one of the advantages of Astro is that it builds this static HTML, which is a big deal to me. I'm not going to launch no site without server-side rendering of some kind. You know?
Wes: Yeah.
Chris: For the content-y parts, so I need that. But Next already has that.
Wes: Yeah. I feel like we're in a bit of a renaissance right now. You know when everybody switched over from jQuery to these frameworks, there's a lot happening in JavaScript land right now and it's all awesome stuff.
Chris: Yeah. Yeah. What are you thinking about, Dave?
Dave: Oh, I was thinking about Next and the new React changes that Wes was talking about, like static builds and suspense and all this stuff. I think I would still choose Next for a React project just because all that stuff is just going to get better. They're going to handle it better, right? You don't have to crunch your own static build server and client build server.
Chris: You might do nothing. You might update your package.json and you just get it all. You know? There might be breaking changes, so I can't promise that, but it's a possibility that their work under the hood you just benefit from naturally.
Dave: Yeah, it just seems like we're in, like -- I don't know. There are a few established players in the scene and any benefits that come should trickle down, hopefully, unless you're stuck on something like, I guess, Nuxt 2 or something like that.
[Laughter]
Dave: You know. I think, eventually, it'll get better. I am curious. The database stuff always gets me. I need to check out Keystone, which I think you mentioned once.
Chris: What's the datastore on Keystone?
Wes: Keystone was -- they initially wrote their own adapters where you could either use MongoDB or you could use (I think it was) Prisma. Then basically what they did is they ripped out their entire adapter. The API stayed exactly the same, which is awesome. You didn't have to update any of your actual code. But, behind the scenes, it's actually using Prisma, so you get all the benefits of the GraphQL and all the hosting. It runs on SQL Lite locally, which is just like a file on your computer.
Chris: Whoa! Seriously?
Wes: As a tutorial creator, I'm so happy because that's one less step.
Chris: You don't have to be, "Go to this thing. Sign up for a free account."
Wes: Yeah, it's pseudo NPM. Don't put your credit card in. There's none of that. It's just, "Here's a file."
Also, if you want to give people starter data, you just give them the file and there's all this data in it already.
Chris: Oh, that's awesome. Yeah.
Dave: No, that's pretty cool. But what's the deploy story with Keystone? It's a Node server of some kind somewhere, like in between the database and your client. Is that kind of what it ends up being?
Scott: Yeah.
Wes: Yeah. It's a Node server or they are getting it to run -- so, it's built on Next.js as well, and they are working on getting it to be able to run it on things like Vercel, so you can run it in serverless functions, which is pretty nifty.
Chris: I think that'll be the baby bear porridge as we move on Web development. We'll be like, "Yes, static front-ends are a good best practice. There are lots of advantages to them, and you should have access to a server." There should be Node behind it, also.
Dave: Yeah. It's almost like you need -- [Laughter] We took out the server, right? With serverless. But I feel like any time you want that data layer, you do need a server in there in front of your database or next to your database or something.
What I am doing in this Nuxt app is just using Prisma as a serverless function. It's all working, but it's very manual, I guess. I don't know. I'm just using REST APIs (because that's what it has by default) to get the GraphQL server. That's what I would need, something like Keystone in front of it for, so.
Chris: Mm-hmm.
Dave: So it's like for every little change, I have to send a statically typed deal. I can't just riff on my queries and mutations. You know?
Wes: Yeah, the Keystone gives you just like an admin dashboard.
Chris: Ooh!
Wes: You could upload files, make your own custom inputs. It's like a CMS that sits on top of Prisma.
Chris: They have a UI. That's cool.
Wes: That's pretty much what it is. It's not a front-end thing. It doesn't care what your front-end is or how you build your app. It's just like an actual CMS, so it has really--
The thing that really won me over to Keystone over a couple of the other ones that are out there, which there are tons of really good ones, is they have a really good auth and permissions way to sort of manage access to things. You should be able to create something but you shouldn't be able to update that. You should be able to create an order, but you shouldn't be able to update how much you paid for that order, right?
Chris: Right.
Wes: There are all these little nitty-gritty things, like permissions is such a slog. If you screw something up with permissions, you could potentially be opening up a major security hole, so I was just so happy.
Chris: Yeah. Yeah. It's a big deal. We talk about it all the time at CodePen because we have to -- I don't know. You can do a sloppy job with permissions that is secure and fine but isn't very extensible and isn't very interesting and doesn't match with what people expect.
I think Google Docs is kind of a canonical example of where the bar is for permissions where you can just be like, "Oh, this is private, but I can make it public (at the individual document level) and I can invite this one person, or I can invite my whole team." There are all these options for it. That crap don't code itself.
Scott: No. [Laughter]
Chris: [Laughter] That's complicated.
Wes: Can you imagine being a new dev at Google? They sit you down and be like, "Okay, um, here are 40,000 lines of permissions." [Laughter] That would be tough - tough, tough.
Chris: Right. The trick then is even if you could pull off all those features, did you do a good job pulling off those features such that they continue to be understandable and extensible? Or is it just 10,000 if lines, or whatever?
[Banjo music starts]
Chris: This episode of ShopTalk Show is brought to you in part by Jetpack, the plugin for WordPress that does all sorts of stuff. A lot of stuff you can buy a la carte like backups, which is a really nice way to do backups on a WordPress site, especially because you can just click a button and restore to any given point really, really quickly.
You know that you can actually do that from your phone? They have iOS and Android apps for WordPress that can do that. Now there is a dedicated Jetpack app for your mobile devices, too. I have it here on my phone.
Uh... Just to be clear. It's really a lot similar to the WordPress app already. So, if you already have the WordPress app for your phone, it can do a lot of the same things. But this is specifically branded to Jetpack and a little more streamlined. Like if there were some features in that WordPress app that you didn't need, like the reader, that's just not there in the Jetpack plugin - a little more focus.
But you can do stuff, like, let's say there was some problem on your site but you ran out for an errand. You could just be like, "You know what? I'm going to bring this up, roll back to just a couple of hours ago when I know the site was working," and just click the button and know that it's going to do that, save your site, and you can deal with it when you get back. That's kind of amazing to be able to restore on the go.
It's got your activity log in there, but it's got all this other stuff for WordPress you can do. Sometimes like I do, I'm lying in bed in the morning like, "Ah... Welcome to a new day." I'll go approve comments and spam comments and all that stuff. That's all in there, too.
You could write a new blog post in there. That's all in the Jetpack plugin. If you just want focused site management stuff, including Jetpack-specific features like security scanning and all that, that's in the Jetpack app. Thanks for the sponsorship.
[Banjo music ends]
Chris: Have you ever--? Wes, just to switch gears a little bit because you all talk about WordPress a little bit, too, because you said you have a lot of experience with lots of different stacks and been around a long time. I do it all the time because I have active sites that I work on that are literally in WordPress and I'm happy about that. I think they do a good job, and I think it's the right technology for the job, a lot.
Although, it's funny to work all day in Next and then have to do a little bit of work on a WordPress website and compare the DX I have that's just given to me on the Next site. Compare the DX that I've worked a long time on trying to make better on the WordPress site and have it just be so poor.
[Laughter]
Chris: There's no Prettier for PHP. There's no live reloading. There's all this stuff that just sucks working on that side. [Laughter] It's not awful. I'm used to it. I get it done. But isn't that funny? It's this platform that can't--
Do you think it will get there? Do you think anybody is even trying? Or am I just behind the times?
Wes: Probably about a year ago, there is a Prettier PHP plugin. It's not production-ready. I tried it about a year ago and it [barf] literally broke the code. So, that's true.
I was like, man, I am so spoiled by this JavaScript stack, and then I can't leave WordPress. I still have a couple of WordPress sites because it's the best CMS. There are people that love it. There are people that have sites that have been built for ten years on this thing and you can't do away with it.
Also, I was listening to a couple of your podcasts. It sounds like all of the new WordPress stuff that they're moving on, like the features, are becoming really, really nice. You know?
Chris: Yeah. I mean I think so. I don't think it's like, "Oh, it's this tried and trusty old hammer and I just use it because I use it," which that would be an acceptable way to feel too, but it's not stodgy. I think it's pretty good these days. But what's not good is authoring PHP templates with no DX help.
Wes: Yeah. Yeah, exactly, especially moving to TypeScript and having all of those how nice it is. I know that there are people that have much nicer PHP setups for their applications. There are a lot of Laravel developers that are really good at that. They sort of look at some of the WordPress templates that I sling and think that's child's play, but that's the type of PHP that most WordPress developers are working with.
Chris: Yeah. Yeah. I have this limit where I actually write a decent amount of PHP for my site, but then have moments where I'm like, "But I really am not actually a PHP developer." You know?
Wes: Yeah. [Laughter]
Chris: I don't really actually know what I'm doing in here, and it's been so long and there's so much of it that it needs auditing and reorganization and stuff. I end up usually trying to hire out for that kind of work because, ew, too much.
Dave: One interesting thing, this WordPress news, is WordPress bought/acquired Day One, the Mac journaling app, which is actually pretty smooth and pretty cool and nice, so.
Chris: Yeah. It's been around forever. I used to use that. That's the thing that you can kind of trust to write, like, "I had a sad day. My crush told me I'm stupid," or whatever. It absolutely does not go anywhere except for you to see.
Wes: Why did WordPress buy them?
Dave: Well, I wonder if it's a native app play to make blogging more--
Chris: I mean the writing angle makes sense, but it's not about publishing something.
Wes: Oh, for Gen-Z.
Dave: Yeah, maybe. Just more casual so you could just bring back live journal or whatever. I don't know.
Chris: I mean the literal reasoning is from Mullenweg. He says, "For many years, I've talked to anyone who will listen about my vision of making Automattic the Berkshire Hathaway of the Internet," which means buy a lot of stuff. Doesn't it? I think--
Wes: [Laughter]
Chris: Berkshire Hathaway is Warren Buffett's thing where he just buys stuff a lot.
Dave: Buys companies. Yeah, he's like, "Oh, shipping liner. We'll take it."
Wes: That's true.
Chris: I think part of the purchasing wasn't necessarily its perfect alignment with the WordPress vision. It's a perfect alignment with the Automattic vision, which is, "Buy stuff." [Laughter]
Wes: Yeah. You look at Mongoose, which is an adapter that you use in Node. It's the most popular adapter to use in Node for MongoDB. Automattic maintains that and they pay people to work on it. Like, why? I'm not sure if they have apps that use that, but that is a building block of the Internet and it's really cool to see Automattic just putting money towards that type of thing.
Chris: I had no idea. Wow! A lot of companies do, too. This thing -- [Laughter] I'm a little embarrassed to say I've never heard of it. Oh, my God! The repo is--
Wes: Of Mongoose? That's what I use on my -- this was initially made by TJ Holowaychuk.
Chris: Mm-hmm.
Wes: Which he is the author behind Stylus and Express and literally everything in early Node.js days.
Chris: Uh, so back to the fact that we both have podcasts here. Dave wrote this and I like this. You have a lot of people to listen to your show. Us, not so much. But combined, we're even bigger. You know? [Laughter]
What do you want for them? What is the message? I'm sure you think it's fun. Certainly, we do too, to have a podcast.
Wes: Yeah.
Chris: Do you think about, "What would be better for all these people?"
Wes: Oh, yeah. Yeah. It's kind of interesting. You get messages all the time from people who are six weeks into a coding boot camp and they just listened to 300 hours of [laughter] past episodes or something like that.
Scott: Yeah. Yeah.
Wes: I think, at the end of the day, we want to help people understand this crazy world of Web development. Things change so quickly. You don't necessarily know what everything is. And by tuning in once or twice a week and just listening to what we have to say, you're sort of just keeping up with what's going on in Web development, learning a new thing here and there, and finding out some interesting new things in JavaScript.
The side effect to that is that people buy our courses. We can sell sponsors on it. That's nice that we can make money from it as well. But it genuinely comes from a place from, Scott and I are really excited about this type of stuff and we're going to try to explain the stuff that we are learning and excited about.
Chris: Yeah. Do you have to make time for that, in a way? I wonder if you--
Well, I mean, Scott's literal career is selling tutorials also, so I guess it kind of goes for both of you that you have to learn new stuff in a way that other people don't because your job is to teach it. So, you can't just be stuck in--
Dave: Yeah, do you feel the FOMO real hard?
Wes: Not really. I'm always excited about new stuff, so I'm always getting into it. Then I do make a point of checking. Like this morning, the last day, I've been building a little app in Svelte because Scott is talking about it and it seems to be getting some serious traction, so there's that.
Then also, any time we have an episode, sometimes we'll spend an hour or whatever researching it and diving into it, talking to people, tweeting about it. I don't necessarily feel too much FOMO. I feel like we do a pretty good job at keeping up with what's going on.
But even then, I was tweeting about Svelte yesterday and someone quote tweeted it and was like, "I've been talking about it for two years and, finally, Wes is taking a look at it." I'm like, "Okay, bud." You know?
Chris: [Loud laughter]
Wes: [Laughter] I'm not going to check out literally everything out there. I can't. There's not enough time in the day.
Chris: Yeah.
Wes: We get heck from people for not talking about Angular and things like that, but we just talk about the stuff that we are interested in and that we have time to check out. That includes usually React, some other frameworks, and then all of CSS and all of HTML and all of vanilla JavaScript.
Chris: Mm-hmm. Mm-hmm. Yeah.
Dave: I forget to mention Ember all the time. Hi, Melanie. That's just--
[Laughter]
Dave: Only for Melanie.
Wes: [Laughter]
Chris: Discord.
Dave: Yeah.
Chris: I had a day the other day with this Apollo thing. This is the one I'm excited about recently and I'm almost looking for excuses to use it because I think it's so cool. The day that I played with it, my day as a whole looked like I got into work at the normal time and I did some serious dev work on our regular stack and just knocked out stuff and wrote documentation and closed tickets and answered emails and did all that stuff.
Then I was like, "I'm going to do something different." Then I played with Astro for like an hour. You know? Then I probably went back to some more normal work and went home for the day.
It happened to be a day where there was definitely some Twitter vibe of, like, "You don't have to learn new things. We're busy." The vibe was like, "Don't have FOMO because you don't have to keep up with this stuff."
Wes: Yeah.
Chris: I kind of like that message, overall. That's okay to be telling people that you shouldn't be covered in guilt all the time for not coming up with stuff. Overall, I think it's a good message. But then I looked at my day and I was like, "You know what? It wasn't that much of a stretch for me. It wasn't at odds with anything else I was doing to have a look at some technology." You know?
I think there's a little bit of balance there that says -- like, I don't think the message is right to tell people, "Never learn anything." [Laughter]
Wes: [Laughter]
Chris: "Don't worry about it. Just use your existing tools." It's not a terrible stretch to check out some tech.
Wes: No. No, it's good for your career, I think, to be able to check out new stuff. We always tell people (on the podcast) when you've heard us talk about it 11 times, then it's your turn to check it out. You know?
Chris: [Laughter]
Wes: Don't go -- like, we're checking stuff out pretty early and telling you about it. But then when you hear us talk about it over and over and over again, like Svelte. I keep hearing about it. I'm like, "Okay. Now is the time. This is something that is not going away, obviously."
Chris: Mm-hmm.
Wes: There are certainly lots of frameworks that fizzled out, but this is not one of them, so I think it's pretty easy to know, okay, this thing is gaining some momentum and it's becoming pretty stable. Now is the time that I can spend an hour or whatever.
I think it's fun as well. Don't you feel like learning something like Astro just renews some of your excitement for Web development?
Chris: Yes, it does. But I would say that it does kind of depend on my mood a little bit and other things that are going on in my life in that if what's going on in your life is like, "I just don't have the brain space for that," then that's the part that's like, okay.
But when you're in that mood that, like, this sounds a little fun, actually, to try it, yeah, it does. It gets your brain spinning in this very cool, positive way. Here I am doing me. I'm a little engineer. Look at me. You know?
Wes: [Laughter] Build some stuff. Yeah.
Chris: [Laughter]
Wes: I could ... oh, I could actually build a full-blown app, you know? I get that as well. This happens pretty much every summer. Scott and I, we record for the entire summer and then we take a month or two off of the podcast, and I slow down my work. Then every September, I say, "Ah, now I'm interested in some of this new stuff."
It's true what you say about just being in the headspace for that. Sometimes, you're just completely overwhelmed. You're not interested in Web development at all. But then I find, personally, as soon as I have a bit of a rest from this stuff, I start getting that itch to check something new out.
Chris: Yeah. It's too deep in our brains at this point. Like it or not, we all want to have dreams about living in the woods and -- I don't know -- being a basket weaver and all that.
Wes: [Laughter]
Chris: It's fun to think about other hobbies, but I hate to say it; we have hobbies. Those hobbies are going to draw us back.
Wes: Yeah.
Chris: Even when we take breaks. Ah... That's nice.
Dave: I think, for me, I think there can be a problem when it feels like it's another thing you've got to learn, like, "Oh, you know what? I didn't learn Svelte. Now there's Astro. That's another thing. Oh, God." You know?
Wes: Yeah.
Dave: It's going to be on the LinkedIn and you need ten years of Astro experience and stuff like that. You're just like, "Man, that's not -- it just came out yesterday."
I feel like, when it feels like it's another thing you have to learn, you're "stuff you have to learn" list goes big, that can be kind of demoralizing.
Chris: Yeah, but you've really been around the Web a long time and you're really smart, and you kind of know the basics. You know that some crap has got to make some HTML that goes to browsers, and you've got to put some data somewhere, and there probably should be a permissions model or something, right? There are these fundamental aspects of Web development that never change so that you're well suited to write something that off for a minute knowing that if I use those tools, it's going to spit out some HTML and the server is going to serve it and there's going to be some data somewhere or something. It's not going to be so fundamentally different. The paradigm of what a website is hasn't changed under my feet, necessarily. There's that.
Wes: Yeah, that's a really good point. You can skill up on these things very quickly once you've done two or three, once you've been doing it for a couple of years. The first thing I built in JavaScript was extremely hard because I didn't know what events were and the DOM and event delegation. Learning all of those things for the first time is tricky. But then once you understand that, yeah, you're fetching data, there are cores, and you've got to put it in HTML and listen for a click, it's the same.
Chris: There's HTML and cores. That's all you have to know.
Wes: [Laughter]
Chris: [Laughter]
Dave: It's 90% of all the pain.
[Laughter]
Wes: Cores, yeah.
Chris: Yeah, but it's still fun, right? Even though the thing does kind of the same thing. What's fun is learning the new syntax, to some degree, and seeing how much easier it is to do the thing, or how well it matches some requirement that you have.
To me, I'm exploring things like Next because (out of the box) it does static rendering. To me, that's what I wanted. I don't really care about the tech. I want to make sure that the thing that I use has that.
Wes: Yeah.
Chris: And so then when I look at Astro, I'm like, "Ooh, it has that too." It has that same requirement but look how it handles data fetching. Wow. They made that like a first-class citizen.
Wes: Yeah.
Chris: They made it like a very primary thing of how they do stuff. Ooh, that's nice. That could maybe lower the cognitive load of this codebase kind of thing.
Wes: What are you exploring Next for? Specifically for your blog or just--?
Chris: Nah. Well, that would be a whole interesting thing to think about, but no. No, I'm sticking with PHP for that for now.
Wes: Yeah.
Chris: But think of the CodePen editor, the Pen editor itself, the simple one where you just write HTML, CSS, and JavaScript, and you see the thing. That is one page on CodePen that is still rendered by Ruby on Rails templates and there's some jQuery still on that page and it's an older area of the site just because it's very, very complicated and we, on purpose, didn't port that page to the new stack as the very first thing we did with a new stack.
It's a straggler on CodePen as far as being rewritten knowing that it's so vitally important to CodePen that, when we rewrite it, we're going to rewrite it with a bang. You know? It's one of those pages, also, that there are some pages of CodePen where I don't really care if they're not static rendered at all, like your settings page or whatever. Who cares?
Wes: Yeah.
Chris: You're logged in. It's just for you. I could care less if that's static generated or not. But when something is public-facing and that Google crawls it and has SEO implications and all that stuff -- for example, just hundreds of millions of Pens, which we have--
Wes: Yeah.
Chris: --that cannot be a div on a page.
Wes: [Laughter]
Chris: It needs to have all the metadata. It needs to have the code that people wrote so that it can be indexed and reindexed quickly and all that stuff. They are server-side rendered today because it's Ruby on Rails. But as soon as we switch over to a React stack, our React stack, we haven't crossed the barrier of server-side rendered React on CodePen yet. CodePen isn't a Next app yet, so I'm playing with it because, what if it was? You know? Then we would buy all the stuff.
Wes: You don't want to go down the route of rolling your own server-side rendering in React. We did an entire show on how Scott was frustrated with it, and we had to scrap it because they rolled out a whole bunch of new changes to making it easier, but still, it's tricky.
Chris: Yeah. just let somebody else do it for you. You know? For us, we can't static generate it either because hundreds of millions, like I said. That's not happening. So, it's got to have a Node server behind it.
Wes: [Laughter] You're not going to have a Gatsby site with 100 million pages? Your Netlify build will take three days.
Chris: No. Node server it is. You know?
Wes: [Laughter]
Chris: This is not done. You can't explore this. This is early days. But we are having some success with it. Then it becomes interesting. Because we're a big, long, old app, we can put Next at a sub-root, like a slash. This page is a Next app, but this other page isn't - still. You know?
Wes: Mm-hmm.
Chris: That's the kind of architectural stuff that we're going to have to face. Then maybe someday you put Next at the root and it handles everything, but we don't have to do that on day one, and we probably shouldn't because then we're not learning as we go and finding the rough edges and stuff.
Wes: Yeah.
Chris: There might be a day. I don't know if this is how it will play out. But that the editor itself is just its own part of a mono-repo Next app, like just that one page is served by Next. There's no problem with that. We can do that.
Wes: Totally. Yeah, and you don't even necessarily have to use the routing part of Next.
Chris: Right.
Wes: You can just use the nice server-side rendering bit and whatever other bits you want.
Chris: Mm-hmm. But if you're not sharing the router, then it'll be limiting. You won't get the smooth page transitions--
Wes: Yeah, that's true.
Chris: --that we'll get later when we make the full site React, and that's okay. It's just a tradeoff, you know. So, there are some areas of the site -- this is deep in the weeds and I'll shut up in a second. If you go to the challenges section of CodePen, you click around the months and weeks and stuff. That's like a React router sitting there doing that routing. You can tell how fast the page transitions are. It's so much nicer than a Ruby on rails transition, I think.
Wes: Oh, yeah. I'm on it right now. It doesn't. It keeps the scroll position. That's nice.
Chris: Yeah, but then if you click over to a Pen, you get the big, slow, [hurling] I'm going to load up the editor now. Ruby on Rails app is happening. [Hurling] You know? Wouldn't that be nice to switch over and have it be instantly fast because it's preloaded and all that stuff?
That's a UX thing. I want to get there, and it's probably Next that will get us there because of just how -- you know. You know it. It's been around forever. It's a very solid project, trustworthy project.
Wes: Mm-hmm.
Chris: Yeah. Okay. I talked about myself enough. Maybe we should do Sick Picks, huh?
Wes: [Laughter]
Dave: Hey! Wes, signal us into Sick Picks. How does it work?
Wes: We say, "Now is the time where we do Sick Picks," which is things that we pick that are sick.
Chris: [Loud laughter]
Dave: Perfect. It needs a jingle. Y'all don't have a jingle?
Wes: We've been needing to get a jingle, and I even found some guy on Fiverr that would record us a Blink 182 knockoff song.
Dave: Yes!
Wes: But Scott thinks we're going to get sued for it, so we're not going to do it. [Laughter]
Dave: Nah...
Chris: [Loud laughter]
Wes: Which I definitely have run into legal issues with large companies before for knocking off their logos, so maybe it's best we don't do that.
Chris: Fair enough.
Dave: Wow.
Chris: Usually you'll get a cease and desist. You won't go right to court, you know.
Wes: Yeah. Yeah.
Chris: [Laughter]
Dave: But then you'd have to go back and cease and desist 200 episodes or whatever. That would be unfortunate.
Wes: Yeah.
Chris: Oh, yeah.
Wes: That would be a bad day, so we need to get some better jingles for it.
Chris: Wouldn't it be nice if the audio tag in HTML took a comma-separated list of MP3s, so you could stitch together.
Dave: Yeah.
Chris: So that we could just find and replace on your website, like, "Oh, the Sick Pick thing, just remove that." Boop.
Wes: Yeah. That's actually not a bad idea.
Chris: [Laughter]
Dave: M3U playlist, is that what they were?
Wes: Yeah. Something like that.
Dave: Anyway--
Wes: I think Spotify is doing that with podcasts right now so that they can inject ads that are--
Dave: Ads.
Chris: Oh, yeah.
Wes: A lot of podcasts I listen to give me Canadian-specific ads for banks and investing apps that are only in Canada.
Chris: Yeah.
Wes: I think, "Oh, yeah. They detect my IP address, and then they deliver me this compiled MP3." But, yeah, wouldn't it be cool to just send a couple MP3s down the line?
Chris: Yeah. Play them in order. Go.
Wes: Yeah.
Dave: [Laughter] Play this. This is one, two, whatever you want here, three, four. There you go. That'd be good.
Chris: Um... Sick Picks!
Dave: Okay, Sick Picks.
Chris: What do you got, Dave? Tell me.
Dave: Sick Picks! Me?
Chris: I basically watch everything Dave tells me to, so.
Dave: Ah, okay, okay. [Laughter] So, I got some Sick Picks. Tell me if I'm doing this right, Wes. So, my first Sick Pick is a shounen anime, a young boy anime called Haikyu, which is about some kids who go to high school and join the boys' volleyball team.
Chris: Okay.
Dave: It sounds very -- it's on Netflix, if you have Netflix. It's probably on Crunchyroll and stuff too, but there's Manga as well. But if you -- it's really cheeseball in the way that a whole episode will be one single point of a volleyball game. You know?
Like, "He's going to serve. He has the power serve. I must counter the power serve by using my power spike." You know? It's all these kind of like mental mind games for a whole episode. Then mid-server, there's ten flashbacks and stuff like that--
Chris: Ah...
Dave: --to when they were boys in junior high and they played against each other. You know? So, it's very sappy and silly in that way. But it's really good and I will say it's really good because it's about teamwork, working on something as a team. That's what I'm getting from it, finding people's specialties, what they're strong at, what they're weak at, and assembling teams and figuring that out.
Chris: How nice. That's cool.
Dave: So, anyway.
Chris: Here's -- I'll read it. "Two boys who are bitter volleyball rivals in middle school join forces on their high school team to take on other schools with a vengeance."
Dave: Yes! That's it.
Wes: [Laughter]
Dave: It's really good. [Laughter] Then my other pick, which is sort of like a preemptive pick, Nintendo Garage is like a video game builder for Nintendo Switch.
Wes: Ooh...
Dave: It's like a game where you build games. It's kind of like -- you know, it'd probably be in the no-code realm since you're doing it on a Switch. But I downloaded it. My son is interested in making games. He's seven.
Chris: Wow!
Dave: He has not really gravitated to this, so I might have to go ahead and build a game and just see where it's at, but I think it's a lot of reading, and so he peaces out, you know.
Chris: Yeah. Can you write an if/then statement?
Dave: I think you can. I think it's kind of like Scratch style.
Wes: Yeah. Oh, this looks cool.
Dave: Blocks, so yeah, Nintendo Garage, and then there's a whole state machine for making a character walk.
Chris: Wow!
Dave: Yeah, you just drag, like you click this button. Oh, he jumps. Stuff like that.
Wes: Oh, I'm into that.
Dave: Kind of cool. I don't know.
Chris: Yeah.
Dave: Even from a coding perspective, I want this for websites. I don't know.
Wes: [Laughter]
Dave: The thing where I drag little blocks around, I want that. I don't know. Can we make that? Anyway, so I'll probably have to make something just to get him interested, but yeah. Anyway, that's my Sick Picks.
Chris: Nice. Did he do it right? Was that a Sick Pick?
Dave: Did I do it right?
Wes: Yeah. Yeah, you did the Sick Pick right.
Dave: Notice....
Wes: You double picked, so that's--
Dave: Okay.
Wes: You're up there. That's a good job.
Chris: Okay. Wes is up.
Wes: I am going to Sick Pick two YouTube channels. I've been getting into lawn care. Something flipped in my brain. I've had a crappy lawn for my entire life and something flipped in my brain and I'm super into lawn care right now.
Any time I get into anything, I do the whole just consume every single YouTube video out there and then I'll have a pretty good idea of the surface area of this topic. Over the last couple of weeks, I've just been consuming lots of YouTube videos.
Chris: And there are high-quality channels that take it seriously?
Wes: Yeah, they've got a drone.
Chris: Oh, my god.
Wes: A little cut sequence coming in of the guy cutting the lawn and a $40,000 lawnmower.
Chris: Oh, seriously?
Dave: $2,000 drone. [Laughter]
Wes: Yeah.
Chris: What are the important topics? Is it like consistency? Is that one? Or like edging?
Wes: Yeah. Yeah, consistency, cutting, cut height, watering.
Chris: Yeah.
Wes: It's a little frustrating because they're all American and they dump all these chemicals on their lawns. In Canada, you can't buy any of that stuff. It's just not allowed.
Chris: Oh!
Wes: But the stuff they talk about is learning about different types of grasses is helpful, and I'm almost at a point now where I'm going to unsubscribe from them just because I feel like I get it and I don't need this to be my hobby. But I've learned all I can learn. The two channels are:
Connor Ward, he's got this front lawn that's like a golf course. It's so thin, so short, and it just looks amazing. He's pretty cool because I think he's more like my style with Web development. He's kind of off the cuff and, "Ah, it'll work out. You don't have to follow all these rules. You sort of just do this." So, I really like his style.
Then another one is Ryan Knorr, and he seems to be more by the book and do everything 100% properly. Both of those are good Sick Picks for YouTube.
Chris: Nice. Yeah. It reminded me of this one I sort of listened to about backpacks. It was a recommendation kind of in our Slack. It's good. They have good, high-quality videos. They talk about backpack topics.
Wes: Yes.
Chris: But then I unsubscribed because I was like, "Okay, but they really are still all backpacks, right?"
Wes: [Laughter]
Chris: There's kind of like a limit--
Wes: Yeah.
Chris: --to how much backpack talk you could listen to.
Wes: Chase Reeves is a really good bag YouTuber. But I bought a bag and it's going to last me like ten years, so I'm kind of over that for the next ten years. You know? I'm not going to buy another one.
Chris: Yeah.
Dave: It's sort of set. It's sort of good.
Wes: Yeah. [Laughter]
Chris: Yeah. Is this the guy? Oh, I can't. I can't get into this again. No more backpack videos.
Wes: [Laughter]
Dave: For me, all those, because I bought a backpack I think last year, but I was thinking I would leave the house. Ha-ha-ha!
Chris: [Laughter]
Dave: They're always like, "Well, it's your standard 23-liter backpack. You know everyone knows."
Wes: Like what is that? Are you putting ginger ale in there?
Dave: Yeah. Twenty-three two-liter, that's--
Wes: Yeah. [Laughter]
Dave: Eleven and a half two-liters? That's a lot!
Wes: Yeah. That's a lot of ginger ale. What are you drinking? Yeah.
Dave: That's a lot of ginger ale in there. But then how many clothes can I fit in a two-liter bottle? Anyway, I never get that. I never understand volume. That's not a skill I possess, so I don't know. I'm really good at 2D things; less good at 3D things.
Wes: What do you got for us, Chris?
Chris: Thanks for those picks. I'm going to do a Web development pick. Sorry. That's no fun, but it just happened to be what I wrote down.
To preface it, one of the things I hate about Web development, and I'm probably alone in this, is just the command line -- not using the command line but needing the command line to debug things, like when you're in Ruby and you have to print crap to the thing to print a variable or whatever because you refresh the page and it'll also output 98 lines of stuff that the rendering thing is doing. I don't know what, but I just despise having to use the command line to debug things. I think it's an embarrassing failure of Web development.
I know some people probably read it like the matrix and they just are so used to seeing it that they can see the stack trace in there and they love it or whatever. But I'm just like, as somebody who likes UI tools--
Wes: Totally agree.
Chris: --Wow, is it bad! At least get some syntax highlighting in there. Put some fences around errors. Something! Use some fucking ASCII art. Do something. I hate it.
Wes: [Laughter]
Chris: Anyway -- WordPress is even worse, kind of, in that you don't even -- with PHP, you don't even really have a command line.
Wes: Yeah, print R.
Chris: Like, where do you print? Yeah.
Wes: Dump it into the menu.
Chris: But you've got to put it in the template, you know?
Wes: Yeah.
Chris: Then look at it render somewhere and probably put a pre-tag around it so that it has some formatting and stuff. That's unacceptable to me, too. Like, "Oh, my God!"
Wes: [Laughter]
Chris: There's this app, and this is not the only one. I think people ex-debug for this reason and there's other stuff, but it's called myray.app. I think it has adapters for all kinds of languages but, for whatever reason, focuses kind of on PHP and WordPress.
Wes: Ooh!
Chris: Just by virtue of you having it installed on your machine. Then when you're writing PHP, you can just type ray(). Ray is your new console.log, essentially.
Wes: Oh!
Chris: Whatever you throw at ray, it outputs really super nicely in this dedicated app. You know? You probably won't need it every day but if you're working on WordPress and need to do a bunch of logging of your queries and crap, this thing kicks butt for it.
Wes: Oh, man. Yeah. I've needed this for years.
Chris: MyRay, super good.
Wes: I have a little function in every WordPress install called pre_r where it just dumps a pre-tag and then dumps the object in there. It's in some weird font that you were using for the H1 tag.
Chris: Yeah. [Laughter] Exactly.
Dave: Yeah.
Wes: [Laughter]
Chris: Yeah, I really don't like that. Or you put it somewhere that is only 100 pixels wide for some reason.
Wes: Yeah. You've got a horizontal scroll.
Dave: You're not a real developer unless you've outputted a whole PHP object in an H1 tag.
[Laughter]
Wes: Oh, that's good.
Dave: You're just not a real developer.
Chris: Oh, my god. Don't leave your ray commands in your code, though. I think they'll probably fail on production.
Wes: Oh, yeah.
Chris: This is also $50, so you better be ready. You better be so pissed at your debugging scene, like I was--
Wes: Yeah.
Chris: --that you're ready to spend $50 on this thing. But I did and I love it. That's it. Sick Pick!
Wes: Good pick.
Dave: That's Sick Pick. Well, we should wrap it up. We'll just -- thanks, listener. If you're listening to this on Syntax or ShopTalk, we just, I think, say for everybody, we appreciate that. Thanks, Wes, for coming on. Scott, thanks for coming on. Sometimes you have to buy a house in the middle of a podcast. We understand it happens.
[Laughter]
Dave: [Laughter] Whatever! It happens. But thanks for coming on and doing this. We appreciate it. Yeah, thank you, dear listener. Follow us, @ShopTalkShow, and Syntax is @SyntaxFM. Am I right?
Wes: You got it.
Dave: Okay. There it is on the Twitters.
Chris: You've got your own outro that you are required to do, Wes?
Dave: Yeah. Wes can take it over.
Wes: We just say, "Peace!" which makes people say it's cringy, but we still do it.
Chris: Oh, I think it's amazing.
Dave: I like it. Let's just end on that.
Chris: ShopTalkShow.com.
All: Peace!