GitHub Next Projects

Monday. Monday. Monday.

Open wide dev fans, get ready to stuff your face with JavaScript, CSS, node modules, barbecue tips, get workflows, breakdancing, soft skill, web development, the hastiest, the craziest, the tastiest web development treats coming again hot. Here is Wes Barracuda Boss and Scott El Toro Loco Tolinski.

Welcome to Syntax.

On this Monday, hasty treat, we're gonna be talking about some of the cool New things announced. And on the road map from GitHub, there was a big GitHub, yearly conference it. It's sort of like a a big showcase where they show off all the cool stuff. And we all know GitHub is constantly working on cool stuff, And so this year's was had no shortage of really neat announcements, so we're gonna be talking about a lot of the stuff going on in there and what it means for you as a developer.

Hey, everybody. There's some really neat stuff here.

Somebody sent me a link to this. And at first, I thought, like, Is this a real website? Because it's on like its own domain name. But, obviously it is real stuff, and there's some stuff that we've been talking about How we would love for this to happen.

So I'm pretty excited about all these new projects. We're just gonna kinda go through them and talk about what we think about them and explain what they are.

The GitHub is going to be much more than a git repo in the coming years.

Yeah. Hey. I just saw something hot off the presses and unrelated to today's topic, which is always great for us, but something in relation to one of our recent episodes.

So recently, we did our episode on the techniques for responsive web design.

When was that? That was episode number 540.

So we did a 540.

Now we're we're doing a 540, and we're adding just a 4 more degrees of rotation in there.

And here we are, or 5 more degrees, and container queries have been enabled in Firefox nightly.

We were just saying, when is Firefox gonna get on board with container queries? And here is a closed issue on Bugzilla Where container queries have now been enabled on nightly.

So this is totally unrelated to the topic, but, man, that is That that is great news for me today. I'm super excited about that. I would love to be able to say now is the time to, start really getting Hard into container queries, and Firefox was that last missing piece.

So sorry for the detour, Wes. No. I'm I'm into that. I'm just reading the Reading the Bugzilla thread here, it says there's only 1 worrying time out.

It isn't a hard thing to hang on.

So it looks like the container curves is, like, almost ready for prime time. I think so. And we we saw that once they're in Firefox, it's go go go. Let's go green. Yeah. Look. I'm in. Let's go.

Let's go.

What's what's the deal with everybody saying let's go recently? I think that's like I think you're, like, maybe a 2 years.

Somebody literally just tweeted, and in response to that tweet, let's go.

It. Let's put on an urban dictionary.

That's just but no. It's it's definitely like a gamer thing or like a YouTuber thing. It definitely there's, like, several YouTubers who'd be, like, just just making that their thing, and then it it, You know,

kept going and going and going. Urban dictionary says, let's go. Things cringey 8 Earl Fortnite players say when they win a game. Exactly. Yeah. That's it's definitely out of, like, gamer YouTube. It is 2 years old. You're right. Yeah.

Oh, yeah. I've been hearing it for a lot longer than that. Absolutely. Me too. But, like, You start hearing it

like, I'm hearing it IRL now. You know? Yeah. I heard it a lot in,

Believe it or not, like video and lighting YouTube, they'd be like, this camera is a one. Let's go.

It's like

It's just the next gen version of the same camera everybody else had the year before.

Yeah. I always thought that was funny. I can't wait until my kids are my kids are almost old enough Now where you can start saying stuff like that. Oh, yeah. Like, my To, like, comparison? My old no. Even just my oldest daughter starting to, starting she called somebody a noob the other day, and I was like Oh, yeah. Yes. Like, it's it's starting. It's starting. Like it. And she's you could tell that she's watching some YouTube videos because of the things she says.

And both of my kids I came into my office the other day, and they said, what's that? I'm like, the pointing at the YouTube, 100,000 subscriber button.

And I sent us my my YouTube play button. They said, you have a YouTube play button? And I said, yeah. Like don't. Yeah. And and they're so that they understand what it is. And they said, you have a YouTube channel? And I was like, yeah. They're like, you're you're famous.

What?

