Speech Commands and Speech Recognition in React featuring Chris Laughlin - RRU 261 - podcast episode cover

Speech Commands and Speech Recognition in React featuring Chris Laughlin - RRU 261

Jun 12, 202446 min
--:--
--:--
Download Metacast podcast app
Listen to this episode in Metacast mobile app
Don't just listen to podcasts. Learn from them with transcripts, summaries, and chapters for every episode. Skim, search, and bookmark insights. Learn more

Episode description

Chris Laughlin joins the round up to discuss how to use the WebKit Speech Recognition API to interact with your react applications. This opens up a wide range of capabilities for web and React applications.

Links

Picks


Become a supporter of this podcast: https://www.spreaker.com/podcast/react-round-up--6102072/support.

Transcript

Welcome to React Round Up, and I'm Jack Harrington, your host for today and with me our page. Hey everybody, and TJ Hey everyone. And our guest today is Chris Laughlin. Hey everybody. All right, Well Chris, why do you start us out by telling us a little bit about why you're here and what you want to talk about? Yeah? So I was My name is Chris Locklin. I recently published an article for side Points. I'm using the webcit speech recognition ape guy built in the browser and then building

that into erect application. So many to utilize your voice to potentially control an application, do different commands, interact with it in a novel in different way, and that's awesome. So how did you apply that in this particular case? So in this case, I kind of went through an iteration of building a basic speech recognition function, blown a user bible to turn on the marketphone, speak to the browser, and then kind of follow about how I get

like build this into the React way of thinking. So using you know, hooks is the the modern way of building React applications. To decide write, okay, let's build this in first just a normal functional component, then start us tracking us out in the hook trying to find the bits and pieces that were unique and reusable, and then created a used voice hook that you could then start recording voice, stop recording voice, and then return that translated text.

So then a React application could take about to this. The example that I used in the in the article was to search for all books based on the author's name. So using the Open Library Web API, you could say like your favorite authors, or like Rule Dal or kind of think of other authors. I can't think of any of the top of the head. Yeah, yeah, they all token So then using that that then call it the

IPI, I bring back a list of books. I think the beauty is that you never touched the keyboard devoice to do that interaction, so all through vocal commands. So was there some business application that you were trying to solve with this or was this more of just hey, this is a cool web API. I want to see what I can do with it. I yet

to find a business API. I had a business reason for applying this, Yeah, I think for my case, like I do a lot of kind of like you know, side projects where I try and take an API and or library and build something fun and interesting. So the first version of this application was a Giffee search, So using the giffees API to like search for gifts using your voice because usually like I can never think of what the type out, but I could probably just say a phrase and get back like a

funny gift. So I wanted to like apply this to see different levels but from kind of buildings side it can. It made me think about different applications. So if you had a website, you could potentially have like a hate don't to say the key work case. People are listening to this outlide, but hey, no gorgle, you know interock with my site, so like no contact support. Potentially you know, tell them your problem instead of type

of the problem. Yeah, I think I've seen this. This is to me, this falls in the bucket of the sort of APIs that are pretty common and native mobile apps that I think people just don't expect to be on the web because I know I personally don't use it, but I'm aware of

several native apps that have this, like searches. I think the super common one that anytime you're searching for someone something, giving people an option to just say it versus typing it out can be kind of handy, and actually that makes me wonder because I'm wondering, like what the engine is under this,

Like is the API good? Like, because that's that's like my biggest concern with these things that like I talk to these and I search for J. R. R. Tolkien and then it's looking for like JBB Tollinger or something like that. Right, So when you're playing with this, like did it do a pretty good job working with that? I was pleasantly surprised how well

it worked. Like I have an Irish accent, and usually like when I talk to my own like smart speaker at home, I would say seven percent time it doesn't understand me for the browser, but to pick us up and I've you know, I mumbled towards it and top really fast and talk really slow and pitch my voice. It was still a little bit pickout everything. You can feed it like a grammar list, so you can say, like these are no keywords that you're going to be looking at for and particular words

that may or may not be understood. As far as understanding it's it's working off like the Chrome level API. So I think Google's may be back in this with their going to speak condition. Yeah, It's sort of interesting because considering it's a browser API, presumably each browser would have to provide their own implementation, right Like, I can't. I doubt it's like the W three

C doesn't Like they wouldn't provide an implementation. So I imagine it would be up to like Google and Apple and Mozilla, et cetera to sort of come up with the actual engine that drives this, right. Yeah, Unfortunately,

