316

January 6th, 2021 × #predictions#2021#trends

2021 Predictions

Scott and Wes share their 2021 web development predictions including the growth of Deno, TypeScript, MDX, Jamstack, and more.

or
Topic 0 00:00

Transcript

Announcer

You're listening to Syntax, the podcast with the tastiest web development treats out there. Strap yourself in and get ready. Here is Scott Talinski and Wes Bos. Welcome to Syndax. This is the podcast with the tastiest web development treats out there. Today, we've got some 2021 predictions. Rid. Scott and I have compiled lists of things we predict will be popular and the things that will happen in web development this year. And then at the end of the year, we'll sort of revisit this list and see where we slam dunked it and where we air balled it. Today, we are sponsored by rid. Three awesome companies. 1st 1 is Sanity. They're structured content CMS. 2nd 1 is LogRocket session replay, and the third

Topic 1 00:45

Sponsors

Scott Tolinski

rid is Linode, which does Linux virtual machines. We'll talk about them all partway through the episode. How are you doing today, Scott? I'm doing good. It's funny. We always record these in the morning, and we're recording this episode in the afternoon. It feels very different. It does. I feel awake.

Announcer

Yeah. We usually record them at, like, 9 AM your time, so you're, like, you're thrown right into it. But I it's 11 o'clock my time when I record. So Oh, right. I'm just ready. Hungry. That's a me problem. Yeah. Yeah. Definitely a me problem. Alright. So how did you wanna do this So we're gonna go back and forth with our predictions.

Topic 2 01:18

Predictions format

Scott Tolinski

Yeah. The way I think that would be fun rather than just, like, Being too organized with it is that, well, we both made lists of our predictions and maybe we could just start at the top And I could do 1 and then you could do 1 and then I could do 1 and then you could do 1. And if you have the exact same prediction on your list, you could say, I have that too.

Scott Tolinski

Ready. Alright. Let's do it. You wanna grab the first one? Yeah. I had, like, a whole, like, game, not like an actual game, but, like, a fun way of doing this, Like, it involved, like, ranking them, and then, like, the more I thought about it, I was just like, this totally is not going to to work. So I, like, presented it to Wes as like, oh, I got this Great idea for the episode, and then I was just like, we basically just go off and go back and forth and talk about what we want. Rid. You're like, is that it? What else what else you got? Okay. So my first prediction is going to be, one that I'm guessing You're gonna have to say I have that too, and that's just ESM.

Scott Tolinski

And ESM is going to be big in 2021.

Topic 3 02:15

ESM popularity

Scott Tolinski

Rid. I have been to the edge and back. I've seen the future, and I have used ESM, and I don't wanna go back. And in fact, I used Snowpack rid To do some ESM bundling, for those of you who don't know, it's ECMAScript modules. So it's basically JavaScript modules built in, And with the combination of a nice ESM focused build system like Snowpack, you get some crazy fast re Reloading times, your tooling gets easier.

Scott Tolinski

Everything overall just seems to be quite a bit nicer in my opinion.

Announcer

Yeah. I had the same thing on mine as well. Everything is just a URL. I I'm very curious to see if we'll get imports from URLs Yes. In rid In node, which would be kinda interesting because you can do that.

Topic 4 03:04

Import URLs in Node

Announcer

Actually, I think we already have that. No. I'm wrong there. You can import from a URL in node because that is part of the ECMAScript spec. The part of the Acura script spec is that you can just import whatever from h t t p s colon /etcetera etcetera.

Announcer

So I had it here. ES modules by default. Everything going forward should always be ES modules, and everything else common JS is considered legacy. We should do an entire on now that we have ES modules in node, what does it look like? How do you use it? How do you mix between? How do you convert a project over from one another? Because We did do a show, but that was before it was finished, and there was a couple things that we didn't quite have yet.

Scott Tolinski

Yeah. I think that along the lines of what you're referring to with the, importing from a URL would be like a caching and package I don't think Node has anything like that specifically. Although, I'm gonna say the word Snowpack a lot in this episode, but Snowpack does have something like that in their, version they have, like, a version 3 release candidate released recently, and there's some very interesting stuff in here in this rid. The 3 release candidate, including one of which is called streaming npm imports, where it's gonna make some of this Transferring over to importing things from URLs a little bit easier because what you would do in Snowpack would be import React from React, so to say, And then Snowpack would go off and get that from the CDN with the right version instead of having an NPM install process or even a package dot JSON to set those things. So it it functions a little bit more like a transparent Install from URL. It's very interesting.

Topic 5 04:51

Other languages improve JS tooling

Announcer

Interesting. One quick question is that Node does have a cache for importing things. And one thing I'm kinda curious about is can we get, like, hot reloading for node modules? I tweeted it out the other day. A couple of people rid Had some, like, kinda half baked solutions for it. But because Node has a ES module loader, I'm wondering if, like, can somebody make another loader that funkifies with the cache, and then every time that you run a function, it will on demand require it? That would be pretty wicked to get that because, like, that's a pain I have right now is that for a lot of node processes, you have to restart the entire application, in order for it to see. And and, like, that's not so much of a big deal when you're doing, like, a small little serverless function. But For existing node applications, it can be a bit of a problem. Totally. My next prediction was remote work is obviously ready. Gonna become more popular, the whole COVID thing. I don't think remote work is like a a silver bullet. There's a lot of hard stuff specifically around, Like new hires and juniors, it's being a little bit harder for them to skill up because you don't necessarily have someone to sit beside you.

Announcer

But the the part where I think is gonna be kinda interesting is that there's a whole new talent pool that opens up when a lot of these companies go remote. So Never mind these, like, rich California tech people moving into some beautiful riverside place. Like, Yeah. People are frustrated when we hear stories of that. But what I'm saying more is that there's a lot of really smart people rid all over the world. And for a lot of people, it just has not been an option to get a job as a web developer because of where they live.

Topic 6 06:04

Remote work widens talent pool

Announcer

And now that is going to be an option for a lot of people because there is this thing called remote work, which is awesome. I think, like, Like, that might not be all that exciting to hear from people who are currently looking for a job because the talent pool probably just got much bigger. But I think that's good for people that are hiring because now you can all of a sudden just, like, select people from absolutely anywhere. So I think that's gonna a big, A big thing in 2021.

