GitHub Open Source Friday, 3 May 2021

Previous Meeting Next Meeting

⏯

youtube image

►

From YouTube: Automate Anything with Script Kit - Open Source Friday

Description

egghead.io founder has built a new tool to automate anything. Script Kit was launched in Beta with community examples last month and already getting traction in the open-source community.

Join @bdougieYO and @johnlindquist in learning how you can automate anything with Script Kit.

https://github.com/johnlindquist/kit
https://www.scriptkit.com/

0:00 - Start
0:45 - What is Script Kit
1:20 - Setup first script
5:20 - Discovering scripts
8:46 - Beta Discussions
11:55 - using npm
18:37 - Sharing scripts

As always, feel free to leave us a comment below and don't forget to subscribe: http://bit.ly/subgithub

Thanks!

Connect with us.
Facebook: http://fb.com/github
Twitter: http://twitter.com/github
LinkedIn: http://linkedin.com/company/github

About GitHub
GitHub is the best place to share code with friends, co-workers, classmates, and complete strangers. Millions of people use GitHub to build amazing things together. For more info, go to http://github.com

A

uh My name is john lindquist. I am one of the original people at egghead, dot, io and egghead's the place you go to build your dev portfolio uh gain the skills you need to get the job you want so um head on over to egghead.io. There you go. You said an ad, that's an ad.

B

Excellent um and uh we're here to talk about something you've been working on, which is called script kit. um Well, actually, is it called script kit? It is called script, okay, excellent and uh which is like what a weird question to ask when I invited you to come on and talk about your project. But um uh do you want to tell us what what is script kit.

A

Yeah it's a script. Kit is a tool that allows you to write, run and write edit share everything scripts that allow you to automate your workflow on your computer. So these scripts are scripts. You write with javascript.

A

They can be um easily edited and updated and easily run from a prompt that pops up when you, when you launch the script kit app so and while those scripts can run in the app they can also run in the terminal, they could run in a github workflow.

A

These scripts are meant to be portable as well, so there's plenty of ways to run them and installing one as easy as like. If you just you, have the app open, you can just click one of those buttons and uh hit open kit. So yeah go ahead and uh name we'll name a script. uh You know pick some name. I gave some suggestions there. Oh.

B

Nimble motion looks like a great one. This is like uh starting up a netifly site, sure.

A

B

Together, two different random, nouns, okay, so which editor do I use code and, oh.

A

And that it'll cache that.

B

Excellent- and that gives me so this is me building my own script, and this is just.

A

Walking me through.

B

Okay, excellent, so what's the I guess, what's the next step, I created the script. I now can console.log nibble motion into the logs.

A

Yep so go ahead and open so script kit defaults to command semicolon, and you should see the nibble motion in your list yep and you can either click or hit enter and it'll run that script. um If you look in the logs directory over on the left, you can see there's a console.log file there and you could you could tail that or just keep on checking.

B

Okay, so when this like there's no deploy step for this nope, okay, excellent, uh also very excellent type in my github, you just name it.

A

B

Which you all should know it is, and I definitely type that that is true there you go so excellent.

A

So this is showing like from creating your first script and um prompting the user for an argument and then displaying a window with some html. As far as like there's already a ton of things, you could do with just that.

B

A

And that's all that it took like we're 10 seconds into showing this off and that that's all that it took.

B

There's already been a comparison which you made this already when our conversations the first five minutes when you saw my screen but alfred um folks, are comparing this to alfred and like would you compare this alfred, or is this completely different?

B

A

I I would say it: people will automatically compare any tool that pops a prompt open to alfred or alfredo sauce, which I love as well, but alfred is a by default. It's an app launcher and it has like these default uh tools as far as searching files and it's it's a wonderful tool. I've used it for years.

B

A

And I absolutely love it um where script kit differs. Is that it's not for it's not explicitly for those things that alfred is for it's for writing and managing your own scripts. um Alfred doesn't have any of that sort of stuff. You can't go into alfred and say, um create new script. They have like a concept of workflows, which you use a ui and you drag and drop lines together and all that sort of stuff and those work great.

A

um What I the reason script kit exists is because it's targeting developers like this is an automation tool for developers who know how to write code, and they don't want to um like you, don't want to go through all those uis which can't do like all the things that script it can do so it the comparison kind of ends at there are alfred workflows which have a limited.

A

I mean you could run any bash script from inside them. So I guess you could say it's unlimited, but yeah. This is this. Brings you your scripts into the javascript ecosystem? Any npm package works, and you have like that whole sharing scripts is as easy as either copy and pasting it into a chat window or you can generate share links. All that stuff is.

B

But his other question was: what's your favorite scripts that you've seen or that you've written.