Yeah. My kids, they have no idea. My My kids love YouTube, but they think all YouTube is is just YouTube kids where there's other kids playing with toys or blippy. Yeah. So When I I'm, like, trying to tell them what dad does, and it's like, yeah, but it's it's not that it's not the kind of thing. I'm not, like, in my office playing with toys, So it's it's not that fun.

Oh, alright. We are sponsored by 2 awesome companies today. First1 is Linode.

Linode is a cloud computing that developers trust. They provide, hosted Linux servers for pretty much anything. You need high CPU, high memory, high availability scaling. They do all of that stuff. So if you've got a project that you need to throw up on a Linux server, it. Linode is for you, and they're gonna give you $100 in free credit at linode.comforward/syntax.

Thank you, Linode, for sponsoring. It. This episode is also sponsored by LogRocket, which is a great place to really understand how your website is being used. It. Now they really came out of the gate with their session replay tool for finding bugs, but their session replay tool is not just for finding bugs because that would be, That would be excellent, but LogRocket is beyond excellent. They are out of this world.

And with Log You get access to more than just a session replay for finding bugs, but you can surface issues faster, optimize your conversion, and increase adoption it. By truly understanding where your users are clicking, what they're getting hung up on, and what they are trying to do, and you can do all of this in a very a visual way. You know me, I'm a visual person, so this really, rings well in my brain and works all the tools you know and love, any kind of front context that you're working with, but not only that. It also works with things like iOS apps of React Native, Expo, Android. It works really well with all that stuff too, And it integrates with all of the tools you know and love, whether that is your error reporting software, your customer support software, where your AB testing software analytics observability and your voice of consumer software as well. So if you want to try all of that and more, head on over to log rocketdot com forward slash syntax, and you'll get 14 days for free. Thank you so much to LogRocket for sponsoring.

Alright. GitHub. GitHub, there they have a a a neat little URL here called GitHub next .com, and GitHub next dot s com is showing you kind of all of their interesting product projects that are either in the pipeline, coming out, or have been released with a date attached to them. And not only that. One of the coolest darn things that this thing does is it has a little interface, and it shows you who made it. So which of the The members of the GitHub team are actually working on these tools.

I gotta love that because it's not like, some faceless Corporation being like, here, buy our stuff. It's like, here are the actual folks. Here are the actual developers making the tools for developers That's going to improve your life and your workflow.

And I I gotta say well done on that regard because that's really cool. Yeah. There are some pretty Neat projects here. I don't even think we'll go into to all of them, but, let's let's pick a couple that we're pretty excited about. I think the most the one that I'm most excited about is GitHub copilot for the CLI. And this is something we talked to Jared from BUN about, is I want GitHub Copilot to figure out what I'm gonna finish typing, in in my CLI. Maybe the stakes are a little higher when you're deleting something, but There is a, I think, a whole world that could could be done there. And the fact that I was like, maybe Warp is gonna do it. You know, like, I'm not sure who's who's gonna maybe Fig will do it, but it looks like GitHub Copilot is going to be doing it. So I am put myself on the wait list for that one. And maybe 1 of you out here is listening

could, you know, be inspired by this to say, hey. Maybe I should try using this, see if I can get on the the wait list here and give this thing a try to make something really neat. You know what I would really like, Wes, would be a, GitHub Copilot for recipes. It. You just start typing a recipe and then it finishes it for you. That'd be sweet.

You know what? One use of GitHub Copilot that That I've been using like crazy now that I'm recording my TypeScript course is I'm using it to just generate data. It. So you can say, a little comment, an array of I I did this. I said, an array of web development podcasts with their hosts and their ratings.

Tap. And then you have to open you have to open up the GitHub Copilot UI because otherwise, it just gives you line by line. Yeah. But it gave me an entire array, including syntax being the best one, which is correct.

And it's unreal. And then I did, like, I did, like, a really complicated one where I said a list of products With their ratings, with a nested list of comments inside of that, and it literally figured it out.

It it did it. It was amazing. And I was like, this is key for doing you want I don't you did a bunch of dummy data.