the Brouiser support, and I think for that reason is very minimal. I think at the moment it's Edge and Chrome fully supported, Firefox with low support, so you're kind of stuck with the browser that you're working with, and that that's kind of the other challenge when it came to emviolentness was doing browser detection inside of the hook, and then you know with doing conditional statements inside hooks, like you know, we use a fact and stuff don't play nice

if you put them inside the conditional so kind of having the hacker run that. So you tell me us or go to Chrome where this isn't going to work, I say seventy percent. I'm sorry, go ahead. I got to say. Seventy percent is pretty good. My my home speaker seems to hate me. You can get like thirty percent, but I'm really impressed here.

I think this articles to me is like a twofer. You get not only this sight into this really cool speed recognition API, but also how to write a custom hook around it, which I think a lot of people tend to avoid in React. So it's good to see a demonstration of that.

Is that something you do a lot? It's customer hooks? Yeah, Like I'm a full time React developer and with the kind of the like these little side projects that build usually you always end up in like one or two files at max, so kind of build little hooks in and you know, trying to abstract layers out. And as part of the learning process of doing this was like how can I build this? How I can make it reusable?

I probably won't use it again because you know, the middle of the side project is completed, it's dead, and the next ledge project takes over. But building it into like a reusable kind of pattern at least teaching me how to build scalable, reusable code. Maybe eventually I'll release it as an MPM package, but there's probably already one right there that does this. We use voice as a fantastic name, so you've got the naming down as well.

Domain. I am curious how you chose to deal with because this strikes me as a really unique situation, like a hook that sort of like conditionally works. So I'm curious, like what approach did you take, Like what what would look using the hook look like if you're in a browser that doesn't support

these APIs at all. So if yourser doesn't support it, it'll it'll do the Briceer detection annoyingly in the hook, like the state to handle what text was returned from the API and the whether it's recording or not recording, because you can turn it off and on. Annoyingly, you can't have them after a conditional statement because of the way hooks work, so you can have to

decline of state. They'll exist, but then an if statement will check to see if your browser supports it and in returns a value to say like this is a non supportive browser, which then you can control like a visual message to say, you know, please try a different browser. I wish that I could have had that before and not even created any of the state variables that were needed for this to work, but the nature of React kind of

just made it go that way. Is a really great library out there, React use that has a whole bunch of really great hooks on it, and it does have a speech one, but it's actually the opposite. It's given me a piece of text and I'll speak it for you. So it could be a nice other side of that. So you can always pr that into that repo and get it out there. Yeah, I think contribute to one people where they were taking different hooks for different uses, and one was that

used economic code. So you can declare the use economic code and the user could type in the a being up, down that right start and then trigger and action based on that. I've seen some other repos or some other pieces of code that have done that, And one of the developers that I learned from actually told me that he had done that at a previous place of employment, that if you typed in the economic code, a fireball and come across the browser window, which is pretty cool. So you said that you work

with React full time in your day job. What is your day job? So I'm like titles principal software engineer, but I manage the team of UI developers working on a secret book. So I work for a company called rap at seven. We do like cybersecurity, so we have like a large scale

React project, our own style and library. We build our React component library as well, so we work across those teams kind of building maintaining improving our scalability when it comes to the building a component that can work across from multiple products as well. Building this into the more like usable, user friendly, and also adding like layers of security in there to keep things protected and safe.

That sounds challenging to say the least. It's very challenging, especially like with the code basically work on. We'd started whenever React with virgin voteing and everything was written completely different then, and when you have a code base of over the thousand files, it's hard to rewrite everything the modern way of So we have like three different state management libraries mixed across the code base. You know, classes, functional components, hooks, all that kind of stuff.

Yeah, that can be really challenging to make sure that you get that consistency across the code base. It's interesting. I'm a principal engineer as well, and it's cool to see you going and investing your time into building these little projects like this. And communicating and that information about how those work, because that's actually I think one of the primary roles of a principal engineer is that

kind of education. So is this something you do a lot of, is like talk to your teams, show small examples of how to do stuff. Yeah, I find like I'm very much of a do something to learn kind of person, So I'll have to build a little small projects or how to

take some of them. Like if I find someone tweaked about some new utility library, I'll go off and try and build an example so I can understand that to bring it back to the team and they kind of recycle and share that knowledge because there's no there's no like, well, there's lots of courses money, but when I there's no formal education JavaScript, there wasn't like a certificateation you could do, so kind of have to learn and it was always

