Later on, we were required to deploy that application to a webpage using Heroku. I decided then to write this very simple post, just as a reminder of the easiest way to deploy Github applications to Heroku. So let's start already!
So, for starters, we are going to use this link
Which opens a Heroku template page on GitPod. [Note the gitpod.io# inserted on the start of the URL as mentioned before.]
When the virtual environment on GitPod page is ready, type
on the terminal to check Heroku's installed version on the template.
The next step then is to select your Node.js application on GitHub and clone it to your Heroku template. On GitPod's terminal type
git clone email@example.com:laisbsc/BlackBooksBookstore.git
NOTE: If copied from SSH, GitPod won't clone your repo due to access rights. Make sure to use 'Clone with HTTPS' in this case. More on the topic here.
Now, you're repository must be looking something like this
Drag all the files out of the application folder and delete the (now) empty folder from the workspace. Your files should be looking somehow like this now:
Once that is done, go back to terminal and type
After saying "yes to all".
and replace it by
"start": "node app.js"
That will tell Heroku the default language for the application that is being deployed.
Next step is to install all modules declared at the start of the app.js file. Basically all that appends the 'require' key-word. On terminal, type
npm i <list of required modules>
Now that's done, it's... DEPLOYMENT TIME!!! \o/ \o/ \o/
1st step into deployment is quite complex [sic]. Go to terminal and type
I know, complexity level 1000! #sarcasm ¬¬'
If you have a Heroku account, GitPod will open an in-loco browser window and tell you when you're logged in. In case you don't have a Heroku account, just go ahead and make one. I will wait here. Now, email to confirm you are actually yourself, go back to the terminal and you should be all logged in now.
NOTE: in case your browser starts acting out [Chrome trolled me for a bit on this step], try a new window and be patient, my little Padawan! We're almost there.
When you see your email on green lettering written at the terminal, it's time to open a smile.
Which creates the app (as well as the git remote) and assigns a random generated URL to it. That will be the URL for your deployed app.
Now, go ahead and do the git magic in there:
git add *
git commit -am "first commit Heroku app"
git push heroku master (or whichever branch name you'd like to give)
And BOOM! 💥💥💥
WE GOT OURSELVES A DEPLOYED APPLICATION ON HEROKU!!!
And this is the link for the original Git repo if you're interested. It's not really tidy so check it at your own risk.
Finally, if you would like to have a look what came out of the makings of this post, have a look in here, it's my randomly-generated Heroku link.
I hope this post could help anyone who is deploying a GitHub app to a webpage using Heroku and GitPod.
If you have any questions, feedback or anything you'd just like to tell me, leave a comment or ping me on @laisbsc. If you're running this tutorial and got stuck, message me! I'm more than happy to [try and] help.
Good luck. And happy coding 🖥️