314

December 30th, 2020 × #2020#Trends#Predictions#Recap

2020 In Review

Scott and Wes discuss the web development predictions and trends from 2020 including the rise of ES modules, improvements in frameworks like React, Vue, Next.js, Gatsby, and tools like NPM, Snowpack, serverless functions and headless CMS.

or
Topic 0 00:00

Transcript

Wes Bos

Welcome to Syntax. I am laughing because I can see the reflection of Scott's monitor in his microphone arm because it's like a glossy black, and he is currently looking at Instant Pot on Amazon.

Scott Tolinski

I'll let you know that we already have an Instant Pot. Okay? I popped over to Amazon

Wes Bos

to see if they had the EVRA 20 in black, rid And they don't, but these are their their Cyber Monday deals. Awesome. Well, we got a a banger of a show for you today. We are going to do 2020 in review. So first, we're gonna Everything that we predicted would be tech to watch in 2020. So we did a show at the beginning of the year, And some of them, we were bang on. Some of them, we were, whoo, big mess. And then we're gonna go through just some other like, what did we think 2020? What was hot? What had a big Come up. What did we focus on as web developers in 2020? Today, we are sponsored by 2 awesome company. First 1 is LogRocket, which does your JavaScript session replay. And second 1 is FreshBooks' cloud accounting. We'll talk about them partway through the show. So welcome, Scott. It's the almost the new year, 2021.

Wes Bos

It's been a heck of a year to say the least. Rid. It's funny looking back at these notes because we had no idea what 2020 had in store for us, but we're gonna just go through all the predictions that we had as well as as some rid Other tech that we thought was, big in 2020. So you wanna you wanna kick it off there? Yeah. We were so hopeful,

Scott Tolinski

young and hopeful. 1st one is CSS subgrid, which did show up. It's in browsers. And what's actually the can I use status of subgrid? Re I use subgrid in my master Gatsby course, and then we we wrote a supports query in CSS to fall back to,

Wes Bos

not a not the exact layout, but, like, a sort of equivalent with

Scott Tolinski

free space rows. But I was like, oh, this subgrid is awesome. So Subgrid's only in Firefox right now. I was thinking it was in a a canary as well, but it looks like it's only in Firefox.

Scott Tolinski

So it's a thing. Like I said, I haven't used it yet, and like you said, you you have a fallback for it. So, okay, It became a thing. It became somewhat usable, but I I doubt most people are still really diving into some grid to the degree that they could in the future, rid Considering it is going to really

Topic 1 02:33

CSS subgrid only supported in Firefox

Wes Bos

allow you for some really flexible, awesome layout stuff. That's the thing about only having 2 or 3 browsers now. Because once it does once it does land Yeah. We're we're gonna be in good shape.

Wes Bos

Yeah. Safari will probably roll it out in, what, rid. 4 or 5 years, and they'll have their own version of it. Yeah. They'll put it behind a, an OS update that no one's gonna wanna do. So re Next one we had here was CSS Houdini, and I'm gonna say this one was a big miss because Scott and I were were pretty bullish on CSS Houdini. And I thought by now we would have saw saw a lot more.

Wes Bos

And there's certainly stuff like, we talked to Adam Argyle about it, And there's people working on it, but it just it's not at a point now where just, like, us regular developers can start to implement it in our app. Yeah. Houdini is one of those ones that I am very excited about. And I was, like, I have a, Houdini course

Scott Tolinski

ready. Rid Not like and and the course is not ready to go, but I've been building the outline for it for so long that I I'm just ready to to get doing it. You the is Houdini ready yet.com is a great place to see the status of that. There are definitely a lot of aspects of Houdini that have shipped, but this is one of the ones I rid. Will still put on my list for 2021 because I still think it's going to come very soon, and it's going to be very cool. Well, maybe not very soon, but it's going to come, and it's going to be very cool. Next one is CSS features that were not supported in older browsers. Things like rid. Scroll snap and position sticky. I think I've used position sticky a lot more than I've used. I've never used scroll snap. Actually, ready. I've used it in a demo, but I've never used it used it. I I I don't know. There's some CSS features that that to me gained a little bit more traction in my heart this year, but, I don't think scroll snap specifically was one of them. Sticky, definitely one of them. Yeah. I think one thing we can say about 2020 is that rid. In most cases, IE

Topic 2 04:29

IE is officially dead for most developers

Wes Bos

is officially dead. Yes. It's it's obviously still supported in in some use cases, but rid. The more I talk to people, the more I hear is, yeah, we're not supporting IE anymore at all. We're in a really good spot now with Microsoft Edge rid. Running Chrome, we don't have a whole lot of those issues. That's that's a how that's a whole another aspect of it, but I'm I'm pretty excited about it because there's a whole new swath of rid that we can now use as well as when new features come out, we can just go ahead and, start using them within, rid Oh, 6 months or so. We don't have to now wait years years. And the thing that always kills me is anytime I have to I tweet about any news feature. We always get the yap, but what about Yep.

Scott Tolinski

Yeah. And we're like so that's those are those are, like, going away. They're still there, but it's going away. It'll always be there. It's a it's part of the industry, but, again, it it is as long as that problem gets better, then everything gets better for us. The next one was a big a big fail, big swing ready. And a miss for us. This is me when I was playing t ball here, as in I I stepped up to the plate, and I swung, and I would usually hit the t ball stand set up the bar. And I'm talking about npm. Tink is something we had on our list, which is in an installer less npm, something a little bit more similar to What you're starting to see with some of these tools like, I think, what's the one that has all the the package listing? Is it Skype? I know it's not Snowpack that I'm thinking of. It's Skypack or The one where you can install directly from URLs.

Topic 3 05:58

NPM Tink did not happen but NPM improved a lot

Scott Tolinski

Either way, this this sort of thing is coming to be a little bit more, rid prevalent here where we're we're removing the idea of a a node modules folder where things might get installed on your system rid. Rather than being installed in a directory for the individual application, but NPM Tink, as far as I know, I I, you know, I would love rid For somebody to come clarify for this, but I I have not seen any movement on this at all. I don't think it's even a thing, really. No. What people were really excited about, re NPM Tink is that there was going to be

Wes Bos

updates to NPM. I think people were a little bit frustrated with the the pace at which features were being rolled out and and things like that. That's why we got Yarn, and then we're all excited about NPM Tink. But it's been huge for re NPM. I I feel like the the NPM in general has really been listening to us. They opened up 2 new GitHub repos where you can request features And get input for the community. Everyone there is super responsive. I put in my own 2¢. I wanted to use JSON 5 for package dot JSON So we could get things like comments and trailing comments. Oh, gosh. That would be annoying. Gotcha. So good. Yeah. They will never happen, they've said, just because, like, package based on. But, like, the reason behind it is because so many things, including Node. Js, consume package JSON. And if you all sudden make a breaking change, like putting comments in a package JSON, then it wouldn't. JavaScript in general has no way to parse re JSON five. It's an external module. Right? So that that would first have to be built into at least into node, if not the language. Right?

Scott Tolinski

So that's unfortunate. I didn't know that JSON five was even a thing, so this is

Wes Bos

even Oh. Kinda shocking to me to hear. For a second. Yeah. If you've ever edited your code settings dot JSON file, you'll note that you can put comments. You can put rid Trailing commas. There's a whole bunch of other little little things that you can do, and that's that's a JSON five. And you have to have a custom parser for that Rather than the JSON dot parse that's built into JavaScript, which is awesome, but it will never come to node. Somebody after me proposed rid that we make a dot JSON five extension, and it checks for that first, which Node already has that where they check for, rid Like, dot j s file first, and then they'll check for a JSON file, and then they'll check for so, like, they they possibly could, but I highly doubt it will ever come. Rid. But I don't know. I think NPM's come come a long way. I am really excited to see what happens in the next year or so in terms of features and things like that. Oh, the other thing I was gonna say is that I requested that you'd be able to run npm dev instead of npm run dev Yeah. Or rid. Yes. Whatever your script is because, you know, you can run you can run npm start and npm test, but then if you have another custom script, rid. You have to run NPM run-in the name of the script. And, like, that's the smallest thing ever, but it trips up everybody. And I proposed That it will check if there's a script by that name. And if not, it will fall back to or or first, it will check if there's, like, a native

