Tech To Watch In 2020

You're listening to syntax the podcast with it. Tastiest web development treats out there. Just grab yourself in and get ready. Here's Scott Zelensky and West boss.

Welcome to syntax is the podcast with the tastiest web development treats in the entire world. We've got a banger of an episode for you today. We're going to talk about tech to watch in 2020. So these are things.

Maybe you want to try out some new stuff. Maybe you want to get a leg ahead. Is that saying you want to get a leg ahead in whatever tech we have? I mean, there's like, don't they call it like part of the race a leg of the race?

I'm not a racer, but if I was, I'm not a racer. No. Anyways, if you want to get ahead, this is the episode for you. We're going to talk about like things that we think you should keep an eye on.

Or if there's something where you're like, I want to focus in on something to maybe forward my career. Pick like one or two of these things over the next year and get really good at it. With me, as always, is Mr. Scott Zelensky.

How are you doing today, Scott? Doing good. Doing real good. I think the kids are sleeping a little bit better.

That's helping us a little bit. They're not sleeping on time better, but they're sleeping a little bit better. We are potty training, Landon. And I don't know what your experience is where they are, but like waking up in the middle of the night because he has to go has been a little bit tough because you're so used to him sleeping.

And I'm like, wait, I've got like four in the morning and be on his monitor like, Dad, I have to go to the potty and be like, okay, go downstairs and get you. And the other night I got him. I put him on the potty and we're on just like waiting for him. And he's like unfocused, right?

He often gets unfocused. And he was just like, it doesn't work. And I was like, oh, no, what do you refer to? But he's like, it doesn't work.

Yeah, I was like, what doesn't work. He's like, the fireplace. Our fireplace doesn't work. Grandma and grandpa's fireplace works.

I was like, where did you pull that from? Like, is this like, why were you even thinking about the fireplace? Right? Like it was just absolutely hilarious.

And that's what we're dealing with. Oh, that's hilarious. Now, potty training was relatively, apparently it's much harder for boys and girls. I've heard from my friends.

Yeah, that's a wee part too. Yeah. He's been good about it. But the middle of the night stuff has been tough to get used to.

But it's cool and off a little bit. So I'm feeling back at it. I feel ready to go here. We just launched a new feature on level up, which is like horse pathways.

I mean, you can go from one course to the other. And I wrote this neat little SVG thing that like calculated the center of each of my course and draws a path between them dynamically. And so I'm pretty sick about that. It was a little fun little SVG project for me.

Wait, are all the cards in SVG or just the path? The cards are all divs. And will there are there articles? And then so I get the left corner of the div.

I get the or I get the left position of the div, the top position of the div. Then I know the width and height of it because I'm using what's it called with an API. You can get that information. I'm getting the box information either way.

I'm using React measure to do it. And I'm getting height and width of the card. I'm getting its top and left. And therefore, I'm able to calculate the center of it.

And if I get all the centers, I can just draw a line between the centers. But then if they're at a different position, you want it to be all right angles. So then you have to calculate halfway position between each one and then angle, bend the angle. It's a lot of fun.

I always look at that where my e-mail marketing has cards and then it's like the person goes for this. And there's always these little squiggly lines between them. And I always think, huh, I'd be neat to learn how to do that at some point. That's cool.

And I did it with React hooks. And theoretically, all I'm doing is passing in an array of dimensions, AKA the dimensions where the centers are. Theoretically, you could just pass in an array of dimensions. And I could give that hook to the world and anybody could draw a path with a few more options built into it or something.

That's cool. When I was doing the face detection stuff, it gives you where the person's eyes are. And if you tilt your head, it will tell you that one eye is higher than the other. And then I was like, OK, but it doesn't tell you the tilt of the head.

It just tells you where the eyes are. And then I wrote some trigonometry. Yeah. Like go way back to figure out how to figure out the tilt given A squared, B squared, and then figure out C squared.

I don't even remember how I did it. But I remember feeling pretty proud of myself figuring out how the head is tilted based on the eyes. Yeah. Going back way back.

All right. Well, today we are sponsored by Sanity, which is a structured content CMS and log rocket. What's the tagline there, Scott? See the magic.

See that's not see the magic. Log rocket lets you replay what users do on your website and helps you fix bugs faster. We'll talk about them part way through the episode. So we're going to start off with a tech and we'll start off with CSS.

It's a couple of things here and then some JavaScript and related things. You want to kick it off there, Scott? I do. But before we're going on to do one more bit on that log rocket thing.

Because see the magic if you're looking at bugs and not like working code, like maybe see the magic is better for like Cypress because your apps working. But if it's bugs, maybe it's see the tragic. And then you're like watching the bugs unfold. Okay.

Sorry. Just a little aside there. There you go. Oh, wait.

I have to say one thing. I had a joke. I had a joke about a certain news station. Wait, we need a joke.

