Uploading a simple site to Heroku

Jorge Junior
Jorge Junior
Published in
3 min readSep 6, 2020

Good afternoon people! Today I’m going to share a cool tip I learned working at Ateliê de Software, which is using Heroku to publish your website in HTML, and the best, for FREE. This is the English version of this post:

https://medium.com/jorge-junior/subindo-um-site-simples-para-o-heroku-8192112bd9b7

The first thing we must do is access the Heroku website, through the link www.heroku.com. There you will create your account (if you don’t have one), which is a very simple task, just click on the “Sign Up” option at the top of the site. Account creation is done in a few steps, with confirmation of registration via email.

We should now download the Heroku CLI, which is the command-line interface provided by Heroku. The link to download the tool is: https://devcenter.heroku.com/articles/heroku-cli
In this link are the steps for installation in the main operating systems today.

With the Heroku CLI and your Heroku account already created, access your computer’s terminal and enter the following command:

heroku login

This command is used to authenticate your user to the CLI. The user used is the one you created when you registered.

Now, we can already create our project folder, I’m on Linux, so I created it in “/ home/jorge/projects/shareatelie”. Within this folder, we can create our first “project” in Heroku. To do this, just use the following command:

heroku create <nomedoprojeto>

The command “Heroku create <projectname>” creates a project and already configures the necessary repository within the Heroku environment. In my case, when accessing my Heroku account, I can already see the project created:

In my case, I created a very simple website to exemplify:

To upload the project, we need to configure it to use Heroku's own git repository. This must be done with the following commands, with the detail that the URL used for the repository (“https://git.heroku.com/shareatelie.git") must be the one shown in the terminal when you create the project.

By doing this, we can already commit and try to push the repository (traditional, “git add”, “git commit -m” and “git push”). However, the following error will be shown in the terminal:

This error tells us that a project with only HTML, javascript and CSS cannot be detected in Heroku.

The tip here is to use a PHP file, such as index and include the HTML file of our project, making it render:

Now, we will be able to up the project:

And that’s all folks

--

--