Scott Tolinski

rid. Command called that. And if not, it will look for a script of that name, and they said no as well. That's what, Yarn does, and I've always really liked that about Yarn. Rid. It is a small thing, but here here's the thing that I think is nice about it. It's a it's a convention. Right? It's a convention that rid Is like, those kind of things are just choices that we have to make all the time in web development. Like, specifically in the JavaScript ecosystem, there's rid So many things to choose from that you get, you know, choice paralysis because there's just so many choices. And at the end of the day, Having the ability to name your scripts whatever you want and do npm run whatever instead of there being, like, a clear convention. Alright. Test is always npm run test Our NPM test that, you know, Lint is always NPM Lint. Like, that would be so nice to have these standards That was just like a thing that maybe you could extend if you wanted to, but, like, having the standard would be really nice. Not even like a standard, but just check rid If, like, you if you run NPM

Topic 4 09:08

Yarn 2 released but not widely adopted due to breaking changes

Wes Bos

bundle Yep. And there's there's nothing built into NPM that's called NPM bundle, like, there is NPM NPM publish, Then it says, oh, maybe maybe there's a script. Like, you could just check. Right? And they said no. And I was like, well, Yarn does it. And then they said, rid. Yarn does a lot less than npm, which is true because you can't publish to the you can't publish and all that with yarn web. But I wish it was, but they're listening. It's it was a cordial discussion, and there's a lot of other things on that feature request that they are going to be implementing, so that's ready. Yeah. So at the end of the day, npm

Scott Tolinski

evolved a lot. I started using npm full time rather than using Yarn. Yarn hit version 2. That was this year. Right? Or was that last year?

Wes Bos

I think it will we have the next point. Just grab the next point on which is yarn plug and play or yarn yarn 2.

Scott Tolinski

And you you switched off yarn. I switched off yarn when this happened because there were so rid. Much divisiveness around this. In the Yarn community users, people were asking for fallbacks. There were large changes that you needed to make to your projects, rid project to make this work, I think, initially, I think there was a lot of blowback about that initial release of Yarn 2. I personally don't. I I remember understanding the blowback at the time, but I don't remember now if we're being entirely honest. And it it was it was I mean, npm the only thing that npm didn't have that Yarn had besides the not needing to run put run-in there was the package updater built into Yarn was nicer than NCU.

Scott Tolinski

Yes. I run NCU.

Scott Tolinski

I I I it's fine. But the the Yarn one, the little interface it gives you is nicer, which is it's it's not enough for me to hold on to to Yarn when NPM got a lot better overall. So Yarn still exists. People still use it. Yarn version 2, it wasn't the big splash that People were expecting. It didn't

Topic 5 11:38

Snowpack/Skypack released for bundleless development

Wes Bos

cause some sort of domination on Yarn's part there. Yeah. I well, from what I see is that most people using Yarn are still using one point o. Yeah. Which is is too bad because, like, like, no shade on the developers, but I think it was just a bit too.

Wes Bos

There was lots of breaking changes and It was really big in terms of how it rolled it out, and they just, like, broke everybody's things. So everybody just went back to Yarn 1 or switch over to NPM. I did Find one thing the other day that I I need and what that yarn has is resolutions.

Wes Bos

So if you have a package that rid Somewhere down the dependency tree of that package, it's it's requiring a version which you need to change. So in my in my thing, I was using I think it was Keystone. And, like, 4 levels down, there was, like, Keystone needed a uploader plug in, and that uploader plug in needed Apollo Apollo server or something like that. And it was breaking, and, like, I was like I've I did the whole thing where, like, you open an issue on the thing, and they're like, well, that's not us. That's the dependency. So you go to the dependency, and you're like, well, that's not us. That's that's the dependency. Yeah. Oh, and then you go down and down and down. So I found out you can you can just write resolutions in your package JSON. Yes. Yes. And it will it'll force a specific version that you specify, and you you can get it to work with NPM with a third party package, rid But it doesn't work unless you have a package lock file.

Wes Bos

If you do the whole thing where you delete your package lock file in your node modules Because something's broken, then you have to NPM install, and then you have to run

Scott Tolinski

the the resolution command. It's a pain in the butt. Yarn does it way nicer. Yeah. Totally. I I I agree, and I've used these resolutions before myself, and I was, like, really struggling through some monorepo stuff rid on my own, and I find all of that stuff to still not be solved perfectly yet in any regard. But, yeah, the resolutions is a nice thing to have. Next up is Peekaa and Snowpack. Now Peekaa is Peekaa Pak did that become Snowpack? Peekaa Pak. Is that that's my understanding of it is Pikapak became Snowpack.

Wes Bos

Yeah. Though there's pika pika dot dev, which has Snowpack. That's the bundle tool. And then Skypack, which is their CDN that's similar to what's Michael Jackson's URL loader for npm.

Wes Bos

Unpackage.

Scott Tolinski

Oh, okay. I didn't know that was his. Interesting.

Wes Bos

Yeah. It used to be called npm CDN, But then they they switched it over. So, yeah, that I think there's been huge, and I think we'll talk about this a little, but the whole ES modules thing has been huge.

Topic 6 14:24

ES modules support improving across ecosystem

Wes Bos

Huge come up.

Wes Bos

It's very good. We were right on that one. That's good. Yeah.

Wes Bos

Do we have Frederick rid. On the podcast this year, or was that the previous year? It had to have been this year. I think it had to have been this year. January 8, 2020. So we rid. It was very shortly after we predicted that or or said that that would have a big con. I would love to have him on again to talk more about, like, right now. Rid. He's, like, one of these, like, visionaries in terms of, like, ES modules and and what the future of JavaScript looks like.

Wes Bos

Speaking of the future of JavaScript, Deno, we were pretty bullish on Deno last year saying, like, this is gonna be a a really cool thing. It Deno hit 1 point o, so So it's got, like, a stable API.

Topic 7 15:04

Deno 1.0 released

Wes Bos

We're seeing some good hosting for Deno.

Wes Bos

There's a lot of packages available to it. They're working away on on Porting the entire node API over to Deno, which is great. We learned how to say it too. That was a big big win for me.

Wes Bos

Yeah. It it's awesome. I think this goes along with just, like, the fact that everybody is ES modules first, and maybe we'll talk about this now. Node re Shipped ES modules, finally, after probably, I don't know, 4 or 5 years of working on it. Probably 4 years of working on it. So it's kinda cool because between Snowpack, Deno, Node ES modules, and all the other tools that we've been working with, rid. We're slowly seeing

Scott Tolinski

common jazz being phased out. Thank you. And that's I'm very excited about that. I you know, I've been babbling my Server side code for a while now. So I have all my codes have been in the, like, import syntax for a while, so it'll be nice to not have to, like, touch That's when I move off of common JS entirely and stop transpiling or compiling my code. I I actually really love Deno, now. Rid. It's it's so funny. We, we go through these phases where we, like, don't know something. It just sort of sit back and wait, and maybe, people are talking about it. And, re we we we have to be a little bit reserved in some of our ideas about it. And, like, I started really playing with Deno a little a little bit ago here, and I released a re course on it this month. So, like, I've I got pretty deep in the Deno world, and it's it's still very fresh. Right? There are definitely some things that you'll hit. Or, like, it's funny because you'll hit a package, and it'll be like, oh, this package is the most widely used one through the Deno ecosystem, and then it'll be like 52 stars on it on GitHub. You're like, oh.