Topic 7 07:06

Programming communities improve

Scott Tolinski

Yeah. Especially in our industry where you can pretty easily detach, you know, the experience of Working in a real environment, you know, people see it like little hubs. I have a a friend who works for a major company of which I'm not going to disclose, Like a major big company, and they do, like, crazy intense work to, you know, just to add a layer of, You know, clarification there. It's an unknown company. They do an unknown large amount of work, but they have these, like, little hubs where they'll have, like, rid Four people in Denver. So what they'll do is they'll buy a small office for those 4 people in Denver. And so instead of Everybody working from home, you just work from where you are. And if there is enough people in that specific spot, then they buy you an office there. And guess what? If you wanna go to that office, you can go to that office. And if you don't, hey. No worries. You can also work from home. So I think there's, like, little fun things like this rid where you will see companies maybe investing in smaller spaces in, you know, various spots around the country rid Or even just wherever to get a little bit more control over their workspaces, but, again, still in giving people that ability to technically remote work. So I did not have that 1 on my list, but I think you're totally right. And I think this pandemic has only accelerated that process.

Scott Tolinski

Next is in my list is Adeno rid. Is going to grow in usage and in just about everything, I think, in 2021.

Topic 8 08:24

Deno adoption increases

Scott Tolinski

I recently released a Framework side of things. And let me tell you, stuff is there. There are certainly good things there, and the community is growing.

Scott Tolinski

But If I were to say, let's say, like, Scott, you were to have to choose to build level up tutorials from scratch right now, would you pick Deno? My answer is probably right now, no.

Scott Tolinski

That said, if I had some fun side projects or something, I might say yes. Because in my experience, there were many packages that were just flat out now working with many cases, you know, connecting to rid A Mongo Atlas DB within the most used Mongo package just didn't work with for me. And, like, I didn't have the The time to debug this, but, like, this package and these things aren't being used by enough people to hit all of the different edge cases or even cases that rid Exist right now. So as more people continue to experience it and use it, I think Deno's usage will continue to grow, rid. And there will be more and more tooling and packages around it. I think it's a great platform, and I really enjoyed using it. But it is it still needs a little bit more time in the oven. I think one thing not Deno itself, but the community. One thing I noticed, like, rid Even, like, packages that everyone would have to use. Like, there's a dotenv package that's really good, mind you, but there's, like, 83 stars on it. And you're like, oh, rid. Eighty 3 stars. Like, not that stars are really the end all, be all, but, like, I was, so to say, a little bit surprised with how

Topic 9 09:43

WASM usage increases

Announcer

Few people are using a lot of things right now in it. Yeah. I'm super stoked about you know, we will probably talk a lot about it on this podcast Next year, just because we are so excited by it. I don't think that, like, it's not gonna be like, oh my gosh. Everyone switched over to Deno. Like, you will probably see that at least 4 years coming. Like, what how old is Node right now? Like, 10 years old right now? It took them a good amount of time in order to get big. But rid. If we see that all node APIs are now compatible and there's, like, a compat layer where you can just run existing node modules in Deno, That's gonna be pretty exciting, I think. Yeah. So, yeah, definitely keep an eye on it for 2021, and, we'll see where we are. I'm really excited to see where we We are in 1 year's time. I had a lot of positive experiences

Scott Tolinski

when working with Deno, and I think this will tie into my next one even though I just had this. So I guess you can go.

Announcer

Either way, my nice things were all about TypeScript in it. Oh, yeah. My next one here is that tooling will fade away. Rid. So there's sort of like 2 camps, I would say, of people's thought process over tooling right now. One is we don't need it. You can use rid. Yes. Modules and HTML in the browser, and you can ship ES modules in Node. And, like, you don't need a layer of tooling. Some people are are going as far to say. And then you sort of see people on the other side of thing. They're saying that, yeah, you still need tooling. There's a lot of stuff that you can't do with just rid HTML, CSS, and JavaScript. You still need a lot of this tooling in place, but it's gonna fade away. And I think I'm in that camp is that Mhmm. What I mean by rid. Fading away is that you don't notice that you're actually using tooling because Deno is a perfect example. It it has a linter, a formatter, transpiler. You can use TypeScript immediately, tester. That's not to say that you they're not doing anything for you. It's all happening for you, but the tooling is built in Or, we're excited to see what happens with Rome. Parcel 2 probably should come out, Snowpack.

Topic 10 11:09

TypeScript tooling improves

Announcer

All of these tooling, rid. You just run it, and it just works. And there's no there's no more fussing about it. And it's been like this way a couple for a couple of years already, I think, with some of the React tooling, rid. Specifically, Next. Js has been really good about this, but you just don't need to spend a whole lot of time fussing with these tooling. Rid. And I bet 2021 is the year that we say, alright. Stop complaining about webpack configs because that's not a thing anymore for most people. It'll be like the people who are still complaining about, I I can't center things in CSS in in 2020. That joke has been long gone for, like like, what, like, 5 years we've had Flexbox centering? That ship has sailed. Yeah.

Topic 11 12:50

Build tooling gets easier

Scott Tolinski

Reminds me of, like, comedians doing their material from the nineties or something, so it's not gonna work. Yeah.

Scott Tolinski

I mean, I I definitely agree with you. I think we're gonna see more and more of these tools. And each time I I try out a new thing, whether it is Parcel or or rid No pack or whatever. They all just feel nicer than the predecessor. The configs read nicer. The usage is generally nicer. You know what? Like, I I've been having just so many experiences lately with new platforms where I fire up a new platform, I don't write a shred of config, I don't even tell the thing that I want to use TypeScript.

Scott Tolinski

