WEBVTT 00:00.320 --> 00:07.610 All right, so now that we've learned about pushing our images over to Docker Hub, I already went ahead 00:07.610 --> 00:10.460 and pushed each of these images. 00:10.460 --> 00:16.790 So I started off by building each image, uh, starting off with my username, the one that I use to 00:16.820 --> 00:18.500 log in to Docker Hub. 00:18.530 --> 00:20.990 Also, make sure that you're signed in. 00:21.890 --> 00:29.870 All right, followed by the image name, uh, the image repo in this case, and the image version, 00:29.870 --> 00:33.830 which is going to be 1.0.0 for each one. 00:33.830 --> 00:40.640 So order management, product catalog, uh inventory support team shipping and handling, profile management 00:40.640 --> 00:46.970 I tagged all of these images as 1.0.0 pushed them to Docker Hub. 00:46.970 --> 00:56.660 The only one I didn't tag as 1.0.0 was the e-commerce UI, because this application is not going to 00:56.690 --> 01:00.980 change between section three and section five, it's going to remain the same. 01:01.880 --> 01:04.490 Uh, but the other applications will change. 01:04.490 --> 01:08.210 That's why we're tagging them with semantic versioning. 01:08.210 --> 01:10.550 So go ahead and do that. 01:10.850 --> 01:15.530 Uh, push all of these images over to Docker Hub. 01:16.580 --> 01:17.150 Okay. 01:17.180 --> 01:25.610 For e-commerce UI, you should only have one image tag of latest whereby whoever needs to create a container 01:25.610 --> 01:32.240 from this image or whoever needs to pull this image can just use the following command. 01:32.240 --> 01:43.100 And then once you have that pushed, copy the readme, uh inside of your course resources into the repository. 01:43.100 --> 01:43.850 Overview. 01:43.880 --> 01:47.630 This informs whoever needs to create a container out of this image. 01:47.630 --> 01:49.430 How to do it properly. 01:49.760 --> 01:55.340 Uh, what the application, what the e-commerce UI app relies on in order to run. 01:55.340 --> 02:01.360 So the six different API's running in six different containers, as well as the environment variables 02:01.360 --> 02:07.660 that it relies on in order to connect to the applications running inside of these containers, so on 02:07.660 --> 02:08.410 and so forth. 02:08.410 --> 02:13.150 So the e-commerce UI should have one tag. 02:13.450 --> 02:20.170 Uh, every other microservice should have a tag of 1.0.0. 02:20.170 --> 02:22.780 So the e-commerce UI has a tag of latest. 02:22.780 --> 02:26.860 All of these should have tags of 1.0.0 for now okay. 02:26.890 --> 02:29.560 We're not going to give them the latest tag yet. 02:30.520 --> 02:32.890 So that's it. 02:32.920 --> 02:44.350 Now what I want to do, uh, before we move on to the next section, is go over to images and delete 02:44.350 --> 02:50.740 everything, because going forward we're going to start grabbing stuff from Docker Hub. 02:50.770 --> 02:52.390 Not all of them were deleted. 02:52.390 --> 02:53.350 That's fine. 02:53.350 --> 02:55.660 We'll delete the containers Tanner's first. 02:58.360 --> 03:02.710 Now delete the rest of the images because there were some containers that were lying on them. 03:02.710 --> 03:05.710 That's why I didn't delete no volumes. 03:05.710 --> 03:13.780 And now that we've deleted everything, I'm going to say Docker system prune dash A just to make sure 03:13.780 --> 03:15.760 that it deletes everything else. 03:16.840 --> 03:19.630 And it deleted the network that we created. 03:20.050 --> 03:20.710 All right. 03:20.740 --> 03:25.930 Now we're ready to move on to the Docker compose section. 03:28.060 --> 03:28.600 All right. 03:28.600 --> 03:31.870 So let's set up our Docker compose file. 03:31.900 --> 03:35.920 I still have every single command that we use to set up each container. 03:35.920 --> 03:43.240 So what I'm going to do is copy these commands over to my docker compose YAML file. 03:43.240 --> 03:46.330 So that's the command for the profile management service. 03:46.780 --> 03:51.490 That's the command for the wow for the e-commerce UI service. 03:51.910 --> 03:52.840 It's a long one. 03:52.840 --> 03:59.520 Let me copy the one that I have over to Docker Hub, because I also added formatting into that command, 04:00.120 --> 04:04.980 which should make it easier to look at. 04:06.540 --> 04:07.470 All right. 04:07.530 --> 04:10.950 E-commerce UI shipping and handling. 04:17.160 --> 04:24.210 Because basically in your Docker compose YAML, instead of creating the containers inside of your shell 04:24.210 --> 04:31.830 using the docker run command, you can create the container configuration inside of Docker-compose.yaml, 04:31.830 --> 04:33.690 just called Docker compose up. 04:33.690 --> 04:38.820 When you need to create the containers and docker compose down when you need to destroy them. 04:38.850 --> 04:43.440 Making things very easy to manage. 04:44.280 --> 04:47.640 Copying this over the product catalog. 04:47.670 --> 04:50.220 The order management. 04:51.390 --> 04:56.940 All right, so what should we start setting up first? 04:56.970 --> 05:00.420 How about the hardest one, the e-commerce UI? 05:01.380 --> 05:05.250 Well, we got to start with the e-commerce UI anyways because that's the UI. 05:05.310 --> 05:11.490 So um, version three, the services, the first service is going to be the e-commerce UI. 05:11.520 --> 05:17.010 So right here we're declaring that we're going to create a container named e-commerce UI. 05:17.040 --> 05:24.000 The image from which we're going to create the e-commerce UI container is going to be our slim 087 slash 05:24.030 --> 05:26.430 e-commerce UI. 05:27.060 --> 05:27.960 All right. 05:28.680 --> 05:30.480 The one I pushed on to Docker Hub. 05:30.510 --> 05:34.800 Make sure to use the image that you pushed. 05:35.100 --> 05:39.600 I'm pretty sure my repo is public, so you might be able to use mine. 05:39.600 --> 05:45.840 But anyways, the container name we're going to specify as e-commerce UI. 05:45.870 --> 05:51.890 By default it should have this name, but I want to explicitly specify a container name as well. 05:52.250 --> 05:52.730 Ports. 05:52.730 --> 06:00.890 We don't actually need to do any port mapping, but anyway, let's just be consistent with our command. 06:01.190 --> 06:09.020 And now the application relies on environment variables in order to run there. 06:09.320 --> 06:13.280 Let's just copy every single environment variable that we have here. 06:13.340 --> 06:17.240 So react app profile API host. 06:17.810 --> 06:19.850 Set that equal to that. 06:22.670 --> 06:24.410 I'm just going to copy this. 06:24.710 --> 06:26.120 Five six. 06:26.510 --> 06:28.730 Product API host. 06:29.210 --> 06:31.220 Product catalog. 06:36.230 --> 06:38.090 Product inventory. 06:40.340 --> 06:42.740 React order API host. 06:42.920 --> 06:45.110 Order management. 06:46.910 --> 06:48.050 Shipping API. 06:48.080 --> 06:51.950 Host shipping and handling. 06:53.330 --> 06:54.410 Contact API. 06:54.440 --> 06:55.160 Host. 06:55.190 --> 06:56.570 Contact. 06:56.780 --> 06:58.100 Support team. 06:59.390 --> 07:02.060 All right, that's all. 07:02.060 --> 07:04.010 That's all we need to do. 07:04.790 --> 07:11.000 And now what I want to do for the sake of practice is have, is to make sure that this e-commerce UI 07:11.030 --> 07:12.650 runs last. 07:12.680 --> 07:19.130 I can do this by specifying what this container depends on in order to run properly. 07:19.160 --> 07:24.620 It depends on the profile management container starting up first. 07:25.340 --> 07:27.680 It depends on a bunch of other containers. 07:27.680 --> 07:29.090 Product catalog. 07:29.090 --> 07:33.200 We haven't defined those containers yet, but rest assured they will have these names. 07:33.200 --> 07:35.600 Product inventory. 07:37.880 --> 07:42.770 I'll be very surprised if by the end of this I don't make any like typos or anything. 07:42.920 --> 07:43.670 We'll see. 07:43.700 --> 07:44.090 Order. 07:44.090 --> 07:45.020 Management. 07:45.020 --> 07:46.670 Shipping and handling. 07:50.660 --> 07:52.430 Contact support team. 07:53.060 --> 08:00.260 So because the e-commerce UI container depends on all of these containers being started up first, it's 08:00.260 --> 08:03.830 not going to start up until all of these have launched before it. 08:03.860 --> 08:09.470 So it depends on allows you to dictate the order in which containers are started up. 08:09.800 --> 08:10.460 All right. 08:10.460 --> 08:13.910 So we're done with the first service. 08:14.480 --> 08:18.560 The next one we can do is profile management. 08:18.770 --> 08:19.730 All right. 08:19.730 --> 08:24.650 So the next container is going to be called profile management. 08:26.720 --> 08:27.770 Uh with the YAML. 08:27.800 --> 08:30.020 Indentation is really really important. 08:30.020 --> 08:36.500 So make sure to specify the profile management container at the same level as the e-commerce UI container. 08:36.530 --> 08:37.460 All right. 08:37.490 --> 08:45.370 Whereby anything below anything after the tab Belongs to profile management. 08:45.370 --> 08:54.550 So this container is going to be created from the image are slim 087 excuse me slash profile management 08:55.240 --> 09:00.460 10.0.0 knows is getting really itchy. 09:00.490 --> 09:04.930 Container name profile management. 09:04.930 --> 09:11.230 We got to be consistent with what we have here because the e-commerce UI container depends on the creation 09:11.230 --> 09:16.840 of this container before it can start up, uh, ports. 09:18.760 --> 09:22.150 Um 3003 what was the port mapping? 09:22.960 --> 09:25.810 33033303 09:27.250 --> 09:31.390 okay, that one doesn't rely on any environment variables. 09:31.420 --> 09:32.710 All right. 09:32.800 --> 09:36.550 The next one we got to create is product catalog. 09:37.060 --> 09:45.040 That container is going to be created from the image our slim 087 Again, make sure to use your username. 09:45.730 --> 09:52.360 Um, product catalog 1.0.0. 09:53.320 --> 09:57.490 Um, container name product catalog. 09:57.490 --> 10:08.860 Staying consistent with what we have here, just copy it just to make sure ports ports is going to be. 10:11.050 --> 10:14.410 Uh 30013301 10:15.910 --> 10:16.840 okay. 10:17.380 --> 10:24.700 The next one is going to be, um, product inventory. 10:28.840 --> 10:40.380 The container will be created from the image are slim 087 slash product inventory 0.0. 10:40.380 --> 10:41.760 Container name. 10:43.170 --> 10:44.010 Um. 10:44.040 --> 10:45.900 Product inventory. 10:48.180 --> 10:51.060 Ports going to be. 10:53.100 --> 10:56.760 30023002. 10:58.110 --> 10:59.100 All right. 10:59.820 --> 11:01.440 Next container. 11:04.500 --> 11:11.070 Is going to be, um, the product support team. 11:11.070 --> 11:13.110 No contact support team. 11:15.540 --> 11:18.510 Which will be created from the image. 11:19.800 --> 11:20.610 Is this right? 11:20.640 --> 11:23.040 Oh, too much spacing again. 11:23.040 --> 11:26.700 Uh, make sure that your spacing is consistent. 11:26.700 --> 11:30.390 It matters a lot when creating YAML files. 11:30.420 --> 11:38.610 YAML configurations this will be created from the image are slim 087 slash Contact Support Team version 11:38.610 --> 11:40.230 1.0.0. 11:40.260 --> 11:41.940 Container name. 11:42.300 --> 11:45.420 Contact support team. 11:45.420 --> 11:48.180 Make sure it's consistent with what we have here. 11:50.370 --> 11:55.830 So this is a good practice because if the container for some reason doesn't exist or you forgot to define 11:55.830 --> 12:02.880 it, this will throw an error because the e-commerce UI depends on that container being present within 12:02.880 --> 12:07.950 the same Docker compose network, within the same docker compose environment. 12:07.950 --> 12:14.730 So that's the image container name ports uh 8008 thousand. 12:15.180 --> 12:21.600 We don't need to do container mapping because, uh, the e-commerce UI is going to connect to it directly 12:21.600 --> 12:23.130 within the same network. 12:23.310 --> 12:29.250 Uh, the port mapping is more so for us if we decide to troubleshoot the app by accessing its endpoints 12:29.250 --> 12:30.210 from the browser. 12:30.240 --> 12:35.760 Lastly, we are going to set up the order management. 12:37.470 --> 12:47.070 Um service, whose image will be, uh, derived from pulled from Docker Hub R slim 087 order management 12:47.070 --> 12:48.690 1.0.0. 12:48.690 --> 12:53.370 Container name will be order management ports. 12:53.370 --> 12:56.310 That's going to be 9090. 12:57.630 --> 12:58.650 All right. 12:58.650 --> 13:08.520 And the order management microservice relies on three environment variables in order to run uh so environment 13:09.120 --> 13:11.910 product inventory API host. 13:11.940 --> 13:17.010 We set that equal to HTTP product inventory. 13:17.610 --> 13:18.990 All right. 13:19.770 --> 13:22.620 Uh product catalog API host. 13:23.160 --> 13:31.320 We set that equal to HTTP product catalog shipping and handling API host. 13:31.770 --> 13:33.810 We set that equal to. 13:35.810 --> 13:37.130 Shipping and handling. 13:40.190 --> 13:44.090 Ensuring that these match the container names. 13:44.630 --> 13:45.740 All right. 13:46.220 --> 13:50.000 Um, I hope I didn't make any mistakes. 13:50.750 --> 13:51.890 Let's try this out. 13:53.270 --> 13:56.360 We don't need any of these. 13:57.770 --> 13:58.310 Uh. 14:00.470 --> 14:01.250 Whatever. 14:01.340 --> 14:04.010 I'll start it up again later. 14:04.220 --> 14:08.990 Uh, CD we're going to go to. 14:11.180 --> 14:13.460 Workbook starter projects. 14:14.270 --> 14:16.730 Oh, for starter projects. 14:16.820 --> 14:20.360 Then I'm just going to say docker compose up. 14:24.830 --> 14:30.740 Service ecommerce UI depends on undefined service shipping and handling. 14:30.770 --> 14:31.310 Cool. 14:31.310 --> 14:32.900 So I must have missed one of them. 14:32.930 --> 14:34.640 Shipping and handling. 14:34.640 --> 14:36.950 Is that what we call the container? 14:43.940 --> 14:49.100 Oh, I totally missed the shipping and handling microservice. 14:49.100 --> 14:53.810 So shipping and handling. 14:56.840 --> 15:00.410 Let me go to Docker Hub because I forgot what the image name for that one was. 15:00.440 --> 15:02.060 Oh, just shipping and handling. 15:03.620 --> 15:04.460 Cool. 15:11.930 --> 15:13.550 I knew I was missing something. 15:13.670 --> 15:16.100 These things never just work from the beginning. 15:16.580 --> 15:19.640 Uh, we'll call the container shipping and handling. 15:22.760 --> 15:28.880 Here you can see the Order management API is trying to connect to the application running inside the 15:28.880 --> 15:30.530 shipping and handling container. 15:30.530 --> 15:34.180 or that will be running inside of that container ports. 15:34.630 --> 15:36.790 What port is it using? 15:36.970 --> 15:39.130 Let's just go into the code itself. 15:42.820 --> 15:43.120 80. 15:43.150 --> 15:43.720 80. 15:47.470 --> 15:48.250 80. 15:48.610 --> 15:48.970 80. 15:49.000 --> 15:49.780 80. 15:50.560 --> 15:52.150 Docker compose up. 15:54.700 --> 15:55.210 All right. 15:55.210 --> 15:58.090 It's pulling all the images from Docker Hub. 16:29.410 --> 16:29.860 All right. 16:29.860 --> 16:32.890 It seems like everything is up and running. 16:32.920 --> 16:35.230 We'll go to localhost 4000. 16:36.280 --> 16:38.140 Um, product catalog. 16:38.140 --> 16:39.490 We'll try to order something. 16:39.490 --> 16:41.290 Everything works nicely. 16:41.290 --> 16:41.650 Order. 16:41.650 --> 16:42.400 Management. 16:42.400 --> 16:42.820 Place. 16:42.820 --> 16:43.690 Order. 16:43.960 --> 16:45.010 All right. 16:45.340 --> 16:49.660 Um, this might not work because you need to sign out and sign back in, but whatever. 16:49.690 --> 16:51.250 I don't feel like doing that. 16:51.400 --> 16:55.930 And, uh, that's it for Docker compose. 16:55.930 --> 17:03.850 So all we did was we basically rewrote all of these commands as configurations in a YAML file. 17:04.090 --> 17:04.960 That's all. 17:04.960 --> 17:14.230 But the beauty about this is that now I can just create another terminal and say docker compose down 17:15.790 --> 17:21.970 up another terminal and go into the appropriate directory workbook starter projects oh three Starter 17:21.970 --> 17:29.640 projects oh four Starter projects And say docker compose down. 17:31.680 --> 17:34.920 So that's going to stop all of my containers. 17:50.610 --> 17:54.510 And after it does that's it. 17:54.540 --> 17:56.760 I'm just going to make sure I go here. 17:57.540 --> 17:58.860 Got no running containers. 17:58.860 --> 18:02.430 I've got all of these images that were pulled from Docker Hub. 18:02.550 --> 18:04.080 I'm going to delete them. 18:06.990 --> 18:08.220 Deletion failed. 18:08.220 --> 18:08.700 Nope. 18:08.700 --> 18:09.900 It did not fail. 18:10.200 --> 18:11.580 And perfect. 18:12.060 --> 18:13.140 That's all for this section. 18:13.140 --> 18:18.960 In the next section we're going to connect most of these most of these applications to some sort of 18:18.960 --> 18:20.220 database. 18:20.220 --> 18:24.060 And we're going to update our images and push them over to Docker Hub. 18:24.090 --> 18:25.410 See you there.