learning in the evenings and then bring it back into the team. So now we try and change that pattern. We're doing a lunch and learn with the team, you know, maybe using the course or using someone you know, random tweak that we've seen building the pots. We have one really interestingly recently

where we were looking at a different way of doing a switch statement. So using conditional cases, we pass in through and then the logic is in need of the cases and whether like this is a viable thing to use, when is the use case for how you can build it, and then building up

different examples the team could understand what it meant. That's what I was going to ask, is you know, it's it's very cool to learn about this stuff, but sometimes I'm just at a loss for what do I want to learn because there's so many interesting things happening, and Twitter is, you know, changing at rapid speed. So how do you how do you kind of, I guess, filter out the grip and say, hey, this is something that actually could be interesting to learn about and then be possibly be useful

in the day to day of what our team is doing. I think I'm

very guilty of using Twitter too much as like a pipeline for information. But I think after a while you see the pattern of someone will tweet this is amazing, this is the best thing ever, and then two weeks later a little tweet and like this is the best thing ever in a contradicted the first week I was actually talking to them, Remember the team recent but I kind of, you know, kind of grew your knowledge how to focus, and he was asking me for like different books to recommend, and I kind of

let more towards like recommend the podcasts, Like this podcast is a great resource. But there's a number of other react ones and draftscript ones are you and I find they're really good because like this, these people are you know,

focus, they're trying to like share and teach. That'll filter out all the noise you get from Twitter or Another great resource is like newsletters, so you know Josh Grip Weekly React Status. Those kind of news letters can give you a good list of like these are the articles of people have felt of some

importance and they're worth looking into. There's a lot of noise and a lot of information, but it's kind of over time you learn how to felt the right like yeah, I don't need to read this, or oh yeah I

should read that. I feel like one of the more valuable skills is you almost develop like your own algorithm for processing all this information, right, Like if I see something come up this many times, or if this is relevant to me in some way, then it reaches that level of like maybe I should check this out otherwise, like because when you first get started, you

just get it's easy to get overwhelmed because you think like everything's important. Then you realize like only a small subset is probably important to you, and learning to recognize that it's almost the skill in and of itself. Yeah. I think filtering is really good because at the beginning I would read every article and try and understand everything, and I got the point where like, well,

what am I doing day to day that I need to improve? So like if I see a typescript or I don't write or use typescript and I do want to eventually use it about me keeping up with the latest Once with the typescript when I'm not actively doing it isn't going to help where I could be reading something else. So like is there a new table library out there that's

so fast? Is there a better you know, API for talking to graph col or managing the state opusing all that instead of learning something I know I'm never going to use. I go through the pattern of open a newsletter out of ring the pocket and then never read it over again. But I start tigling things like I will eventually read this article usually a date. Yeah, you end up with a massive reading list. I know, I have several incognito windows that it's like, oh, yeah, I'll get there, eventually,

I'll read that article, I know it. And yeah, unfortunately I end up falling into that trap of clicking on those clickbait articles just too easily. Yeah. The group tabs that Chrome introduced not that long ago have been a good thing and a huge detriment to me because I'm never going to close that group even though I'm actually never going to read those articles that I grouped

together. I've seen the recently released search for your Times and I was like, that's a submission to broken, like a broken and would just make it it worse. So true, Hi Carl, welcome to the party. Hey hey, sorry, had over a bit, no problem. Yeah, absolutely, meet Chris, and Chris did an article on speech recognition API. Yes,

hey, good good, I'm by the I'm in England. So just because the border and nine is name is enjoining the Goodwiller, We're finally Oh gosh today it was okay in the morning, but now I've been reading a bit so yeah, passic English weather say good weather in England. That's that's not as advertised heard of, so Chris, I'm curious because I'm looking you've

written a number of articles for site Point. How did you get started kind of taking these projects that you were building and then besides sharing them with your team and with the people that you work with regularly, how did you get into like actually writing these these tutorials and stuff. I think it's some of like a couple of years ago. Like most developers, I always have my own blog, and you spent more time rewriting the blog architecture and writing blog

posts. And I got the one where like when I did write a blog post, I was like, yeah, this is cool. Maybe I'll share it all Reddit, but no one's really going to read it, and there's no motivation to keep me learning and recing. Trying to find me things was enough to develop our work with He had written a Java article for side Points, and he was like, yeah, like you can submit an article and

