Deploy to GitHub and Heroku

so hopefully by this point you either recreated the same app yourself or you've created some other web app in Django that's running perfectly fine on your local system now the steps to get this up and deploy it on Heroku are many and we're going to go through them step by step and hopefully by the end of it get this same exact site to display on the public Internet okay so where do we start well first thing that you need to do is go to github make sure you have an account that you're signed in and click create new repository and that will bring you here and let's create a repository for our weather application or whatever app you have and don't change any settings just go ahead and publish it and you need this URL here this is your URL for your weather app get a repository and we're going to use this through the command line to push all of our contents of our site up to github and then also up to Heroku ok so let's see what's the first step well we've got the URL so let's fire up our command prompt and go to our project directory so that's for me this is where I go and I'm going to do get an it and it's going to initialize the github repository or create the local repository and then I'm going to do get ad dot and that's going to add all of the files that we have in this directory into sort of Prime them to be uploaded and pushed if you will up to github now you can create something called a git ignore and I'm not going to go over that right now but it's pretty easy to do there's a good ignore plug-in in PyCharm which will auto-generate one for you or you can manually create one if you don't want like the pycharm specific like hidden files to get pushed up and also once we do this it's going to commit all of our files publicly available on github which means if you have any passwords typed in any of your documents people will be able to see them so when we follow these instructions to get our existing project on the github there is a warning that says do not publish passwords API keys all the stuff that we're about to do so if you are doing this as a test no big deal so mine I'm not worried about I'm going to push all that up I'm not really worried about excluding anything because it's just for demonstration and I'll have removed that from github before you see this video so I'm not worried about anybody finding it but if you're doing something that is going to actually go in production go through the remove sensitive data link read through this understand it and get your passwords and your keys and tokens out of your files do not load your password files up to github ever ok now that we get that out of the way let's assume that you've done that ok and we're going to add everything and then we're going to go to get commit with a message first commit and that lines everything up to be pushed then we're going to do git remote add origin and this is where we paste the URL in and this tells when we push this tells get when we push our files where to send them to ok so that assigns that github remote repository to be the place where we ship all our files to and then we can verify that with git remote verify slash V and there you go so everything looks pretty good there so we're going to go ahead and do get push origin master and everything should be uploaded to github now and we'll refresh there we go so everything's here including my keys pi which has my passwords in it again so be wary of doing it if you're not sure what you're doing you might accidentally post some information you don't want to - github so last warning on that okay what next well we need to get our static files prepared to be deployed by Heroku and haruka makes it very clear that they do not like to serve up static files they want you to put them somewhere on some kind of storage like Amazon s3 or something and serve your files from there but you can if you use this module called white noise you can install that through pip into your Python install and add this to your server configuration and add this to your settings dot PI and it will actually upload package and upload and serve your files directly from Heroku so we're going to go ahead and do that now so we're going to fire up the command prompt here and we're going to go to our virtual environment remember we're not installing anything any Python modules without logging in to our virtual environment because we need them to be collected in one central space so for me if you recall I created a directory called environments and I created one called weather and this is where all of our stuff is and there's a scripts folder and I can activate that so now we're operating within the confines of our virtual environment so if I install white noise here it will not install white noise to my primary location I'm just my brute Python directory which is great so I'm going to go ahead and do pip install white noise okay I've actually already done that you will see a completion script and there's one more thing that we have to install which is not inherently clear through the tutorial but if you try to do it without it it'll blow up and you'll see the error message we have to install something called G unicorn which is the webserver that's going to handle everything for us and we're going to go ahead and do that now so that's pip install G unicorn or gonna corn or whatever you want to call it okay no surprise there I already have that installed too okay so you should now have both of those installed into your virtual environment that is a requirement okay now we need to tell Heroku when it deploys our Python application or Django app what modules it needs to install to support all the functions that we're doing and that means everything that we've installed through pip needs to go into a text file that Heroku will scan as it's installing your your server as its setting up your server and it'll install those for you it will execute pip install whatever for every single thing that you have this is another reason why we use a virtual environment because if we weren't using a virtual environment and we we got the requirements dot text file which we're about to do it would pull all of the modules that we used for our main Python install which might include like numpy Sai PI pandas all kinds of stuff that's like not relevant to our web app and Gen Heroku would install all this stuff that you don't need and that's just not a good thing to do so the way you do that is you type in pip freeze requirements txt and there it is that's our requirement file so I'm going to do is just fire up Explorer go to that location and it's environments weather up it's under scripts whoops there we go okay so as you see it's just got the packages that we've used in our virtual environment loaded not everything that I use on a day-to-day basis with my main Python install so that's a good thing so we're going to cut this out go to our project folder and paste it in okay so this will be fed to Heroku when we spin up the instance to host our website also Heroku defaults to Python 2.7 if you just launch your app it's going to run Python 2.7 and some things are going to break okay so you can google that you can say um let's see python versions Heroku 83.5 something like that and it says specifying a Python runtime and it says here that it defaults to 2.7 but you can run 3.5 you have to create a runtime dot txt file and paste this line in here so let's do that so we're going to go back to the command prompt it's in our project root folder and we're going to do notepad runtime txt and yes we want to create that file paste that line in and save it and there we go so now we have runtime it specifies this this file will be read when it's deploying your application and it will install Python 3.5 instead of 2.7 which is super coach because that's what we're practicing in here one last thing also it says in these are all just from the from the documentation so if you have no idea where I'm getting all the stuff from it's basically just you google django apps Heroku and static files karoku and you'll get directed to these it says is that okay so we've done the requirements we've specified the Python version we have to create what's called a proc file and we have to paste in this line of text right here this code so let's go back into our the same place where we created the runtime and requirements we're going to go in and do a notepad proc file capital P yes we'll create that paste this in save it now you'll notice that notepad creates a dot txt on the end of our proc file and you don't want that it says just to name it proc file so let's just rename that a proc file dot txt to proc file and there you go so we've met that requirement we're not going to build it locally I'm not too worried about that okay so that takes care of most of the requirements for Heroku to know what to build into your application now we need to pop over to our Django settings and start modifying the heck out of it okay it's configured for localhost right now and we need to fix that so let's go to the settings pie and first of all let's change our allowed host yours might be empty might just look like that we're going to allow Heroku to we're going to allow Heroku to connect to our our app so we're going to specify the Heroku URL but actually before we do that let's go in and spin up the instance for Heroku so first thing you'll need to do actually to do that is I'm just going to do Google the sample exercise that they have for Heroku and if you get started it points you to the Heroku toolbelt which will give you a command line interface for Heroku so go ahead and click on that and install it I've already done it so I'm not going to do that again but it allows you to summon Heroku commands through the command prompt okay so close out of that one and what we need to do is we need to log in and create the Heroku app that we're going to be using so let's do Heroku login ok so this is how we know that the tool belts working I put in my hair okuu credentials that I created when I got my Heroku account and then I'm going to do Heroku create I'm going to name the app that will spawn here so I have one called fush ometer that i worked on before and i'm going to do you create get a creative name here because if it's already taken it won't let you use it so I'm just going to try something like uber weather app something long okay so it just created this website for us and if we go to the Heroku dashboard and refresh you can see that it's spinning that up for us right now so that's good and then I also need to what else need to do that should be good for right now so let's actually check ok so if I do get remote verify I see that Heroku is added as well so this will be pushed to both places at the same time which is pretty cool so alright now that that's done what else do we have to do okay alright yeah the reason we did that was because we to figure out what the name of our app was first and make sure it's not taken before we can add it to our aloud host so this site here uber weather app dot Heroku comm is what's going to be pulling our django apps so we're going to be putting that in here dot Heroku app dot-com yep okay cool so that's good we've done that and we need to go down to the bottom to our static files so this stuff isn't really relevant anymore because this was what we had set up previously to serve up our templates and our images to our local Django server but we're going to be changing that so what we're going to do is go in and paste in let's see we go in and we're going to paste in this okay so this line here white noise Django blah blah blah that comes from the Django static assets right here so it says to add that to your settings and we also need to point it to here and let's see I'm missing I think no I'm not let's see why does that look that way I am missing one here there we go okay so this tells it where our static files are and where to serve them and this is the storage that we're going to be using to serve them up so this base directory just points to here okay so our static is under our base directory sometimes you'll see this a project directory and project directory can be defined as this and what that is is if you have it under station like so if you have it under your actual project you have static files here you'd be serving them out of the project root but we're not we're serving them out of the base directory here so and this also needs to have the reason it's red so we need to have it like that there you go as a string so that is in so that should help us serve up our files so that's good and then we need to go to WSGI and we need to add white noise there so that's going to be from white noise Django import Django white noise and then we need to add make sure this line is in here okay set default ah blah blah and then we have our standard so we need to add one more application Django white noise applications application there we go okay whoo okay so we've got that in that's good and let's see what happens maybe that's enough I don't know we're going to go in and we're going to do git add dot git commit added proc file changed what else do we change you change the static okay and we're going to do get push Heroku master and keep our fingers crossed so this you'll see is going to deploy everything to her Roku hopefully so its detected it's Python it okay so it caught the thing where we told it to do Python three point five point one so read our a version file that we created it's reading our requirements it's installing everything that we've told it to so that looks pretty good what it's doing right now is it's actually installing everything that you need to run and then it's collecting your static files and putting them in a place where it can serve them up so that's cool breezy collect static right now so it snatched up 56 files and copied them to a place where it can be served and then it's declaring that it's a web app that that's going to use G unicorn to host it it's compressing everything into a zip file to be served out of and it should actually also be doing make migrations and migrate to push the information over the models that we created into the database now one thing to note is when you deploy a Gengo app with a to Heroku it creates a Postgres database for you automatically and we can see that if we go in here into our weather app and under resources we see the Postgres database automatically generated which is really cool so let's go into that database and click on that one the Lubar weather app database and we're going to get all of our connection settings which might take a few seconds it's still spinning everything up ok so remember how we had everything under settings and our database settings pointed to our localhost well this is where we're going to go in and copy and paste all of this information over so let's go ahead and start doing that so copy the host paste that into host copy the database name paste that in here move the user name over get our password and port is 5 4 3 2 I don't think you even need that but we can add that in and so that should fix that and then it also if you remember our worker file also has settings as well so we need to do the same thing here so the host the password the user and the database name ok so let's see what happens here we're going to go back and do git add dot get MIT message updated database settings get push a Roku master and this deployment will be a little bit faster because it caches everything that's already installed and it won't reinstall everything for us so it's just applying the things that have changed so it's pretty quick see it checks requirements it checks collects static it knows that nothing's changed so it kind of just bumps past that and just goes right to uploading the files that have changed so all right ok so says it's deployed so at this point we can try to launch the site it may not be working yet we can do Heroku open and ok so it's giving us an application error that's not surprising we can go into Heroku logs and see what blew up ok let's see all right we got exception oh I copied when I copied this over um where was it I know what I did I copied it I copied some command here that I did I did it wrong so let's go back to I think it's settings RW SGI and let's see whether up where did that come from hans check the logs here no module named getting started it must have messed that up somewhere hmm you don't think oh there it is okay so in our proc file I copied and pasted the line over and that is what screwed is up here so let's go and change that to the name of our application so you have to read what you're doing when you're copying from the documents over it uses the getting started which is like the little helper app they help you build it first so that will screw you up pretty bad so let's try this again get add get commit and that's going to be will say updated proc file get push a rope to master try that again I knew was hiding somewhere so that the logs are going to be very helpful so if you're having trouble with your site not loading just type Heroku logs and find the exception and Google that and typically someone will help you figure out what the heck you did wrong and even though you follow this tutorial anything could go wrong so expect to have to do some bug squashing during this particular phase because a lot is changing and it's easy to miss something so all right let's try it again okay great so at this point it's blown up because it's saying that it can't read the observation from so this is a database problem okay so it's saying that it's trying to read from the database and it couldn't read from the database so that could mean either our database is blank or more than likely it did not successfully migrated over so what we can do to verify is go into PG admin and we can actually connect to the remote database so this is really cool so I'm going to right click on servers maybe not I'm going to file ad server there we go and I'm going to go and call this Roku weather app and I will get our database connection settings again and I see host database we don't need that we need user name and actually you have a duty database name it's going to be here and that should all that password okay so there it is we can double click on the server and there are a quite a few databases in here these are everybody's database but we can't connect to everybody else's database we'll only be able to connect to ours because it's the only one we're authorized to see and that database name is DC gah if you see here so we're going to go down to there it'll be the only one without an X on it by the way there it is schemas public tables okay so Django did not migrate our settings over and if you recall when we built our models it didn't push this into our database and construct our columns in our Postgres database generally it does Heroku is supposed to run make migrations and it usually does but for whatever reason it seemed to not work so it's good to know that you can do a Heroku run Python managed PI make migrations and do it on your own so you can run pretty much any Python command you want just by putting Heroku run and it'll execute alright so no change is detected it must have ran run to make migrations but didn't actually do the migration so let's try that Heroku run managed PI migrate fingers crossed here Oh Python managed PI migrate there we go we're hoping to see is a bunch of stuff added here ok there we go so now we refresh this ok that looks good so we have our station reading which is what we really needed and it's got all our columns in there so let's give it a shot let's go to our worker here and run our worker and oh ok success so it says it was able to push some data into the database so let's go here and refresh this ah there you go ok so that's pretty much it but there's some other things that we can do so now that we have this thing up live we need to turn off debugging mode because if you remember when it exploded a few minutes ago it spit out all kinds of information about our configuration and everything and you don't want it to generate that the debugging log for the general public because they can we'll see all kinds of information that they're not supposed to see so when you go into your settings and you go up here to debug it says do not leave this turned on during production and that's a really really good idea because people can run something that breaks and they can see everything that your app is doing and that's not good so we'll make that false and we'll do get commit and we'll do blow up that was not what we're supposed to do not get commit I wonder blew up get add here we go get commit debug false get push Roku master and that way nothing will change visually for us but it'll keep people from getting the debug log when something blows up which is pretty important so while that goes we talked about earlier separating your worker app from your Django application because it would reduce loading time in the web page and it would allow you to schedule the worker app to run at a specific interval and it would run constantly in the background and update your database over and over again well there are a lot of ways to do that and there are some scheduling databases that you can use and some other interfaces that are kind of complicated and I'm not going to get into those but if you start looking at scheduling workers with Heroku there's a ton of walkthroughs on using certain database technologies to sort of queue up workers that get pulled out and executed but fortunately for us there's one that's like actually pretty easy to do and it's called Heroku scheduler and so let's where is that out here it's under resources somewhere there go find more add-ons and we want one called Heroku scheduler guys search this yeah okay so Heroku scheduler and I'm going to hit install and I'm gonna install it to weather app and we'll just do the free plan and it's going to provision that we can go into scheduler this is like as simple as it gets all you do is type in the command to execute and it will do it for you and we can change it down to once every 10 minutes so once daily once hourly once every 10 minutes if you need it to execute on a different time schedule other than these three choices you have to find a more complicated solution maybe there's another add-on that does it I don't know this one just works for me so every 10 minutes we're going to do Python worker dot py and let's see we'll see if this works so right now the last time it was updated was almost 1 p.m. today and that's when I ran the worker app that was about 5 minutes ago this is Pacific time so this is the last time when we manually ran it from here so let's see if it updates on its own once we deploy this here where is it there it is so save and so it's 1245 refresh Oh what happened no idea something blew up let's see I was weird when we turned debugging off our site melted not only sure why that happened but it did so let's try to turn that back it's almost as if I did something else here let's see that looks good let's let this deploy you're so close that's so close yeah okay so I'll have to check on that and see what causes that because I have the host allowed here and that shouldn't cause a problem I need to check something here let's see all right maybe I need the full path let's try that because it's seem to be quite as getting rejected I don't know let's check that we'll add the actual full URL there to our loud host and turn that back to false all right updated hosts and let's see what happened here this says the scheduler is set to run in a minute so we should be able to refresh our page and see that bump up to like 54 12 54 Pacific how much there all right hopefully it doesn't blow up nope sure did okay so I'm going to have to get back to you on that when I don't know why that's happening but I will figure it out and I will let you know so we will go back push that one more time and we'll see if the scheduler worked and then I'll pause the video figure out why it's blowing up and we'll come back and we'll check it out see what we had to do to fix that actually not I could check the logs that would probably be a smart idea maybe we could just figure it out a little bit faster I don't know all right launching refresh and with any luck we'll be good to go yeah there you go okay so it updated everything looks good so I'll check on the debug and see what's going on I'll come right back and we'll wrap this up all right figured it out took a few seconds but when we are loading our static files into the template we need to change this from static files to just static okay that way it can serve up from the static folder it's being served out so static files will work locally but not when it's hosted on Heroku so that's it so now the debug is set to false everything's locked up and this appears to be working fine it's the last collection was at 105 probably can refresh this another minute and see that it's updated yeah there you go so the worker apps running fine our app is deployed everything looks great and that's it so kind of a lot of steps but not all that bad once you've done it once or twice I hope you enjoyed this video series and hope you learned a lot so if you have any questions leave a comment if you like this please subscribe and I appreciate you watching ting

Channel: Chris Vaden

Views: 16,914

Keywords: django, heroku, postgres, web app, git, github, migrate

Id: 8Qcqh0jl5YU

Length: 42min 12sec (2532 seconds)

Published: Fri Apr 29 2016