And then I make a TSX file, and the builder and compilers just like, No problem. I got that. And for me, personally, like, that's what 2021 is going to bring. It's gonna bring situations where I'm not Installing and then thinking, okay. Now how do I put my TypeScript compiler into this setup? Or how do I open up and I gotta deal with Babble and, you know, just Not having to do these things is going to be a huge productivity boost for us all. It's gonna be a a huge decrease in barrier to entry because, honestly, It's really great to write TypeScript code, but when the first, you know, 2 videos of any tutorial series have to be about setting up your environment, that to me is not learning TypeScript. That's rid Learning how to, you know, get a a tech stack working for the sake of getting it working. Right? So I think we'll see a lot of this stuff. I have one interesting thing on my list here because I also had the fact that these tools will get easier. Let me, follow this up with a prediction that I have that is right along the rid lines of this, and this is, greater usage of other languages to build JavaScript and TypeScript. For instance, Have you seen esbuild.github.i0?

Announcer

Yes. I have. I didn't look out What it was, I assumed it was just a builder for ES modules?

Topic 12 14:41

Go and Rust improve JS tooling

Scott Tolinski

ES build is basically a Babble competitor written in Go, And they do a neat little comparison where, you know, people throw these benchmarks up. And, yes, they're benchmarks on somebody's website. Yeah. One of these rid. Graphs where it's a 1000 times faster in their specific use case. Bill, like, my thing is way, way better than yours. Look at this graph that I created to that. Like, I'm gonna make a graph that shows just how cool Scott is, and I'm gonna, like so very clearly based on this data that I'm presenting you, very cool.

Scott Tolinski

So, no, for ESBuild, it is very fast, but I think this is a neat trend that we've already really started to see even if you're not aware of this. And one of the things that we've been seeing this in is Deno specifically.

Scott Tolinski

Deno is built in Rust or at least the aspects of Deno that rid Would be transforming your TypeScript. Right? And, likewise, ESL just built in Go. And so my prediction is that we are going to be Seeing languages like Go and Rust used to great effectiveness to improve JavaScript tooling, and I think that's something that we're definitely gonna see. This ES build thing, regardless if if their benchmarks say that it's crazy fast, I've used it. It is crazy fast. So, you know, I think this is the first of many of these type of projects that we're going to see over the next year. Rid. Isn't Rome also built in Rust? Am I am I tripping on that? But Rome may be along the same lines too. Is it? Let's let's check that out.

Announcer

Looks like all the files on their GitHub are in TypeScript. So, no, I don't think it's in Rust.

Scott Tolinski

They're all written in TypeScript.

Announcer

Yeah. It looks like you are right. So this is just a classic case of me making that up. Rome is written in TypeScript And runs on Node. Js. Rome has 0 dependencies and has largely been written from scratch.

Announcer

Interesting.

Topic 13 16:45

Rome JS tooling

Announcer

0 dependencies is the new big thing is that there's not a whole tool chain of 40 node modules down. I would like to install Rome then and then see, like, what's in the node modules directory.

Announcer

One thing?

Scott Tolinski

Well, so here's here's a this is like if the the nacho's connected to another nacho with cheese, is it 1 nacho or is it 2 nachos? So, like, along with that that same question, like, if you just bundle all your stuff up before putting it into your node modules, is it 1 dependency, or is it, the 100 dependencies it was before.

Announcer

In Canada, our version of that is when the Timbits stick together, it counts as 1. Not the Timbits. Even if the one is stuck to another one. I don't know why I thought you gonna go poutine, but No. You don't really get that here falls apart. In your area, do you? Oh, yeah. We get poutine is is pretty big here. Yeah. Yeah. We have this, rid A chain called Smokes Poutine, which is just like after we used to go after the bar and get, like, like, a 8 pound little box of poutine, and you would just hate yourself the next morning. That's Great drunk food, and we never had that in anywhere that I've lived really except for there is 1 place here in Denver that does a fantastic poutine, but, yes,

Scott Tolinski

I went we went to Montreal for my brother's, my brother's bachelor party. So we definitely ate a bunch of poutine. Oh, yeah. It was just great. Let's take a quick break for one of our sponsors, and that is Sanity,

Announcer

available at sanity.i0forward/ syntax. Sanity is rid The structured content CMS for your next project. So what it is is it's like a it's a CMS. So you sign up for Sanity. But the kind of cool thing is it's a Service, but you have control over both the front end of your application. Obviously, it is whether it's a React or Svelte or or Vue or Angular website, But then the actual editing experience is fully customizable because they have this thing called Sanity Studio, and you can install Sanity Studio And the code runs both locally on your own computer as well as you can deploy it to Sanity or you can deploy it to your own domain name. You can deploy it anywhere. It's a React application.

Sponsor break

Announcer

Rid. And I really love that because you you get the entire editing experience with Sanity Studio. But if you wanna be able to control custom inputs or theme it or do whatever you want. It's not just like, alright. You have 6 color pickers, and you're allowed to choose from these 6 colors, rid. And you there you go. You customize it. No. You get you get access to all of the coding. You run it all yourself. So check it out on your next project. You need a headless CMS for your project. Check it out. Sanity.i0forward/ syntax, and that is going to get you double the free usage tier, Which is 200,000 API requests, 1,000,000 API CDN requests, 10 gigs of assets, and 20 gigs of bandwidth. So Pretty generous free plan there for your next project. Check it out. Sanity.i04/ syntax. Thanks so much to Sanity for sponsoring.

Scott Tolinski

Thank you, Sanity.

Announcer

Rid one thing I'm super stoked about is programming communities getting some traction. So right now, a lot of programming communities rid. Are either in Slack or a lot of them have moved over to Discord, and those are awesome. But, like, I sometimes mourn The death of the good old message board or the forms and things like that. Right? And I think I've been looking around myself. I've mentioned this many times. I wanna rid. Move my Slack to something else that is more of a real time message board than just a chat where things get lost Yeah.

Announcer

Rid After 20 minutes of talking. Right? So I'm pretty excited because, we've we're starting to see GitHub discussions pop up. The dev.t0 folks ready. Are releasing this thing called Forum, f o r e m.

Announcer

And, basically, it's just like they're open sourcing their entire platform, and and it's like a Swiss army knife of rid. Running communities. You can make it whatever you want. It's really, really cool. I've been playing with it myself. There's another so that that one's open source. It looks like they will offer a hosted version as well. I'm not not completely sure about that. There's another one called Circle.

Announcer