you know they'll publish it, and like this is this is awesome. So this has given me like a kick in the backside to say, right, you know I've submitted this, I need to actually build and write and you know, create an application for this post. So that kind of like snowball from there, and every time I would post something that's like right, well, now I need to find a new idea to post the next one. And it kept me like really engaged with like what can I learn new?

What's brand new out there. One of the articles I posted recently was on the React framework Remotion, and it was a brand new at the time building videos using React, and I was like, this is amazing. I need to write about this share so other people can see it and can continue to getting that feedback. And it's kind of it's rewardedt to see that you're sharing your knowledge, are getting it out there so others can build and grow and

do the same. Say, Remotion is really really fun. Maybe you could if you wrote about it, could explain to the audience like roughly what it is, because I think it's a pretty exciting project. Also, yeah, it's really cool. I kind of liken it too. It's almost like Windows movie Maker, but for the browser, so you can like you run Remotion that's like the applications itself, and then it'll bring up a pre when though you can scrub through a video. But the brilliant part is like how you

actually create a video. So if I want to go and create a video and I and like I needed graphics and move around the screen. I would have to get you some software written by Adobe or someone like that and pay licensing and everything. Whereas remotions free open source. I can just run that

from MPM. It works in the riser. So the core Remotion is like a library that allows you to use React components to build out frames of a video, and Emotion allows you to expert out so you can use React, HAHTML, CSS, whatever you normally build a web application of, but it

generates a video at the end of it. Yeah, and it's cool because I've always said it's an interesting project because there are people out there that use like these, like Adobe tools or there's other tools like it to create these things. But and there's people that are very good at that. But if you're building with web tech, if you're building with React, like it opens

so many doors that you could never do with a tool like that. Like if you wanted to programmatically do some things as part of your videos, like let's say you want to generate a unique video for like each of your users, right and bring in some like customized stats, Well, you can use a fetch call to bring in some stats and like incorporate that into your video

production or like algorithmically change parts of the video based off of whatever. Right, It's it's a React app, So the sky's the limit, and it sort of just blows my mind a little bit at the possibilities just because it's it's just such a unique idea because I would have never thought to build videos with React, right like in my brain, like I have a segmented part for like, oh yeah, that's for like really complicated Adobe tools or screen

Flow or Cantasia or whatever, like that's not something I do with web tech. That's that's nuts. It's interesting you mentioned like the kind of customization because as it was like working with it, I kept thinking, like we're working the school hyping this get better because it just run three mpm. How you normally win your code? Like what if you set up with get up action every time you re release like open source library, it generates a release notes

video that can then lightly publish the Twitter. And I was talking to someone recently who was like big into the no code movement where you could then utilize that so users could be building videos in a drag and drop environment. But

it's all just React code under the hood. Yeah, because I mean all you had to do, like you could picture a form where you just put in what's my project, what's my version number, and then a remotion project grabs that information programmatically from GitHub, tosses it into the video, spits out a like MP four whatever video file, and like you said, like you could tie that into like integrations posted somewhere. It's it's kind of cool and

kind of nuts. Yeah. I think React it's actually coming kind of like a platform, right because you've got so many libraries for like another one for like three B stuff, one for like aiming, one for this, one for emotion. So you can see probably in the future that becomes this kind of platform you can kind of build all kinds of things on it, as opposed to be when it started off was a library for you envilement. But now it's kind of morphing into this thing where you can basically do a lot

more of it than at the beginning. Yeah, it sounds a little bit familiar, a little bit similar to recut if you've seen anything about that on Twitter that Dave. I think Dave Sidia created it. And what it does is if you're filming and I don't know if it's built with React under the hood, actually, but if you're filming and you stop speaking or you flow a line or something like that, it makes it very easy to take out the I guess the line that you've potentially messed up while you're speaking, as

well as any silences. It just automatically cuts those out, which people have been saying is really amazing for all the content creators out there. Yeah, there actually is like an off the show product for that called the Script, which is really good. It actually gives you a running translation or I guess transcript as you go and then you can literally just like edit your your text to be like oh those arms, just get rid of them. Done, and it does the transition. It's very smooth. Oh, very cool.

Yeah, I'm just like we recatting. It still amazes me that this is built with React and not like, I don't know C plus plus I had a question for Chris regarding your unblogging and have the workflow that you you kind of have kind of figured out over the years in terms of your drafts and then you put your research, your ideas and your editing and publishing like what's your what's your thing? Like your post us for your brooking line wholeheartedly and