Scott Tolinski

Rid. Yeah. Very early. But one thing I've I've really enjoyed about my time in Deno is just how code forward it is. We we talked to we're we're gonna do a whole episode about it very soon next year, but Wes and I have been talking just about, like, how cool it is to be able to load, like, a TS file from a URL at any given point that exists on the browser. And one thing that it's really done for me is it's made me dive into the source of packages that I'm using a lot more than I do with JavaScript rid Because it's so easy to get to that source file, and I even just, like, command click on it in Versus Code, and it will link me to the deno dot land source file. And I can look at that file and say, okay.

Scott Tolinski

The this is, like, these are the inputs, the outputs, whatever. But the fact that it's all typed, all of these things, Man, I got a lot to say on this because I I've been, like, really reading source so much since, working on Deno stuff compared to what I do with Node typically.

Wes Bos

Yeah. It's it's funny because it's it runs, like, TypeScript natively, so there's no compile step. And one of the really frustrating things to me is, Like, when you run into an issue in a package and you open up the source, you're looking sometimes most of the time, you're looking at the compiled source And not the author sources. And as more packages move over to being TypeScript, that's gonna be very rid I I think that node needs I hate to be the guy that is like, this needs to be built into node because peep we all said that with jQuery. Yep. You should just build jQuery into the browser.

Topic 8 18:17

Need native TS support in Node

Wes Bos

But, like, they need some sort of, like, first party

Scott Tolinski

support for running TypeScript in Node, I think. Totally. At least I don't think that will ever happen, though. Yeah. Rid. Especially, for the way Deno is built. Right? The way Deno is built, like, with that in the the ground up. That's the framework of it, you know, is that it will just run TypeScript.

Scott Tolinski

Man, I'm turning into, like, one of those people who who wants to abandon the compilers because we're we're just we're getting the ability to use so many things that are close Closer to the edge, the browser here where whether it is modules in the browser or ES modules, and the server or just TypeScript running it straight up.

Scott Tolinski

Rid Like, to me, after using Snowpack and Dino, I'm so convinced that these, like, compiler less modules are the the Near future, and I I've seen I've seen the future, and I would like to stay there.

Topic 9 19:10

Compilerless modules are the future

Wes Bos

It's so good when everything's a URL, and there's not a build ready. Or anything in in your way. So good. Yeah. Maybe that's our prediction for 2021 is

Scott Tolinski

less Compilers. Trust me. Once I once I get my, dev environment on the snowpack, I'm just gonna be, like, in the best mood all the time. Those 52nd mil of re Reloads are the best thing in the entire world. Okay. Next step is react. We talked a lot about suspense becoming more of a thing, and I feel like the the guy with the stopwatch still waiting for suspense here. Suspense still does not have support, the server side rendering, context of things, which Makes it a huge no go for a lot of people.

Scott Tolinski

Suspense, a, it it it exists. You know what? It's it's actually funny. I I use suspense a lot In, the React three d course, that's the only time I've used suspense is in the React three d course because in React 3 fiber, re It's I mean, it's all browser based anyway, so you don't have to worry about server side rendering. And the in the React 3 course, the the React 3 Fiber team has built suspense into all of the loaders and everything, and it's rid Really cool. I I wish I could use it at any other capacity other than that, but for the most part, we have not seen

Wes Bos

suspense really take hold in any degree. Yeah. And when we talk about this, at least, I'm referring to the suspense for data loading. Yeah. There's 2 right. On top of everything. We had, like, the the wrapper where re You could set a time out. And if there was if it went longer than that time out, then show a loader. Otherwise, not. I think part of that was scrapped.

Wes Bos

Rid. And I think the whole like, that whole suspense her day loading, there are I don't know any firsthand thing, but the fact that they haven't released it means that they are Taking another look at it and being like, maybe this is not

Scott Tolinski

the right approach for us to go about this. So we were very wrong on that. Yeah. It just seemed like I mean, it was a big announcement and seemed really cool. You just thought it was gonna have some movement.

Topic 10 20:53

React Suspense not as big as expected

Scott Tolinski

But, no, not not a ton of movement, at least not in front of the scenes here. Re And, you know, maybe, you you wanted to use suspense in your server side rendering code. You didn't know it's supported until you dropped it in there, and then it broke your site. Maybe you'd wanna use one of our sponsors.

Scott Tolinski

Well, I'm just talking about what happens if your site breaks because you use some features that don't exist in the project And, well, you thought they existed or something. You maybe you're not using TypeScript, and it's not complaining at you either way. Your site broke, and you gotta fix it. How do you fix it? Well, sometimes it's really hard to see exactly what happened when the site broke. Maybe you're not running into the same, A specific scenario that other people are running. And in fact, here's a really good scenario.

Scott Tolinski

For instance, this morning, West Tried to load up his affiliate page on level up tutorials.com, but Wes has a very specific type of user account where he has access to, Like the pro content, and he has access to things that other people do not have access to, but he hasn't paid for a subscription because he's my cohost, because he's a dead bee. Right? And, no. So because of that, he ran into a very specific bug, which was on our list. And, you know, sometimes we might see this this bug come in and say, oh, I have no idea how this user's hidden this. Well, Lock Rocket makes it really easy to see What exactly the user did? And in Wes's case, it it could just be his account and his data, but I get access to more than just the video replay of what he did. I would get access to the console log, the network tab, all of those things that you would need when you're solving a bug in your local dev environment. I could see that the Network request is returning some GraphQL error saying that ID was not defined. Well, I can understand how this was happening with LogRocket.

Scott Tolinski

So head on over to log rocket.comforward/syntax, and you will get 14 days for free. So check out LogRocket and see How the bugs are happening like it's magic.

Wes Bos

See the bugs like magic.

Scott Tolinski

Next one was Meteor. You went off and on of Meteor on your own course platform, what, 16 times this year? What's the status? Me and Meteor are, What's a celebrity couple that breaks up and gets back together again? I don't know. I although it's not messy, and and I have not broken up with the Meteor. I I like the Meteor. Our platform's still on it. No. Meteor was purchased by Tiny. They had just got new ownership at the very end of last year, so that was like a a big thing for me to say, oh, re You know, perhaps this is going to revitalize the community. It has since, it it's not exactly like world beating numbers here or anything like that. But since rid This version 1.9 dropping in the new ownership, they're now up to version 1.12, and they have, version 2 is in re Beta. So I've actually version 2 has all sorts of neat things, like how module reloading and tree shaking stuff. So there rid. Went from being absolutely no movement on the developer side of Meteor to lots of movement. The new owners have done a good job. They even, re approved a mini conference for a meteor. So, like I said, I I think it's it's good movement on their part, And we will see if that continues to grow and move in 2021.

Scott Tolinski

My lights in my office just went from concentrate to energize, And, I got a little bit more of a orange glow on me now.

Wes Bos

Awesome.

Wes Bos

Next one we have here is felt.

Wes Bos

I'll let you take this one as well, but definitely can't stop hearing about Svelte. Svelte has really gotten

Scott Tolinski

to, it's gotten a lot more shine this year. Definitely a lot more people working in Svelte than there was in 2020 or 2019. So So Svelte definitely definitely, had a big year in terms of people using it. It it is very good. I released, I think, like, 2 or 3 Svelte courses this year. So I had a lot of time in Svelte Svelte, and I I really enjoyed my time working in it. They also just rid. Came out with the announcement that they're going to be moving their, you know, their their site building experience that was called Sapper before. It's now just going to be SvelteKit, And it's going to be with ESM using Snowpack in oh, man. So I think Svelte's gonna have a big year next year too because In my mind, they're leading the way in the whole ESM side of side of things for front enders. And once people get a a load of some of that stuff, they're gonna Not wanna give it back. We also had on this list as Vue 3. I don't remember when Vue 3 came out or what we said about it to you. 2 or 3 months ago.

