This course has been updated! We now recommend you take the Intermediate React, v5 course.

Check out a free preview of the full Intermediate React, v2 course:
The "Introduction" Lesson is part of the full, Intermediate React, v2 course featured in this preview video. Here's what you'd learn in this lesson:

Brian introduces the course, the course website, and how the repository is structured to be modular so that students can watch segments independently of one another.

Get Unlimited Access Now

Transcript from the "Introduction" Lesson

[00:00:00]
>> Brian Holt: Welcome to the Intermediate React V2. I'm really excited to be here talking to you about React again. And today we're gonna be talking about the extended React ecosystem.
>> Brian Holt: React in and of itself is not typically the only tool that you use to build a project. You're gonna bring in things like Emotion to do CSS, you're gonna do Node server-side rendering, you're gonna do code splitting, and all that kinda stuff.

[00:00:25] And so that's what intermediate React aims to teach you, is these kind of extended ecosystem type of things. So the first thing I want you to do is go to bit.ly, B-I-T-L-Y. Bit.ly, rather, /react-v5. And that should take you to this website here. You can also just go to this link up there as well, those both work.

[00:00:47] These are my course notes, right? So you see that I have a Surface here. Literally what I have on what you see in front of you is what I have here as well. So If you get lost or anything like that, you can feel free to just jump into my notes and take a look at that as well.

[00:01:02] So, the thing to note about this website is both the complete the intro to React, the intro part is in here, and the intermediate part is. So, the introduction part is 1 through 15 here. So everything after conclusion is the intermediate part of this course. The thing to know about this is that we're still gonna use the same project from the first version of this course, and we're just going to augment that.

[00:01:32] Now, you don't have to have taken the introduction, it's helpful if you have, but you don't have to have taken the introduction to do this part of the course. The other thing to note, as opposed to the introduction, is each one of these is a branch, right? So each one of these is totally siloed.

[00:01:49] So if you wanna skip Emotion and go straight to Code Splitting, you can. So each one of these is totally in a different silo. As by way of introduction, you can read everything that I have here. But just to say who I am, my name's Brian Holt. I work at Microsoft.

[00:02:08] I used to be a cloud advocate, and now I'm a senior program manager on Node.js on Azure, as well as on Visual Studio Code. I live in Seattle with my wife and my dog. And I sometimes talk out in front in happy hour. I am a board member for Vet Who Code as well as a co-founder of the African conference, Concatenate.

[00:02:31] Feel free to catch up with me on social media here, I have all my links as well. And I'm stoked as always to be here at Frontend Masters teaching the stuff that I love to teach. And I'm really, really happy that they encouraged me to open source my materials so that you can share these with your coworkers, and with anyone.

[00:02:50] As always, it's really helpful for me if you star the repo on GitHub so that other people can find this as well. Cool. So inside of this introduction here, underneath where it says long series of numbers and letters. If you click on the repo is here, this'll take you to the GitHub repo for this course.

[00:03:12] So what you see here in the masterbranch is the finished a Complete Intro to React project, okay? So this is the state that it's in after you do the Complete Intro to React. What we're going to do for every single section of this particular course is we're gonna go back to the master branch, and then we're going to start again, right?

[00:03:33] So as soon as we finish Emotion, we're going to go back to the master branch, and then we're gonna start on server side rendering or something like that. So as soon as you're done with any section, just clear all your dependencies, remove your node modules, run npm install.

[00:03:45] And I'll remind you of these things as we're going along. Or you can just clone a new version of the repo or you can open a new branch, those are all fine things to do. But if you want to see, I have all of the complete work up here.

[00:03:58] If you click on this, you can see that there's code splitting. There's Emotion. These two are for the GitHub Pages, which is the course website. And then there's Redux, SSR, testing, and TypeScript. Those are all here as well. But again, for each new section, you just go back to a clean master branch.

[00:04:14] You might consider using something like Sourcetree, which you can get at sourcetreeapp.com. And this will help you if you're not super familiar with git. You can also use GitHub Desktop. I just use the command line. So feel free to use whatever suits you best. But I would suggest you take 's course called Git in Depth.

[00:04:38] Git is definitely a tool that's worth knowing.