Oh, yes. Yeah. Okay. Go for it.

It's not a joke. I had a joke about a certain news station a couple episodes ago. And it was not clear that it was a joke to most of you and I got some very angry emails about it. So first of all, I'm Canadian.

And second of all, it was a joke. I'm apologize for everyone that got riled up about that. Yeah. Well, you might have heard me go, or something when you said it, but I don't know if I realized it was a joke, even myself.

So you just, you know, work on that information a little bit there. The story of my life is just having jokes and sometimes people don't realize that it's a joke. Yeah. All right.

So let's get into this first one, which is going to be CSS subgrade, which we recently talked about arriving in some of the later versions of Firefox. Now, I'm not quite positive what exactly that version is. But if you have Firefox, is it in Firefox main main right now? West, you know, it is in Firefox 71, which was released on December two.

So it's been about a month, a month and a half in Firefox already. And I use it the other day. It is awesome. Yeah.

We I was going to make a joke that I was going to be arriving sometime this year, because that did not work out so well when we said that last time. But yeah, subgrade is one of those things that's going to allow you to really solve some of these neat little issues that we've had forever and ever in CSS. Again, we have whole episode on subgrade. So many of these things we're going to be saying, Hey, if you want the full on scoop, refer to that episode.

What episode was that number? Let me pull that up here. 109. CSS grid level two, AKA subgrid.

Yeah. Yeah. Check that episode out. That was January 14th.

Yeah, we exactly one year ago as a recording today. That's crazy. So yes, that is a subgrid. Again, it allows you to have a essentially a grid within your grid.

The best way to understand it is really visual. So you'll want to go ahead and check out that episode. We have a lot of links and a lot of ways to further understand what's going on there. Next one we have here is CSS Houdini, or it's called the CSS Paint API.

And it will allow you to make your own CSS properties by giving you a sort of a lower level worklet where you can, if somebody says, display Scott and then any div that's display Scott, we'll just have glasses on it. Yeah. Right? Like you could probably do that with CSS Houdini.

And it's been around for a while, but still being worked on. I'm just looking at browser support right now. Nothing in Firefox. No iOS Safari, no Opera Mobile, no Safari.

It's pretty much just, oh, it's behind a flag in Safari. It's in Chrome. And I guess we're just waiting for Firefox at that point because there's no more browsers. Or how happy is that that there's no more browsers.

And those of you who rely on IE, I am so very sorry for you. It is the year 2020. Hopefully we can move past this as a society. Yeah.

So IE 11 was released October 16, 2013, almost seven years ago. I bet that's probably one thing to look for in 2020. If you haven't already dropped it, I bet a large portion of people are going to drop that. And at the same time, people are upgrading to Edge, which now runs Chrome under the hood.

Yeah. And if you look at our notes, the very next thing is about dropping IE overall. But I think, so yeah, the Houdini, I'm really looking forward to Houdini because right now, even with all sorts of things, right? People are sharing code.

They're sharing this and that. We're able to take advantage of doing some really cool stuff. But I think CSS hasn't really had its moment in that way. Like the way that we've had to do CSS for a long time, you bring in a library, a bunch of stuff, obfuscated, it's a pain in the butt to change any of it.

But CSS Houdini is going to give us like power tools, essentially. We're going to be able to do all sorts of cool stuff that we've never been able to do by sharing CSS functionality in really interesting ways. And so I am personally very, very excited for Houdini. I think it's probably going to be one of the largest changes into how we write CSS once it's supported, obviously, which is going to be some time.

But I'm very excited to see what's going on there. But yeah, yeah. We should do an episode on it. We've been saying this for a while, but maybe we both need to make something in Houdini.

And I'm not really curious to see how it's going to roll out because I imagine there's just going to be libraries that people, it's not going to be easy to write these things. But people will probably roll out like a library and then you and me can just go ahead and use that and it will knowing it uses a Houdini under the hood. That's what I'm saying. Yeah, I'm excited about that.

I think that will give us a lot of opportunity to share some really powerful code. Like you said, Display Scott gives it glasses, it puts it upside down, it starts rotating it. Oh, somebody please make that. That is awesome.

So, okay, so this next bit of CSS is something that we sort of look forward to every year is every little piece of sand that falls through the hourglass really drops the browser usage percentages in the browsers that we all hate just a little bit more. And personally, I haven't had to support IE myself, but I know many of you require IE. There's a lot of features out there in the great, big, wide open world of CSS that so many of us just have to ignore for so long because we just use them. Right?

Yeah, border radius. Box shadow. Okay. Yeah.

No. But in particular, you know, I just checked out some of these that I've sort of filed away in the back of my mind for a little bit because I know I couldn't use them like scroll snap. I didn't know scroll snap worked on IE and up. So IE 11, I should say.

