Deplying to Heroku

[00:00 - 00:07] After a lot of hard work, we are ready to publish our application. We are going to use Heroku for that.

[00:08 - 00:19] We are using Heroku because it's free of cost and we don't even need a credit card to set up our account here. We can also create free database service with Heroku, which is why we chose Postgres over any other database.

[00:20 - 00:26] Copen Heroku and sign up if you haven't. I have an account, so I will login.

[00:27 - 00:41] And this is my dashboard. If you have signed in, you will see a dashboard like this. Click on Create New App and here, let's give it a name, "Learnify Course".

[00:42 - 00:51] This should be unique, so you can choose any other name for yourself. I will click on Create App.

[00:52 - 01:01] As a deployment method, we are going to use Heroku Git. First of all, we need to install the Heroku CLI.

[01:02 - 01:10] Open and go there. And install Heroku CLI for your respective operating system.

[01:11 - 01:28] I have it installed. I will open my terminal and I will run Heroku login. Press any other key, apart from you. This will open a browser and you need to login using your credentials.

[01:29 - 01:37] When you are logged in successfully, it will show you logged in as your email ID. Now let's close the terminal.

[01:38 - 01:50] And before we follow these instructions, we can create our database. So let's click here and click on Data.

[01:51 - 02:04] We can choose Heroku Postgres and click on Create 1. Let's scroll down a bit and copy this code.

[02:05 - 02:17] We can now open our PS code and open the terminal. And now we can copy the code followed by -a, which stands for Application.

[02:18 - 02:27] And now I will mention the name of my application, which is Learnify course. You can mention name you put inside your application.

[02:28 - 02:37] So now I will press enter. And it has successfully created our database.

[02:38 - 02:45] After setting up the database, let's go back to the browser. And now we can go to our dashboard.

[02:46 - 02:53] Let's open our application and now we need a Build Pack. Let's open Settings.

[02:54 - 03:01] And here we have an option to add a Build Pack. Build Packs are scripts that are run when your app is deployed.

[03:02 - 03:11] They are used to install dependencies for your app and configure your environment. Let's click on Find New Build Packs on Heroku Elements.

[03:12 - 03:17] And now here we can search our Build Pack. And we need Build Pack for ASP net core.

[03:18 - 03:26] So let's search for .NET. And we need this Build Pack, which is .NET Core Build Pack.

[03:27 - 03:32] So let's click here. Now we can scroll down and copy this code.

[03:33 - 03:40] This will be applicable for .NET 6, which we have already installed. After you copy this, we can go back to our VS code.

[03:41 - 03:44] And let's clear it first. And now we can paste it here, followed by -a.

[03:45 - 03:57] And now we can mention our application name. In my case, it's "learnify-course".

[03:58 - 04:03] And now it has installed Build Pack for us. Let's go back to our dashboard now.

[04:04 - 04:10] It says it asks me to log in again, so I will do that. Now let's go back to the dashboard.

[04:11 - 04:15] Click on the application. Click on Settings.

[04:16 - 04:28] Inside Settings, we need to set up our environment variables. If we click on Reveal, environment variables, we already have a database URL environment variable, which is the URL of our database.

[04:29 - 04:34] Let's add some more. In production, we won't have access to the .NET user secrets.

[04:35 - 04:38] So we need to mention them here. Let's open VS code.

[04:39 - 04:53] I will go to the API project and type .NET user secrets list. Let's copy them and paste them in Heroku one by one.

[04:54 - 05:02] Let me add all of them and come back. I have added my publishable key and client secret inside environment variables.

[05:03 - 05:11] We also need to set up two more things here. Environment and the token key, which is located inside appsettings.development.

[05:12 - 05:19] json. So first of all, let's start with the environment. Here I will write ASP.NET core.

[05:20 - 05:29] Underscore environment. And this will be production.

[05:30 - 05:35] Make sure the spelling is exactly like this. Otherwise, it will have problem getting this value.

[05:36 - 05:44] Now we can open VS code once again and look for the token key. Let's open appsettings.development.json.

[05:45 - 05:55] And we need JWT token key to be mentioned inside environment variables. And this time, let's not keep it secret token key, but let's make it a little tough.

[05:56 - 06:10] So let's go back to the browser and click on add. And here I can write JWT colon token key.

[06:11 - 06:15] Make sure the spelling is exactly the same. And yeah, it looks like it's same.

[06:16 - 06:26] And this time, mention any strong value here. And click on add.

[06:27 - 06:44] Now, if you go back to VS code and open the default connection string, this is easy for us to get inside appsettings.development.json. But in production, we have a URL from where we need to extract the details.