A

um So there's a lot in the if you open the uh kit again.

B

A

Just command semicolon: oh.

B

A

um So if you go to the hot tab, you can either hit tab or click on it. um Oh nice, you just want to make your prompt a bit bigger, so he's on a 1280x720 screen. That's why things are so small, so this is another. This is another thing where this is a community focused tool where people share scripts, so in the hot tub I'm going to keep a list of like scripts that people publish where you can go and check out what they're doing this is the script I'm using right now.

A

I have this run, so I have a cron that runs every 30 seconds to see how many downloads scriptkit has had, and then it updates my twitter name. So if you look at my look at my account on twitter, you'll see whatever so now it's had.

A

If someone clicks the download button, we could come back and check in 30 seconds and you'll see the that number will go up.

B

A

B

A

Which is it's ridiculous right, but it's you know it's one of those things that makes me laugh.

B

A

B

Because, like I have a, I have a um not a script, I have a query, a graphql query, to check to see if I'm live on twitter and not twitter on twitch, uh because I want to build something very similar to this. So I can update my twitter name to basically say: I'm live.

A

B

Check when I'm live, it's gonna say I'm live uh and it sounds like I already solved another problem in like the next. The next five minutes of this conversation.

A

Awesome yeah and that's where, like this script, um it's it's kind of more advanced to like compose scripts together, but it's totally possible to have one script call another script. So if you had, one task was one script was to you know, query do a graphql query and it had some sort of output. It could then pass that into this script. You wouldn't have to even like compose them into us here. I'll show you something really cool here now: go go back to the script.

A

Yep um go to the top of the file this this isn't in the tutorial, but on line one do write a comment.

A

Just create a new line and write a comment and say shortcut with a capital s and colon. Then space like opt space, t like option t.

A

Probably probably lowercase t, I don't think it matters. I hit, save now hit option t.

A

Oh, do you have option t bound to something in code.

B

uh Yeah, it's the um okay.

A

B

The them bindings.

B

Let's try this one more time: uh option g! There we go, oh got it, so you basically can route the shortcut. That is that's amazing. You can route it route the script, to a shortcut which, in the case of things like updating your twitter name, I could see routing it when I go live.

A

Just hit the shortcut.

B

Rather than running a cron yeah and.

A

That is genius.

B

And you said that this is not in the uh the tutorial, but this is this in the docs.

A

The the shortcuts, if you look at the yeah, if you go over to the docs in the discussions, there's just kind of like a beta discussions in the docs. um It's one of the categories over on the left just.

B

A

um So if you look at metadata.

A

So these shortcuts the app will automatically watch your scripts for any of those shortcuts you put in and bind that shortcut just globally to that script.

B

A

The the menu one will make it so you can search for like a better name for the menu and description as we'll be will be in there. If you scroll down a bit, you can get into some of the oh and there's the attribution stuff. So if you share a script with somebody and you put author and twitter in there, then when they run your script, they'll see in the upper right they'll see your your name to show that you wrote that not a new file.

A

So so I recommend I recommend using new from the menu and here let me show you why go go over to your actually, let's, let's do it this way: open script, kit, the command semicolon.

A

Go over to help and search for add it's like add to your profile.

B

A

Yep and you probably use esh, I assume uh actually I've.

B

Been using batch rc.

A

Okay, so whatever whatever terminal you want to add, so there you go, you now have um if you hit enter here. It'll do the exact same thing.

A

So this script, when you use new from the app it's going to generate. If you look in the directories over in the left, there's a bin directory at the top yep, and if you look at nipple motion you can see. Essentially this is the heart of script kit um setting up it runs. It has a node installation itself or just you know, the executable itself, um it loads, the dot end most people are familiar. Developers are usually familiar with loading.n files.

B

A

And then there's a the core library is that mac dash terminal library, when you run it from the terminal or there's a mac dash app library when you load it from the app and those provide all the read file, write, file, arg and all that sort of stuff, and then that shoots all of your script on line eight and then all the arguments on line nine um and it loads that all into on line five is where it actually calls no separate from your global node modules.

A

So you'll in your canv directory you'll see a node modules folder um that keeps them all in there and what's recommended is if you want to. um If you want to install a node modules uh or sorry a node package, node library um there's a weight npm.

A

So if you use, if you just go ahead and create a new script, real quick like I I when, when I'm showing people this, I want them to be really comfortable like just go ahead and create a script like just like. Instead of instead of talking about it. Let's just do it, um you can call it wealthy ducks or whatever wealthy.

B

Yeah, these are great I'll, never remember what these are, though, aspiring.

A

Oh, you lost focus.

B

Claw there we go uh the command semicolon is something I never type so like hats off to you for figuring out another command, because I have.

