Deploy Node.js website on Heroku for Free

Today we are going to explore how to deploy a Nodejs website on Heroku for free. The project has to be non-commercial, but you can always upgrade to the paid plan if your project is business-focused.
Code: raddy.dev/blog/build-news-web...
☕ BuyMeACoffee: www.buymeacoffee.com/RaddyThe...
0:45 Introduction:
2:57 Node.js Project Setup:
2:57 Node.js Heroku Settings:
4:28 Creating Heroku App:
4:51 Uploading Node.js project to Heroku
8:37 Ending
Discounts:
⚡ Hostinger: www.hostg.xyz/aff_c?offer_id=...
⚡ Elementor: be.elementor.com/visit/?bta=2...
Recording Equipment:
◾ Microphone: amzn.to/3Ppp8Ok
◾ Shotgun Mic: amzn.to/3IVqIot
◾ Camera: amzn.to/3z0bxpF
◾ Lens: amzn.to/3Pw4s7d
◾ Lighting: amzn.to/3PGXvzW
Computer Gear:
◾ Keyboard: amzn.to/3PGXvzW
◾ Headphones: amzn.to/3PJl9fg
◾ Mouse: amzn.to/3z1TGPf
Connect with me:
◾ Website: www.raddy.dev
◾ Newsletter: www.raddy.co.uk/newsletter
#nodejs #heroku

[@RaddyDev]

What would you like to see next?

[@anishjoshi1999]

What is in the .env file ??

[@RaddyDev]

@@anishjoshi1999 that shouldn't be there haha. It was an API key for the NewsApi website

[@anishjoshi1999]

Explain MVC?

[@DineshJayasiri]

Angular production proxy config or solution for cros origin problems

[@pravinpoudel1307]

cloning some web apps in react and node/express.

[@ankit_kr_roy_4c_105]

You look like real Madrid forward benzema😂😂😂😂😂😂😂😂😂...btw helpful vid👍👍

[@RaddyDev]

😂😂😂😂😂😂😂

[@muhammadalarabi4180]

for the past like 2 weeks I've been struggling only this Heroku staff couldn't find any answer and today was my last day as after today if it doesn't work I'm quitting but I don't know how I came to this video and the magic happened thanks, man, really thank you so much

[@nerdiloo9863]

Cool - just a reminder that if you should add node modules f(and any other files that aren't used in the final build) to the git ignore file. That way all that stuff won't be uploaded.

[@zulianadryan686]

thank you mate, helped me a lot

[@coderlady_]

I like the simplicity of your explanations, just subscribed :)

[@RaddyDev]

Thank you, CoderLady! I appreciate you subscribing

[@upzaiz8095]

Thanks.. This was really helpful for me. I deployed my application in 10 min right after watching this. Also need to mention that for the free version, in memory data will be erased if there is no in coming traffic for a particular time. (May be 30 min)

[@RaddyDev]

Good point. Glad that you found the video useful! Thanks for the comment

[@akuakana7364]

Ephemeral file system. Resets every 24 hours with traffic and with no traffic every 30 minutes.

[@csy897]

Short and easy to follow. Thanks!

[@RaddyDev]

Thank you for watching!

[@justnhu118]

Thank you very much! It's very useful so I can submit my deadline on time

[@RaddyDev]

Glad that you found it useful! Good luck with the project

[@NoiceHD]

Thanks Raddy, helped a lot. Works perfectly for me

[@RaddyDev]

I am glad that it worked. Thanks for the comment 👊🦍

[@RurouniKenshinShinta]

Holy shit! You are a legend! This finally worked for me after trying to troubleshoot an error for an hour and half. Thanks!

[@RaddyDev]

Glad that you found it helpful, Kintsugi. Thank you for watching!

[@user-qc3wj3dg4k]

Thank you very much!!! It's really useful and clear to follow your steps.

[@RaddyDev]

Glad to hear that. Thank you for the comment!

[@GalileoBTC]

thanks for your help, dude!

[@jcdsr1]

Nice content, well done. However, you missed all the security implementation in expressjs and how to deploy as production and having an environment for testing. Will be nice to have this. On Heroku do we need to add DB on heroku plan? What about azure

[@RaddyDev]

Thank you. Yeah, there is tons more that can be covered. I guess once you get started you can always refer to the documentation. You can use their database functionality even on the free hobby plan if this is what you were asking. Azure is another beast, so it's Google cloud, AWS and so on... Plenty of options 🙂