So if you have IE and 11 and you want to use some like native scroll snapping in your CSS, that is usable right now. Position sticky still doesn't work with any sort of IE. It's never going to happen. But if you don't need to support IE in 2020, you got to position sticky.

And I really had to position sticky is one that I've used quite a bit since of, you know, finding out that I was able to use it. Big fan. Well, another kind of cool thing is a lot of people are going to groan about this is you can, there is now a spec for styling your scroll bars. There has been, isn't there?

Or it was just, it was just really cool. There's only like a WebKit. Yeah. Like a way back in the day, there was like Microsoft version of that.

Yeah. And then there was WebKit. But now there's actually a spec which only Firefox is implemented, but between Firefox and IE, it actually works. And people groan at this every time I talk about it because they're like, don't style scroll bars.

I like this. They're obnoxious. Yeah. But if like, especially like if you look at something like Tweet deck, if Tweet deck didn't style their scroll bars, they would have these big gray bars all the way through the application.

And like even anything with dark mode needs to style your scroll bar to be sort of the opposite colors. And I use it on use. It's not tacking. I think it looks pretty good.

You obviously can do some awful stuff and it could be an accessibility issue if it doesn't contrast enough, but it could be done well. Yeah. I don't think it's, I think it's definitely one of those things that could be done well. I mean, even look at my VS code theme has styled scroll bars.

You know, I mean, any of that stuff. And I don't think people groan about that not using the. Yeah. I don't think people realize that a lot of scroll bars are styled.

Yeah. It's just annoying ones that you go to website. And it's like super obnoxious. Yeah.

Right. Yeah. Definitely. Don't don't don't have it start playing noises when you hover over the scroll bar.

When they're that scroll fart library a couple years ago. Yeah. Farts girl.js. Oh gosh.

Oh gosh. Something to look forward to in 2020. Farts girl.js. Yeah.

Okay. Time to grow up. Wes. It's 2020.

Okay. All right. Let's move on. You the next thing you have here is NPM's.

Tink. I actually haven't looked into this before. You want to give me a rundown of what this is? Yeah.

Yeah. Yeah. So check that I've included a link to this in the description of the episode because I feel like a a lot of people might not know what this is. But here's a blog post published September 12 2018.

So this is this idea has been around for a little bit, but you can actually try and develop a version of Tink right now. I don't know anything about how well it works. I have not tried it myself. Uh, so I have no idea what the status of Tink is and they very well may be building this into NPM.

I don't know the status, but Tink is basically a concept version of NPM. You get to give us just like an experiment that they're having, but it covers a lot of the stuff that we talked about on some of our, we briefly mentioned some of this in our Pika package. So it's an installer list NPM. So basically just by referencing a package, it would install it on runtime and it would add it to a shared cache across all of your packages.

So it accomplishes this by instead of having a like no modules folder, it would have simply just a file that tells where to look these things up at. So you would no longer have this giant node modules folder in your application, but it exists across all of your projects, right? And one of the cool things is that only downloads the parts that you need. So if you're grabbing like a sub part of a module, it's not going to grab the whole thing.

It's just going to grab that part. And again, it does this all on runtime. So you would never have to install NPM install, whatever. And again, it is not something that, well, okay, we talked about this in a couple episodes, going the Pika package about how there could be potential security applications here.

There's a little bit of notes on that, but not necessarily enough, something that we can get into here. They don't feel like it's necessarily going to be a huge problem, but who knows? Interesting. Yeah.

I'm just looking at like, what's the status of this? GitHub repo hasn't been touched in eight months, but there was, there's an issue that says, is this dead? And it looks like it is on the roadmap for NPM eight, which we're on NPM six right now, I think. So that's exciting.

So it's definitely future. Yeah. And also somebody put a link to Yarn two, which I'm not sure what that's going to do. Do you know anything about that?

So there's a lot of movement going on in this sort of space in terms of like, you know, nobody wants sort of that the whole left pad fiasco thing to happen. There's a lot of like issues that we have, obviously where your package directory is huge, it's a lot of redundancy, there's a lot of confusion sort of around here. So it may seem like these tools just are dumb, but they're not there actually where actively have been working on these. These are problems that are actively being worked on in several different ways.

And another one of those is yarn PNP. I think it stands for plug and play. I should probably confirm that. Yeah, yarn, plug and play and not and play, but plug and play.

Okay. Just just. Just. Yeah.

Just in case you wanted to get that right, there's actually on the next.yarn package.com slash features, I'll push a link to this in the description. But yarn PNP is sort of like the next version of yarn and that sort of yarns take on solving some of the same issues that Tink would be solving. And I think this is really interesting. There's hard hard links, essentially, it eliminates package duplication.