I think it is, like, what I hope Spectrum would have been, and I've been testing it out for my own community as well. It's circle dot s o, I think. This one is more targeted at, like, rid Kinda exactly what Scott and I do as well. So I'm stoked about that because it's it's bringing back the the form. Think about how much we lost to Slack Slack expiring chats. Right? We I think we lost a lot of of back and forth, and I would love for when somebody helps somebody, I would love for that to stay on the Internet for at least 5 or 6 years so that you'll help other people Totally. Come in in the coming future. You know what this circle,

Scott Tolinski

dot s o kind of reminds me of, like, Facebook groups without, Mark Zuckerberg's

Announcer

greedy finger on it. You know? It's pretty, it's kinda neat. Yeah. I mean, at least that's a vibe I get from looking at it. Yeah. Kind of. I would say that's not what it is. Okay. Because Facebook groups have the same problem in that everything is not is temporal, and then it's gone. The search sucks. You can't find it in Google.

Announcer

But yeah. And and it's all all around a thread.

Announcer

And then when you get too many replies, the thread gets overwhelming. I hate Facebook rid groups. I'm part of so many of them because that's unfortunately where communities are right now. But this is what I'm hoping it is. It's kind of like like a really good Forum but with a lot of like real timeness layered on and on top of it. And so I think it looks pretty cool. I'm I'm still between whether I'm ready. Go with Forum or Circle. I have to try it out a bit more, but get excited.

Scott Tolinski

Yeah. You know what? It is. Like you mentioned, it's like one of those things, like, it's what you kinda wanted Spectrum to be, which Never really fully materialized. Spectrum to me is a just a big avoid. It's kind of crazy that so many so many communities jumped on Spectrum really early when it was looking like it was gonna be awesome. It's because people were dying for

Announcer

a better alternative to Slack and GitHub issues mashed together. Right? And then, Spectrum was supposed to be that, but it just didn't even, like, Max tweeted hey. That's how I found Circle. He tweeted it out being, like, this what Spectrum was supposed to be, so I'm so excited for it. Nice. Yeah. Discourse was always a decent option too, but it never seems like a ton of people use Discourse. I know rid The media media forms on Discourse, and there are aspects of it that are really nice. It's funny. Like, I've tried out Discourse. I've even installed it myself, but There's something about the UI. About it. Yeah. No. I get that. I'm not sure what it is, but every time I'm on 1, I'm kinda irritated Yeah. And I'm like,

Scott Tolinski

I'm not sure what this is. You know, one of the things is the command f is overridden. Like, that bugs me all the time. Yeah. Like, what do you mean? What And who is it? Gusto overrides the command click in the Gusto dashboard. I'm like, why? Why would you do that? Like, people use this.

Scott Tolinski

Okay. Next step on my list is gonna be something I think you have on your list too because I did a little snooping, and Wow. I know I shouldn't have done it. I'm like, Oh, is that Shaggy? No. Shaggy's song was not. I shouldn't have done it. It was it wasn't me. So it wasn't me. I wasn't snooping. I'm talking about more WASM here. WASM, BRT, stands for web assembly What does the m? That's it. What does the m stand for? WASM.

Scott Tolinski

For web assembly. A membly. A membly. It's the membly part of assembly. Is it really? There's nothing else there? I always thought it was, like, web assembly, you know, hypertext markup language, you know, something like that, but not. No.

Topic 15 23:49

WASM details

Scott Tolinski

So WASM is basically the ability to use other languages on the front end, or in the browser of your applications.

Scott Tolinski

And let me tell you. I've had a taste of Wasm. I I was kind of like, yeah. Okay. Wasm, we'll see you, whatever. I'm not a developer of any other languages, although I'm a hobbyist of a a couple. But, like, I'm not a great developer of any other languages. But when I saw, Like, some of the cool stuff that Munko was doing in their app were using, their Compass app using Rust and Wasm.

Scott Tolinski

And I watched the talk and it looked like, wow, that was pretty easy. In fact, they were just doing some number calculation was one of them. Was one of them is they built a number calculation, some sort of thing that needed to run a lot of values really quickly, and they built it in Rust. The Rust program really wasn't that intense. They built it using Wasm pack, and then you were able to import the rest function as if it were JavaScript, get the correct typings and everything in it, And just use it like if it was JavaScript.

Scott Tolinski

So that to me is is really, really interesting. And I think the the world now that we're starting to see some WASM in production in lots of places, I think we're gonna just see it even more. I think people are gonna be like, wait a second. This is really, really fast. Totally agree. I

Announcer

it out, the new three d tool. Did you try that out? What was it called? New three d tool? Spline. I have not tried out Spline. Spline.

Announcer

Yeah. So Spline is a new three d tool. No. It's Spline.

Announcer

It's built in It looks like it's built in React. It's funny because as soon as it launched, I whipped out this there's this tool called Charles.

Scott Tolinski

You whipped out Charles?

Announcer

I whipped out Charles. Charles will allow you to sniff network traffic. If you're ever wondering, like, what an app who it's talking to and what servers it's on? There's, like, Little Snitch was another one of those, but maybe a little bit more invasive. Yeah. Charles is more like dev tools for like, the dev tools network tab for your entire computer or for your iPhone. And you can also do SSL proxy monitoring so you can, like, install your own cert. Anyways, I opened it up because I was like, what's this built in? And the entire Application is hosted on Netlify, and it's just boxed into an Electron app. And I thought that was bonkers. I found the URL, and I just ran it in the browser. And I was like, this is rid. Unreal. Unreal. But they can build a 3 d app

Scott Tolinski

with Wasm and HTML, CSS, JavaScript. So Pretty excited about that. It's very cool. You know what I'm also excited about is one of our sponsors today, and this is one of our sponsors that's going to allow you rid. See some magic happen in your browser. I'm talking about LogRocket.

Scott Tolinski

LogRocket is the error exception handling tool that allows you to see rid. Errors and exceptions as they actually happened.

Scott Tolinski