A

To look down to think.

B

About it, so hopefully that'll be muscle memory by this weekend.

A

And if you want to change that, you can change that in the help menu, there's a change shortcut for scripts and the main menu.

A

So right here, if you say, await.

A

Space npm and then this npm is a function and pass in a string of sharp or some library, you'd use.

B

A

I've never actually used.

B

A

It's that's the image, processing, library. Okay, um so if you just run this right now um so it'll say sharp is required. Go ahead and it'll tell you how many downloads it has um nice and it'll go ahead and install it and then continue on with the script as with sharp installed.

A

So if you do on line one, if you say let sharp equals this, then you'll have like the sharp library.

A

And every time now, when you run the script, it won't stop you there, because now it's installed and then um this this is another thing like sharing scripts. I didn't want people to have to go and say, npm install this, and if you install that, like.

B

A

Script, it just says we require this, require that so we'll prompt you for it we'll say: hey. Do you trust this, and now you can just start sharp, resize and sharp whatever images on your your computer, so.

B

Sharp, oh, but it's got typescript too, as well. Nope.

A

uh You'll have to do there's a special type annotation to get the um to get the code hinting on this. If you want to learn what that is, but.

B

Yeah, I don't know if it's worth it, but uh a library I've never used before, but um but this makes sense too, and I love that I can have access to the full node modules to be able to run scripts and do some quick, dirty yeah image, resizing.

B

uh Vortex minus one vortex has a question: would it make sense to use scriptkit as a local runner? I'm not sure what that implies. Now.

A

um A local runner, I don't know what you mean by a local runner.

B

A

Sorry, if you could explain that.

B

um Symptorant has a question about pending inversions, uh so, with this whole um await npm, can you pin different versions.

A

uh Not right now I could. I could definitely add that in um after after it's installed, you can always go back and um like go into the package jason and manage things um and there's in the like. It's it's literally a node project.

B

A

B

So you could actually run npm install here right.

A

B

A

I can see pinning versions inside of that npm helper being like being a totally easy, easy thing to do. Yeah.

B

A

And you can also from if you launched the app again.

A

If you go over to help.

A

And go down to manage npm packages that you're right on it. um You could say uninstall sharp, like it lists the things you might want to install or uninstall. So.

B

Okay, if I go to manage packages and install does it know, it doesn't know that I'm using sharp anywhere.

B

All right we'll try and prep for discussion all right so now github token.

A

Is needed, which I I do have? Oh no you're right, sorry, my bad! This does require. This does ask to create a just still I was gonna remove. I was gonna. Remove that I just haven't done it yet. I'm sorry.

B

uh This is for kit and uh I'm gonna assume repo access, but who knows no.

A

B

Just just access you can remove that.

A

All right, it's a muscle, memory, yeah.

B

I was literally creating tons of tokens. Everybody take note of the token.

A

Ghp underscore wyo.

B

Yes, commit that to memory.

A

Yeah, no, this that's bugged right now, okay looks like the share menu is something to go and go in and fix.

B

Interesting: okay, what happens if this is also yeah? So, for whatever reason it's.

A

Well, it's taking the the share. Script is looking for the script name as an argument and it's taking uh when it's waiting for the environment variable it's um it's replacing the the script argument with the environment. Variable essentially is what's going on um you can you can try just yeah right there if you just paste it in there.

A

And maybe this is this is one of those things where it works on my machine, because all this is set up and.

B

A

I forget, like people haven't, set things up so now now it should probably work.

A

Yeah see like that's how it's supposed to work, but there was a there's, a step in there where it was that I need to go and fix. I need to like clear up my environment and double check. Some of those scripts.

B

Okay, um well cool, and I look forward to everybody who's going to be creating generating just on.

A

My my github profile.

B

A

B

At-Bats at it to copy that uh or screencap that.

A

You can go ahead and you can do the prep for discussion. One now I'll show you what this does.

B

Share that one.

A

So um it gives you a link to click, to jump to the discussions. It shows you where it just is, and um it's copied your code as a js like markdown.js, fenced.

B

A

So if you just like open discussions, um you would create a new discussion and just paste if you just command v right now,.

B

A

It just pasted that that all in so.

B

That is amazing, so I could see this as a really good use case of um I want to create. So what happens is a lot of times? I'll? Have an issue show up, because I do a lot of uh I'm flexing right now, but I do want to live streaming on twitch and I'll, be working at a github repo and find a bug, and I I will beg the chat to open up issue because I know, if I do it.

B

It'll just be like five minutes of me, like silently trying to type and spell things right. It's like.

A

Hey can someone just open the issue I'll clean that up.

B