So again, the same problem that we're facing where you have the redundancy in your packages. It's also going to be utilizing a shared cash across all of your projects so that you can not have a whole bunch of stuff installed in one spot. So again, these are a lot of the same tools that are solving the same issues here, where it's the whole space of packages. In fact, another one of these tools that we talked about in the previous episode, or the episode before we sent Pika, Pika package, with a snowpack.

So check out Pika package. Watch that whole episode is very enlightening and they're also trying to solve a lot of these same issues and how we get our packages into our application. Yeah, there's also Entropic. So I think it's safe to say something will happen with package management this year.

Yeah. Because everybody's moving. Yarns moving, NPNs moving, Pika package is moving, Entropic is moving. I don't know, exciting space.

I'm sure we'll have a couple of shows on it this year. Yep. What's going on there? Yeah, yeah.

Then we get a lot of show topics from this. And also adding new stuff in 2020 is one of our sponsors. This episode, which is a long time sponsor syntax is a sanity. Yeah, we've, so if you know what, sanity is structured content CMS.

It's the headless CMS tier, the rest of your body, which is your website. And they've just been cranking out the features lately. So I'm going to just kind of go over a couple of the different features that they have here. So they've introduced environmental variable support to sanity studio, which is the, um, sanity studio is the UI that you use to edit your, your data.

And it's, it's kind of cool because like you, sanity is a hosted solution, but the studio, the UI that you use, you can self host that yourself and you can throw your own react components into it, which is pretty cool. So they've rolled out support for environmental variables, which is pretty cool. If you need to use that and any of your stuff, a nice UI for, for that type of thing. They've also rolled out Google analytics right inside of sanity studio.

I know a lot of clients, like you, the developer want like a really wicked headless CMS. But then your client wants a really nice UI to log in and manage their website, manage their data and all of that stuff. So just like one step further to the perfect dashboard is pulling all of that data right from Google analytics into your sanity studio dashboard. They've given me a list of like 10 different new things that they rolled out in just the last two months.

So they are charging on ahead for 2020. If you want to try, check out sanity for your next website, go to sanity.io forward slash syntax. That's going to give you double normal free tier. Thanks so much to sanity for sponsoring.

Say it. Cool. So next one is Dino or Dino. If you know how to pronounce this one, please get at us because we're not going to pronounce it because we all know that.

But you want to check out dino.land or the dino github. Man, this is the naming thing for this is kind of tripping me up. That's the best way to learn about this, I think, is to watch Ryan Dals talk on everything he learned from the creation of Node.js and the things that he wished he would have changed. Because this is basically, they call it a secure runtime for JavaScript and TypeScript.

But it's basically a new version of Node written with TypeScript that solves a lot of those issues. Yeah, from the ground up, this is not a thing that you add to Node or you start doing Node in TypeScript. This is a brand new PHP node and now you've got Dino. Yep.

No, Dino. It's Node backwards. Is it? No.

No. No. No. No.

No. No. I don't know. It's not Node backwards.

You can read it. No, or Dino backwards is O-ed. Oned. No, not backwards.

But it's been split on two characters and then swapped. So it's not backwards. So it's not backwards. It's not backwards.

But I don't know. I think this is really cool. It's going to be probably a number of years before you see it have the adoption of even beginner-obdoption something. Like, no, it's obviously still being worked on.

But something, if you want to have like a side project or you're interested in how these things work, I would definitely check it out. I feel like building a website in this. They've got their simple little TypeScript server in like eight lines of code. Example, go to dno.land.

It'll show you some simple code. And it might be a good. Pretty excited about this. It's to build up your dev points a little bit, right?

You take a library or package a popular Node.land and recreate it for Dino. That'd be sort of low overhead because you know what needs to be created already. And then it would exist for this other ecosystem. Or if you get in on the ground floor and something like this and you become like the Dino person, then companies are looking for that Dino person.

Maybe you're that person. So it might be something really interesting to look at early. But again, I might try doing a side project like this. Nothing major for me right now.

I'm going to go buy dnocast.com and start a new career. Yeah. Ooh. Yeah, Dnocast.

That's good. Does someone already take it? Oh, somebody already got it. Oh, oh, oh, oh.

Oh, somebody's on it. Somebody's on it. What kind of Dno developer is using? Go D.

Yeah. If you were, if you asked go Dany, how can I host my demo site? They'd be like, don't know. You can't.

We can't do it here. Let's see. Does there any who is in phone on this? Who is this?

No fun anymore. Everyone's got private. I never paid for privacy. I know.

You don't? I need to. No, it's free on like any any registrar worth their weight. It's coming from free.

So you're hating on name.com is what I'm hearing. I'm using, I moved all my domain names over to CloudFlare. Because CloudFlare doesn't let you register new domains. So I have to still use hover to register them.

But then you move them over to CloudFlare and they give them to you at cost. Just like eight bucks a year for a, like a.com. I need somewhere to move mine because mynerallatname.com and I love you at name.com. You're Colorado, all that good stuff.