You get a session replay, which is a scrubbable video replay, including the network log and all sorts of rid. Information that you can use to detect what happened on your site. It's like being able to solve a mystery by seeing the crime happen. Wow. That sounds so good. Especially as web developers, we're often working in the dark with the earmuffs on and with not being able to rid See anything in our surroundings or solutions, a black box. We're just trying to fix the problem. And LogRocket really makes fixing that problem easy. So head on over to logrocket.comforward/syntax.

Scott Tolinski

Sign up and get 14 days for free. Check it out.

Announcer

My next prediction here is that TypeScript rid. Will become extremely popular. It obviously already is, but I think, like, the masses will find that it makes more sense to start a Type rid project than just a regular JavaScript project because of tooling. Versus code is just getting so dang good rid. With all of the tooling that surrounds TypeScript, obviously, being able to run it, no problem. And Deno is really, really cool. So I see it as a big year for TypeScript.

Topic 16 27:19

TypeScript popularity

Scott Tolinski

Yeah. In fact, we just happen to line up perfectly on this one because you may see my very next one on my list is TypeScript tooling will get even nicer, which is something I alluded to earlier on when we talked a little bit about tooling in general. Right? Like, nobody wants to spend their time learning TypeScript to learning how to get their tooling to work. We wanna create a dot TSX or a dot TS file. We wanna save it and we just wanna have it work. And then for me, if you remove a lot of the barriers to entry around TypeScript, I think it is rid Just totally right for really mass adoption at this point. I really, really have a hard time going back to writing JavaScript anytime now, and it's crazy if you listen to Syntax, like, a year year ago even when we're like, well, we'll see who the winner is. You know? Yeah. And now I'm just like, oh, I love TypeScript. I'm its friend. I I bought it a really nice gift for his birthday. I'm just very excited to, be TypeScript's friend at this point. So now if TypeScript could just, You know, make their driveway paved, then more people will come over to its house. This is an extended metaphor.

Announcer

I like it. The latest version of Versus Code that ready. I think at the beginning of December when it rolled out, they changed something with the both with the auto import and with the type hinting.

Announcer

Rid. And it got for just regular JavaScript I'm talking about. It got so good. Like, it's obviously still not as good as writing TypeScript, but If you are using, like, a third party library, almost all these third party libraries that are popular ship types now, and you can use those all in regular JavaScript. So it's like just rid that, I think that will show people. Oh, that's so nice to be able to use in JavaScript. Imagine it was even better,

Scott Tolinski

in TypeScript, so it's gonna be a big year for it. Rid Totally. What do you got next? Oh, that was my next one. Are you running out? No. I'm not running out. Oh, grab another one there, Scott. It's funny because I'm snooping again, and I noticed your next one is about React, and my next one is also about React.

Scott Tolinski

However, both of ours are different. Okay. So I have 2 on React here Specifically, maybe I'll go through both my 2 here just so we can save time. 1, scoped CSS in React will find some way to become better than it currently is. I have been on this for a little bit. I'd like Svelte CSS option where you just put a style tag, you get single page components, and it just works. Rid. Styled components are nice, but nothing is really quite dialed it down in the React community as if there's always, like, a little bit of JavaScript barrier in between the JavaScript rid CSS that I would prefer just to have a little bit more magic there myself personally, and maybe that's a framework that solves that problem. I just think Somebody's gonna make single page components a little bit nicer in React, and we're gonna get that scoped CSS of my dreams. Now another one I think is gonna happen, Which I also think you might have something about in yours is server side rendering and hydration in React will become a lot better because Anybody who's worked in server side in React or even in the hydration, it's not a lot of fun. It's pretty intense on the the computer when you're working in dev, so I always turn SSR rid are off in dev. I see Remix is doing a ton there.

Announcer

Yeah. The whole, like, streaming React will be a thing. Yep. Instead of, like, thinking server side, client side, it just works, and then it will stream from the server to the client. Not exactly sure how that's gonna look, but re It's gotta get better than it is now. Like, even right now, if you try to do something like anytime you have, like, a window dot whatever Oh, yeah. It, like, breaks the entire building. Rid Come on. And you have to go get a special component for it to work. Like, you can't figure this out. Like, they obviously are, but It's been, like, a year and a half, almost 2 years of us sort of waiting for what this is gonna be in React land, so I'm so pumped, and I bet 2021 is the year rid that we find that out. Yeah. And I bet that all connects somehow to suspense and promise based rendering in React. Somehow, rid I'm I'm thinking they're all related. Somehow. I don't know if it is, but That kinda ties into my own thing is, like, I think We'll see. And this this won't be me. I doubt it. But I think we're gonna see people fall out of love with React just because of things like animation, rid. Scope CSS, the server side rendering, there's a lot of the stuff that has not gotten better in React ever. And there's all these other frameworks that are just slam dunking how to do this stuff.

Topic 17 30:52

React SSR improvements

Announcer

And, I'm not sure if that's Because React just says, well, that's not our problem. We we are the putting data in the DOM and updating the DOM Right. Yeah. People, And you do the rest. Right? Like, that's next jazz's problem or something like that. Or if if they say, yeah. Like, we've been looking at how to do that stuff, and we're going to show like, even the forms, rid Why is it so hard to sync a value to state with a form input? Right? Like, come on. It should be a little bit easier rid to do that in React without having to install a whole bunch of stuff. So I think either

Scott Tolinski

people will fall out of love with React because of those reasons, or We will start to see a little bit more magic added to React. Yeah. In various various ways. I agree. I I think there will be something there. And I I think maybe this is a related topic, but maybe you're gonna see more people on web components because there are more web component based Frameworks that are coming around, whether that is, like, Stencil or something. But there are more web component based frameworks out there That their advertising point is, well, it's closer to the platform. You know, it is the platform, so why wouldn't you use the platform sort of thing? Yeah. We'll see.

Topic 18 32:41

Competitors challenge React

Scott Tolinski

So my next one here is going to be markdown based formats like MDX are just going to continue to skyrocket in use Because let me tell you, there's nothing better than authoring HTML with MDX.

Topic 19 33:31

MDX usage increases

Scott Tolinski