[@abubakirmahkamov]

Thank you .This video realy helps me

[@benkimtai5995]

Pretty simple. I am Grateful

[@marcosanna8039]

great video man, you've earned a sub! Keep it up

[@RaddyDev]

Thanks for the sub!

[@rahsidqk]

Nice and straight forward thanks

[@mathistruth9105]

Wow. Thanks a lot man!!

[@RaddyDev]

Happy to help!

[@blueandraedevera8084]

YOU GOT A NEW SUB. KEEP IT UP MAN

[@RaddyDev]

I appreciate it, Blue!

[@hayatokoyama4034]

Thank you !! amazing

[@CarpMasterFishing]

Hi Raddy! Thank you for your tutorial, working perfectly! I have one question for you. Is it possible to do, that on heroku save the upload file permamently? Because I have a nodejs website, where I have an image upload page, heroku save the image, but after a few hours, i see only blank images.

[@RaddyDev]

Hey, I am glad that it worked. I just had a look and you are right. "Each dyno gets its own ephemeral filesystem, with a fresh copy of the most recently deployed code. During the dyno’s lifetime its running processes can use the filesystem as a temporary scratchpad, but no files that are written are visible to processes in any other dyno and any files written will be discarded the moment the dyno is stopped or restarted." You might have to use Cloud Storage. Companies such as Google, Amazon& IBM offer cloud storage. There might be something cheap or even free out there. I've only used Heroku for basic websites and I didn't realise that they reset the files.

[@CarpMasterFishing]

@@RaddyDev thank you for your answer! i will try to fix it with cloud storage, if not working, then I need to deploy on a paid server. Sure, for basic website is a very good alternative to try your website on server for free! :)

[@ABHAYSINGH-ch1vn]

Dude u solved my 6hrs long problem in just 8 mins and 39 secs Thank You so muchhh!!!!!!

[@RaddyDev]

Glad to hear that the video was helpful!

[@MohamedAbdulRaouf]

man i liked your style and setup

[@RaddyDev]

Thank you, I appreciate it!

[@mustafakosmaz178]

in the end it worked! thanks

[@RaddyDev]

I am glad that it worked

[@jatilyadav4000]

you are best....love from India

[@scottieblangeres9656]

Would I need to create a new repository and just move the code over from the old one to make this work, or can I do it with an already existing repo

[@RaddyDev]

Already existing repo is fine

[@Kaiz__]

Thank's for the tutorial, still working in 2022 :)

[@RaddyDev]

That's always good to hear

[@ahmedmahmoodhameed2585]

Thank you very much. Finally I deployed my website after week of suffering.

[@RaddyDev]

No pain, no gain 💪

[@J151366]

I love that "Heroku" at the beginning

[@RaddyDev]

😄😄😄

[@jessdeng9084]

If I want to make my API key as the privacy to .env file. So what should I make change on the get method newsAPI =? of news.js file?

[@RaddyDev]

You need to require dot env somewhere at the top of your app.js: require('dotenv').config() In your .env file you can add something like: APP_KEY = your API key And to use the variable in your application you would do something like: process.env.API_KEY I hope this helps

[@Frest99]

Nice! Very easy. Thank you

[@RaddyDev]

Glad that you found it easy! Thanks for the comment!

[@cesaremannino2774]

Hi Raddy, next you could do a tutorial on how to deploy a node.js with MySQL database on Heroku! Thanks for all the cool videos.

[@RaddyDev]

Hey Cesare, thank you for the comment and I like the suggestion. I will add it to my list

[@Husseinfaqih]

Cheers Mate!

[@RaddyDev]

Thank you for watching!

[@zkp143_]

How to update npm on heruko ? Had deployed a project. But shows npm have a major update. Update to 8.... Vers. So how can i do ? Did i want to edit in project through git ? Or any other way ?

[@RaddyDev]

If you want to update your npm packages I would first test locally and then reupload. You can probably do it with the CLI, but I haven't tested it. It might be the case of doing npm update

[@oleksandr8482]

Thank you, bro!

[@RaddyDev]

Thanks for the comment, bro! I appreciate it

[@rudocourtneytogara6791]

Thank you so much!

[@RaddyDev]

Glad it helped!

[@iman8120]

Can I deploy web socket project in heroku?