[06:45 - 06:50] It has automatically created a connection for us. And this string has a username and a password.

[06:51 - 06:59] So it is very complicated. I have given you a code which is inside the transcript, which you can copy and paste it.

[07:00 - 07:05] So simply copy it first. And now you can open program.cs file.

[07:06 - 07:16] And in place of this particular code, you can simply cut it from here. This is taking the connection string from our default connection.

[07:17 - 07:24] But in production, we won't have a default connection string. So let's cut it from here and paste the code which I have provided.

[07:25 - 07:46] This code will read the value from appsettings.development.json file if environment is development. If it is production, it will read values from the database URL, which is inside the environment variable and pass the DB connection string to our Postgres database.

[07:47 - 07:53] So save it and make sure it doesn't have any error. So you can go through the code once.

[07:54 - 07:59] Once this is set up, let's go back to the browser. And now let's click on deploy.

[08:00 - 08:08] And now we need to follow these steps to move our code to Heroku repository. First of all, let's copy this code.

[08:09 - 08:16] And now go back to the browser. Now let's open the terminal and let's clear it.

[08:17 - 08:23] Make sure you are inside the base of our project. Now we are inside root of our project.

[08:24 - 08:33] What we need to do is first of all, we will start with git init command, which will initialize our repository. We don't need to send everything to production.

[08:34 - 08:45] So what we can do is inside root of our project, we can create a file and let's call it dot git ignore. And here we can mention the file names that we don't want to send.

[08:46 - 08:53] So let's start with obj, which is not needed in production, although we are hiding it here as well. But in production, we don't want to send that.

[08:54 - 08:59] We don't need the bin folder. We don't need app settings dot development dot JSON file.

[09:00 - 09:16] So let's type app settings dot development dot JSON. And since our front end code will be inside www root folder, we don't need to send the client folder to production.

[09:17 - 09:27] So we can also mention client. Now let's close this and paste the command which we copied from heroku press enter.

[09:28 - 09:36] Let's search for git status. And we will see all the folders that are going to go to production.

[09:37 - 09:49] And as you can see, we don't have the client folder because we have mentioned it inside dot git ignore file. Now what we can do is we can run git add space and command.

[09:50 - 09:54] Now we can press enter. This will add everything.

[09:55 - 10:05] And now we can write git commit dash am with stands for the message and inside we can mention first commit. You can put anything here.

[10:06 - 10:15] Now let's press enter. And now finally let's run git push heroku master.

[10:16 - 10:20] This will push our entire course to heroku. Now let's press enter.

[10:21 - 10:25] Hopefully this will make our application run. Let's wait for it to finish.

[10:26 - 10:30] It says our project is now published. Let's open our browser.

[10:31 - 10:40] And now we can click on open app. And now we see our application.

[10:41 - 10:51] We see eight courses here. Let's select different categories.

[10:52 - 10:58] This seems to be working fine. Let's add to cart and go to cart and we see two courses here.

[10:59 - 11:12] So that is working fine as well. Let's try logging in as a student.

[11:13 - 11:21] And we are able to log in. Let's buy a course and we will buy full stack python with Django.

[11:22 - 11:26] Let's go to the cart. Let's get rid of these two courses.

[11:27 - 11:43] And now we can click on checkout. Let's mention the details.

[11:44 - 11:50] And make payment. We see your payment is successful and we see a course here.

[11:51 - 11:58] Let's click on go to course. And now we see our course.

[11:59 - 12:04] So everything seems to be working fine. Let's also try to be an instructor.

[12:05 - 12:11] Let me click on become an instructor. And now I can go there and click on instructor.

[12:12 - 12:21] I can create a new course. Let's say creating a test course.

[12:22 - 12:29] And let's simply copy it and paste it everywhere. Let's give it a price $1,199.

[12:30 - 12:38] And it can be music for beginners and language can be English. Let's click on submit.

[12:39 - 12:41] And it has created a course. Let's go there.

[12:42 - 12:50] Now we can add some sections and lectures. So let's write section one.

[12:51 - 12:57] Lecture one. You are in one.

[12:58 - 13:04] Lecture two. You are in two.

[13:05 - 13:08] Lecture three. You are in three.

[13:09 - 13:13] Now let's publish the section. It says section added successfully.

[13:14 - 13:19] Let's publish this course now. Let me click on publish course.

[13:20 - 13:26] And it says course published successfully. Let's go to home and let's check music.

[13:27 - 13:33] And we see our course that we just created. So everything is working as expected.

[13:34 - 13:37] Our course is now completed. And this was it for the course.

[13:38 - 13:40] I hope you got to learn something from this.