If, um when it's done right so it'd be cool to have like a script to say, okay open up an issue on this repo and then that way and then assign b dougie. So that way, he'll remember to clean up the issue and provide more context.

B

But yeah. That's actually a great use case of just to sort of create a little sandbox to prep it for um for copy and pasting.

A

Yeah and those should, if you look at the preview, um so you see that install aspiring cloth, yeah.

B

A

When you click that that should open the app and say um and try and install the script.

B

So I've got the I've got this.

A

B

And then I've got aspiring cloth.

A

Yeah this this pulled down the gist by clicking on that link and put that near her and put that in here. What.

B

Happens though, if um it's, I guess, if you have the link, because I was gonna, ask what if it's a private gist, but if you already have the link, you can see it, I believe yeah yeah yeah, so not too bad. This is anyway um I'm. Basically I'm going to be asking you for advice.

A

B

Other ways I can basically do my job next week.

A

Sure I'd love to help out this is. uh It makes me happy to see people removing friction from their lives. Yeah.

B

But yeah, even like things like so we have um in the tweets like we ought to. You can automate uh these images um so like. I could see myself just basically just grabbing john's profile and then slapping it in the uh the sigma template or copying and pasting it and then into the figma. Template is doing.

A

B

Quick little scripts.

A

Yeah one one of my favorite most favorite scripts, I wrote was one for taylor bell at egghead. He has this scenario where he's looking at a website and he wants to grab the open graph image from that website, and so I gave him a script that looked at the current chrome tab and then did the appropriate parsing to find the open graph image and then downloaded that image cropped it to 640 by 480 or whatever he needed it for and then put that in his clipboard. So he could look at a site hit.

A

It hit a single keyboard shortcut and it would give him that formatted image that he could just paste where we, wherever he needed it needed it to go.

B

That is amazing.

A

And that's safe that saved him so much time compared to going to opengraph.com or whatever it was where you'd find it and download it resize it yourself and like that.

B

That makes me happy yeah and um shout out to github who just shipped uh new open graphic images for the repositories. Oh I've seen those they look great yeah, so like to be able to get those on demand um because yeah I've.

B

I love having the fact that you have little stars and issue counts or common counts in the open graph image. Regenerating those on the fly would be a breeze using script kit for sure wow um love that example open graph. Is that live? uh Is it already? I guess we should.

A

uh I don't know if I've posted that one.

B

I'll go find it well. I guess.

A

B

Good segue, um because I just realized we're right at time too as well. um I was just so engulfed in this, but um where can folks sort of keep up the dates and keep tabs on new scripts? What's happening with script kit um suggestions.

A

For scripts, so so here you go open uh open the app.

A

Go over to join type, your email.

B

That is the way.

A

B

A

Yeah there you go and so now joanne's gone from the menu. You never have to see that again, but um that's genius yeah. Joking aside, if you like the announcements, category and github discussions, uh a lot of the stuff will go there as well. So github discussions is where it's at for keeping track of skip kit for sure.

B

Yeah, that's a great use case and like we, we mentioned it in passing through as well. I mean I realize this is a github twitch channel, um but yeah. This is a great use case for discussions. It sounds like it's pretty lively.

A

B

As you were answering questions, you were pointing the discussion, so this is I'm looking forward to continuing to watch this repo. Actually, let me go ahead and watch uh I'll watch all activity for now, but I'll make I'll make a custom uh selected. Events later is.

A

There is there a watch discussions.

B

A

B

Okay, uh but I say that as a github employee, so I have no idea if this is available to you so, um but if there isn't it's coming soon, that's.

A

B

The challenge of being working on github, I have no idea what's on the everybody list and what's on the bw.

A

B

Gotcha but yeah excellent. This was super fascinating again. I I really feel, like the rest of my day, is now shot because I'm gonna be writing some scripts. I'm gonna have lots of fun. uh You'll, see me in these discussions asking questions uh soon and uh folks, um john lindquist, everywhere. uh Twitter github um definitely sign up for egghead help. Him pay the bills too, as well. Yeah.

A

B

Great yeah and uh this video will actually be up on youtube uh uh approximately monday and uh if you're interested in joining us, as as a maintainer as a contributor to open source projects, uh hit me up on bw on twitter and twitch bdoggie on github um we're we're actually pretty booked through the rest of june. uh I will update the meetup page of all the upcoming guests, um because I haven't done that yet and I took a a week off um and then yeah, I'm.

A

Really enjoying having conversations.

B

Like this with john and hope, you all are enjoying this awesome.

A

Have me back sometime.

B

Yeah for sure uh I I feel like when this script comes out when the script comes out of beta, I'm so ready to uh to have another conversation about this awesome.