It's fantastic. I was doing a markdown post the other day, and I was like, oh, I need to add. What did I want? I wanted to add, like, a counter to it, just like a simple counter. And I was like, oh, yeah. This is markdown. Like, if the oh, if this was an MDX file, I could just Drop in a React counter into this. But because it was marked down, I was like, oh, okay. I'm I'm in static land here. I think things like MDX, Which is basically markdown with components inside of it. I think those things will continue to become more and more popular.

Announcer

I predict Gatsby will get rid Some sort of server rendered, streaming rendered, on demand, some way to get around the limitations of what Gatsby rid has right now is that it's entirely static.

Announcer

And now that Next. Js has the ability to do both, We talked about this on the whole next verse Gatsby show. There's there's, like, a data layer and whatnot, and there's still some benefits to to Gatsby there. But I think that they've got it both to solve some of the pains of long build times as well as sometimes people do wanna server render some of this stuff. I'm curious to see what they'll come out with in terms of hosted hosted GraphQL.

Topic 20 34:14

Gatsby streaming/SSR

Announcer

On the flip side, I'm I'm always curious. Like, will Next ever implement some sort of data layer, or is that out is that outside of the scope of what Next. Js is? Yeah. Rid I think it probably is outside, but I'm just gonna throw it on the table there. Yeah. Just toss it on the table. I think that's cool. I agree.

Scott Tolinski

I mean, I think for the most part, What we're gonna be doing next year around, I don't know, midway through the year, we are gonna be having ourselves, like, a little bit of a Next. Js, rid Gatsby and Remix Thunderdome, where we're gonna have these platforms that are doing server side stuff. Rid. They're doing data. They're doing all sorts of stuff, and we're gonna have to say, alright. Well, which one has what? Which one has what? And I do think that will definitely be a thing. Here's a fun one that might be a little bit of a change of pace here. I think augmented reality tech in the browser is going to continue to evolve and become a much more thing that needs to be in your skill set. Maybe not by the end of, 2021, but I think it's gonna like, Its market share will rise in terms of skills needed. Because let me tell you, Courtney, was buying something from Target yesterday, and she had the rid. She had the app up and was putting a picture on one of our walls with augmented reality.

Scott Tolinski

And I know people have been able to do this for a little while, but, like, Is this the website or the app? And she's like, this is the app. And I was just thinking, yeah, this is an aspect that web is going to be behind it. Right? Companies are gonna say, I wanna be able to see my artwork on the wall. No. You can't do that on the app because I don't have the skills to do augmented reality. Now I don't know what the status of this is in current Land, I've done a little bit of 3 d, but no augmented reality.

Topic 21 36:17

AI gets easier

Scott Tolinski

So I'm interested in checking out more about these APIs. I think augmented reality is going to be something that the native app makers are going to be running wild with while we're still held back just a little bit, but I think we need to push it. I'm gonna kinda tell on that with augmented reality

Announcer

becoming easier for us, just regular web devs. I think that somehow, I don't know how, But AI will also become a little bit easier because I was thinking the other day, like, you know, when you search on a website and you misspell it, but it still finds what you meant? Yeah. I was just sitting there thinking like, damn, that sucks that we can't just do that in the web. Yeah. You know? Like, we you have to, like, go get Algolia or or some sort of set up some sorta Docker container that will learn from you. And I'm like, is there not some sort of, like, smart like, some browser based thing or, like, some way to do that just in regular where it's not a huge undertaking.

Announcer

I don't know. But I think AI is getting huge in every industry just Like like, you've you've seen the noise cancellation AI.

Announcer

Have you seen that?

Scott Tolinski

Yeah. I have. Yeah. The what's it called? It has a name.

Scott Tolinski

Voice, it's called voice. Any of that stuff for me, I think, is poised to at least grow in in some sort of capacity because I say this as somebody who really wants it to happen, but then I'm I'm thinking about it. And how many websites in 2020 still have really terrible search? I can think of a lot. Yeah. There's, like, a lot of things where I'll search. Oh, like, even, like, what is it, Giphy? Like, Giphy, you Search a 2 word thing, and it only searches for the 1st or the 2nd word? Like, you can't search those as a phrase? Come on.

Announcer

That's a good point. So it might be a little bit optimistic on our part. Yeah. Maybe this is just our wish list. Yeah. Right? Do you have any, predictions for Next. Js? Gonna happen with that in in 2021?

Scott Tolinski

I have no predictions for Next. Js. I think whatever the React team is doing around server side rendering, if They are in fact doing something around server side rendering. I think that will will dictate. That will be what we get. Yeah, that's true. I think the image Component that they release will probably get a lot better. But past that, I still want them to do some sort of CMS, but I don't think they'll ever do that word. But, no, I don't have anything on on, Next. Js specifically. No. I have 1 on Versus Code. This goal's gonna continue its dominance. Rid Versus Code will continue its market share dominance. It is going to continue crushing foes as it invests in cloud shared code environment so that people can start coding easier on their iPads or their Phones, whoever would wanna do that.

Topic 22 38:18

Next.js predictions

Scott Tolinski

What was there's a demo of some app that I just saw the other day. It was like a decentralized repository for your code, And it used this really neat thing where people were able to do sort of like a multiplayer mode in their code. And I was just thinking, multiplayer mode in code, kind of like it is in Figma, rid is gonna happen. Yeah. We're gonna be able to pair code, just like you said, with, like, remote work things being easy. We're gonna be able to pair code rid We're all typing on the same files and saving, and then we're getting, you know, 0.05

Announcer

millisecond hot reloading onto our ESM bundles and shipping it. It's gonna be cool. Yeah. Codespaces is what Versus Code is already working on. GitHub Codespaces where what will be the day where we don't even have Versus code has an icon on our dock, but you just visit the URL.

Topic 23 39:52

VS Code growth

Announcer

That will be, an interesting day. It's coming for sure. It's funny. Versus code I I was just thinking I was like, isn't it funny how Versus code just tricked us into using an IDE?

Scott Tolinski

Just IDE light for a little bit, and then they're like, well, we'll just sprinkle a little bit more. Then next thing you know, you're using WebStorm with themes. Little bit of types, Jake. Yeah.

Announcer

It's true. So good on you, good on you, Versus Code. Yeah.

