Automate egghead Lesson Setup with ZSH Shell Functions

John Lindquist
InstructorJohn Lindquist
Share this video with your friends

Social Share Links

Send Tweet
Published 5 years ago
Updated 3 years ago

Sometimes you have an idea that you want to quickly record, but the idea of setting up a project just to get it recorded gets in your way. I'm going to walk your through scripting away the main setup pain points so that you can focus on creating content.

John Lindquist: [00:00] From my terminal, I can write +vanilla. The name of my lesson is awesome-lesson-idea. I'll enter.

[00:09] Then it will clone and install everything I need, create a GitHub project with everything pushed up there, and setup an invoke parcel and code, so that it launches code to an index.js. On my other monitor, it opened this window, which is running whatever I type into this file.

[00:35] If I console.logout("hello"), it's saved there. You can see "hello" in this file. Also, if I go to GitHub and show my repos, you can see that awesome-lesson-idea is already up here with everything that was installed. My script for this looks something like stop this and open my zsh file. I say change directories into projects.

[01:06] There's a tool called degit which will take a template, remove all the git stuff, so you're not working on a fork. It's a clean version of the project. It will name it whatever you passed in that name. It will cd into that name. Set up all the necessary git stuff. Git create is from hub.github.com. This will add the ability to automatically create projects from your command line. Then it'll push it.

[01:36] PNPM is a way of NPM installing packages which are locally cached in your computer. Then you can use code in the current directory with the -g flag to launch a specific file. Then my template has a start script. For this all to work, you do need to install degit which is just an NPM package, NPM degit. Go ahead and install this.

[01:59] Make sure you install Hub so you can use the git create command. If you're using code, that should be obvious there. I'll just paste this at the bottom of the lesson, so that'll be there for you. Then once I'm done with this lesson, back in my terminal, I can type +egghead, hit enter. This will commit and push all the files up to my repo.

[02:21] It will launch the embedded version of the code Sandbox. This is the exact project and all of its files loaded from GitHub. Then it also launches Chrome to the new lesson uploader.

[02:36] What that looks like is in my zshrc, git add, git commit. I'm just parsing in the date, so my commit will have the date in there. Get push, and then telling Chrome to open that CodeSandbox, which is linked to the repo, based on my directory name, and then my user account. Then it just also opens the URL to upload Egghead lessons.

Tim
Tim
~ 4 years ago

Thank you so much for this. Using your .zshrc file, I also set up one for a cra app (I want to also do a barebones, non-cra one) and one for react-native

Markdown supported.
Become a member to join the discussionEnroll Today