that it's not perfect and it appollos constantly. Yeah, because at the beginning I would just start writing and then get really confused and you know, get bored halfway through the article and just want to write the conclusion. But it can I start of like usually each each post is based on you know, using something in job script to do something or exposing like a new framework verry.

So I'll think of an idea of like why can I take this make it fun so relatable that you know isn't as a do app or isn't you know, some sort of business logic that you would do as a practice in a workplace. To build out that application asn't building I'll take notes to think we are the important parts, where did I struggle, Where did I get excited and like oh this is really cool that that worked and it's kind of

thing. So build a list of that that usually then kind of forms into the contents of it, like you know, getting start with this, running on the issues, how to debook that, then build out a little bit further kind of like go through you know, iterations, how you could potentially change that out and then you flash that into the final article where it'll like flow like a tutorial, but not very much like a kind of do this

and then do this and copy that command do that command. I kind of let the user figure it out by themselves, but also kind of guiding them along the kind of journey that I had whenever I was doing this. Yeah. I think that's a great way to get your side projects out there.

I know there is a ton of hilarious tweets about like, oh, you know, this is yet another side project that I've gotten myself into and having that output at the end of it, like, hey, I'll just you know, make a dev two article on this, and that gives me some conclusion point and something I can go back to later and take a look at if I choose to get back into it. Hey, I got my own thing written by me that explains it to me. But it's also helpful and

it gets it out there and it gets it on your resume. It's like, oh, this is something else I can do. I can teach people about how to do the cool stuff like speech recognition. Yeah, Like for me, I kind of really progress at the start of like the lockdown, I was at home at all the time. I'm like, I need to be learned. I need to do something to keep myself busy. So I

decided I'm going to start a Twitch channel. I'm going to start a series called Hello Drunk World, where I have a glass or two of wine and get myself an hour and a half to go from like an empty folder to a full application published live that users can access and each time try and use something I've never used before. So may it be like a random library or an API, and then kind of build and grow upon that. And it gave me that kind of structure of like I need. And they start off

every two weeks. Now it's every fortnight, and then it's probably turning on every every month. But I had this kind of fear every Sunday night. I need to think of a brand new idea and an application I can build using this random bit attack to kind of learn and grow. I want to watch that. I'm so it's good for me. It's good to kind of

do that. And then I like the factause I was explaining to some coworkers that I'm having a couple of drinks, like coding and everyone has that fear like if someone's over your shoulder watching your code, You're going to make mistakes, You're going to do typos, You're going to run the problems. And I like it's constantly just shouting to the people on Twitch and like, right, where am I going wrong? I can't see the problem here? Is

it a semi colon or something else? Like when someone had they help me, especially like I'm really bad at CSS, so anytime you came to styl and I was like, what am I trying to do here? And like

asking people in the chat like give me what I need. Yeah, that's awesome that it's kind of that live experience of people talking to you in real time, although it seems like it would be difficult because I've not really done much live stream to keep up with both what you're trying to do on your own screen and what people in the chat are talking to you about at the same time. It's not too bad. The kind of minds I always said at the start, like it's fine if I ignore people in the chat.

I kind of try and think like I do this alone, and then I'll look off to the site when I'm stuck. Now I think it might be easier if you're a little tipsy. I got to say kind of, you know, Lucy, I'm sure there's like a curve where too many drinks and it's just it's not coding anymore. But somewhere in the middle there is a nice sweet spot of a productivity where you're okay with people looking over your shoulder.

At the start, I'm very quiet and reserved. By the end of it, that deploy button, it's like, no one can stop me. Oh yeah, I think that the deploy button might have to have to have a trigger on it. You know, X number of drinks, you know the deploy button anymore, it's a math before this will deploy the production exactly like that Google thing. Are you sure you want to send this email right now? So? What are some other side projects you've done that our listeners

might be interested in? I don't think well, so I think the first one I did was trying to build build an application was felt because I never used it. So I was trying to come from the React pantagy and the learns felt, and I was like I was building tender for dogs, but

trying to use felt the whole way through it. And I thought that was a kind of good one because I like started with that kind of built upon it, built upon it, and then kind of trying to learn how to use stayed in this library how I like make shareable components and trying to flash it out. I think I kind of the next time that I was working with Redwood, because I do a lot of deployments with Netify, so I kind of trying and stick with the jam stack kind of style. So I

was like, right, I want to use Redwood. I want to deploy a full jam architecture. It went hardly wrong and I never made the light a day, but kind of like learning using the API is building upon it. I kind of trying always make them, make them a little bit fun