[@abbg1436]

Thanks !!!!!

[@suaterklc6425]

Great video! Thanks.

[@RaddyDev]

Thank you for watching 👌

[@shubhangarbeeragere9060]

this actually works!!!!!!!!! thank you

[@RaddyDev]

Haha of course it does. Thank you for the comment

[@nahidkarimankur4828]

Thank you man! Subscribe done

[@RaddyDev]

Thanks for the support, brother! 👊🦍

[@thestar001Official]

In the Procfile you would have to use the actual name of your server file.

[@Bartman2Dilaw]

Hi Raddy, Thanks for sharing, it will be helpful. Unfortunately, the "local" and remote (heroku) versions do not work. I am indeed not getting any record on the "/" route In "local" I get "no posts found" but no error on console. On the "heroku" version, I get an error on the heroku console of the project: "Error connect ECONNREFUSED 94.136.40.82:443" I don't know what to do. Thanks for your help Alain

[@RaddyDev]

Hi Alain, thanks for the comment. I know what the problem is. A few days ago I changed my domain name and hosting IP address. Unfortunately I had a few issues with my domain and I couldn't do a re-direct on the same day. The redirect should work now and you won't get the error. Alternatively you can try raddy.dev. Saying this I do have some firewall protection in place which could also block access. It has happened once. Hopefully it will just work now, but I will make a note for other people

[@Bartman2Dilaw]

@@RaddyDev Thank you. I've already tried the raddy.dev link without success as far as I remember. I'll try again later and let you know

[@RaddyDev]

Okay let me know. It might be my firewall... You can try pretty much any WordPress website that has their rest API open

[@rasulakhundov500]

Thank you so much

[@alec3979]

Thank you! 👏

[@RaddyDev]

Thank you for watching! High five 🖐😎

[@alec3979]

@@RaddyDev 🖐️😎

[@par4ll4x15]

Thank you sir

[@ChaeRi9]

Thanks bro

[@RaddyDev]

👊😎

[@aasthajha1051]

hey! I'm having links on my web pages that when clicked open a new ejs web page. It work totally fine in local server.But when hosted on heroku it give error that is Application error and unable to open the ejs page when click on the links

[@RaddyDev]

Hey, Aastha! It sounds like it could be the path to your files. It's obviously finding the pages locally, but for some reason not on heroku. You could set a static folder to be used if you haven't done that. Anyway, double check your path

[@mohammedshafin7399]

Thanks

[@jandesterke9608]

Maybe do an explanation on how to connect a domain to your heroku app so itt's ready to go live.

[@RaddyDev]

That's a good idea. I will do that, thank you

[@diyahanggraini8461]

thank you so muchh, you save my day!!!!

[@RaddyDev]

Any time, Diyah!

[@eliaserbenjamin6892]

Struggling to install cli for Mac on Command line, help?

[@RaddyDev]

First, you have to get Homebrew which is a package manager for macOS & Linux. Go their page brew.sh and install it. They have one command installation. Once you do this, try Heroku CLI again. I hope that this works!

[@jamesmassa1999]

Thank You for taking the time to produce this video, this was helpful. Oh, and get a haircut you, hippie! Best

[@RaddyDev]

😂😂

[@hidezet]

Thank you for kind video! I am heroku deploy-possible person now! :-)

[@RaddyDev]

I love it! Thanks for the comment, Juan

[@5555aramacomom]

Merci. T'es un mec bien

[@RaddyDev]

Merci beaucoup

[@pushkarjain2494]

Spot on explanation

[@RaddyDev]

Glad you liked it

[@uploadvoice]

Great video ! Btw what are the limitations for the free plan ?

[@RaddyDev]

The free plan is for non-commercial apps, such as proof of concepts, MVP's, and personal projects

[@nguyenuc9135]

i try do like your tutorial. But when i open app with heroku, on page show this message: Upgrade Required. Tell me what's it and how to fix! my project is websocket server.

[@RaddyDev]

I am not sure what it could be. Did you not find anything on the web?

[@hamsithacs4091]

wowo wowowo i can't express myself, i am trying from yesterday but i didn't find a tutorial like this!!!!!

[@RaddyDev]

Glad that you like the video. Thanks for the comment!

[@njohbless2580]

does the site all you to host website for free with a domain name and hosting ?

[@RaddyDev]

Try Render as I don't think that this is free anymore