Announcer

What else do we have here? Just some CSS Predictions.

Announcer

I predict color functions, we will get. I think people will use more built in features. Like, I posted a screenshot the other day where I refactored Style components, like theme props and, like, using a theme provider in style components. I just refactored that just using CSS variables. Rid. Yeah. And a lot of people were like, oh, you're not using that anymore? I'm like, no way. CSS variables are they're native.

Announcer

They just work. Rid. It's a okay syntax with the dashes. I'm I'm used to it now. So big fan of that. And, like, that's the idea is that eventually, you Stop using a lot of these transpilers and you just get

Scott Tolinski

CSS. Like, one day, maybe you'll even get scope CSS. And, honestly, rid. CSS variables to me are just endlessly better in every capacity than a theme function or whatever installed components Or even suffer rounding.

Announcer

Except for rounding. Did you see that? No.

Scott Tolinski

Rounding corn?

Topic 24 41:12

CSS rounding

Announcer

No. Somebody on Stack Overflow asked, like, how do you round a value with CSS? And they they have this, like, insane calc function Of like yeah. But, like, why would you ever want a round, I guess, if you wanted to, like I couldn't think of a reason why I wanted a round, but I thought it was hilarious. I'll try to Look it up. Yeah. Please do. My prediction was that people are going to use and love CSS variables

Scott Tolinski

because let me tell you, man, I have a course on CSS variables for those of you out there. Modern CSS design systems where we create design systems with CSS variables.

Scott Tolinski

And if we had, like, a which we don't. If we had some sort of way to gauge the feedback that we've gotten on every single course, that is by far my most appreciated course this year.

Scott Tolinski

People really are blown away by what you can do with CSS variables.

Scott Tolinski

And I'm I'm considering making a second part to it because there's a lot more you can do. For instance, we started, re detaching our colors to be HSL a and then storing different parts of the variables rid. As, like, I have a hue and saturation variable and then a lightness variable. So that way, we can do our own pseudo color functions by rid Plusing a percentage amount to a function, in the in calc, and it works really nicely. The whole system is just amazing. Rid. I have so many thoughts on CSS variables. I'll I'll save them for later, but I really love them. I think people are gonna continue to tell to love them, and, man, they are just very, very nice to work with.

Announcer

What about serverless? Any predictions there? Serverless

Topic 25 42:40

Serverless growth

Scott Tolinski

will continue to grow and evolve And become easier and easier. Local development with serverless will get easier. The amount of platforms that make you have to think about Lambda functions, Less. The amount of, like, just, you know, the ease of use that we've seen already with serverless, like, not having to think about it. Like, I think most front end developers don't even wanna think about it at all. They just wanna have it be served to the most people as fast as possible And then be able to scale. And I I think that's what we'll see. Did you see the other day? I just saw this today. Was Netlify

Announcer

rolled out a plug in That allows you to run Next. Js on Netlify and not not just like Next. Js static version, but, like, server rendered, and rid And it runs in all entirely in in serverless functions, which is besides the serverless framework, That's the 1st time I've ever seen the ability to run Next. Js as serverless functions instead of just a regular node app when you're outside of Vercel.

Scott Tolinski

Hot. Hot. Hot. Hot. What else do we got here? We have time for our 3rd sponsor of the day, which is a new sponsor. And this is, a new sponsor, but not a new company by any means because I'm talking about Linode, and Linode has been doing the the dang thing for a long time. Do people still say ring. Thing in in 2021.

Sponsor break

Scott Tolinski

Is that a thing? Oh, yeah. Linode is, just one of these cloud hosting providers that has re Been really innovating for a very long time. So whether you're working on a personal project or managing enterprise infrastructure, you deserve a simple, Affordable and accessible cloud computing solution that allows you to take your project to the next level. They are talking my language right there. Simplify your cloud infrastructure with Linode's Linux virtual machines and develop, deploy, and scale your modern applications faster and easier.

Scott Tolinski

So today, you can get started with Linode with a $100 free credit, which, we all know in the VPS rid will get you a very long ways because virtual private servers, especially, companies like Linode, are cheap. So $100 in credit It's going to get you a lot of stuff. So you're gonna wanna head on over to linode.comforward/ syntax. That's l I rid. Node.comforward/ syntax.

Scott Tolinski

Linode has 11 global data centers and provides 247, 360 human support with no tiers or handoffs regardless of the plan size. In addition to shared and dedicated compute instances, you can Use your $100 credit on an s three compatible object storage managed Kubernetes or more. So check it out. Rid. Linode.comforward/ syntax. Click on the create free account button to get started. Thank you for Linode for sponsoring.

Announcer

Next one I have here is Enterprise Jamstack.

Announcer

Rid This is a little bit tongue in cheek, but I think that Jamstack will become becoming more and more popular.

Topic 27 45:34

Enterprise Jamstack

Announcer

I saw the other day that rid Cloudflare is rolling out, like, static hosting in the whole, like, build process online, which is rid Pretty nifty. So I think, like, the big players are now taking note of Jamstack.

Announcer

It's sort of outside of our whole, like, People that listen to this podcast.

Announcer

And now I think that it is a is a a much bigger thing, and we're seeing a lot of people, see the benefits, especially with tools like Next, Gatsby, Sapper, whatever, Svelte SvelteKit.

Announcer

It's pretty exciting to see both serverless and rid. Statically rendered or statically refreshed pages would be so easy to build. Word. I think that is it For our predictions, I think we'll come back to you later in the year to see how we did on these predictions just like we didn't, unless you have any others you'd like to touch on. I just asked on Twitter. Couple of people said progressive web apps are finally a thing. They are a thing. Maybe Apple will finally yeah. They are, but rid Apple always cripples them. That's the frustrating thing about everybody using an iPhone. So maybe progressive web apps will be, an even bigger thing. What do you think is gonna happen

Scott Tolinski

Do you think that electron based, which has already happened, but electron like apps and Native apps that are written in web tech will be more popular than PWAs, or do you think PWAs will ever be more popular Then web apps that have been bundled in to be a native platform because I just don't know if I see without

Topic 28 46:50

Web apps vs PWAs