All the time. And you want it to be, like, somewhat relevant or somewhat interesting because you're staring at this dummy data all day while you're doing your thing. So, Yeah. You don't want it to be a FUBAR BAZ.

Exactly. Exactly. We we get access to whatever.

Do you should have you should have done, Most handsome podcast host sorted by most handsomest, and then

wait. Can we should we do that? One second. Hold on. I gotta touch your file open right now.

A list of most handsome web developers.

Const most handsome web developers is equal to. K. So I'm gonna open GitHub Copilot.

Synthesizing solutions.

Oh, my gosh.

You're you're not gonna You're not gonna believe this, Scott. I actually don't believe it just because of how you're already presenting this.

So it says, handsome web devs equals number 1, Wes Bos. Yep. I appreciate it. 35. Is that true? How old am I? Yeah. How old are you? I'm I'm born in 88.

I thought I was 34.

Yeah. I'm 36.

It says you're 35. So Okay. Pete Hunt coming in at number 3. Ryan Florence, number 4, Michael Jackson, number 5, Kenzie Dodds, number 6. Wow. Interesting.

Very interesting.

Well, yeah. That's fun. Copilot CLI, I gotta say I'm excited for this. I, you know, I I have not used The synthesizing results, can you maybe, for those of you out here who are like me, who have not used that, can you talk just a a quick second about that? So if when you're using GitHub Copilot,

it gives you line by line. But if you want a larger thing, you maybe you want a bit an entire, I guess it doesn't give you line by line. Sometimes it'll give you a whole function.

But if you want a lot of a lot of data, you basically Type your comment or whatever it is that you want, and then you open up your command palette and just say open GitHub Copilot, it. And it will show you the 10 solutions that it it thinks to thinks to give to you. Based off of your comment? Based on your comment. And it doesn't change so that if you if you keep typing something, it's not gonna change it. So it's kind of a way to just Preview what the possible options are.

Yeah. That seems like way better to me than, the just, You know, having it pop up in as a comment

completion kind of thing in your UI. It's it it depends on, like like, what you're doing. I think, I I think if you're just doing a couple lines here and there, bam, bam, bam, that that's what I want. But if you wanna be able to maybe review what it's going to give you, that is Probably a better approach. Oh, here's another list of handsome web devs.

Wes Bos, Chris Corriere, David Walsh, Sean Larkin, Ryan Florence, Eddie Asmani, Jake Archibald, Paul Irish, Eric. Snubbed in this one. Brendan Eich.

Yes. I'm sorry to say you're not on this one. Brendan, I coming in at number 25 kind of kind of I would have put them higher, honestly. Can we get My mom's list of the most handsome web devs.

Okay. Let's talk about the next one here, Which, I'm gonna start at the the actually, the first one on their list that's the most recent, which is, hey, GitHub, which sounds like, You know, hey, Siri or anything like that. But this is write code without the keyboard, which is it's really relevant for us because we've had a a couple folks on it. Talking about repetitive stress injuries in voice coding.

So this is GitHub's kind of own Copilot based voice a coding solution.

Use your voice to code without spelling things out by talking to GitHub Copilot. So you're not having to be, like, Open brackets, close bracket, you know, making clicks and pops and stuff. You're able to talk to GitHub Copilot, And their examples are really interesting. Get Titanic CSV data from the web and assign it to variable Titanic data. It. Clean records from Titanic data where age is null. Fill null values from column like, this is cool.

I like, this is how I think in my brain, and then I have to go in and then write the comment and then then type it out myself to say filter out All of these things from this array, even though I've written that same filter code a 100 times and I know how to write it, this is gonna give you the option to talk to GitHub.

And as long as you know kind of the way GitHub Copilot wants to hear these things, it's going to return back code. And I gotta say, I'm really impressed by this. You know, this actually would be a really great use case for our our last guest. Kenneth had one of those, like, gamer headset mics with a mouthpiece in front of it. That would be, like, a really nice thing to have on and just talk or even, I guess, AirPods too if you got them in your ears.

Yeah. Nice close microphone up to your mouth, and you just talk to