and kind of quirky. So there's one of the reasons where I was interested on everyone wants to make bumble sizes smaller and optimize you know what libraries are pring in their product and there's always people talking about like all you know this library ships and it's no not point not not no one megabytes. I was

like, how does that relate when you think about it physically? So I built a site where you could give it the r L and then go off and fetch your site, pull all the job script files and then tell you how many floppy disks it would take to hold that website. And then the top light you could upload your web pack stats Jason file and would do the same. So we said, you know, it would take five floppy disks

the carrier site the folks that actually know what a flabby is. Yeah, I think a lot of like, well, I imagine a lot of my viewers are of my time and era, and I will remember those days. So did you find it helpful learning spell? Did it help inform the stuff that you do in react? I haven't had enough time like after the kind of stream and all, but it was interesting to see just how they approach things, how they thought about exstruction. I think it was I was more

looking from like a kind of structural projects. I think the national syntax because they they'll never really kind of murder up. But it kind of gave me insid like this is how they're thinking, This is how they're building out their products. You know what way are they thinking? Definitely from a normal reactive It is something I want to explore more and learn about because it's it is gaining popularity. It seems to have, you know, a lot of advantages.

So I'm curious toy, where it's going to go, how it's going to end up. Absolutely, So you're saying we instantly rebrand the podcast as this is now spelt around up. Is that a go? Or is that a no go? Maybe some more episodes and reactions for me to learn. I feel like a react with a spelt kind of showdown in order. That sounds fun. You can throw a view in there as well. Yeah,

absolutely, that sounds actually really really fun. I've been meaning to actually find some time to actually look at spekes and actually try and build kind of a terplication. And then I saw yesterday as well there was a new one that came out called Footage Yes and it was built by one of the person's works for eBay on their Marco uy. So it was published I think this week, and it seems to be getting quite the buzz, so maybe it's the

new hotness who knows? Yes, See, this gets into what we were talking about earlier of like trying to process when something's elevent or not, and like I'm still hitting the puz button then spelt even like it's getting to the point where it's like it's approaching close enough that I want to take a look at it. But like I tend to be super conservative on these things,

I wait until it's like hit mainstream essentially before I dive in. Now I'm with you, actually, I think for me, I like to look at a job John Quimans and actually see how many are not asking for a particular framework, because that's a flavor of whether or not that tool has become kind of mainstream and has got I can mass behind it as opposed to you it's

too for the cool kids. Yeah. Yeah, I definitely took notice when I first started to see Gatsby mentioned among like static site generators for some companies. I was like, Oh, that's that's really it's becoming a thing that and Next, like Next has just taken off. It seems like for good reason too. I get it. So I've got a question for y'all, So GitHub co pilot, is that actually going to stall new platform development?

Because what essentially means is you have to have a certain amount of open source code out there for folks to be able to use Copilot on your platform. So unless you have that initial momentum, right, how how is that going to work? Is it gonna? So? Yeah, question for y'all. Okay, So I'll start by just saying, maybe for the listeners and for me personally, maybe you could just explain what GitHub copilot like is and what it does. The name, but I don't totally understand what it is,

right. It's an AI extension for I think it's just vs code at this point, I don't know. But you essentially just type in a comment and then run this copilot on it and the co and the comment can be something along lines of give me a function that multiplies two numbers, and it will literally give you a function in whatever environment you're in that potentially matches what you asked for. You know, you could say, give me all a list of all the Pokemon, and it might use a fetch api to go and

get all of the pokemon. And it's essentially using GitHub and all of the repos in there as a training set for this AI. And then it's you know, there's this essentially I guess a variant on the GPT three AI engine, this customize more towards code that then essentially pulls out a fragment and gives you the code that would do that, So it's pretty interesting. It doesn't mentioned like well it open source coup becomes stale because potentially this AI is right

in everring. But we'll get to the point then where so much was written using an AI that the AI then starts suggesting it's a AI generated code. So like, at the minute, it's harvesting all this manual code that was written by people, and eventually it's going to be all this code written by an AI. So it's just given its own results back that's inevitable and will

have it extremely quickly. Personally, I'm always skeptical of these sorts of things, so I have not tried it. I would be kind of fascinated to play this, so I'm going to have to poke around with this afterwards. But and any of these sort of like algorithmically decided things, especially for code, I'm I don't know, I'm just skeptical. I have trouble believing that the GitHub API is smart enough to be able to generate code that's going to