Topic 11 24:34

Svelte gained popularity

Wes Bos

Okay. So it came out. Just I guess it took most of the year

Scott Tolinski

to to come out, and, what I'm hearing from people is that it's awesome. I've not used it. What about you? I haven't used 3. No. I've only used 2. There is, like, a Vue Hooks kind of deal that I like. I don't really I I haven't I haven't been paying rid. Enough attention to Vue this year to really know what the the changes in the ecosystem are. I think my Vue time got taken up by Svelte this year. Not to throw any shade on Vue because, by all means, I think Vue is getting better and better. I don't know. I'm gonna we maybe we should dive in, and we should do a Vue 3 show.

Topic 12 25:38

Vue 3 released

Wes Bos

Do a show on that. Alright. Next one we have here is Apollo. So a couple of months ago, Apollo 3 came out, something I've been waiting for personally for my advanced React course. And It's awesome. They have super fine grained control over the cache.

Wes Bos

So if you need to read things or evict things or find things in the cache, they got really like APIs around that. You can do custom logic over how things are read or merged. So you can just query items, and then you can control, whether they hit the network for them or how they're merged or what order they go in, lots of, like, rid. Super. That that stuff is so so complicated. Every time I get into Apollo, I'm like, whoo. This is tough. Like, imagine actually building it. Like, they did a lot of work and a lot of thinking in terms of How the API should be should be working. And, also, there's there's new Apollo dev tools coming out pretty soon as well, which I'm excited for. Yeah. They there's been a lot of movement in Apollo. Apollo engine became

Scott Tolinski

something else. I think Apollo engine became Apollo Studio, and it it gained a lot of neat features.

Topic 13 27:03

Apollo 3 released

Scott Tolinski

I I really like this new version too. It did make some things like the, ever so slightly better, like the update. Rid It was the the manual updating of the cache stuff is is a lot nicer to me, especially on, like, the Way easier. The context of rid. Optimistic UI. That stuff all got a little bit nicer for me, which I do I would like it to be even nicer, but I I I get it. It's really nice. And and to me, personally, I've been using Apollo with with both Apollo TypeScript plus GraphQL code generator to generate all my hooks for Apollo and, oh, that is the promised land. I'll tell you that is fantastic.

Scott Tolinski

I actually had a a conference talk, and I'll link to it, about rid Apollo GraphQL tooling that I think would be really interesting if you are interested in that sort of thing. So I'll make sure that's in the show notes. Next. Js had a big year. Not in terms of

Wes Bos

features. They did roll out next 10, which has the image, which is huge for me. We talked about that in our next versus Gatsby one.

Topic 14 28:07

Next.js gained momentum

Wes Bos

They are focusing on internationalization, which is a huge pain point for a lot of people, rid. But I just feel like it's gained some just serious momentum in terms of, like, this is an awesome framework to build your app or website. I'm all over it. Yeah. Totally.

Scott Tolinski

I just wish they would add the the routing. Yeah. I'm gonna I'm not gonna say that one more time. But

Wes Bos

The nested alright. No. But let's say it because The other day, I was building something. What was it? Transcripts for the syntax. F m website. And I was like, Scott, I finally need

Scott Tolinski

Nested routing, and I understand what you're talking about. I just wanna render the whole same thing except for this minor little part minor little part. 17 rid. Components deep. And especially when like, for instance, if you were to go on the level of tutorials my account page, Wes, and you were to change the page on that page navigation, We get that neat little animation where only that one little spot is in the app. You can't get that in Next. Js. You just flat out I get it. Can't do it without orchestrating it at the top level. So bingo.

Wes Bos

I don't know how they would do it, but I want it. Yeah. That do no. It's it's really easy for me to sit back and say, just just do it. Just do it. Just push just push put a button. That's always the thing for people on Twitter. Just put edit button. Like like, the thing that's blocking them is They couldn't figure out how to put a button. Oh. Oh, we we just had to oh, that's it? Oh.

Wes Bos

Oh, a button. Oh. We were thinking, like, how would we, let them do it? A of Button. Okay.

Scott Tolinski

Yeah. We are aware of that. And next up would be Gatsby, which really you know what? I I use Gatsby less This year in 2020 than I used it in 2019, but only because there's more options.

Scott Tolinski

Svelte kinda took the place of my Gatsby ing stuff, but it's still, very viable option. And they they released a ton of stuff, but none of which I've used. So I know you released a course on on Gatsby, so rid You you probably have a greater insight into this than I do right now.

Wes Bos

Yeah. I Gatsby's just been on fire with their different Features coming out lately, they're working on making it images generate on demand instead of on build, which is can be very, very slow. They announced rid File system based routing. So like Next. Js, you can you can use a certain syntax and name your files a certain way, and it will it'll create them for you rid Instead of having to you can still use the existing API, which is often great, or just a create pages API.

Wes Bos

Integration with all the different CMSs This has been been really, really good. So Gatsby is firing on all cylinders. I think 2021 is gonna be like, even even since we recorded the next versus rid There's been, like, 3 or 4 things that have come out since since then, so I'm really excited to see both of these Platforms develop over the next year. Totally.

Topic 15 30:28

Gatsby shipping many new features

Scott Tolinski

Next step would be a serverless stuff. Now serverless has gotten easier. Begin.com, We predicted would be a a thing that more people would be having their eyes on, and and we actually use serve begin.com to do our transcript checking As a serverless function. Right, Wes? Or when I say we, I mean, you did it. I did not do it. Yeah. I needed like, I got

Wes Bos

rid a little bit deeper into serverless, and I I I needed to run something every so often Yeah. Which is sort of like a cron job. And I also needed it to run for, Like, minutes at a time because there's hundreds of episodes that we need to check, especially when, we're talking to GitHub in the script and pushing them to GitHub and all that stuff. And rid I found out that a lot of serverless providers don't have that right now. And Netlify just rolled out background functions, which is exactly what this is.

Wes Bos

And re Begin had both of those, which is why I went with Begin. I was I was hoping to just host it with the existing website, but it wasn't possible.

Topic 16 31:44

Serverless getting much easier

Wes Bos

So Big fan. I feel like serverless is is finally getting to a point now where it's super easy just to write a quick little thing I in my Gatsby course, I called it a SIP of back end, and people really like that. Like, you just need a little bit of back end. I don't like that. Yeah. Just a little SIP of back rid. Again, you you have a little serverless function, and we predicted it's going to get easier. I think it's between All of the different platforms out there, I think it's gotten so much easier. What about you? I agree. I have not used it to the

Scott Tolinski

degree that I would like to yet. And so I think for me, 2021 will be a big serverless year for me, but, I do I I've been loving because that was my biggest complaint about it before is when it was just AWS rid Serverless functions and Lambdas. You had to connect the Lambda to the whoseits to the whatsits, and next thing you know, he's like Too hard. Yeah. Much. Yeah. In the dev and 2 local dev environment, no good. Yeah.

Wes Bos

I honestly, the the deploying Like, I talked a lot about, what was it, no jitsu. Back in the day, we had this thing called no jitsu. You could whip up a quick note app and host it on no jitsu really, really easily.

Wes Bos

Rid. And I love that because it was so easy just to throw up a quick it was almost like making an index dot PHP and throwing it on a server, and you can hit that rid. You're I used to love that when I did PHP, and then everything got so much more complicated.

Wes Bos

Like, you have to do SSL certificates and CIs and CDs.

Wes Bos

PM rid and and rerun it. And I was like, oh, and I feel like now with serverless functions, we're getting back to just write some code in a file, re Deploy it, and you can hit that URL. That code will run, and that's the best. Imagine when