But like you have not changed in years. This boy did. Oh, yeah. Yeah, it's not fresh.

Yeah, I probably, I think I did the math. I'm saving $600 a year when I moved to CloudFlare. Okay. Because they give it to you all at cost.

They don't have every single domain name, but I would say probably, I don't know, 98% of the domain names I have. Like the.af didn't move over. And there's a couple other ones that are custom. I couldn't move over.

I don't think.tech will move over because they're their own thing. But yeah, you should check it out. Yeah, check it out. Cool.

So the next one, let's get into some react stuff. Because this is, you know, there's a lot of new react stuff coming. For instance, suspense was just sort of dropped. It's suspense for data fetching.

And that's all I'm going to say. Is it out now? I think it's out. Yeah.

I think it's out out. But the thing is, is that for suspense for data fetching to really be legit or to really be everywhere, libraries need to take advantage of it, right? Like, for instance, Apollo, we need to take advantage of it. And that's one thing that I would look forward to is more libraries using suspense for data fetching.

But one of the big reasons why I can't use it personally is because of server side rendering, right? So suspense for server side rendering is not released yet, which you can almost, I they be going work on it. I mean, they're working on it. So I would like to think it would come out this year.

But again, I'm not on the React team and I have no understanding of what their deadlines or timelines look like. So they're doc say this is an experimental feature and is not available in a stable release. And then immediately underneath that, it says react 16, six, add suspense component. That lets you wait.

Yeah, but I think that's suspense for loading. They sort of lazy loading in my opinion, the naming for this. I don't know about some of the naming, you know, suspense for data fetching. This is my I get it, but like it is a little confusing on what's released, what's not released.

Well, what's the what's stable react? Let me just check that 16.12. And why is the doc say it's not in everything I've heard is that it's not available yet. What are the docs say it's not?

It might not be. Oh, I could be totally wrong about this. I think it is still experimental. Yeah.

Yeah, this is like I did a talk over a year ago about this. I can't wait for it to come out there. Obviously, making sure they get it right. But I am more than ready.

There's like for this thing to come out so I can start moving over some of my libraries. And I'm trying to rerecord my advanced react course right now and I want this thing to be in it. Everyone asks me like, does it have suspense in it? Like it's not, that's not even a thing yet.

Yeah, you're you're a little ahead of the game and that's, you know, understandable, but so. Next we have here is something Scott is super pumped about. Almost like it came back from a lifeline is meteor. What's the status of meteor?

I thought it was dead. Yeah. So, okay. So meteor, which was purchased by a company called a tiny.

So tiny is a firm that owns businesses. They own dribble. They own a bunch of different interesting things. But one of the things they just recently purchased was, oh, they also own designer news, but they recently purchased a meteor.

That allowed their Canadian. Yeah, they are Canadian. But they recently purchased Meteor along with Meteor's hosting platform Galaxy, of which I've both been using for a long time. The good news about that is certainly, you know, full credit to Ben Newman and the Meteor team.

Ben has done incredible work constantly on Meteor. But it was very apparent that MDG as a whole Meteor developer group as a whole was just not interested in really evolving Meteor or putting the energy into it beyond the amazing work that people like Ben were doing. So the problem was, is that I think it was obvious for a lot of people that they weren't interested in putting in that time into it. So therefore, a lot of people just didn't want to care about it.

Right? I mean, me personally, I was worried about the future of Meteor because even though I knew that it would continue to see updates from people like Ben, I just knew that the energy wasn't there behind it to get it where it needed to be. So here comes tiny and tiny purchases it and it has, I think at first, everyone is a little bit, I don't want to say concerned, but everybody was a little bit like, okay, what's going to happen to this now? And since tiny is purchased it, there has been a ton of updates.

Because one of the things that Meteor always got right was the updates and the growth of the application. The things that Meteor got wrong were the community-focused aspects of Meteor. For instance, I would assume that a large portion of the community doesn't even understand what modern Meteor even looks like today. So they weren't great about fostering this community and they weren't necessarily great about keeping everybody up to date and bringing people in and all these kind of things, but they just really missed out on it.

You know, there's a lot of community members that put in a lot of work to Meteor and I felt like MDG just sort of ignored them for a little bit. So again, Meteor seemed like it was a little bit neglected, but they've now since released a new roadmap, which is big, since buying it. A couple of versions of Meteor popped out of which Ben was working on before, but they've released and they're excellent. And largely, the library just seems to continue to grow and grow and improve.

So me personally, I posted the link to the Meteor roadmap in here. They're going to be getting tree shaking, thinner Meteor, the hosting platform, seeing a ton of improvements. But I personally, I've been using this platform for a long time and I was rewriting my application on the next JS. I've gotten it basically done and I've since decided to go back to Meteor.