[@ayoubomari1347]

thank you very much

[@RaddyDev]

I hope that it was helpful. Thank you 👊😎

[@F1World2023]

After adding git add. So many statements come it's end less why is that so?

[@RaddyDev]

What do they say? Usually they are quite informative. Look at what the errors are and just look online how to solve them

[@masterpc-9845x]

I got an error when trying to open the app. I got this " Error: Cannot find module 'express' when I checked with heroku logs. What happened?

[@RaddyDev]

You need to add express as dependency to your project. Heroku install them via npm install so you need to have it listed in your package.json

[@masterpc-9845x]

@@RaddyDev I've fix it already. Thanks a lot!

[@RohitVerma-fd8cl]

Thankyou Very Much!!!

[@RaddyDev]

Thanks for watching, Rohit!

[@ml-rj5pt]

Is it really free? One week after I deploy a sample app to Heroku, I suddenly got an email saying I got a charge - $1.23 for Application dynos. I don't remember what application dynos is.

[@RaddyDev]

Heroku is no longer free. If you started on the free tier, they would have warned you that your instance will stop working. They won't just randomly start charging you (I don't think). You've signed up to their paid tier by the sound of it. Cyclic and Render have free plans that you could try

[@Lelouchvv]

thank you!!!

[@RaddyDev]

Thank you for watching! 👊😎

[@devajithp4184]

what if the running file is in a subfolder

[@RaddyDev]

in your package.json file, you can specify the subfolder and it should be fine

[@shauryaagarwal4689]

Can anyone please help me!!! I'm not able to use the git command in my vs code. It's showing that 'git' command cannot is not recognized.

[@RaddyDev]

Try installing Git if you havent

[@shauryaagarwal4689]

@@RaddyDev Thanks. Worked!!!!!

[@RaddyDev]

@@shauryaagarwal4689 that's awesome!

[@stepanvalerivich6999]

you're a lifesaver

[@RaddyDev]

👊😎

[@jpjapos2427]

What's that file with .env extension. I'm having an application error

[@RaddyDev]

.env holds environment variables. In this example, we are storing our database host, user, and password. You can store all sorts of stuff in there. I actually just done a full tutorial on .env if you want to check it out. It's one of the last videos that I've done

[@alanbiju1751]

What to do if I have MySQL database connection with my node js project

[@RaddyDev]

Instead of localhost you could remote connect to it and it should still work

[@alanbiju1751]

@@RaddyDevok thanks man

[@deepakajay4204]

Thank you

[@RaddyDev]

Thank you for watching!

[@KmeOst]

Muchas gracias !

[@RaddyDev]

Se lo agradezco mucho!

[@ahmedayman7626]

Thanks :)

[@RaddyDev]

Thank you for watching!

[@MrHitesh297]

Thanks, I missed the Procfile!

[@RaddyDev]

There was a way to make it work without the Procfile. If it works, don't fix it :-D

[@salihhasan9662]

Heroku guy 👍👍👍👍

[@theojubard5736]

merci bro

[@RaddyDev]

merci beaucoup

[@jatilyadav4000]

thank you soo much sir...........

[@RaddyDev]

Thank you, Jatil!

[@otonielcarlos2099]

Whats your vs code template? looks clean

[@RaddyDev]

Hi Otoniel, it's called Dracula 🧛‍♂️

[@otonielcarlos2099]

@@RaddyDev Nice I just installed it and its fire. thanks!

[@govindjain424]

Thanks, it was a great tutorial. But you missed one thing to install git. I was not having git and it created some problem.

[@RaddyDev]

It really didn't cross my mind... thanks for letting me know, I will have to put a note on the video

[@enricoperez9147]

is it just me or the audio and video are not synced?

[@RaddyDev]

You are right, the audio is out of sync. No idea why that would have happened as I would have noticed when I was editing the video

[@b-13prathameshpawar62]

Thank U

[@RaddyDev]

You're welcome!

[@kostya45]

Great video, 10x

[@RaddyDev]

Thank you!

[@morososaas3397]

If your package.json is not in the root directory. It cannot do this.

[@RaddyDev]

Thanks for the comment, Moroso! 🙂

[@scottisitt]

This is pretty confusing with the instructions not matching what's on the video... Still appreciate the explanation, though. 👍

[@RaddyDev]

