How to Deploy a PHP and MySQL Website on Heroku And Configure the Database

hi guys so in this video i'm going to show you how to deploy a php on my sql site to heroku and could then configure the database with phpmyadmin okay so first of all uh what we need to do is make sure you've got an account on heroku so if you haven't click this link here and sign up to heroku or log in i'm already logged in so i don't need to do that and then download the heroku cli tools so that's going to allow you to write heroku commands from the command line um so go over here and install for mac or windows whichever you've got i downloaded this one but i don't need to do that because i've already done it okay so next of all next thing to do is to open up your project folder and i'm using vs code so i'm just going to open up a blank pa vs code here i'm just going to open folder i'm going to create a new folder so if we if you go over to your c drive and then x amp if you don't have x amp you can download it here so go over to just google x amp download and then you can download any one of these um my i'm using php version seven so any one of these is fine though and then what we need to do is go over to our xampp uh folder then go into htdocs and create your project in here so i'm going to call create a new folder in here and i'm going to call it heroku tutorial okay so select that folder open up in vs code and then we need to log into heroku from the terminal so i'm using vs codes integrated terminal here go up to terminal new terminal and i'm just going to type in heroku login enter and that's going to allow us to log in to heroku it's going to open up a browser log in and there we go i'm logged in okay so now we can close that down and we are logged in okay so next we need to do next thing we need to do is create an initial php file and this is the file that we're going to deploy so this is like a little sort of test file for this tutorial so i'm just going to go into the project to create a new file called index.php and in here i'm just going to just going to create some php tags [Music] we're just going to echo hello there heroku danny here okay so save that and that is all we're gonna that's what we're gonna deploy to heroku okay so then we're gonna we need to create a composer.json file so every php project is required to have one of these when you're deploying to heroku so go into the root of your project and create a composer dot json file okay and that's all you need to do you just need to create it so then what we need to do is we're going to need to um initialize a git repository and add everything then commit and we need a get repository because heroku requires you to have one of these in order to deploy to it so we're just gonna just gonna copy these commands in here we're gonna add everything we're going to commit everything to get okay now for the heroku stuff so now we now need to create an heroku project and a lot of people seem to do this through the command line but i prefer to use the heroku sort of dashboard or website wherever you want to call it so log into heroku and go to your apps dashboard and then click create new app so this is my apps dashboard these are previous projects that i've done you don't need you may have an empty these this may be empty if you've never made it in a roku project before so we're just going to go over to new create new app and uh what did i call this before let's see danish tutorial app let's see if that's available is that available yes it is and i'm just going to click europe because i'm in europe i'm going to create the app okay so the app has now been created okay and now we need to push the app to heroku so we need to tell the remote heroku repository that we want to push to um this um app here so let's just copy and paste this and you're gonna need to use your own app name i think it's somewhere on here actually um yeah so just copy this command pop it into your command line and that's going to uh set the remote repository as this heroku url so next thing we need to deploy to heroku so we can just use this get posh heroku main and then heroku will provide you with the url to your app okay so once all this is done we'll get this url okay there it is so i'm just going to press ctrl and left click open it up and there we go so that's our php file file deployed to heroku okay so that's good and now we need to add a mysql database okay so we're going to go to our apps dashboard so i'm just going to click this link here it's going to go to our apps dashboard and i'm going to select the the app that we just deployed okay then you're going to click resources and add the clear db add-on okay so we're going to click resources and we're gonna i'm just gonna search for the clear db mysql database so this is an add-on that we can add to our project okay make sure you select the free one okay and then you're going to submit the order form and when you submit this you're probably going to be prompted to enter your card details which is necessary i'm afraid um but as long as you select this free option and you don't have to worry about heroku charging yourself just um add in your card details and then submit the order form or submit the order form then your card details so there we go that's done so i can close this one down we don't need that okay so that's all done now we need to get our database url so we're going to go to settings then scroll down to config variables so i'm going to go to settings and we're going to go reveal configuration variables and here is our database url so what i'm going to do is i'm going to copy all of this and i'm just going to open up a text editor so you can open up word or notepad i'm just going to copy this url in here okay now this url contains the information information that you need to connect to your new heroku mysql database via phpmyadmin so the username is this part here so if you copy that and i'm just gonna make a note of this so that's the username and then the password is this section here so it's going to copy that and then the host is this bit here so where's that eu net okay so that is the host okay so that's stored for later okay so now we need to configure our phpmyadmin and now this is what comes with the your xhamp download if you're new to all this so we now need to tell php myadmin that our heroku database information we need to tell phpmyadmin our heroku database information so that it can connect to it so let's open up xampp and i'm gonna start oh these are already i did this earlier so just press start on here click these two and um and then we're going to open up the my sequel admin okay and that's going to open up this thing here um okay and what we need to do now is we need to tell uh phpmyadmin our um our database credentials so that phpmyadmin can connect to this uh heroku database okay so we need to open this file here to do that okay so let's open up uh some files okay so we're going to go to your c drive click x amp and then you want to click you want to click on phpmyadmin and then we want to go over to config config.inc.php so config yeah this one here so config.inc and then it's a php file so open up that i've opened it up in via vs code okay and then what you want to do is go down to the bottom of this file and i'm just going to copy in this this code here okay so make sure you're within the php tags and what you need to do now is change this stuff here okay so i need to change this to our app our new app credentials so we've got the host name here so this was our host so copy this in and then change the username for your remote server so this was the username copy that in and the password we copy that as well okay then just keep this as config save that okay so that's saved our new database information is in there so now we can connect to our heroku database so if we refresh this we can see here that we now have this little thing appeared okay so now we can connect to our remote database okay select our database and there's a problem here so maybe i didn't copy the these variables incorrectly um ah yeah i didn't sorry that yeah the username is just this bit here so be careful when you're copying that i accidentally copied the username and password okay so i just need to get rid of this bit here okay so now we've got the username correctly in hopefully this will now connect refresh select the database and hopefully there we go we're all connected up okay so let's go to the next part of the tutorial let's see what we need to do next so selected the heroku database and then you can go over to your databases and you can create a new database so you can create new database here um so just press create um oh no so you need to select the database okay so it's this one here this heroku database and then we can create some tables okay so that we can create tables in this database okay so i'm not going to do that because this is not a mysql tutorial but now you can create and configure your database um for your remote app okay so next we need to connect to the heroku database from php so we've connected to the database from phpmyadmin but now we need to do it from our php app so we can actually access the data and render it to the screen or wherever we want to do so we need to copy the code below into your heroku database configuration variables to your app and this will connect your app to the database so let's copy all this and i'm just going to copy it here okay and what this is going to do is it's going to load um your [Music] your heroku database credentials into the app okay so it does it automatically for you and then it will connect to the database here and then you'll be able to do whatever you want with that data okay or you post the database whatever you're doing okay so that's it we've deployed a php project to heroku made a remote mysql database configured the database using phpmyadmin and finally connected our app to the database so hopefully that was helpful let me know in the comments if you've got any questions subscribe like if you want to see more videos like this it really helped me out thanks for watching guys and i'll see you later

Channel: DoableDanny

Views: 26,153

Keywords:

Id: EyEn5gREn_U

Length: 16min 4sec (964 seconds)

Published: Thu Jan 07 2021