actually solve problems for me enough that i'd actually want to use it. But I've also been wrong about this sort of thing before. But my initial reaction to skepticism that this will be useful. I've seen a little bit about it,

and I haven't played with it yet either. But one thing that I have seen that people are at least a little bit upset about is how I guess, maybe how GitHub is classifying open source code, because different repos have different levels of you can use this without any attribution, or you must use some sort of attribution that you're borrowing from this, And I don't think that the AI is doing much in the way of filtering or are doing attribution for

sources that it's getting this code from. I could potentially see it being useful, but I also, like UTJ, I'm a little skeptical that the good old manual way of figuring stuff out the route force method and then refining it and refactoring it into something that makes more sense to everybody besides you who wrote

the code. Yeah, Like, well, at the top of my head and like like your example, like if I need a function that multiplies two numbers, I'm sure this tool is great, But like the day to day problems I'm solving is I've got like my widgets and a function, and the widgets have like these three properties that are unique to my company, and I need to do some conditional logic based off of it, right, and AI

is not going to really help with that. So it might help me google something like preventing from Google things like that stupid thing like how do I capitalize the first letter of like like a string, like some of those stupid things that we've probably searched twenty thousand times and like seen the same stack overflow posts like it seems like it would help with that, like save me a step. But for like the real logic I need to write, like the nitty

gritty stuff. That's the part I guess I'm skeptical about. Yeah, I think in practice you sometimes don't do things that code look right away because for that particular solution it works. But I'm getting the AI might be like, no, this is the right way, but I think, no, for this solution, it's okay. I can break the rules because I need to

make this work. So yeah, definitely, I think it won't be practical for those kind of day to day tasks, but maybe like a fun thing to pay on with and if you want to be Yeah, like the examples of it's been very accurate and it's filt really good. Cool, But as you said, like, it's it's always small stuff like I need to fetch

the users and that kind of thing. So it's it's it's saving your copy and pits from stack, which I don't think we should be removing us to write a passage of going to stack be told to use jQuery, even though learning with that experience. I see we said there's been reports that it's potentially throwing API keys and secrets. Yeah, we accidentally committed the code and I'm like, oh, this is where it gets funded and interesting. Well,

and that's that's a good point. Actually, not necessarily that we're copy pasting from stack overflow, but learning to ask the right questions to find the answer that you need is such a crucial part of becoming a decent developer. It's like that is that is a huge part of every developer's job is how do I phrase this so that I can actually find an answer that makes sense for

my use case. And the other thing that I was just thinking about is so much of what we do is writing not very good code the first time around, and then figuring out through experience and through pull request comments and through just building more stuff how to write better code the next time around, and if we have an AI kind of suggesting this is either the best way to do it or this is the right way to do it from the get go, there's a lot less of that learning experience, I think, and then

being able to go back six months later and say, wow, this was really not very good. Now I think I can write it a lot better

and a lot cleaner. Well, you could make the argument, though you still have to find a right way to ask the robot your question too, because I'm sure like the robot could potentially interpret different things depending on how you like phrase your comment, because somewhere deep down in the source code, something is parsing those search strings and feeding it to its algorithm or whatever it's doing

under the hood. It's like the same process, but like different. Yeah, you mentioned like pular requests, Like if if someone raises the polar requests and some of the coups written by the AI, are you going to comment on it or you're going to say, well fix this? Right? Those question as well? About the ganty right, I remember the case I think it was it was it Uber, but it last year or the year before where a lady was hit by a car that was surpriving itself, if you

like, and then the case Okay, so that's the software. If it's in that moment AI, who's liable? Is it? Uber? Is it the developer? Like? How do you like that legality becomes those kind of a grader because obviously the person behind it isn't is AI. So AI can't be held accountable because it's a person. But yeah, it's an interesting question because I guess going forward, as well as more and more kind of AI gets gets into your day to day lives, that's going to become a topic

that needs to be kind of addressed and so it sut out otherwise. Yeah, I think it's one of the issues around AI is the fact that a lot of this is just training sets and models and we don't really understand why it works. We've trained it, we understand how the weights work and it creates this model, but we don't really understand this is why. You know, we've got out the slide rule and we did the calculations and YadA,

yad YadA. I mean, nowadays, you know, when we land to something, it's more by training it on tons of failure as opposed to actually doing all the math and figuring out, Oh, here's how you hover slam a rocket. You know, maybe you do. I don't know. I'm not a rocket scientist, but yeah, it's certainly interesting, certainly interesting. The legal challenge around this. Wait, wow, we have come really far from speech recognition APIs but not may maybe. Yeah, the visual Studio code