I appreciate your comment. Unfortunately the instructions do change. I might have to update the article on my blog

[@anishjoshi1999]

love from nepal

[@RaddyDev]

Thank you 👊🦍

[@shubhanshusahuu]

Deployed successfully but it is showing Application error "An error occurred in the application and your page could not be served.

[@RaddyDev]

Check to see if you are using process.env.PORT instead of hand-coding it

[@shubhanshusahuu]

@@RaddyDev i am using first one and pipe sign then 3000 port number

[@RaddyDev]

This looks just like your problem: github.com/StartBootstrap/startbootstrap-freelancer/issues/89 Hopefully the answer on there will help

[@shubhanshusahuu]

@@RaddyDev i got that I putted a white space after web in Procfile, now i removed it and it worked👍

[@Pranauv]

im always getting port not binding error!!! pls help anybody .. i have tried literally everything but none are working!

[@RaddyDev]

Heroku automatically assigns the port number. So what you have to do is this: .listen(process.env.PORT || 5000)

[@Pranauv]

@@RaddyDev I've tried that too... It isn't working 😶

[@RaddyDev]

@@Pranauv In the logs can you see an error code? Usually you can google that and hopefully find the answer. I am not sure what else it could be

[@Pranauv]

@@RaddyDev ok thanks

[@rayarozen]

error: failed to push some refs to....

[@RaddyDev]

You probably haven't committed. git commit -m 'message'

[@ryan_roga]

Do you still need a Procfile in 2022? 🤔

[@RaddyDev]

Nope. The setup now is fairly straightforward

[@libertydaniel6366]

How can I solve error in heroku cannot GET/

[@RaddyDev]

Create a router for the page. Make sure that your project is working locally first and then you can upload

[@libertydaniel6366]

@@RaddyDev it's working locally. Like everything is well i even refactoring my code. Like to put the GET / route nut it's still the same

[@RaddyDev]

That's really strange. You could check in the Heroku logs to see if there are any errors. Is your project public on GitHub? It could be something small

[@libertydaniel6366]

@@RaddyDev I found the error it's refusing to send my react file when on heroku but in local dev it's working perfectly. This the error I get ..Error: ENOENT: no such file or directory, stat '/build/index.html'

[@RaddyDev]

@@libertydaniel6366 So I wound assume that you just need to build your project and then upload. Glad that you spotted that

[@endless4785]

Heroku free dyno will no longer available on November 28 sad/

[@RaddyDev]

That's a shame... we need to find a good alternative

[@darktools186]

Is it secure ? I have sensible information in my node js files

[@RaddyDev]

As far as I know it's secure. Heroku is pretty big

[@darktools186]

@@RaddyDev how can I update my git ?

[@RaddyDev]

@@darktools186 on windows you can do "git update" or "git update-git-for-windows" and on Linux you can do "sudo apt-get update" and then "sudo apt-get install git". I am not so sure about mac os. Also I do want to mention that storing sensitive information in your nodejs files might not be a good idea. Maybe use .env or some of the paid services. Just be careful that's all. Don't publish your nodejs project on github with all of the sensitive information that you are talking about. Other than that Heroku is a pretty well known service and in general people really like it. Shame that they are closing down their free tier...

[@darktools186]

@@RaddyDev thank you bro. Amazing video btw

[@stephenselvaraj8960]

Super :)

[@RaddyDev]

Thank you!

[@ratefiarisonharivonylalati3873]

Bro, your pic hide all the command

[@RaddyDev]

Yep... mistakes were made there... I don't record my head now :-D

[@zeyadalbadawy2245]

reach 96% and didn't complete why is that ?

[@RaddyDev]

You have to check the error logs in Heroku and they will tell you. It might give you an error code that you can google

[@ldstudio3044]

merci

[@RaddyDev]

Thank you for watching

[@checkerface5710]

wait is heroku like github ?

[@RaddyDev]

It's a little bit different. You can pretty much deploy projects in most languages and also manage data services. You can pick any database and get it installed fairly easy. I am not sure if you could run a node js project on github... I think that you can only have static web pages?

[@knowledgezone5399]

It will not work after 30 minutes inactive status

[@RaddyDev]

You mean that the app goes to sleep after 30 min of inactivity? That's pretty normal and I guess it's a good thing in terms of saving resources. You can ping your website every 15 min or so if you like and that won't happen. Or get some visitors on your website :)