Scott Tolinski

JavaScript modules are everywhere, and you could just throw up a little JavaScript file and have it Be red. No problem. I like it. Alright. Next 1 was the headless CMS Thunderdome that we had going on between all of the different options.

Scott Tolinski

I think Sanity really has continued to grow in the headless CMS space, especially as a paid service. WordPress just sort of is Doing its thing still. Nothing, like, really shocking from WordPress out of this year or any of the other CMSs to be honest. WP GraphQL.

Wes Bos

This is not WordPress rid Specifically, but Yeah. WP GraphQL. Yeah. The they released 1 point o, which is great. Gatsby is actually funding that, which is pretty cool. Yeah. And that's a shining spot, but it's, other than that, there's not a lot of movement necessarily, at least not that has been on our radar. We also there's a couple other headless CMSs that have bit big come up. Keystone is the one I've been super bullish on this year. Re Keystone is releasing not as I'm talking about it, it's probably out now. I've been working with the folks at Keystone just to make sure that it works with with my app, And it's built on Next. Js, which is really cool. So the back end, if you wanna make any customizations to the actual admin UI, you can just do that because it's Just Next. Js at the end of the day. It's just big, big fan of it. Strapi is another one. I spent some time this year building an app in Strapi.

Wes Bos

I really like it. It's super impressive.

Wes Bos

The UI that you have up and running, you can just log in, create your types, Relate things to another one another, and you can do so much via the UI.

Wes Bos

There's just a lot of polish on that one. So those are 2 really big ones. What else did we have? Redwood was a big one. Still in development.

Wes Bos

Blitz, still in development. But I don't know if we mentioned those in our I don't think so. They I think they came on our radar this year. Yeah. So, but all these years of, like, yearning for A headless CMS that has really good user management and really good inputs.

Wes Bos

I'm gonna say we're finally there. There's lots of really good options ready to build your your websites. I think the only thing that we're still missing yet is and I don't even know how to solve this, is the the plug in ecosystem that that WordPress gives you. I know. Yeah. I rid I don't know if that exists in any other ecosystem, yet, which not a lot of not everybody needs that, but, Certainly, a lot of people sticking around on WordPress because of it. Yeah. Totally.

Topic 17 35:47

Cypress got Firefox and Edge support

Scott Tolinski

You know, next up we had was Cypress, and this is fun. We had, Currently, no Firefox support. Hopeful for 2020. And guess what? We got Firefox support as well as Edge support, and I use that every day.

Scott Tolinski

So I I Still using, like, Cypress quite a bit. And one one neat thing that we we did is there the Cypress community has definitely evolved. There's, read. You know, in the React testing library space, there's now a today are now, like, DOM testing library, but there's also a Cypress version of it too. So you can use The same syntax that you're used to in the React testing library in Cypress. Oh, cool. And not only that, but there's, like, a whole bunch of plug ins. I've gotten really deeper into Cypress myself because, like, we we use Cypress quite a bit. So having to write my own custom Cypress commands so that I could do, like, c y dot log in And have it log in with an account on our database and stuff like that. It's been really nice. I I really like using it. What are some plug ins I use? Because I use a couple of plug ins, Which I didn't even know was a thing, but I use a dark mode plug in for Cypress just to turn it to be dark mode, and people are always have their minds blown by the fact that there's a dark mode.

Scott Tolinski

What else do I use? I use promise register Cypress promise register where you can do, like, a Cypress promise, to better control the flow and then the rid. Testing library Cypress add commands. So I I use those 3 plug ins, and, it makes my my Cypress there's a whole community of Cypress plug ins out there. And if you look on Cypress' site, To me, that was, like, a huge thing beyond the Firefox support was having all those neat neat plug ins to play with. Next one we have here, and this actually not a space that I dipped into. It's the whole

Wes Bos

design and code mixing Oh, yeah. Space, rid But we had modules here. What what's the status of that? Have you do you use that? It's a great question. I have not used it, and I was hoping to get access to it

Scott Tolinski

in September of last year. And if you have their site modules app, it still says apply for beta access. So I have not I have not gotten access to it. Rid. As far as I know, it's a thing still. I I I follow the developer on Twitter, and he seems to be tweeting about it. But, I don't know when when this thing's coming, if it's coming, but it it exists rid. Still, Figma, holy cow. Figma had a great year in 2020, because Figma is one of those products where, like like, Sketch came out, And people started asking for features, and they were just like, no.

Scott Tolinski

We're, like, not gonna give you those features. And guess what? We're not gonna give you support for anything other than Mac. And meanwhile, Figma just, like, crams features in constantly.

Scott Tolinski

So, I don't know if you've been paying attention to anything they've done, but, re one of the even the biggest things that they added was auto layout tools where it's basically flex containers.

Scott Tolinski

So say, like, you have a button. Well, now this button's design is basically determined by the padding. So you could set padding on a button with text and have it auto expand and do all that stuff without having to do any weird re Constraint or layout tools. So there there's been, like, a ton of, like the types of features that web developers really like to see have been have just been dropping left and right. I'm trying to find there's, like, a a new feature that they recently did. Let's see. Auto layout has become more flexible.

Topic 18 38:27

Figma keeps adding great features

Scott Tolinski

So now you can do, like, flex containers with their auto layout. Oh, that's pretty cool. So the options are are hug content, Fill container.

Scott Tolinski

Like, that's pretty neat. And there's also button variance is now a thing now, so you can have variance on your components. Rid. Instead of making, like, 800 different components, you make, like, 1 component, and then you can like, you have your button, and then you can have a disabled variant and a re Hovered variant and whatever, and it just exists as a drop down on that thing. It's like these are the tools that developers Would really love to have when they're working in a design application because that's how development works. So Figma, to me, constantly innovating with a lot of the stuff they're adding. So check it out. I'm so excited to use this. I I'd said

Wes Bos

previously on the show, my next thing that I design, like, next website design will be in Figma, and then I fired it up. And I was at my at the cottage in the full stack shack at the time, and rid Figma, like, needs good Internet to work. Mhmm. There is, like, a you can save locally, but it it doesn't like, it makes you save a new copy every single time you wanna hit the save button. So, like, That's not a workflow No. No. For anyone doing any sort of design.

Wes Bos

So I was kinda bummed, so I went back to Sketch and and did my website. So the next thing I designed, hopefully, will be in in Figma, and it's just it's really exciting. And another thing I wanted to say is, did you see on Twitter the other day there was, like, a three d app

Scott Tolinski

that is gonna be launched pretty soon? That's, like Did I see it? Oh, what's it called? I retweeted that thing. I opened it, and I was like, mouth agape. It is very cool.

Wes Bos

Like, what what what is it? What is it? Like, it's a It's a three d app. What is it for? What's it called?

Scott Tolinski

It's it's funny. My, Landon Spline. Spline.

Scott Tolinski

Landon always, like, when whenever he, like, learns about something new, he asks what it do? What does it do? What it do? So I'll be like, dad, is that what is this? I'll be like, oh, it's rid Oh, it's a microphone.

Scott Tolinski

What'd it do? Uh-oh.

Wes Bos

What'd it do? Oh. So it's a three d design tool for the web, And it looks like a whole it looks kinda like Figma. Yeah. And you can design three d stuff, and then, like, what's what's the point? You export it So you can use it on the web or or what? That's what I would imagine to be the case.

Wes Bos

There's not a ton of information about it. But Comes out tomorrow. Yeah. It's not even out yet. It's it comes out December 1st. So You're listening to this. It's already out. Let's check it out. Spline.design.

Scott Tolinski

Yeah. It says export production ready web assets. Rid. So, you could probably, like, drop in in in in like, when I did my React three d course, it was definitely missing from that world. It was, Like, having to do everything in code can be really awesome, but sometimes you really want a a GUI to click and drag and move or whatever.

