This course has been updated! We now recommend you take the Complete Intro to React, v7 course.
Transcript from the "Using Yarn" Lesson
>> Brian Holt: So I'm gonna say Yarn, which is the same as npm install.
>> Brian Holt: And it's gonna go fetch all those packages. You're gonna get a bunch of these warnings. Ignore them, cuz we're using a bunch of alpha and beta versions today, cuz that's a good idea. [LAUGH] So it's gonna think that you have incorrect dependencies.
[00:00:20] They're fine, I promise. Just ignore the warnings, famous last words. But notice we just installed 800 dependencies, which is like Node problems, right? But that was only done in 11 seconds. If this was done on npm I imagine it would take a lot longer. So now if we go look into our node modules,
>> Brian Holt: I'm gonna say ls, and just look at how many, we definitely don't have all of these inside of our package.json, so where did all of these dependencies come from? Node-emoji, I did not install that [LAUGH]. Now that I know it exists, I want to, though. The reason is that Yarn installs all of your dependencies in a flat structure, and then it just links them together, right?
[00:01:14] So if you go into, I don't know, let's go to yargs. And we look inside of yargs,
>> Brian Holt: Interesting.
>> Brian Holt: Anyway, I'm not actually sure how it works. Now that I'm looking at it, nope. But, suffice it to say that they're assembling together when they request their dependencies.
[00:01:46] Whereas npm is gonna build this giant stretching tree of Node modules that contain Node modules, that contain Node modules, right? And so I think that's part of how Yarn gets its speed. And part of why it's more deterministic, cuz everything's very, very flat. But, beyond that, there's not much more to Yarn.
[00:02:07] So I wouldn't worry too much more about it than that. Any more questions about Yarn?
>> Speaker 2: Travis is asking, is there a common command to get started, like npm init?
>> Brian Holt: I think there's a Yarn init.
>> Brian Holt: Yarn init.
>> Brian Holt: So, yes, yes there is. Very similar.
>> Brian Holt: Yeah, Yarn has some really interesting features.
[00:02:36] Yarn upgrade interactive, this stuff is just amazing to me. Interactive
>> Brian Holt: I need to get out of here.
>> Brian Holt: So, Genesis is like, okay, you have these things that are out of date. These can be upgraded to these different things, right? This is just fantastic, right? There's amazing things that Yarn can do, and I'm just kinda scratching the surface here.
[00:03:10] It says, hey you know what? You actually have an axios 15.2, but there's actually 15.3 out there if you're interested in grabbing that. And you just say, you know what? I would like 15.3.
>> Brian Holt: What do I do? I hit space, and then I hit Enter, yep. And just like that, it just does it.
[00:03:34] And now we have 15.3.
>> Brian Holt: Cool, any other questions? I definitely invite you to explore on Yarn. They're adding cool stuff all the time.
>> Brian Holt: Okay, we're gonna do some global installs real quick.
>> Brian Holt: We'll just tackle those as we get them.
>> Speaker 3: Question from Richard. Why in your package.js is there a Preact library too?
>> Brian Holt: [LAUGH] So, late night hacking last night. I was like, you know what would be really cool? If I could just change my entire workshop over to be Preact, just like that. And so I tried last night at one in the morning or something like that. And it worked, and so I'm gonna teach it to you tomorrow.
[00:04:22] So we're gonna migrate our entire app to use Preact, which I will talk about tomorrow why you would even think about doing that. That's a good question, though.
>> Speaker 4: People snooping in the package.
>> Brian Holt: I know I can't keep anything from you people.
>> All: [LAUGH]
>> Speaker 4: There are no secrets.
>> Brian Holt: There are no secrets here.
>> Speaker 4: They will be discovered.
>> Brian Holt: That's true. That's good, though, I like that kind of investigation.