is web based they could implement. And it's it's chromium based too, they so the web speech API should be there, right, like it could. You could use the speech recognition API to feed into the robot. Right. You don't even have to write comments, just use your voice the robot. You could just dictate your code, right, and the robot is going to fill in the blanks for you. Amazing. Actually, just I'm lazy, just talking to the right. Okay, line to cons name open bracket.

You've got your next article right here. Ye take that VS code extension stack on it. But that, yeah, there, it is nicely done. Well. I think that's a great time for picks, and let's start out this week with Carl. Yeah, so I've got one pick today and it's not really a pick, but I subscribe to a number of different front end or js emos, but what I've been doing lately is actually subscribing to emos

about things that mightamain. For example, right now, I subscribe to an email and alixa one and how to be a tech lead, and there's another one on a on a different topic. And I do so just to every week. When I go through my emails and news. It basically helps me kind of see what's happening outside front end side. Yes, and sometimes you find this about this thing in exile or whatever, and I think it's gould to get a kind of rounded view of what's happening outside you kind of domain.

And I definitely recommend it. Just try and find something outside you your language or framework, and just be keeping update on that EPs in week. Couldn't agree more, how about you, Paige. My pick this week is going to be a keyboard. It is the Logitech mx keys wireless keyboard and I recently I bought one this past weekend. And this thing is awesome. It is low profile, it is quiet, because I am not a lover of mechanical keyboards that make so much noise that you can't hear yourself, and

it is so far it's just been amazing. It paired up well, it has three different toggles, so you can have three different computers paired to it, and it works for both Mac and Window and probably Linux, and it's just been it's fantastic. So I would highly highly recommend that if you are not a mechanical keyboard enthusiast and you want something that's quiet and feels just right on your in your hands. It's got a good weight to it, it's

Bluetooth compatible, it's it's pretty sweet. I very much would recommend it to anybody who's looking for a new one. Nice. I love their mice, all right, Chris, What do you Got to Mine? Is kind of like utility application script by John Linquist. Now, I recently did a side

project almost before and it's like in Michael, actually have like Spotlight. We can do commands space, I mean type for files, but this you can do all space and you get like a pop up where you can type in and now commands like open up a Google search or you can move Windows. But it's built on JavaScript, so you can write your own scripts, and it has an API. You can use MPM so you can do whatever. You can do a job script like call servers interact with the machine and my

own jobscript. I think it's really cool. Ah, that's awesome. I totally am going to look at that. That's great. DJ. Yeah, I'm going to pick something called the Manfroto Magic Arm. It's basically an arm for mounting something like lights or like a more heavy duty camera. I've been doing some work in the home office and I got a nicer camera and I was spent a lot of time researching something that would actually hold it and found

this thing. It's a little pricier. It's like a one hundred and fifty dollars arm, So like, you don't want this for like a really like light thing. It's designed to be a little more heavy duty. But if you have something that's heavier and that you need to mount somewhere, if it's a light, it's a camera or whatever, it's good. I am like the world's worst person at like putting things together and setting things up. I'm comically bad at it, and even I was able to figure it out.

And it's credibly configurable. It's got like three different joints, so you can kind of fit it in anywhere you need. So I'll put the links in the in the show notes so that I don't have to read out the numbers. But it's a man proto magic arm and I've liked it. Yeah, Manfroto is great. I've got one of their tripods and they've got a nice little interchangeable system that you can use, so you can take the same connection that's on your tripod and put it onto any of their stuff. I think.

So that's really handy. All right, So my pick for this week is solid JS. So I don't know if you've taken a look at this yet, but it's essentially if you're looking for the spelt speed but you don't want to leave React world, solid JS is a really good alternative. It's kind of as if somebody reimagined React starting at like twenty twenty. So it's all functional components, it's all reactive, so it's all using kind of hooks and similar kind of this data changes then update this kind of thing, and

it is wicked fast. It's certainly something to look into if you still want to have components, you still maybe wanted to do the micro affee thing. You don't want to lose from are area already with React, but you do want some of it. That's just crazy fast solid jass is a cool thing to look into. Nice all right. Well, that I think wraps us up for this week. Tuning again next week for React round Up. See you then see everybody. Yeah,

Transcript source: Provided by creator in RSS feed: download file
For the best experience, listen in Metacast app for iOS or Android