Wes Bos

It's funny. Like, probably 7 or 8 years ago, I built an ad for, like, some car company, and the car would drive in and break. Ready. It would dip down a little because the brakes hit. Yeah. And then it would blow a little smoke when it it turned off. And we had designers do it in some sort of app, And then we exported that to HTML and CSS, I think, and it was not very good. So and that was, like, 7 or 8 years ago, so I'm excited to see what maybe that rid That's more motion graphics, though. This is three d. So that was the list of the tech that we thought was gonna be hot. We are on in some of them, way off in the others. Let's ready. Move into some other things that just just as a a look back into 2020, the biggest one to me is that ES modules had a big come up. We talked about that. Yeah. Rid ES modules can be used in the browser. They can be used in Node. Deno has it. We're getting build tools that are ES modules first, which is Snowpack, things like that. Rid. Webpack has had it for a long time. U ES modules for for beginning.

Wes Bos

I still have not shipped any code that is ES modules in the browser.

Scott Tolinski

It's still all compiled, but Yeah. To be 2020 1's the year for that. Yeah. I guess maybe it could be. It it really just think of who has ready. Ship it and who hasn't shipped it. I I guess I don't know where it's fully supported just yet. That's gotta be a whole episode now. Yeah. The the bundler world really took a a big, I don't know a big jump, I think. I think people are really starting to see, especially at the ESM stuff, like the bundlers that we have coming, in in Snowpack and Veet Fight. I'm I'm gonna say this correct one of these days is gonna be pretty cool. I think that whole world has a lot to offer. I think roll up became much more rid greatly used in in being able to ship all sorts of things like ESM. I don't know if anybody's used the t s d x library for creating Libraries in React and TypeScript, but that's built with Rollup, and it ships e s e s m and,

Wes Bos

yeah, all of that good stuff that we're talking about in this episode. So Yeah. Re Yeah. We have a whole episode on bundlers and tooling. You can go back to that, and do we'll go through all the other ones. But it's been a big year for rid All of the different tools and bundlers that we have.

Wes Bos

GraphQL. I I feel like GraphQL got way easier in terms of rid tooling and and things like that. Just rerecording my advanced React course from a year and a half, 2 years ago versus now, Having to manually write the types and type everything out and then type it for your server and then type it for your API gateway and then type it again When you're consuming it, that

Scott Tolinski

is is sort of a thing of the past, and I feel like it's it's just gotten way easier for people to go ahead and use it. Yeah. And types, we talked a lot about, you know, waiting to see what the next type library movement would be like. Who who's gonna take The crown, and it seems pretty obvious to me that TypeScript has taken the crown over Flow. And Reason, even though if those are both rid. Still widely used. I think more people are using TypeScript. To me, it's there's a lot more tools around it, a lot more of the community juice. Rid Regardless of if you like Flow or not, TypeScript really seems to have the juice. And and this was my 1st year writing a lot of TypeScript. I mean, we moved our entire rid Code platform server and client over the TypeScript along with fully typed in our API and everything. I I I got deep into Rust, which is my first re fully typed language that's, like, typed by like, strong type language that for me, like, really blew open, like, the idea of using types rid in my code base overall. So TypeScript for me got so much more of a real world

Wes Bos

experience for me. Yeah. Me me too. It's probably been about rid. 6, 7 months. Every single new thing that I build has been in TypeScript. I've been been working on a TypeScript rid. Of course, here and there, I've got a really wicked layout, lots and lots of demos, and I just I'm there. I'm there. Like, I I I I don't know if I was linked to the game, but I I get it. I totally get it. We're both on time. Yeah. We're on time. I I think, like, re It's at that point now where it seems to be the winner until maybe JavaScript gets its own types, which should be kinda cool. Seems to be everybody's shipping it. There's types available for ripped. Everything you npm install automatically has types, and even even, like, Versus Code, if you just write regular JavaScript and Versus Code, you still get A lot of the benefits of TypeScript, which is which is so awesome.

Wes Bos

So I am officially a huge fan of TypeScript. We'll probably do re Entire show or 2 on what the benefits are and and the tooling around it and whatnot. But and, also, I feel like not just like me and you. Maybe it's just me and you, but I feel like Everybody else is sort of jumping on the TypeScript train as well, so choo choo. Choo choo.

Wes Bos

Yeah.

Wes Bos

I like it a lot. I think it's great. I think it's fantastic.

Scott Tolinski

Also, WASM became, viable.

Scott Tolinski

Like, in the past, At least for me, I looked at the sort of WASM world and was just sort of like, oh, it's a thing. Right? It it exists. But, like, for me, I now understand how People are using WASM in real world production ways. What is WASM? Tell for those who don't know. WASM is basically being able ready. Use assembly code in the web. And if that doesn't mean a whole lot to you, think about, like, being able to write a language, A language that's maybe not JavaScript, maybe it is, but maybe it's not JavaScript. Maybe it's like Rust. And that language can do some things that are very, very fast, very, Very performant. Much more performant than, a JavaScript or a Node app could do specific tasks. Right? Well, what you'd be able to do is compile that code, rid. That Rust code into assembly code in which the browser could then load up as a module and use directly into your JavaScript code. A good example of this would be an app that Wes and I use very frequently is the MongoDB Compass app. In the Compass app, while it's not built In WASM itself, there are specific functionalities such as their performance tracking stuff that is actually written in Rust And then export it so that when when the what they do is that they call a function that appears to be a JavaScript function by all intents and purposes, but that Function is written in Rust. So when you import it and use it, like, the the consumer of that might not need to know too much about it, just the ins and outs, Then that function goes off and does all its stuff, and it's much faster because it's assembly, and then it pops the answer back out. So that's a good Example of some some real world usage of WASM in the wild because Compass is an electron app and it's browser based, but it is Using WASM to do a bunch of computation heavy stuff. I don't think that I knew that. I knew that it was like like, oh, you can run games in the browser, and it re It runs the assembly code under the hood, but I'm just looking at this GitHub repo called awesome web assembly languages.

Wes Bos

There's a list of probably Thirty or 40 different languages that you can run-in including PHP.

Wes Bos

Yes. So you could assembly. Like Yeah. E even, like, you have some rid Some weird dependency that's written in a different language other than JavaScript, or it says it really nicely here. It says WebAssembly or WASM for short is a low level byte code that format that runs in the browser just like JavaScript.

Wes Bos

Re It is designed to be faster to parse than JavaScript as well as faster to execute, which makes it a suitable compilation target for new and existing languages.

Wes Bos

Rid. Yeah. So you gotta, like, you gotta write it in. Like, there's, like, a PHP, PIB, WASM interpreter.

Scott Tolinski

So I I know you because both of us, we do a lot of video stuff. You've used some of the video compilation, rid I guess, about rendering applications, like what's the FFmpeg.

Wes Bos

Yeah. FFmpeg is is what most rid Video stuff uses under the hood. So you could run that in the browser. Check it out. F fmpeg.wasm.

Scott Tolinski

I'll send you a link. I'll put it in the show notes here. Yeah. No way. You can run it in the browser. Yep. No way. Why the Yes way. Yes way.

Wes Bos

Rid You could I did not know about this. Upload a video, convert it with I'm actually

Scott Tolinski

in the process of doing a fun little project with this, rid FFmpeg.

Wes Bos

So is that what Figma uses under the hood for some stuff? Figma is,

Scott Tolinski

Figma is built in something interesting,

Wes Bos

rid Possibly Rust. Figma is powered by WebAssembly c plus plus. C WebAssembly's cut Figma's load time by 3 x.

Wes Bos

Rid. So there are many benefits using c plus plus code.

Scott Tolinski