So I'm actually still going to maintain and continue my project within Meteor. And I'm really excited to see where that goes through the next year. Awesome. That's pretty exciting.

I'm glad that that has sort of, because I know you were like kind of sad to move away from it. And you're a big fan of it. I love Meteor. I still am.

Yeah. And I think there's a lot of misconceptions. I would love to do an episode on modern Meteor, what that looks like at the misconceptions around it because it largely accomplishes so many of the things that we talk about with looking for this rails of JavaScript. And you can do so in an exceedingly modern way.

You know, I have code splitting and server-side rendering and TypeScript and I have Apollo and all these things. And it's absolutely effortless. You can even, you don't have to use a lot of the Meteor stuff if you don't want to. As a build tool, as a platform, as a node server, it's all an excellent, excellent platform.

So yeah, I'm excited for where that goes. Who got some non-react stuff next? I know View 3 has slated to come out fairly soon, so that'll be a big, not super down on Viewer on what's changing and whatnot, but obviously it's a major release. So that will be a big shake up.

And then what was the other one? Smells awesome. Yeah. Smells awesome.

Fixed up. Smells had a big year last year and it's felt three came out. A lot of press around them. I think people really took notice of how nice it was to write Smelt code and just how simple it is.

So if you are interested, check out Smelt to be honest. I'm really excited about what the future will hold. If there's going to be more community packages or all more interesting things in Smelt, the stuff that's there already, like for instance, like the animation packages that are built into Smelt compared to obviously there's nothing built into React, the stuff that's built into Smelt couldn't be any easier. So check out Smelt, check out the community and just I'm excited to see how that grows this year.

One thing I just watched an awesome talk a couple weeks ago on Apollo 3 that's coming out. And one of the biggest features for me is ability to work with the cache a little bit more. So right now, if you want to validate all of your items in the cache, you have to blow away the entire cache, which sucks. Because if you've got like users or local data in the cache, then you have to blow that away as well and refetch it from the server.

So Apollo 3 is going to give you much better control over the cache. Do you know any of the other stuff that's totally unblanking on it right now? The way they are organizing the packages is going to be very different. In my opinion, the way they should have had it before.

So that aspect of it is going to require a little bit of a rewrite of your code, but not really functional, so to say, it's just going to be a little bit better organized when you're looking for the specific package. I think that's a little win personally. Yeah, there's not going to be so many little packages. It'll all just be shipped in, I think, one big one or several big ones, which is good because mismatching versions is annoying.

And I'm sure tons of silly little bugs pop up when you have not the right version. And then peer dependencies never work properly. And then I didn't hear anything about their suspense plan yet, which I'm super keen on. It's on the work-spearmenting phase.

I guess we're just waiting for it to be officially released so they can go ahead and make stuff, but that will be big as well. Because right now I use next JS and suspense, and we have to do this whole climb the tree, every component and look for queries and then move them up to the top and wait for those. And suspense will make all of that so much easier. Yeah, yeah, absolutely.

Speaking of next JS, next one is next JS. Now, we have a next on the list is next JS. Look, I can keep on all day. This one's not going to change because the next JS is at its static sites.

See? Look at that. That was three different transitions into next JS. Amazing.

Yeah. Do you want to talk a little bit about the static API? Because I haven't looked into this other than the fact that it exists. Obviously, it's probably in response to the popularity of tools like Gatsby.

So they rolled out some new, we have get initial props. They have a new thing called get static props, which allows you to get static props and generate sites. They actually, as part of the rollout of this, they redid the syntax website, which is built in next JS and a custom server. And they redid it as a static website that is just generated on every pull request.

We haven't merged it yet because we need the custom server because of the way that we release episodes. We can't regenerate the website at nine o'clock on Monday and Wednesdays. When the episodes are ready, we push them with a timestamp. And then once that timestamp is passed, the data is then available in the API.

And then the next time you visit the website, we'll rerender a new version of that. So figuring out how that works. If we, if syntax should be a static website or it should be dynamic, we're not totally sure because there's certainly other ways to fix that. But it's kind of cool that obviously Gatsby is doing a lot in the static space and it's exciting to see now take a look at or sorry, next, take a look at that and try to implement it.

There's still so much more that Gatsby does over something like this, but it's kind of a step in the right direction, I think. Yeah, totally. All these tools are going to just get better and better in this year. Another thing is serverless stuff is going to continue to evolve.

You already seen it evolve in a really cool way. Next.js has done some amazing work with it there at Now Hosting platform that allow you to run serverless functions directly in your next step. We did a course on a level up tutorials and I really, really liked how the kind of control you're able to get over your application. It feels like it's all neatly in one little thing, but at the same time, you're running your functions as a serverless container.

So I think it's all going to get a little bit easier. We're seeing companies like Netlify step up with their functions next.js with Now. A lot of people are in this space and they're going to again, make it a little bit easier than what AWS just had with their, you know, deal with it platform. Yeah, it's true.

