This course has been updated! We now recommend you take the Complete Intro to React, v8 course.

Check out a free preview of the full Complete Intro to React, v7 course:
The "npm" Lesson is part of the full, Complete Intro to React, v7 course featured in this preview video. Here's what you'd learn in this lesson:

Brian demonstrates how to get started installing and saving packages by initializing npm and generating the starting package.json file.

Get Unlimited Access Now

Transcript from the "npm" Lesson

>> So we're gonna take a step away for a second from all of our react writing code, and we're gonna move into a new frontier of compiled code. And using build tools, and we're gonna make react reading a lot more pleasant. So again, no one I know writes react without some sort of bills stuck, cuz they all use this JSX, they always use stuff like that.

[00:00:25] And I think you'll hopefully understand why, if you don't understand why, just stick with me until the end of the course. And if you still don't like it I mean, you're wrong but sure, whatever, that's fine. You can go back to writing it this way. Yeah, we're here on JS tools.

[00:00:40] We're gonna start with NPM. NPM does not stand for Node JS Package Manager, but it is the Node JS Package Manager. What does it stand for? I don't know, they won't say. Microsoft bought NPM while I still worked there, and I asked all right, what does it actually stand for?

[00:00:58] They were like not Node Package Manager. So I imagine many of you have used it before, it's a great tool, makes writing JavaScript fairly easy. So, we're gonna be using that. If you have installed Node JS, you've installed NPM, I guess technically, if you do it through Ubuntu as package manager, NPM doesn't come.

[00:01:20] Anyway, if you're doing it through Ubuntu, you can figure out how to get NPM on your own. We're gonna start by creating a package dot JSON for our project using NPM. So I want you to head over to whatever your favorite terminal is. Mine is through VS code, but you can do it through whatever you want.

[00:01:40] I'm using ZSH here, but this will work out for bash. Probably work for FishShell, and it should work for PowerShell as well. I'm far less familiar with PowerShell, despite working directly adjacent to that team at Microsoft, I don't ever use it. But anyway, i'm supposing mostly that you know how to use NPM if you're here.

[00:02:00] So I want you to come here into your project, i'm in my adopt me projects here, i'm going to say npm init. And if you just hit enter right now, it will ask you a bunch of questions like, what do you wanna call your project? Where's the repo?

[00:02:15] What's the test command? If you just hit- y, just saying I don't care, make it whatever you want. So you can see here, it just generate this package at json with a bunch of very basic things here. So, if I make the test command that doesn't do anything, makes a licensed ISC which I think is a very permissive MIT style license, I tend to make everything Apache 2.0.

[00:02:44] But that is up to you, you can just leave it as it is. I don't know why I decided to talk about that, but it doesn't matter. You can make it, whatever you want it to be. The point of doing this is now, we have somewhere where we can track all of our dependencies, right?

[00:02:57] So if I say npm install react, it'll say cool, i'm gonna give you the latest version of react. It'll keep track of what version you're installing here in your package dot Json. And this allows us to build up our project as we go, so don't install react yet by the way.

[00:03:11] We'll get there, But not yet. Someone's probably gonna ask me why are we not using Yearn? Because I don't care, is really the best answer to that question. Yearn is fine, Yearn is a great tool, and if you feel like using Yearn, knock yourself out, or why don't you use npmpm?

[00:03:29] Pmpm is that what it is? Performance npm, i've never used it, so that's why we're not using it. Anyway, NPM does a really good job of looking at other players in the ecosystem, and pulling in their best features. So, I'm just using NPM mostly because I know the team, and if something goes wrong, I can yell at them.

[00:03:47] That's really the real answer to that question.