WEBVTT 00:00.930 --> 00:01.590 Okay. 00:01.590 --> 00:09.060 In this video, I'm going to show you how we can deploy our front end application to the server and 00:09.060 --> 00:11.400 we can do it absolutely for free. 00:11.400 --> 00:15.810 And the service that we will use for doing that is Firebase. 00:15.810 --> 00:23.130 So you can go to firebase.google.com to the website and this is platform as a service so you can read 00:23.130 --> 00:24.450 more about this. 00:24.480 --> 00:28.590 And basically that's a service that has a lot of features. 00:28.590 --> 00:36.090 Usually what we think about Firebase is a kind of database that is very start to be very popular and 00:36.090 --> 00:37.770 it's from Google. 00:37.950 --> 00:46.230 So a lot of people use a firebase, but it's not just a database, it is a service with a lot of different 00:46.230 --> 00:47.370 useful features. 00:47.370 --> 00:50.640 One of the features that we will use is the hosting. 00:50.640 --> 00:59.730 So basically what we can do is we can push our application to the Firebase hosting and it will be there 00:59.730 --> 01:01.720 and it's absolutely free. 01:01.720 --> 01:08.260 So what we can do is we can go to pricing here and you can see here a spark plan is free. 01:08.260 --> 01:13.600 And it also includes if we go back to the hosting. 01:19.560 --> 01:24.390 So we have our storage here up to five gigabytes and then one gigabyte a day. 01:24.390 --> 01:30.780 That will be more than enough for for us to store our small obligation. 01:30.780 --> 01:35.970 Or you can see here hosting and we have one gigabyte and then a gigabyte transferred. 01:36.000 --> 01:37.590 We have ten gigabytes a month. 01:37.590 --> 01:40.080 So that's a lot for a small application. 01:40.080 --> 01:46.500 If you are ever need more, you can go for a paid plan and you have a prices here. 01:46.500 --> 01:54.810 So basically our goal is to put our application for free online and we can access that from a URL. 01:54.840 --> 01:55.260 Okay. 01:55.260 --> 02:01.260 So what you will need to do is you will need to create a new account with a firebase and you can do 02:01.260 --> 02:02.220 that in here. 02:02.220 --> 02:08.700 I already have that account in my in Firebase so I can do go to console, but you will need to sign 02:08.700 --> 02:10.020 up for the service. 02:14.390 --> 02:19.220 And what I have here is I have all my projects at the moment. 02:19.220 --> 02:23.750 I have only one project here and I can create as many projects as I like. 02:23.750 --> 02:29.030 And you can see here you can use a user interface to create a new project. 02:29.030 --> 02:33.920 So we could do that as well with a command line interface. 02:34.520 --> 02:42.920 Comes with a CLI so we could do the same thing with a CLI using some commands in the terminal to create 02:42.920 --> 02:43.550 the application. 02:43.550 --> 02:46.100 But I will show you how we can do that with a user interface. 02:46.100 --> 02:51.980 So I will add a new project and then we can put here a sample application. 02:55.610 --> 02:57.200 Like, for example, this one. 02:57.200 --> 03:04.850 So we'll get a custom ID and we can name our project, I will name it movie rater, and I will go Continue. 03:06.480 --> 03:09.480 And then you have Google Analytics for Firebase Project. 03:09.480 --> 03:16.110 You can enable Google Analytics or not, and you can see a simple explanation What is actually AD I 03:16.110 --> 03:18.150 can uncheck it because I don't need it. 03:18.150 --> 03:22.680 If you have a Google Analytics account, then you can link it and use it. 03:22.680 --> 03:26.100 We don't need to do it here, so I will create a new project. 03:31.240 --> 03:33.090 In My new project is ready. 03:33.100 --> 03:37.660 I can click continue and you can see here that my new project. 03:37.660 --> 03:42.490 So basically what we have here is we have a lot of different features. 03:42.580 --> 03:50.440 So you can see a firebase comes with an authentication cloud, Firestore and Crashlytics performance 03:50.440 --> 03:51.700 and so on and so on. 03:51.700 --> 03:54.250 So basically a lot of different services. 03:54.250 --> 03:56.920 You are free to go and explore all of them. 03:56.920 --> 04:04.660 What we are interested in here is the hosting, so I can click on hosting here and you can see here 04:04.660 --> 04:09.010 you can do a click started or you can watch the introduction here. 04:09.010 --> 04:12.010 So and you can explore how the hosting works. 04:12.010 --> 04:16.750 But basically what we'll need to do is we need to enable the hosting. 04:16.750 --> 04:25.660 So in order to start with a firebase hosting, what we'll need to do is we'll need to get started clicking 04:25.660 --> 04:32.870 here and that will be a set of instructions that will need to perform in order to deploy our application 04:32.870 --> 04:33.650 on Firebase. 04:33.650 --> 04:39.560 So first thing what we'll need to do is we'll need to NPM install G Firebase tools. 04:39.560 --> 04:45.860 So basically we have already installed the new use command install G like a global. 04:45.860 --> 04:48.560 So globally you will install firebase tools. 04:48.560 --> 04:54.320 That means you can use a firebase command to trigger something. 04:54.320 --> 04:58.280 So you can see here you have a firebase login and so on. 04:58.280 --> 05:01.010 That will be the commands that we will use later on. 05:01.010 --> 05:05.870 So first thing, what you need to do is you need to make sure you have that CLI installed. 05:05.870 --> 05:09.170 I do have it installed on my machine in order to check it. 05:09.170 --> 05:14.630 If I have it, I can do Firebase Dash dash version. 05:19.020 --> 05:25.050 And once you see a version here, that means you have a firebase installed on your machine. 05:25.050 --> 05:27.430 So that will be the first step to do. 05:27.450 --> 05:35.010 So in order to deploy our application, you will need to first create your account in the console firebase 05:35.010 --> 05:35.730 Google. 05:35.760 --> 05:42.120 Then you will add a new application and then you will need to install Firebase tools. 05:42.150 --> 05:43.140 The next step. 05:43.140 --> 05:46.910 What we need to do is we need to do Firebase login. 05:46.920 --> 05:53.460 So basically if you do fire base login here, it will. 05:53.580 --> 05:59.910 Firebase will ask you for credentials and that credentials will be the same as you have it when you 05:59.940 --> 06:01.500 create this account. 06:01.500 --> 06:08.250 So you have an account here on the console firebase and you use your username and password or email 06:08.250 --> 06:11.670 and password and that one you will need to use it. 06:11.670 --> 06:12.690 Also here. 06:12.720 --> 06:15.270 I'm already logged in with a firebase. 06:15.270 --> 06:21.250 I have Firebase installed, so in the next video I will show you how we can actually get it from there 06:21.250 --> 06:25.600 and we can deploy our application with a command line interface.