It's been difficult in the past. Yeah, that's within the name of the platform. One sort of company I'm keeping my eyes on is Begin.com, which is going to allow you to do serverless stuff. I haven't checked it out yet, but I've just, it's from Brian LaRue, who was one of the main devs behind PhoneGap and Ryan Block.

I met him at a conference and he's like, Hey, I'm Ryan Block. I'm like, you're the end gadget guy. Remember, yeah, yeah, yeah. Yeah, like I remember reading end gadget like like crazy when I was, I was really young.

And now he looks like Ryan Block is running a serverless company with some, a lot of devs I respect that are working on it's on my list of things to check out. It's coming up as Begin.com. Cool. I'll check this out.

Yeah. Another one is Gatsby as we know, we love Gatsby over here and Gatsby, do you have any knowledge on what Gatsby's going to be doing this year? I know it's just like always push itself, you know. The one thing I'm really looking forward to is a single unified query.

So currently there are page queries, which allow you to have variables in them. And then there's static queries, which don't allow you to have variables in them. And you can only use page queries at a page level. And if you want to query something inside of a component that has a variable in it, you're kind of out of luck.

Yeah. So there is there, that looks like they're unifying the queries, made possible by suspense. And they're going to move towards a single use query. There's already some, there's lots of code written, lots of proof of concepts.

So I would imagine that as soon as suspense drops, we'll see a single unified query, and then we'll move away from the two different types of queries in Gatsby. I think that's, I'm not, that's, that might be wrong, but that's kind of how I see it working like that. I'm not sure what else Gatsby has planned, but I think some pretty interesting stuff, if I would bet it's, it's a big time for Gatsby right now. Yeah, Gatsby does excellent work.

And we've seen it time and time again with themes and all the stuff they've been pushing out. Next one is the other category, which is the stuff that doesn't really fit in anywhere. I wanted to point out quickly the headless CMS Thunderdome, I'm calling it, where we have all these thousands of headless CMS companies right now, of which we, we know and love a few of them that we've tried, you know, such as Sanity and Contentful and Take Shape and Forestry, and there's even like things like Tina and some other stuff. There is so many of these services, and so many of them are very excellent.

So we should see this space be continuing to be a Thunderdome, specifically because there's all this competition around and competition like this usually breeds some innovation. So I'm excited to see what comes out of this headless CMS Thunderdome, and which tools are going to continue to grow and evolve. And they're all coming for that big, that big seat of, you know, the WordPress seat, that seat that's, you know, getting a little long on the tooth at this point. You know, I don't know how many times people have tried to do headless WordPress sites, but I've done a couple of courses on headless WordPress.

And if I'm being entirely honest, it's not really that great of an experience. I hope I don't, you know, make any WordPress people upset. I don't love it. And so I think this area is right for someone to come in and just do it better.

So we're seeing a lot of these companies take those steps and I'm interested in seeing that happen. What about seeing the magic, Scott? Yep. Seeing the magic and seeing the tragic with Log Rocket.

That's also something I'm excited for this year because, you know, websites, they got bugs. You know, it just happens. And a lot of times when we have our bugs, we don't really know how they're happening. We don't really know what the user did.

Like how did the website end up upside down? I don't know. How did the user do that? I can't even imagine how the user made the website go upside down, but maybe they did.

And Log Rocket allows you to see the exact steps that the user clicked. Maybe they did a little, uh, kept on cheat code in there. And you didn't know they had that on your web, maybe it was just hidden in there, and it made your website go upside down. But you would have never been able to solve that bug without a tool that allows you to see the user's interaction with your site, exactly what they were doing.

Their network requests, their error logs, their reduck state and all that and more using something like Log Rocket. So you'll want to check out log rocket at log rocket dot com forward slash syntax. We're going to get 14 days for free and you're going to see the magic. I'm sorry, log rocket for just making up these slogans for you, but you're going to be able to really see it because the first time a user hits that bug and you saw that by watching a video, it's going to feel like magic again.

Log rocket dot com forward slash syntax. Uh, another thing I'm really excited for is all these frameworks that are now starting to pop up. Keystone, obviously we had a show on that a lot of people replied to the Keystone with, you should try Strapi. So that seems like a really good option as well.

Meteor, Vulcan, JS, all these different like headless things where it's sort of a step ahead of Prisma or a Hsura where those are good options. But if you want something that's a little bit more batteries included, there's a bunch of these different frameworks sort of pushing forward right now and I'm excited to see. Yeah, sort of the next level, right? We have things like Gatsby and next right that largely take control of the rendering and those application parts, but they don't take care of as any sort of data, data database layer or anything like that.