a Copilot. Wow. This is really pretty neat. Yeah. Honestly, I CS. I bet that this is there all the examples that they have are just adding code. So at what point, like, how do you edit code with that? You know? Like, how do you Sure. Yeah. Right. Change something? Because remember we had What was his name? We had him on. We talked about it. He's like, go back to he basically had little stoplights over every single syntax, every bracket, every a word, and then you could just jump around to there. But I bet if we're gonna eventually get to some sort of accessible

Voice to code? I bet that it has to include some sort of AI in there. Yep. Totally. Seems like it might be it. There was a episode number 400 and eighty one, a voice coding with Pokey Rule, which I believe oh, no. It wasn't our 1st separate club. That was, like, pretty early on in our separate club. Yeah. So that was the the really cool, episode if you wanna hear what the, like, really awesome intense world of voice coding is like. Yeah. It does. It I wonder, like, how much of this is, like, 1, interpreting your text as comments and then using those comments it. To then generate the code. But, 2, I wonder also how much of it has to be context aware of what you're doing already, What exists on the current page? And like you said, what is that editing experience like? Or is this just generating code with your voice? Either way, Pretty darn cool development. Yeah.

Next one we have here is GitHub Blocks.

This is Kinda cool because it's going to allow you to, add custom interactive blocks into GitHub. So you think, like, Probably the simplest example is you have a read me, and you want to be able to put some sort of interactive table or chart or, even, like, even if you had, like, a color picker and you wanted to be able to show how it works or or show someone how to generate something, being able to, Embed interactive stuff into your actual, your read me or into a, like, a build. Maybe if someone were to, you you have a bot that runs a build on a pull request, and you have some, information that needs to be outputted. Right? This is really cool because you'd be able to to do that type of stuff with it.

Scott, you said you've been actually had access to this before it was even announced?

Yeah. Yeah. As a GitHub Star West, I get access to all this stuff really pretty early.

They let you, Preview it. They they give you a little presentation on it, or they have, chat rooms where you can go in and and, you know, ask questions about it and stuff.

And and I remember being presented as kind of like a big deal.

But at the time, I didn't necessarily get it as much as I get it today. It. We're like even just the tagline here, Readmes don't have to be static.

That right there should be the selling Point here. We we all create Readmes that are this or that. But, again, Readmes aren't static, and what we end up doing is we end up creating, Not that this is a tool for isolation development, but we end up doing storybooks to document or really deeply interactive examples to document our components. And we live in this world where you're just creating little widgets and components. And, now we can create rich and interactive repositories it directly in our code base without having to spin up an entirely second website just to show that kind of stuff off, and I think that's

Really pretty neat. You know, one thing that GitHub rolled out recently that's not on this list is the new GitHub code search. I was like a beta tester for it for 6 or 7 months, and I was using it like crazy.

And now they've they've rolled it out. I think they might even have some some more stuff coming down the pipe. But Being able to search all of GitHub in super fine grain control is amazing. I use all the time. If I'm like, I Don't know how to use this API, or I wanna know how are other people using this specific method.

I can do that. Or somebody tweeted the other day, Does anyone have an example of, a GitHub repo that uses that's built in JavaScript and uses 4 tabs I'm sorry. No. It uses 4 spaces as a as a tab.

And I was just like all I did was just go on GitHub and say type JavaScript, file editor config.

And then I searched for, the config that would show that, and I just Replied immediately and they're like, how did you know that? It's like just GitHub code search is a superpower to be able to To get those things up and running. Yeah.

What a a just a tremendous platform. And if you remember when Microsoft bought GitHub and So many people were freaking out about it, and now here we are with what is very clearly the best GitHub that we've ever had. Yeah. The best GitHub features, and it doesn't Really seem to be slowing down at all. Holy cow. Even I I also think a really cool use case for GitHub,

code search soon will be how many people are using container queries, you know? And you could be able to maybe chart the the How many container queries are going up? Or what's the most common container query size? Or how are people using like, those those kind of, like, Basically, data science on top of how are people coding. Google had a a code search years ago, and they shut it down. And there there has never been anything other than the, the web archive every year

