1 00:00:00,990 --> 00:00:08,420 We have package, Jason, we installed here dependencies and now we want to cover why having packages 2 00:00:08,430 --> 00:00:14,270 on is so crucial when we start sharing our project with other developers. 3 00:00:14,490 --> 00:00:20,280 And for this example, I'm going to use GitHub as well as a few basic commands. 4 00:00:20,400 --> 00:00:27,090 And my assumption is that since this is somewhat of a advanced course, you're already familiar with 5 00:00:27,090 --> 00:00:29,700 Git and GitHub and you have the account. 6 00:00:29,700 --> 00:00:35,580 If you don't, please stop the video, create the account and just use your favorite search engine to 7 00:00:35,580 --> 00:00:42,380 learn about the basics of setting up the GitHub repository as well as basic git commands. 8 00:00:42,780 --> 00:00:46,920 So our task is to push this up to to get. 9 00:00:47,490 --> 00:00:55,810 And now Melanda question, are we just pushing everything up, including the mode modules, which for 10 00:00:55,810 --> 00:00:58,170 the most projects is going to be somewhat big? 11 00:00:58,620 --> 00:01:05,940 I believe I just checked in our case it was like nine megabytes, but trust me, it always gets way 12 00:01:05,940 --> 00:01:12,870 bigger than that or we will just want to send the code and you can probably already guess that since 13 00:01:12,870 --> 00:01:20,940 I'm implying that the size is too big, that we'll have to push this up to the GitHub without the node 14 00:01:20,940 --> 00:01:21,360 modules. 15 00:01:21,690 --> 00:01:25,410 And I'll start by creating a dummy repo on a GitHub. 16 00:01:25,830 --> 00:01:27,990 So let me open up in your window. 17 00:01:28,350 --> 00:01:35,130 I'm going to go with GitHub and I'll just create a temp repo and then I'm just going to create a repo 18 00:01:35,460 --> 00:01:38,010 and I'm looking for these three commands. 19 00:01:38,610 --> 00:01:45,570 Essentially, I would want to get that URL, the raw material, so I know where to push it. 20 00:01:45,900 --> 00:01:53,160 And then instead of the repo before we set it up GitHub repo first I would want to go with new file 21 00:01:53,370 --> 00:02:01,050 and we'll create a get ignored because of course what I would want is to place the node modules in a 22 00:02:01,080 --> 00:02:05,310 get ignored file because that way they will be ignored by my source control. 23 00:02:05,580 --> 00:02:13,350 And I won't be pushing up this giant folder to get up because you'll see in a second that there is no 24 00:02:13,350 --> 00:02:13,860 need for it. 25 00:02:14,130 --> 00:02:17,340 So we're going to go with forward slash and then node modules. 26 00:02:17,340 --> 00:02:23,760 And if you're not familiar with get ignored, there's just a file that specifies which files are going 27 00:02:23,760 --> 00:02:25,680 to be ignored by the source control. 28 00:02:26,160 --> 00:02:30,390 In our case, as you can see, I'm placing node modules inside there. 29 00:02:30,600 --> 00:02:37,470 Then I'll clear my console and I'll just initialize this as an empty git repo online. 30 00:02:37,470 --> 00:02:38,760 We'll add everything. 31 00:02:38,850 --> 00:02:40,950 So get and get Kemet. 32 00:02:41,400 --> 00:02:43,490 We'll just say first Kimmett. 33 00:02:44,910 --> 00:02:52,970 First comment and then I'll copy and paste those three commands in order to set up that Yoro, the remote 34 00:02:52,980 --> 00:03:00,430 YORO and once I have a service in place, should be able to go back to my GHURAYB Armadas. 35 00:03:00,570 --> 00:03:02,100 This is my REPL. 36 00:03:02,790 --> 00:03:10,230 Now, probably your next question is, OK, so we pushed it up to the up, but I can clearly see that 37 00:03:10,230 --> 00:03:11,310 in my just. 38 00:03:11,670 --> 00:03:15,210 Well technically I'm using the lower dependancy. 39 00:03:15,210 --> 00:03:22,200 Right, but we didn't push up the node modules folder so how the person who is going to get this repo 40 00:03:22,530 --> 00:03:27,570 will be able to run the code in the U.S. since there's no note modules. 41 00:03:27,570 --> 00:03:33,210 And you told us previously that we could only run it if the dependencies there. 42 00:03:33,540 --> 00:03:34,470 Well, let's check it out. 43 00:03:34,800 --> 00:03:42,750 I'm going to go with Klown option, so I'll just get to your URL and navigate back here and I'll do 44 00:03:42,750 --> 00:03:44,370 that in my stop again. 45 00:03:44,370 --> 00:03:45,300 It doesn't really matter. 46 00:03:46,080 --> 00:03:49,230 We're just going to go with desktop and then get clone. 47 00:03:49,590 --> 00:03:52,050 Now I copy and paste the URL. 48 00:03:52,260 --> 00:03:58,560 I'll open up a new instance of my text header, copy and paste. 49 00:03:58,920 --> 00:04:00,630 And this is where the magic happens. 50 00:04:01,350 --> 00:04:09,960 If we have package JSON, we simply need to run, NPM, install and what is going to happen? 51 00:04:10,500 --> 00:04:20,130 The NPM will check for dependencies that we have in the packages and automatically set up that node 52 00:04:20,130 --> 00:04:21,050 modules folder. 53 00:04:21,329 --> 00:04:27,330 So if I go here, first of all, I can see that there has been some changes that is already good news. 54 00:04:27,660 --> 00:04:32,930 That just means that I have my node modules and if I refresh, check it out. 55 00:04:33,450 --> 00:04:41,340 So now of course I have my node modules folder and if you have been using react applications, you probably 56 00:04:41,340 --> 00:04:48,300 already familiar with this one where again, when you are setting up the code, you are not sharing 57 00:04:48,300 --> 00:04:49,470 the node modules folder. 58 00:04:49,710 --> 00:04:53,550 And I can showcase that by taking a look at my Riak project. 59 00:04:53,940 --> 00:04:55,230 And that's not what I wanted. 60 00:04:55,320 --> 00:05:03,540 And when I look at my awesome picture when I want, it is a react and lets go with project and you'll 61 00:05:03,540 --> 00:05:12,030 see that in that repo we have a bunch and a bunch of folders and each folder has two more folders final 62 00:05:12,030 --> 00:05:13,800 and set up and now check it out. 63 00:05:14,070 --> 00:05:18,720 None of them have the node modules because imagine the size of the sucker. 64 00:05:18,840 --> 00:05:27,870 If I would push for every project, for every folder, the node modules instead I have packages on. 65 00:05:28,080 --> 00:05:35,520 So when you get repoll, when you clone the repo or download or whatever, then of course you get the 66 00:05:35,520 --> 00:05:37,680 packages on and in here. 67 00:05:38,040 --> 00:05:43,320 These are the dependencies and you just run NPM install and they are being installed. 68 00:05:43,710 --> 00:05:49,710 OK, hopefully it is clear that why it is so crucial to have the packages on because we can just share 69 00:05:49,710 --> 00:05:54,900 the code without dragging the massive node modules folder with us. 70 00:05:55,410 --> 00:05:59,940 We can simply just provide what packages our project is using. 71 00:06:00,540 --> 00:06:09,570 And then once we get the repo, then we just want NPM install not just the command and install all the 72 00:06:09,570 --> 00:06:12,210 packages that are in the dependencies.