1 00:00:00,180 --> 00:00:07,530 In this section, we will discuss a lot about cars and CSR, which are most common topics related to 2 00:00:07,530 --> 00:00:10,660 security and hotspring security handles them. 3 00:00:10,860 --> 00:00:19,650 So before we jumping onto the cars and CSR discussion, let's try to set up our easy bank UI application 4 00:00:19,830 --> 00:00:26,130 so that we can call that our application through your browser and we can establish a communication link 5 00:00:26,130 --> 00:00:27,750 between the front end and the back. 6 00:00:27,990 --> 00:00:35,310 In the process, we will encounter the issues related to cars and CSR and we'll see how to resolve them 7 00:00:35,310 --> 00:00:42,750 using security, our dads, the sample uncaught and the sample installation and the steps that you need 8 00:00:42,750 --> 00:00:47,550 to follow to set up the UI project that I'm going to discuss in the coming videos. 9 00:00:48,030 --> 00:00:55,500 So the steps that we have to follow to set up the way of the Easy Bank application that I have attached 10 00:00:55,500 --> 00:00:56,340 to this video. 11 00:00:56,610 --> 00:01:02,730 The very first thing is, since this is an angular based project, you should have a node installed 12 00:01:02,730 --> 00:01:10,580 in your system for that, go to the sea wall and install the node dodgiest aspirator operating system. 13 00:01:10,740 --> 00:01:18,600 And once the installation is completed, you can check with the node dot hyphen v command, which will 14 00:01:18,600 --> 00:01:21,870 tell you what is the version I installed in your system. 15 00:01:21,890 --> 00:01:30,990 Post that using the NPM command, which is a node command, we have to install the angular seal so that 16 00:01:30,990 --> 00:01:35,430 we can perform various commands, relate to the angular project. 17 00:01:35,550 --> 00:01:44,280 After you install Anglicised through this command NPM install minus the Aderet anglers smashingly go 18 00:01:44,280 --> 00:01:46,020 to the visual code. 19 00:01:46,260 --> 00:01:51,060 You order and install the visual core idea in your system. 20 00:01:51,210 --> 00:01:57,090 So we'll use visual studio core for our Ucore developing. 21 00:01:57,090 --> 00:02:01,080 Running for all those faces will use this idea after that. 22 00:02:01,410 --> 00:02:04,820 Download the project that I have attach along with this video. 23 00:02:05,130 --> 00:02:08,979 Once you download extract and this is how it looks. 24 00:02:09,210 --> 00:02:14,220 You can see there is a package Dargis and file inside this you will project. 25 00:02:14,490 --> 00:02:16,800 This is very similar to our Mavin. 26 00:02:17,250 --> 00:02:23,340 So just like how we have imagined dependencies defined in the back and the similar way we have packaged 27 00:02:23,880 --> 00:02:31,920 and for all the angular applications here, we have all the dependencies declared navigate to this folder 28 00:02:32,190 --> 00:02:35,400 and run the command NPM install. 29 00:02:35,850 --> 00:02:42,870 This will install all the dependencies that you need to run this project by creating a folder called 30 00:02:43,140 --> 00:02:46,260 Nor Underscored Modules in the same folder. 31 00:02:46,650 --> 00:02:55,410 Once that is done in the project using the Visual Studio code, once you reimport it is how it looks 32 00:02:55,590 --> 00:02:58,700 when you have a project bank approval. 33 00:02:58,950 --> 00:03:02,070 And there are these are all the dependencies that has been installed. 34 00:03:02,070 --> 00:03:07,530 When you run NPM install and you have all the source code which will be discussing in the coming various 35 00:03:07,830 --> 00:03:16,830 was that open the terminal, navigate the project Bankcorp UI here you have to run the command in. 36 00:03:17,020 --> 00:03:20,840 So which will build and start the project in your system. 37 00:03:20,970 --> 00:03:28,050 So for that I'm just running in this so and so internally we'll use Angliss to allay dependency. 38 00:03:28,050 --> 00:03:31,890 That's why we have installed Anglicised also in the previous steps. 39 00:03:32,130 --> 00:03:39,330 If we are doing this very first time, it will take some time to compile and build your application. 40 00:03:39,570 --> 00:03:42,090 Please wait for the hundred percent to complete. 41 00:03:42,390 --> 00:03:51,270 But if you encounter any issues while setting up this workspace, please try to Google the issues that 42 00:03:51,270 --> 00:03:52,440 you have encountered. 43 00:03:52,590 --> 00:03:57,980 And if you're still not able to resolve them, please post your questions in the Q&A section. 44 00:03:58,140 --> 00:04:02,130 So now the angular application is up and running. 45 00:04:02,370 --> 00:04:09,030 That's where we have received one hundred percent company successfully and the application is serving 46 00:04:09,030 --> 00:04:13,110 at the old localhost for two double zero. 47 00:04:13,410 --> 00:04:22,650 We can validate by going to the Ural localhost for to double zero and this is the UI of this project. 48 00:04:22,890 --> 00:04:28,290 So let's try to understand what we have written inside this Ucore and a high level. 49 00:04:28,290 --> 00:04:36,300 I know this is not focusing on the angular, but I just wanted to you understand the basic details of 50 00:04:36,300 --> 00:04:42,990 this project and how it is going to come and get to the back and so are back and the services that we 51 00:04:42,990 --> 00:04:48,320 have built and in between how we are going to implement bring security between them. 52 00:04:48,510 --> 00:04:51,160 Thank you and I'll see you in the next week by.