For us to, like, dig into and learn these things ourselves. You know what it sounds like to me, Wes? It sounds like some really great potential syntax Exploration episodes where we, dive into some fun fun stuff. I'm I'm totally in. That sounds a great time. It. We had so much fun talking about the web almanac stuff. I feel like I could just

really love it. We haven't even dipped into the JavaScript script stuff. Yeah, we'd still have a lot for it. I enjoyed those very much. Yeah. By the time we finish the 2022 Web Almanac, it's going to be the 20, 20 3 one.

Alright. Next step that we had here is the, collaborative workspaces, which is a really interesting concept. They describe it as, I love this. They have, like, the stages for each of these, like, where they're at works in progress, they're released, whatever. This is described as a napkin sketch, not just like an exploratory. It's a napkin Sketchwitch. We all have done napkin sketches. They're some of the best times you ever think about something. It's one of the reasons why I keep a piece of paper or a digital piece of paper handy at all times Just for when you wanna start writing stuff down.

And this is really super cool. I would imagine this video that they have here of showing this working is Probably, it's probably just faked, but I who knows with them, you know right above it using Visual

Studios live share extension.

Yeah. But I'm wondering if, like, how how much of the features they're showing off in general, our, like, actual features are clear, like, what they imagine them to be like. Either way, it has, like, a column that says session details, participants, shared servers, shared terminals, con contact. So you have all the people. If they're available, they have, like if they're Break or if they're green, if they're there, red, or they're on do not disturb. It has little multiplayer tabs to show who's typing where.

It shows, it's it's really fun because it's talking about, like, how do web developers work in the same team, the same code base, the same project, and they have a nice little diagram, How people are working so good. In in their cert yeah. All of these little websites are so good. They gotta have a besides having a team to develop these features, they have somebody or some team out there that is making these little little exploration websites look so good.

What's going on with that? It's just Incredible. Between this and some of the other tools that we've seen in in this episode, man, Being able to collaborate on a codebase in about a year or 2 is going to look very different than it looks right now regardless if you're using this or whatever,

And that to me is exciting. Next one we have here is GitHub Copilot for your own code base. This one's kinda interesting is they want to be able to give Copilot suggestions that are in line with the idioms and the Formatting and everything that you use with your own code base.

How they do this will be very interesting, because people do not trust AI, scanning your your own code base. So I'm very curious to see, what How will they oh, they have a whole paragraph here is the, in the machine learning literature, the key concept is a retriever. A precompile index that allows Quickly look up data items, etcetera, etcetera. So they will probably have to run it entirely on Your computer? We'll see how they do that.

There's there's, like, the technical, and then there's the people are gonna freak out and not actually read. Mhmm.

Read that is like they're stealing your code like this 100% for sure is going to happen. People are going to lose it.

So they have some certainly

it. Some work cut out for themselves. They should, you know, to to get people to trust it a little bit more, Wes. And this is a free tip for you, GitHub, if you wanna use some of my star power here.

It. Instead of calling it a retriever, they should call it a golden retriever because everybody loves golden retrievers.

They do. True. They're very trustworthy.

Golden retriever. Yeah. Yeah. Who doesn't like a golden retriever? Alright. Next question is or next question.

Next one of these things is from the GitHub GitHub Copilot Radar, and this is basically, like, navigating your code. And they say it's jump to definition on steroids, which To me personally, sounds really great. You know? Just being able to get where you want to get Is it always slow, but it's not always it's not always super fast. And and even now with, like, Versus Code, when you click through the function, Sometimes it just takes you right to the TS types instead of the actual function.

And other times, you're doing a, you know, command t. You're looking for symbols. You're looking for files. You've gotta figure out, based on, like, context, where you are and what you're actually trying to get to. And sometimes you have things named the same things. So this thing says it combines static analysis with Copilot's AI.

So, it knows what you're talking about in any given file. And if and then you go to look Or something else in relation to that file, it's going to present you with, more relevant it. Options and better options even when it's not necessarily as explicit as it is. So it's it's basically taking that that idea of your text editor knowing where you are and where you want to go and putting into, it's with some AI to help you get there in a more Meaningful way. Pretty much all of this is just add AI and machine learning.