It's largely about how you render the site, right? Whether that's server site, statically, whatever. A lot of these like Vulcan meteor, I think Vulcan's built on meteor, but Vulcan meteor, Keystone Strapi, they're more interested in that full picture of like, how does the data get into the site and how does the data exist? It's off whether that's working with the database.

It does feel more of that space of a CMS, but like maybe not the full space of a CMS. It doesn't take up the entirety of that space, but it's definitely interesting tools that allow you to build some really cool stuff. Another one I have on here is Cypress. For those of you who don't know, Cypress is the end to end testing library.

You can check it out. I believe at Cypress.io. You can just Google it. Cypress testing, it's an end to end testing library that is really super good.

It feels like nothing else I've used for testing. I absolutely love it. The biggest reason why people don't use Cypress is because there's no Firefox support, but they have been working on it for some time. And I just on Twitter, they're still working on it.

And I am very helpful that it will get Firefox support in 2020. Another one is modules, which I was hoping to get to my hands on this one in September, but I think they have a lot of work to do. Modules at modules.app, we'll have a link in the show notes, is a visual editor for your code. A lot of times these things can be balked at, but this one is more like Figma or Sketch, and then you can output a view or react component from it.

And also you can input your Figma document in here according to this little diagram. So it seems cool. It seems like it's what Framer was trying to be. I have my eyes on this one.

And lastly, is my design app of choice is Figma. Honestly, if you're still using Sketch, that's cool too, but I prefer Figma. I don't want to be that divisive, but Figma to me is just better in every sort of way. I really love Figma and they continue.

The reason why I like Figma from the get go is that they had a lot of the same features as Sketch, but they had new features like all of the time. And that eventually happened where Sketch just didn't keep up at all. And Figma's cross-platform, they added plugins, and they just keep adding new features. They just added an auto-resizing feature.

So if you create a button and then change the text, the button just resizes, there's a lot of little stuff like that. And I'm excited for where this app goes this year because they continue to heal it non-stop. You know, one thing I learned yesterday is that you can import Sketch files into Figma. That was one of the biggest blockers for me.

You can do that from day one. I had no idea. Okay. Well, I think 2020 is the year that I move over to Figma.

It turns out it's one of the devs or me and the main guys behind Figma lives like 20 minutes. So yeah, I mean, look here, I don't know. I think my DMs, my DMs are gone. Do you know what?

A funny thing about Figma is that I was working with Figma to do some videos a couple years ago. And they only had a handful of employees at that time. But one of the guys I worked with at this computer store at University of Michigan, where I met my wife all those years ago. And so he knew Courtney too.

And it was so funny that I was like, wait, is this the same guy? You know, it's so fun to just, I didn't know he was in the space at all. It was just so fun to run into somebody digitally that way that you would known from college. That's cool.

Yeah, I need to. Next side, I do. I'm going to do it in Figma. Yeah, I'm a huge huge fan.

I use it every day. I use it for all sorts of stuff, not even like I said, I use to create my thumbnails and stuff just the best. Awesome. All right.

So that's what we think 2020 has in store some really interesting stuff coming up. I'm excited for the new tech that drops. So buckle up and get ready. Let's move into some sick pics.

You got a sick pick for me today's got you bet. I got a sick pick. I got a couple of them trying to decide. I have a really interesting little sick pick here that's a smart device, but it's not necessarily the smartest to smart device.

Like as in, it doesn't need a hub is not like all super fancy. You don't need to check it out of your house. So it's a little $13 thermostat and high grometer, basically a humidity sensor. And it's very low power.

And it basically runs on a couple batteries and it connects via Bluetooth to constantly keep track of temperature. And every time you connect, it updates your app. So I really love this. I bought a couple of them one for my attic because we don't store anything in our attic.

And I wanted to really keep track of what the humidity and temperature levels were in our attic so that I know like what we can store up there and how it's going. But also for our gym, our gym gets really cold because it's a shed, you know, it's basically a shed. It's a shed garage, but we have a couple of heaters out there. So what we've done now is I have one of those thermostats and I can turn on all the heaters and then I can come inside the house and I can just look at the app because it connects via an app, even though it's just Bluetooth, it connects via app.

And I can just look and say, okay, it's 40 degrees out there. That's warm enough for me to go out. What's this called? It's a Go-V thermometer high-grometer accurate indoor temperature humidity.

Go-V. Go-V. I have a link to it in the e-show notes or I did. I'll put it back in there.

I think I need this because my wife's always like, it feels cold in the girls room. And I'm just like, I don't know. Is it? And like, I want it to play, I have the E-Go-V thermostat and E-Go-V has these little like coin cell things.

You can put in each room and then it will heat it depending on what room you're in. And I was like, I'd love to just have one in every room so I can know how hot is it in each room. Do we need to turn on a space heater? But they're like 60 bucks a pop.

It's just too expensive. So just something super simple, like this is probably what we want. That's great. It's super simple.