1 00:00:00,240 --> 00:00:00,600 Okay. 2 00:00:00,600 --> 00:00:03,870 And up next, let's prepare for deployment. 3 00:00:04,560 --> 00:00:13,260 We're basically we want to add a few scripts to the package JSON and we want to simulate the server 4 00:00:13,350 --> 00:00:14,280 environment. 5 00:00:14,490 --> 00:00:20,640 We need to keep in mind that once we push this up to a server, the platform we're going to use is going 6 00:00:20,640 --> 00:00:22,470 to be looking for two things. 7 00:00:22,950 --> 00:00:28,070 The command we want to run every time, basically deployment starts. 8 00:00:28,080 --> 00:00:35,430 So in our case, that is we want to install client dependencies, we want to set up production build 9 00:00:35,520 --> 00:00:40,010 and we want to run the NPM install for server. 10 00:00:40,020 --> 00:00:46,650 So we also want to install dependencies on the server and then we'll have to provide a command like 11 00:00:46,650 --> 00:00:51,420 for example, node server, which is going to spin up our application. 12 00:00:52,160 --> 00:00:54,050 And therefore in this video. 13 00:00:54,950 --> 00:00:56,360 We'll set up those commands. 14 00:00:56,630 --> 00:00:57,790 We'll set up two of them. 15 00:00:57,800 --> 00:01:02,540 So we already have the I believe it was build client. 16 00:01:02,600 --> 00:01:03,200 Correct. 17 00:01:03,200 --> 00:01:07,910 Which built out the production ready application on the client. 18 00:01:07,940 --> 00:01:09,950 Now we'll go with install client. 19 00:01:09,950 --> 00:01:13,540 So now install dependencies and then we'll set up that command. 20 00:01:13,550 --> 00:01:15,890 So this is the command we will run on the server. 21 00:01:16,590 --> 00:01:23,100 Now, please keep in mind that by the end of the video, this video, the application needs to work 22 00:01:23,100 --> 00:01:23,850 locally. 23 00:01:24,060 --> 00:01:27,240 It's not going to magically start working on the server. 24 00:01:27,240 --> 00:01:31,200 If it doesn't work locally, then you need to troubleshoot. 25 00:01:31,530 --> 00:01:32,760 Please keep that in mind. 26 00:01:33,000 --> 00:01:38,580 And in order to simulate the server environment in a client, we will remove two folders. 27 00:01:38,580 --> 00:01:44,400 The build one and other modules effectively will start from scratch and the same goes on the server. 28 00:01:44,460 --> 00:01:49,800 We will remove the node modules, then we'll set up the commands, then we'll run them and we'll see 29 00:01:49,800 --> 00:01:57,150 whether everything works by the end of the video or application, in my case at least, needs to work 30 00:01:57,150 --> 00:01:59,400 perfectly on local host. 31 00:01:59,400 --> 00:02:01,740 5000, so not 3000. 32 00:02:02,010 --> 00:02:04,030 We're not going to be using concurrently anymore. 33 00:02:04,050 --> 00:02:05,040 5000. 34 00:02:05,160 --> 00:02:06,630 And the reason why I keep. 35 00:02:07,370 --> 00:02:08,449 Repeating this. 36 00:02:09,030 --> 00:02:10,199 Is because. 37 00:02:10,870 --> 00:02:14,920 Once in a while I get the questions about the deployment. 38 00:02:15,750 --> 00:02:18,960 And when I take a look at the project, I can see that it doesn't work locally. 39 00:02:19,290 --> 00:02:21,330 So there's no magic on the server. 40 00:02:21,330 --> 00:02:25,160 If it doesn't work locally, it's not going to work on the server. 41 00:02:25,170 --> 00:02:26,580 Hopefully that is clear. 42 00:02:26,820 --> 00:02:30,000 So now let's start with a cleanup. 43 00:02:30,150 --> 00:02:36,270 First, let's remove, build and the node modules from the client. 44 00:02:36,600 --> 00:02:38,430 So start here from the scratch. 45 00:02:39,200 --> 00:02:39,800 Here. 46 00:02:40,570 --> 00:02:41,710 And here. 47 00:02:42,400 --> 00:02:42,590 Great. 48 00:02:42,660 --> 00:02:43,250 Good. 49 00:02:43,810 --> 00:02:47,740 Then we want to remove the node modules. 50 00:02:48,500 --> 00:02:55,490 From the server and this is totally optional, but I'll also remove the package lock just because. 51 00:02:55,880 --> 00:02:56,950 So let's remove it. 52 00:02:56,960 --> 00:03:01,180 Now, let's navigate to the script and let's add those additional scripts. 53 00:03:01,190 --> 00:03:04,190 And as they're not, we might as well can stop. 54 00:03:05,080 --> 00:03:07,090 Right now the server. 55 00:03:07,330 --> 00:03:12,430 So let's go to package JSON on a server and this is not happening on a client. 56 00:03:12,430 --> 00:03:13,840 In fact, I'll close it here. 57 00:03:14,140 --> 00:03:21,070 We're looking for package JSON on a server and in the previous, in one of the previous videos, we 58 00:03:21,070 --> 00:03:25,870 set up this build client, correct again, which created that production ready application. 59 00:03:25,960 --> 00:03:33,250 Now we want to install dependencies as well and then we want to run both of them plus. 60 00:03:34,280 --> 00:03:36,920 Installed dependencies on the server. 61 00:03:36,920 --> 00:03:40,910 So think of this way we want to install dependencies on a client. 62 00:03:40,910 --> 00:03:45,830 We want to build production or the application on the client, and then we want to install dependencies 63 00:03:45,830 --> 00:03:52,190 on the server and at the very end we'll run the server and as a result, our application, the entire 64 00:03:52,190 --> 00:03:55,070 application is going to run on the server. 65 00:03:55,820 --> 00:04:00,590 So let's try this one out where we want to go with install client. 66 00:04:00,590 --> 00:04:04,550 And here the value is going to be CD client. 67 00:04:04,820 --> 00:04:06,710 So again, we'll navigate over there. 68 00:04:06,920 --> 00:04:10,100 However, we'll go and PM install. 69 00:04:10,370 --> 00:04:17,990 Now we install those dependencies and now let's set up that command that pretty much is going to do 70 00:04:17,990 --> 00:04:26,300 all of the heavy lifting, let's say here, set up production and then let's run first install client. 71 00:04:26,300 --> 00:04:30,050 So now PM around install client. 72 00:04:30,230 --> 00:04:33,140 So this is the command that we just created. 73 00:04:33,620 --> 00:04:36,770 Client Then we want to run, build. 74 00:04:36,770 --> 00:04:45,560 Client Look me out of comma here because there's a bug show, NPM, run, build Client And then lastly 75 00:04:45,560 --> 00:04:53,360 we want to go with and PM and install so that installs on the server and I'm not going to repeat what 76 00:04:53,360 --> 00:04:54,380 these two are doing. 77 00:04:54,380 --> 00:04:55,730 You can clearly see that. 78 00:04:55,730 --> 00:05:03,260 So a build client, install client or just make sure that there are no typos because I'm an expert on 79 00:05:03,260 --> 00:05:03,890 doing them. 80 00:05:04,250 --> 00:05:13,610 And now let's go to a terminal, let's clear everything, then we'll run and PM run, set up production 81 00:05:13,850 --> 00:05:16,460 like so we'll run that one first. 82 00:05:16,460 --> 00:05:20,270 You'll see that we're installing the client. 83 00:05:20,270 --> 00:05:26,570 And as I don't, yes, it's going to take a little bit of time, so I'll kind of stop the video. 84 00:05:26,600 --> 00:05:31,730 I'll mention what we're doing and then we'll resume it. 85 00:05:32,330 --> 00:05:34,520 Once we're done installing dependencies. 86 00:05:34,700 --> 00:05:37,970 Now we're setting up the production build. 87 00:05:38,000 --> 00:05:46,160 So now we're building that production ready application on a client, and now we're done with the client 88 00:05:46,160 --> 00:05:52,460 and we're installing dependencies on the server and once the command is complete. 89 00:05:53,710 --> 00:05:57,830 Then we want to go with Node and then what is the name of your file? 90 00:05:57,850 --> 00:06:01,150 In my case, that is server and. 91 00:06:01,980 --> 00:06:03,730 Everything should work on local. 92 00:06:03,750 --> 00:06:05,700 Host 5000 again. 93 00:06:05,700 --> 00:06:07,260 Not 3000 anymore. 94 00:06:07,290 --> 00:06:08,230 5000. 95 00:06:08,250 --> 00:06:14,040 So if I go to 3000, I should get an error because there is no running server that supports that. 96 00:06:14,220 --> 00:06:20,010 So now let's go to local host 5000 and notice. 97 00:06:20,010 --> 00:06:21,960 That's my John user. 98 00:06:22,020 --> 00:06:28,110 Quickly just add a job and I mean if that works, then everything else should also work. 99 00:06:28,110 --> 00:06:34,920 So front end and then let's say Apple here, let's submit everything seems to be working. 100 00:06:35,100 --> 00:06:36,600 And if I go to all the jobs. 101 00:06:36,600 --> 00:06:37,920 Yep, there it is. 102 00:06:38,310 --> 00:06:40,530 And let me just quickly test. 103 00:06:41,550 --> 00:06:42,630 Lead them all up. 104 00:06:42,750 --> 00:06:44,820 And if that works, then for sure. 105 00:06:44,850 --> 00:06:47,550 Everything is ready to go. 106 00:06:47,670 --> 00:06:54,570 So effectively, then we can set up the GitHub repository and hosted on the render platform.