So that's kinda interesting because, like, you think, like, oh, I don't wanna use Figma because it's Just web tech, and that eventually is gonna get super slow and sluggish, but it's not. It's not. It's super fast. Been used in the web. Yeah. So, you know, it's it's funny because we we talked all a lot about WASM, you know, like, hold your horses. We'll just see what that you know, WASM isn't necessarily something we need to worry about, whatever. And by all intents and purposes, it might not be something that you you might not ever need to write a c c code to and use it in the browser, but rid. The fact that you could have FFmpeg imported like a JavaScript module, then Yeah. You know, use a re function directly out of it and have it just work in the browser is very cool.

Scott Tolinski

Like, that's the kind of thing that you'll probably want to be aware of. Alright. Scott, you need to use your

Wes Bos

Figma connections to get the a dev from Figma on to talk about this. That'd be so cool. You have your people call their people. Yeah. I'll I'll do that.

Scott Tolinski

Well, I'll have I'll have my people call call rid their people and then set up some invoicing, and then we can track that invoice to make sure it gets paid on time. How about that? With FreshBooks, FreshBooks is our sponsor today. Rid. FreshBooks .comforward/

Wes Bos

syntax.

Wes Bos

They are cloud accounting for your freelance or small business or whatever. If you're sending out an invoice, rid Don't open Excel and and make a thing that's impossible to track. Do it all through FreshBooks. You can send it out. You can check on what's paid. You can send late payment reminders. You can track all of your expenses.

Wes Bos

You can auto import your expenses from a credit card or a bank account. It is awesome. Rid. So check it out. FreshBooks .comforward/ syntax. Make sure you use syntax in the how did you hear about us section. And thank you so much to syntax. No. To FreshBooks for sponsoring, and thank you so much to Syntax.

Wes Bos

Syntax listeners for using FreshBooks because they just reupped for sponsorship for next year. And, yeah, it's because it is working, and you, the listener, are using FreshBooks, which is awesome. I think we could say thank you to the syntax listeners for giving all of our sponsors a try because

Scott Tolinski

our our sponsors have really enjoyed, You know, getting to share the the magic of their their services and whatever. But I I think for the most part, you all are are you trust us to rid to share what we think is is really cool with these companies, and I think it reflects really nicely that upon all of you that you you trust us to that rid. Because we we use all of these services, and we love them. So just happy that you you guys can see that, magic.

Wes Bos

Rich. Cracks at Pepsi.

Wes Bos

Another big thing, unsuspecting, was work from home. Oh, gosh. Yeah. Obviously, rid bloated in 2020 because of the nouveau coronavirus.

Wes Bos

We all started to now I hope not all of us, but a lot of us. I would say most of us are now Working from home and remote work, it it was kind of like this, like, weird thing where rid. Some companies were into remote work and some weren't, and they weren't doing it right. And it really was just learning by fire where you really had to figure out rid. How to make this work by working remotely, that is awesome.

Wes Bos

Somewhat related, Starlink Internet. We talked about my cottage Internet rid Situation. Starlink Internet is now coming, which is great for remote workers in remote locations Yes. Which is is great. What else?

Scott Tolinski

Webcams. Everybody's got a wicked webcam now. Yeah. Everybody got a a wicked webcam because, everybody finally realized that the Mac webcams not been updated since, 1908.

Scott Tolinski

They're just like the oldest part of the Mac. I I I don't know where they even find this applied. Yeah. When when you turn it on, there's a big the poof. You know, in the old timey photos, there's the the cloud of smoke that was happening when you turn on the Mac or dust. You can't move anywhere or else, it'll ruin the exposure time. Yeah. Yeah. No. I know the the Mac webcams. Like, I don't know, like, where they even find the supply of these webcams. They are so old. They must have Ordered too many of them initially and been like, well got a deal. Just gotta use them till they're gone. No. I I have no idea. Everybody got a nice webcam or a cam link To make a webcam nicer and I I don't mean everybody everybody, but everybody spends so much time on Zoom and whatever video calls. Now we all realize just how, how bad it can be with these these crappy webcams.

Scott Tolinski

Overall, a lot of the stuff around, is your company ready to do, like, remote working? Rid Our industry probably sees this in a much different way than many other industries because we are inherently a little bit easier rid to work remotely if you're a computer programmer.

Scott Tolinski

Granted, it has removed some of the personal aspects of getting a nudge of your rid. Your coworker on the desk would say, hey. Can you take a look at this? Am I doing this in a really dumb way? They can't just pop over and look at your screen and say, yeah. This is stupid. Re It's really changed the way that a lot of companies are working and open up the possibilities for a whole ton of different SaaS companies to come in, rid Swoop in and collect some money by giving you a service that is going to make your team work a little better remotely. I know we've had to use, rid. Discord pretty heavily. We do all of our team meetings in Discord now, so we just pop on over to a video chat room and chat away and whatever. And it's actually pretty nice. You can have a little break room and say, hey. Can you come take a look at this for a second? And it's almost like actually being at this person's desk. So, yeah, these tools have all rid. Gotten a little bit better, changed quite a bit. Not something Anyo has necessarily expected, but probably, a change that was gonna happen at some point anyways.

Wes Bos

Rid Another this is not new at all, but pair programming remotely has be has seen a big up because, like, you need to debug things with coworkers. And, rid I use for the 1st time on, like, a really big app, I used Versus Code's live share Yeah. Where pretty cool. Rid With, Jed from Keystone, and I was so impressed at it. The you can see where they are. They're moving around.

Wes Bos

You can highlight things. And I do. We just had, like, the video of some I wonder if they're going to add, like, WebRTC eventually so you can have video in it as well.

Wes Bos

So it was good. The only thing it didn't have is that, like, it doesn't show when someone's hovering and looking at, like, type definitions or something like that. It doesn't show that. So there's there's a bit of, like, missing context there. I wonder if that will come at some point. Another one is is Tupelo.

Wes Bos

I've not tried this before, so they sent me Yeah. A DM about it a while ago to try it. I just never did, but it's apparently a really good pair programming. The Farhan from Shopify is on the home page, and I saw a talk from him, like, 10 years ago when he was at Extreme Labs about rid Pair programming and how how they only do pair programming.

Wes Bos

Mhmm. So if he is endorsing it, like, he's probably one of the top pair programming re Enthusiasts in the world. So if he's if he's endorsing it, it's probably pretty good.

Scott Tolinski

Yeah. I have a hard time with it because of my general, hyperactivity level, but, like, I do really always appreciate having multiplies on code.

Scott Tolinski

Some of the next ones here would be an actual, like, coded library. React Query rid. Got a lot of juice. A lot of people using React Query in 2020, and I think that's probably gonna continue because in my mind, what React re Query data was make working with HTTP a large part as nice as working with GraphQL. Granted, it's not as nice rid. It's like the types up and down the stack that you get with GraphQL, but the fact that you use React Query the same way that you use use Apollo, use use, use query in Apollo, And having the cache just exist like that, yeah, that, React Query is basically the way to do,

Wes Bos

HTTP requests and storing of cache data for me now. Rid. Alpine JS, it's not something I've used yet, but especially it seems to have gotten really good traction in the Laravel PHP community.

Wes Bos

Rid. And what it is is I I like to think of it as, like, JavaScript sprinkles, you know, early on in the Angular days where you would just write, like, rid. And you repeat, and you would just like Yeah. It's all declarative. You write your HTML a certain way, and then it just is JavaScript.

Wes Bos

That's what Alpine JS is. And I think there is as much as we talk about building these crazy Next. Js 100% React server rendered TypeScript, There's a large portion of I even think our listenership who are working on 10 year old server rendered applications, And parts of them are built in JavaScript and whatnot, but, if you'd often, if you just need to add a little bit of interactivity to something, rid. It doesn't make sense to change that entire view