Yeah. Hey, you like your thing? We put an AI in it, and now it's even better. Yeah. This is something that's been around for a while. It's the GitHub Copilot Labs,

where you give it a hunk of code, and it will try to Spit out a, human readable explanation of that. And in in my experience, it's always been fantastic.

You could just basically you could take a huge, loop, which with regexes inside of it and and incrementing and all that stuff, and it will convert it to text.

I don't think that's this is never like, I used it a couple times, and that's really cool. But, like, I've never gone back to it it. To actually solve any problems other than to just, like, make people smile, and and it's a cool demo, because I don't know. I hate being the guy being like, oh, your code should be readable, but between comments and readable code, Not I don't think I've had to knee I've needed this. What do you think? I have not had the need for this,

but I also you know, I I think it's I think it's a worthwhile thing to have. I think it's worthwhile that exists, and maybe there's a time where I'm gonna be like, oh, yeah. That'd be That'd be great to have this, but, no, I've never really had a situation where this is, really made a ton of sense for me. That said, I Yep. It does seem like an important step if you can imagine using AI to get code from natural language to get natural language back Or code to back in the natural language. Right? It does seem kinda seem like a back and forth, like a you get it for free. Maybe if I was in, like, Ruby

or Rust or or something that I didn't understand

as well. Yeah. What was happening because I don't know if you need a learning tool.

Yeah. Yeah, that's true. You get You get a a code example. You highlight. You say, what's this do? Remember? What was that our our, One of our syntax live games that we did was, like, here's some old syntax. Like, what does this do? You could give it Yeah. Some old syntax and be like, what does this do? That that'd be very fun. Oh, that that's their next product is the GitHub,

whiteboarding AI, Where you upload 3 hours of your face, and it will, do the interview for you, and it will us. Craft a video of you talking to the interview and get you a seven

seven figure job at phys Yeah. I thought you're being honest at that point, and then I was like, oh. And then when you said, like, the 3 hour video, I was like, oh, no. Okay. That's not Real. We'll do one last 1, and this one will be essentially what we've been saying for the AI for pull requests where you're just dumping AI into any of the given things. Here's the thing everybody uses on GitHub, pull requests.

So let's dump some AI into it and make it even better.

This is kind of neat. Right? So you you often get Pull request. We have to do code reviews. You have to paw through. You have to look at issues.

And this says it's helping you review pull requests to the AI, a See how it makes actionable suggestions for improvements you can just click to accept. Okay. Sure. It's like it. Instant AI driven code review.

That seems really great, especially for, you know, you work in big teams, and many times, there's People submitting things that don't fit, maybe code styles or using a variable that, already a function that already exists somewhere else or remaking something, and maybe this is going to step in in there and say, hey.

If you consider doing this or perhaps You'll want to do this instead.

Who knows how this ends up looking? It's a work in progress still at that stage. But, again, a lot of this is just Using AI, and they're already given their Copilot, which, you know, in all honesty, functions very well, except for that one time it didn't put me at the top of the hands of these developers.

And, you gotta say I gotta say it works. It's it's gonna be an exciting world when some of the start stuff to hit the, early previews that you can actually use.

That's great. I think we should have try to find out who from GitHub we can have on a podcast to talk about All of this Copilot stuff because well, look at who is,

look just look at who's in just about every single one of these Copilot related Thanks, Matt. Matt Rothenberg.

Matt Rothenberg. If you know Matt Matt or Matt, if you're listening, hit us up. We'll hit up you and see if we can, Get you on the show. Yeah, there's got to

be got to be somebody listening. Or if not, we will, we'll try to dig them out.

So this is some cool stuff. Future cool stuff. We gotta love it. That's one of my favorite things we do here. We dive into future cool stuff. Maybe we should just rename the podcast The Cool Stuff podcast. I would like it that, actually. That's pretty cool. That's cool stuff.

I could do that. Alright. I think that's it for today. Thanks, everybody, for tuning in.

We will catch you on Wednesday.

Peace.

Head on over to syntax s.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.