How To Host Your Laravel Application For Free on Heroku

Photo by Samuel Zeller on Unsplash

Getting your project on an actual server where friends, family and even foes can see is something every developer aims to accomplish, you might even be one of those people that just want to show off your work when you find yourself in the midst of other developers.

Other times it could be a case where you’re working on a project for a client and need to have the work on a server so the client can be up-to-date with your progress on the project, and the said client hasn’t paid you 100% for the project, you’d not want to use your money to pay for hosting and any other overhead cost, would you?

Well, whatever category you may fall under you’re in the right place because in this article I’d be showing you the easiest way to deploy your laravel application to heroku for free!

Some Definitions

Laravel, as defined on the official website, is a web application framework with an expressive, elegant syntax. Laravel attempts to take the pain out of development by easing common tasks used in the majority of web projects, such as authentication, routing, sessions, and caching.

Heroku is a cloud platform that lets companies build, deliver, monitor and scale apps — we’re the fastest way to go from idea to URL, bypassing all those infrastructure headaches.

Now we have an idea of what Larave and Heroku are let’s get to work!

— it’s important to know that there are different ways to deploy your laravel application to Heroku but I promised the easiest way to get it done so let’s dive right in.

Prerequisites

• Composer
• Heroku Account
• Github Account

Setting up Laravel on your Machine

It’s assumed you have composer installed on your machine so navigate to a work folder for this project you might have created and run the code below on your console

composer global require laravel/installer

this will download the Laravel installer using Composer.

then to create a new project run

laravel new HostOnHeroku

Congratulations! you’ve successfully setup Laravel on your machine and you’re one step to creating something beautiful.

This will create a folder called HostOnHeroku which contains all our project file.

Navigate into the HostOnHeroku folder and run

php artisan serve

you should see a message like the one below

laravel project served on 127.0.0.1:8000

Open up your browser and paste in the link http://127.0.0.1:8000/ and you should see this message below

laravel application

We just successfully setup our Laravel application on our machine!

But we’d like to have this on a server so we can access it over the internet, so the first thing we’d have to do is have our codes on a GitHub repo. To do this login to your GitHub account and create a new repo for this project

creating a new repository

Click on New repository and fill in the needed fields then save.

creating a repo for our project

and our HostOnHeroku repo is created!

HostOnHeroku repository

Now we have our repository we’d have to upload our source code to GitHub so navigate to your project folder in your console/terminal and run the following code

$ git init

this will initialize GitHub in your project folder

$ git remote add origin https://github.com/just1and0/HostOnHeroku.git

this will associate your repo with the project file

$ git add .

then

$ git commit -m "initial commit"

finally

$ git push -u origin master

You might be prompted to put in your GitHub login details, it’s just GitHub’s way of ensuring the owner of the repo is the one pushing code or the person pushing to the repo is authorized.

If all goes well you should end up with this message on your console

successfully pushed code to GitHub repo

Now we have successfully pushed our codes to GitHub, so what’s next!?

Now we have our codes on GitHub we’d log in to our Heroku account to set things up

Setting up our project on Heroku

It’s assumed you have a Heroku account so login to your account and create a new app

creating a new app on Heroku

Fill in the necessary fields

creating a new app on Heroku

Add to pipeline

create new pipeline

Create a new pipeline

save app

then create the app. Once the app is created you should now see this

The dashboard of the created app

Now our application has been created you need to associate it with your GitHub repo, to do this click on the Github(connect to Github) option on the Development method.

associating github repo with heroku app

type in the name of the repo, as named on github

the repo would show up as options, click the connect button just beside it.

And that’s it, you’ve successfully linked your Laravel app with Heroku.

What Next?

Now we’ve linked the repo with our Heroku account, you’d have to deploy the application, so scroll down to Manual deployment and click on Deploy Branch

If all goes well you should be seeing the message below

this means our application has successfully been deployed! so go ahead and click on view, to open up the application.

error on the application page

Oops! what went wrong?

If you’re seeing an error on your application, relax no need to fear it’s just a minor error.

Heroku is looking for an index.php file to act as the entry point to your application, but it can’t find it, you need a way to tell Heroku where to look for this file on load of the site.

To do this you’d need to create a file called Procfile, Yes Procfile, this file won’t have an extension name and should be placed in the root of your project file.

Procfile could also be used to set up workers, cronJobs, etc in your Laravel application.

So open up your IDE and create a new file called Procfile and place the line of code below in it and save

web: vendor/bin/heroku-php-apache2 public/

Once this is done your file structure should look similar to this

Procfile added to file structure

Now you’ve made changes to your project you’d need to commit changes and push to your master branch so heroku would get the updates.

To do this, open up your console and run

$ git add .
$ git commit -m "Procfile added"
$ git push origin master

Once you’ve successfully pushed the changes to your master branch all you need do is hit the deploy branch button again on your Heroku dashboard, wait for it to deploy and then reload your site URL

Oops, not again!

Another error! what's going on, not this again!

Well calm down and look at the bright side which is we can now see a Laravel error page! which means our application was actually deployed. Besides the error really is something minor.

So what went wrong? Laravel works with something called .env file, where all environment variables are stored for security reasons. The application we just deployed is looking for environment variables but can’t seem to find it.

You might say but I committed the .env file, but no! Heroku won’t work with that file you have to create environment variables on Heroku that your app will use.

To add variables go to setting on your Heroku dashboard

Click Reveal Config Vars beside the Config Vars option

Now add the variables that are needed, as below

Once this is done, reload the application URL and yes, sure enough, we have no more errors.

I have gone ahead to do some editing to the landing page of our application so we now have this.

Our application hosted on Heroku

Conclusion

Getting your project on a live server is as important as writing that last line of code and having the satisfaction that you can sleep well at night from now on.

Heroku is a beautiful platform that handles such a task for you and for no fee at all. In the long run, it also eases your development process with the addition of auto-deployment, and Wait for CI to pass before deploy! Heroku is just awesome and should be something you begin to use in your day-to-day development.

Sure enough, we’re done Hosting our application, but what about setting up our database, you can check how that’s done in this article

You can also check out the code on Github, don’t forget to Star.

Also, check out the site we just deployed and feel free to reach out to me on twitter

Host On Heroku