Introduction

[00:00:00]
>> So my name's Brian Holt, I'm really excited to be here. I think this is my, I can't even count right, 13th or 14th time recording for Frontend Masters. And I'm just really excited to be here again teaching. This is my favorite thing to do, and I'm really grateful to the Frontend Masters team for allowing me to continue to coming back and hanging out with you all.

[00:00:24]
So, a bit about myself. My name is Brian, you probably got that from me saying it three times. I live in Seattle, you probably got that from saying that I'm recording from my house in Seattle. I work at Microsoft, I work on Visual Studio Code, and I work on NodeJS on Azure.

[00:00:43]
So I'm the PM for developer experience for NodeJS on Azure. So, it's a cool mix of writing code and working with the product teams as well as endless meetings and endless emails, as I'm sure many of you understand. And yeah, today we're gonna be doing the Project Fox Game.

[00:01:03]
So in the past, I've taught you courses like containers, I've taught you courses like React. I've taught computer science, I've taught to Intro to Web Dev, I did the boot camps. But all those classes had, we're gonna teach you React, we're gonna teach you containers, they had a core curriculum is something that we're going to build together.

[00:01:25]
This is gonna be something different and it's a new experiment for me and for Frontend Masters, which there's no core here that I'm actually trying to impart to you. We're actually just gonna build a game together. And it's gonna be like you and me are in the room pair coding, designing things together, having a conversation about how we wanna build this game.

[00:01:42]
So what I want you to learn during this is kind of how me, I've been an engineer in the industry for about a decade now, maybe a bit longer, and I've been coding for probably two decades. So I'm not gonna say I'm the best coder, but I am gonna say that I'm a effective developer that ships code regularly.

[00:02:02]
So hopefully you can pick up some of my tips, some of my tricks, some of the things that I've learned over the years and maybe hopefully that's helpful too. And if you like it, then we'll do more of these. So the first thing that I want everyone to do right now is that I want you to go to this address which is bit.ly/fox-game.

[00:02:25]
And no capitals, it's very sensitive, so it has to be lowercase fox. That's actually a minus character, right? Game, right? And that'll take you to this website. It won't say bit.ly.fox-game because I added that after the fact, but it'll look something like this. Okay, this is the course notes for the course that I'm teaching.

[00:02:49]
You can't see, it's little off frame, but I have a little laptop right here that has this website up on it, so this is literally my notes. Now what's advantageous to you is if you fall behind or you don't understand something I say and you want to refer to it later, tou can always go to this website.

[00:03:03]
It's always gonna be free, it's always going to be open. And this is something that you can share out, this is not a secret, the source is open on GitHub, right? So that's something that's really awesome that Frontend Masters allows me to do, which is open source of all of my course materials.

[00:03:19]
Okay, so hopefully you've arrived here on this project website. I just wanna give you a little bit of how the page works. So if I go to the section Welcome and go to Introduction and click here, you can see that actually ends up here in the header, welcome-introduction.

[00:03:37]
I did that on purpose so that if you don't know where we are, you can just look up in that corner and you can see which section and kind of chapter we're in at the time. The other thing to know is that I have some participants that are online at the moment that are gonna be asking me questions throughout, so that's where these questions are going to be coming from.

[00:04:01]
Okay, so here this just kind of says some of the stuff that I've been going over already, which is the course objective. This course is not necessarily anything new, it's meant to be a pairing coding experience with you and me. Okay, who are you? So the base level expectations of this course is I expect you to be a beginner in HTML, CSS and JavaScript.

[00:04:24]
So I'm not here to teach you necessarily those core things, this should not be your first time with HTML, CSS and JavaScript. I expect you to have at least some intro to webdev or the boot camp. So if you haven't done that, this is a great time to pop back into that, do those.

[00:04:40]
I left you some links here for the boot camp and Intro Web Dev V2. Nice thing is those two are actually already free, you just have to sign up for a Frontend Masters account and then you can watch those. And this would be like a perfect next class to take after that.

[00:04:55]
If you have just a base level of familiarity with NodeJS, that's going to be helpful as well. But if this is your first time with NodeJS, that's totally okay. We won't be doing NodeJS, but we'll be using NodeJS for our tools later in the course. Okay, setup instructions, I really want you to just install two things.

[00:05:17]
One of them is NodeJS, you have to install that one for this class to work. I personally use NM, you do not have to use NVM. That just allows me to switch versions really quickly. You can just install it directly off the website, and that should work for Windows and that should work for Mac and Linux just fine.

[00:05:37]
I am a VM on the Visual Studio code team, so I would implore you to install VS Code. I will be using VS Code myself, and so you will learn a bunch of tips and tricks for someone that works on the team. So obviously, I think that's a benefit to you.

[00:05:51]
Even if it's necessarily your day to day driver, if you prefer eMax or something like that, that's fine. And you don't have to, there's nothing required on this course that you have to do VS Code, but it's a good time to try new things. I get asked this every single time what's your font, what's your theme, what's your prompt?

[00:06:14]
For VS code, my font is Dank Mono. That one is not free, I think it's 50 British pounds. If you don't wanna buy a font I've actually found it worth it cuz I've used it for years now. 50 pounds over like five years of using it, probably worth it.

[00:06:32]
But there is one from Microsoft called Cascadia code, and that one is free and it does have all the ligatures. I gave you a couple links here to figure out how to enable those. A ligature is if I have like an equal signs and a open bracket next to it, it'll combine them into an arrow.

[00:06:50]
If you see like two things combining, that's what a ligature is. You don't have to do it. I just think it's cool, so I do it. My theme is the default dark plus theme for VS code, I just like it. For my shell, I use ZSH and I use the Spaceship ZSH prompt, which is gonna show you what version of Node I'm using and all that kinda stuff.

[00:07:11]
And yeah, and obviously VS Code. This isn't gonna be a perfect course, right? I wrote it, so there's gonna be grammatical and spelling mistakes and even occasions where there's just things that are like wrong in the materials. So this is all on GitHub, you can file an issue and then we keep track of that and we'll fix things.

[00:07:29]
And feel free to open a pull request as well if you want to fix it yourself, that's great. I'll just say that I'm always happy to chat on social media, but I get a lot of tech support requests and I don't necessarily have time to respond to all of those.

[00:07:42]
So if you do that, the better place to put that is an issue, cuz if it's an issue then we will eventually get to that, for sure. Okay, who am I? This is me at Christmas in 2018 in Paris drinking a very fine Belgian beer that's the size of my head, which I was very happy about.

[00:08:00]
I told you I work at Microsoft, I'm also on Frontend Happy Hour, which is a pretty cool podcast. And previous to Microsoft, I worked at LinkedIn, Netflix, Reddit and in some other smaller places in Salt Lake City. I'm also on the board for Betsu Code, which is an awesome nonprofit.

[00:08:20]
I live in Seattle. I have a little dog named Luna, who you may or may not hear during the course of this class cuz she likes to bark at everything. And yeah, I left my links here for social media. So Twitter, GitHub, LinkedIn, feel free to add me on all those, I always accept them.

[00:08:38]
Again, huge shout out to Frontend Masters for letting me create this course, for giving me incentive and time to do so. I'm just infinitely grateful to them and their team and to Mark and everyone. So I definitely think their product's worth it, their workshops are really top-notch. And last thing, I left a link down here to the repo for this particular page.

[00:09:02]
In fact, if you open it here, I would really appreciate a little star up there, that's always helpful for me. One, it feeds my ego to let me feel good about myself. Just kidding, sort of. And it also makes the repo a little bit more discoverable to other people, which is always great.