Announcer

companies like Apple, like, adding PWAs to the App Store, I don't see that, like, ever taking off. Yeah. That's that's a good question because you can take like, we talked to the miss of folks and their app. I was rid Surprised to hear that it was JavaScript, HTML, CSS. So, like, you can do that now. And it seems like every month now, I hear about a new app that people go, woah. This is rid. This is actually a not necessarily React Native app, but, like, this is just JavaScript running inside of some sort of shell.

Announcer

So I probably will see that. I don't think Apple will ever want, you to go around the App Store because that's how they make a lot of their money. But as long as as long as we can still just build our apps in

Scott Tolinski

HTML CSS and those things get better and faster And consume less memory and less resources, things like that. I think that's probably where where we'll see it. Word. Cool. So let's get into Sick Picks, the of the show where we pick things that are sick. Let me tell you, Wes, my cup has been overflowing with sick picks. I I cannot keep rid of them all. I I have too many, so I've been having to write them down in, like, 8 different places, so much so to the point where it's, like, getting a little absurd. Let me pick 1 that is going to be really nice for those of you who are ready. Looking for something fun to watch. Nobody likes to talk about how, everybody's all stressed out right now because of the current situation. So rid Courtney and I have been, like, only watching funny things or fun things because anything else is just too intense. So we've been watching rid. Head Lasso on Apple TV, and, man, that is a delightful show. Wow. It stars Jason Sudeikis, And it's about he's a football like, a college football coach who gets hired to be the coach of a Premier League team, And he he has to go to England and and sort of manage the fact that everybody hates him and all sorts of great things, but he's like this unbridled rid Positivity in his way of doing things is just totally infectious, and we were completely hooked after rid. Completely hooked after 1 show and then just, like, binged it after 2. And then by the time that we ran out episodes, we were just very sad that it was done. But they've been signed on for 2 more seasons. It is very, very good.

Announcer

Oh, I'll have to check that out. I'm gonna sick pick something that you sick Picked, I think, or mentioned a couple, a couple weeks ago, a couple of months ago. Oh. And it's this newer dimmable ready. 480 LED.

Topic 29 49:25

Show picks

Announcer

So, like, I went down the rabbit hole of of lighting, and, I almost got the re KeyLite. And you're like, no. Don't there's better ones out there. Those are, like, rebranded,

Scott Tolinski

like, you know I I mean, it's marked up, definitely marked up even though it is cheap.

Announcer

And I couldn't, like, find, like, whatever the equivalent was just because of of how they make it.

Announcer

And somebody on Twitter said, like, Alex Sexton, I'll thanks so much for this. He said, you don't have to, like, light your face directly. Just bounce it off a wall. And And I was like, oh, that's a great idea. And I was like, okay. I need, like, a super, super bright LED. And I I bought a couple of them and returned them. And then, finally, I was like, Scott, what's the one you have again? And he sent it over, and, like, that was it. Because it's it's got a dial for, rid. Like, the warm LEDs as well as a dial for, like, the cold bright light, and you can mix it just perfectly. Because that's always a problem I had is that, like, sometimes they come out, like, very pale rid. Or to red.

Announcer

And this allows me to to to dial that in. And this thing is awesome. It's just like the sun. And I can just I could bounce it off rid Off my wall, and my video got so much better from it. And Scott's had this thing for for years now, and it's great. I love it. So it's the re Newer dimmable bi color LED. They have 480 ones as the sun. They have one with 660 LEDs, which

Scott Tolinski

I imagine is like Tucson's. Yeah. It's probably actually starting nuclear fission in your office.

Announcer

Yeah. So big fan of it. We need to do a show on our setups now that I think I'm pretty pretty happy with my, audio video setup right now, specifically video. I've had my audio dialed in for years now, but I'm pretty happy with my video now. Yeah. I have recently

Scott Tolinski

Rearranged my entire office. You you can tell, Wes, because you're now seeing my whole bat my whole set that I created is Smaller and a little bit shifted in the wrong direction Oh, yeah. By that, so I'm gonna have to shift my set to match. And my my setup is really dialed in. People were always really getting on me about my exposed cables, and my cables are tidy.

Announcer

Tidy as a t right now. The cable the cable shamers. Cable shamers. Let me just say, Cables are beautiful, and you should never shame somebody for having to plug in their computer.

Scott Tolinski

Yeah. I got one of those little, like, racks. I just screwed it in, and I just rid. Shoved all my cables under there. So guess what? You cable people, like, those cables, they're still there. They're just all shoved into a rack so you can't see, and I hope you think about that. So that's awesome. I'm glad you like the light. These these things are fantastically small and just thin and just amazing. So Way smaller than I thought. Tiny. Yeah. It's like maybe, what, like, maybe 8 inches by 8 inches? It's maybe a foot by a foot. Looking at my foot And then looking at the light. I actually might have the bigger one, but I'm not sure which one I have. Either way, mine's a foot. Yeah. Because we footage by a foot ish. When you showed me a photo of yours, it looked ridded.

Scott Tolinski

Yeah. It's potentially.

Announcer

It's awesome. So, yeah, check it out. Check it out. I'm I'm excited to do a show on video now. Yeah. So, okay, shameless plugs, level up tutorials

Scott Tolinski

.com.

Scott Tolinski

We have just new courses out 247 here. Rid. The latest course at the time of recording this v or this podcast, which is months ahead, is Deno 101 for web developers. And let me tell you, This course is for those of you who hear the words Deno and maybe don't understand why you would ever want to use it or where it fits in or how to even get started.

Scott Tolinski

We we talk all about writing your 1st line of Deno code to exactly what the heck the permission model is doing, how we can import and load things, what the Standard best practices are in how to get started writing your own web server that serves static as well as APIs.

Announcer

Alright. I'll sec pick Or shamelessly plug all of my courses at westboss.comforward/courses.

Announcer

Got a list of all of my courses, And, you can use the coupon code syntax for $10 off.

Announcer

That.

Announcer

Alright. That's it. Thank you So much for tuning in, and, we will catch you on Monday. Catch you on the Flippy.

Scott Tolinski

Peace.

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 if you like this show.

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