I'm creating a web application that has Angular for front end and Flask for back end. I already 'dockered' my applications but I'm not sure on how to get them in Heroku as the same application
I've been reading that some people has used a reverse proxy server (this means that both applications are in different heroku app and they connect them using a proxy like traeffik or haproxy). But I don't want to do this, I want them to be in the same application (Example: grupo-camporota.herokuapp.com
)
I was thinking that I should push both images, one as web dyno (front) and the other one as a worker (backend) but I've read that the worked dyno it's not for this, but for EXTERNAL apis. I would like to upload both image into heroku and make them communicate between them.
I would like to know how to get this done (I'm pretty sure it's possible), since i'm kinda lost
Each process has its own port in dev, but deploying on Heroku uses just one total. Put the working frontend in a subdirectory of root (such as /frontend ). Put the working backend in a subdirectory of root (such as /api -- the blogpost assumes the backend remains in the root directory -- either way is fine).
Heroku provides two ways for you to deploy your app with Docker: Container Registry allows you to deploy pre-built Docker images to Heroku. Build your Docker images with heroku. yml for deployment to Heroku.
Two options would be: Create a docker bridge network manually. Here are the docs for that. You'd just want to define a network with docker network create , add that network in your docker-compose, and make sure you put your frontend container in the same network when you docker run it by using the --network option.
On Heroku Dashboard, create a new App and connect it to your Github repository, click the manual deploy and check it with the public URL provided by Heroku Your backend should be up and running at Heroku scale!
It also looks like you can't communicate between Docker containers using a private network on Heroku. You may just have to deploy two apps (or host your front-end on a more appropriate static host). Thanks for answering Chris.
This is a good way to split the complexity and responsibility in different codebases. While Heroku is a very good option to deploy an api-based backend app in seconds, Netlify is a much better solution for frontend app (build system, CDN and more). Here the steps and source code to start from zero to a minimal remote and working app.
You can run 2 apps (frontend and backend) on the same Heroku dyno. It’s just not straightforward… There’s a tonne of ways it won’t work, and only 1 that will. Today we’ll walk though setting up a ReactJS/Node frontend and a Rails API backend.
Your backend can't be a worker dyno: only web dynos can receive traffic from the internet. And one app will only get a single port to listen on, so you can't run two services on a single app.
You could serve your front-end up from your back-end as static files, but I don't think that will work with Docker. Also, Flask doesn't like to serve static files itself, so that may not be a good fit either.
It also looks like you can't communicate between Docker containers using a private network on Heroku. You may just have to deploy two apps (or host your front-end on a more appropriate static host).
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With