Scott Tolinski

over to a single page React app. So Alpine JS rid is that, and I think that that really filled a a need that a lot of people wanted. You know what that I mean, I wonder, like, if Web components are gonna continue to fill more of that need too. I've been seeing a lot of people talk more and more about web components towards the end of the year. Rid And, I don't know if you checked out Stencil at all, but Stencil seems pretty cool. It's like a multiple output target web component framework where you can, like, have re React working play by play with Vue and web components. It all works very nicely together. I haven't used Stencil myself, but it seems like something that could be becoming more of a rid More of a tool. Speaking of more of a tool, 2020 is a giant tool.

Scott Tolinski

The year itself is a tool. Remember when that was, like, a big insult? Yeah.

Scott Tolinski

2020, man.

Scott Tolinski

Rough year. Yeah. Let's just get out of here. Let's just let's just stop it.

Wes Bos

Yeah. It is it is a hard year for productivity, just like everything changed, just mental rid. Trying to focus on your work when there's a lot going on in the world.

Wes Bos

So it was definitely half of your work time. Yes. Just in terms of, like, rid sheer being able to to work. I know that you had had that.

Wes Bos

So, yeah, it was a rough year. I don't know if we need that. Certainly need to go into all the ups and downs, but it. It was it was a tough year. And I want to say thank you to everybody who listened in all year long. I'm super impressed that rid Despite all that happened, we never missed an entire episode. We did No. Over a 100 episodes of syntax this year. People kept on listening. I thought we were gonna see a major drop when everyone stopped commuting, and that didn't happen. People are still sending in their pollock questions rid And, just it's been good to have this podcast for this year. We're endlessly thankful,

Scott Tolinski

for you for listening, and keeping the podcast as, you know, as popular as it is, but it's also like, hey, Wes. It's been awesome having a whole year of doing episodes with you. I I we we got, rid. We got to chat web about so many cool things. We've had a lot of cool people on the show. And Yeah. You know what? I'm optimistic For 2021, 2020 can go, can go I don't know what they say. I'm trying to say something appropriate, but it's not coming to me right now. It can kick rocks Is what you're trying to say there, Scott.

Scott Tolinski

Hey. One time I told a guy in a bar to kick rocks, and it might have been the coolest I've ever been.

Wes Bos

Oh, man.

Wes Bos

Rid I love that kind of stuff. Like, I call people goofballs all the time, and it's, oh. Yeah. Goofball. You know? Like, I love those those kinds of, like Like, you're you're being mean, but you're also being super PG.

Scott Tolinski

Yeah. I'd say somebody has a full diaper.

Scott Tolinski

He's gone totally full diaper.

Wes Bos

Oh, man. Alright. Well, thank you so much for tuning in. Hopefully, you have an enjoyable New Year's Eve not going anywhere, staying home, Which is what I do every year regardless.

Wes Bos

Yes. Being safe. Thank you so much for tuning in, and we will catch you next year. Except for we didn't do sick picks. Oh, okay. Sorry. I tried to wrap that up way too early.

Wes Bos

You got a sick pick for me today, Scott? Rid Sick pick.

Scott Tolinski

Do I have a sick pick for you? I think I do. I I I've been like I have I have a lot of sick pics lately where I feel like I've just, like, discovered a lot of cool things whether people podcast for us? I I might have a podcast.

Scott Tolinski

Hey. I I've been listening to a lot of cool podcasts lately, but, no, I'm actually going to sick pick a light bulb today because, you may know in our smart home So we talked a little bit about the fact that I was on the the Philips Hue platform, and the Philips Hue is fine. There's a lot of great things. The app is, like, rid slickest experience. Like, Philips 2, man, have really nailed a lot of aspects of it, but the bulbs are very expensive. And when you get into, like, rid. Flood bulb territory, it's like $40 a pop. And when I have 6, flood bulbs in my kitchen, there is no way that I'm spending that kind of money on flood bulbs just to make them smart. Well, I found a, works with Hue bulb, and I didn't realize this was even a thing. But this brand, I n n r, re Pronounced inner. They work with Phillips Hue, and I bought their floodlights. They have bulbs. They have spotlights. They have rid Strips and everything's quite a bit cheaper, maybe, like, half the price. So I'm gonna sick pick some inner bulbs here So that you if you're looking for a little bit cheaper of a situation with your Phillips, you can use these. And I buy I've I've connected now 8 of them, and they're perfect. They were just rid We're lovely. My, my wife refers to our kitchen as a cave now because I turn the lights down low when I'm doing dishes at night.

Wes Bos

My wife rid Loves having the the lights as dim as possible in a He do. Though. I just Yes. Came it into my eyes. I want it to be like a operating room. Rid Hate it. I hate sitting in the dark. Korneo will hate come out and just be like, what is this cave? Like, what are you doing? Get my my eyes ready for for rid Sleepy time. I'm gonna sick pick something that I've been thinking about getting for a long, long time, and that is a weighted blanket. Woah.

Wes Bos

Yes. One for my daughter, rid 6 months ago just because she was having some trouble sleeping. And every time I, like, put it on me and, also, every time I go to the dentist and they, rid Oh, yeah. Like, lead vest on you. I feel this just, like, overwhelming sense of calm, and I'm just like, maybe Like, why is it that I this just feels so good. So we ended up getting a like, the heaviest one you can buy, 25 pound weighted blanket for our bed.

Wes Bos

Like, I was telling my wife, I rid I was telling my wife, I just want the weighted blanket to outweigh the weight of the world. Yes. Yeah.

Scott Tolinski

I wanted to physically turn my bones to powder. That's what I would prefer.

Wes Bos

Oh, and I'm I'm like I'm like, this is, like, the heaviest one. This rid gonna be too much. No way. No way. I could probably put 3 of them on me and be fine. And it is so nice. We've had it for a couple days now. Rid. And every night I go to bed and I put it on and go, and I'm I'm a couple days in, and I've slept really good all of those nights. Rid. And I don't know if that's correlation or causation just yet, but it feels awesome. And I can't believe I waited so long because, like,

Scott Tolinski

Investing in your sleep setup, there's I don't think there's any any other way to to do it. Yeah. I have this, Pedalton one rid. That is from Costco, and I I have the 20 pounder. Courtney got it for me last year for Christmas, and, oh, man, I love it. Yes. I I agree, man. That thing you put that thing on, and it is. It's that same lead vest experience, and I I I totally dig it.

Wes Bos

Oh, it's I I can't believe I waited so long, so big fan of that.

Scott Tolinski

Yeah. Shameless plugs. I rid Have courses out every single month on level up tutorials. We're recording this far enough advanced that I don't even know what my next course will be, but I'll tell you what my November course was rid. Deno one zero one for web developers where we tackle the task of understanding what Deno is. We write a lot of TypeScript code. We we get, down with some neat stuff like, you know, we build a contract generator, reading it, and writing files, but we also get deep into writing a re HTTP server with Oak where we serve not only a JSON API, but we also serve up static files as well. Rid. We talk all about error handling middleware, and you learn all about how it would look to write a real world application in Deno. So check it out at leveluptutorials.com.

Wes Bos

I'll plug all of my courses. Go to westboss.comforward/courses, and it's a list of all of my courses that you have On their JavaScript, CSS, you name it. Some of them are free. The paid ones use a coupon code syntax for $10 off.

Wes Bos

Alright. I think that's it now. Thank you so much for tuning in, and we will catch you next year.

Scott Tolinski

Head on over to syntax.fm for a full archive of all of our shows. And don't forget to subscribe in your podcast player or drop a review ready.

Share

Play / pause the audio
Minimize / expand the player
Mute / unmute the audio
Seek backward 30 seconds
Seek forward 30 seconds
Increase playback rate
Decrease playback rate
Show / hide this window