Run two apps on one heroku domain - heroku

I have two apps, one is a react app being served on a node server (front end). Another one is a Spring boot app (backend that provides bunch of REST API endpoints). They live on two different github repos.
Is there a way to configure heroku to serve both of them (they run on different ports) on one domain?
Right now, I have the java spring boot app being served on one heroku domain, I want the second react project to build and run on the same domain. Any idea ?

Related

Ideal place to deploy a springboot web backend and a nextjs frontend

I just wanted to know, if someone could suggest me some sites, where i can deploy my springboot backend connected to a mysql database. My frontend is build with nextjs/react.
You can try Render or Heroku if you don't want to operate a whole Kubernetes cluster.

Server Client Communcation between heroku apps

I have a server application built on nodejs and socket.io and a client application built with typescript and socket.io.
The two apps are separate git repos.
Can I host them as separate apps on heroku and allow communication between them or do they need to share repo/heroku app?
As heroku allow to open single port per application. You have to use separate heroku apps for:
Nodejs backend which includes socket.io
Front client application which built on Typescript.
You can share share Repo if you're not connected Git with Heroku Repo.
But in case you connected Github repo with Heroku app you need a separate Repo for both.

Webserver for Angular and Spring application

I'm building a small web application for a personal project. It will be an Angular web application which will talk to a Spring-Boot service layer which in turn will read/write stuff to MongoDb.
I hope to host all this on a single EC2 instance in AWS. My question is how to configure a web server (like Apache but doesn't have to be) to 'beautify' the URLs a bit. Example, without touching anything angular will run at something like host:4200 and the service layer at host:8080. I will then have to map a proper domain to host in AWS, but the hiding of ports etc is where it gets murky for me.
I want to be able to hit my web app at domain.com (no ports etc) and I also want my service layer to ideally have a similar setup e.g. domain.com/service (no ports etc).
How do I configure a webservice to do this for me? Examples or pointers to specific examples would be ideal, but even a pointer to the right documentation will be helpful.
This thread is kind of similar to what I want but not too helpful: How to deploy Spring framework backend and Angular 2 frontend application in any online server?
You can use a setup with AWS CloudFront as reverse proxy and CDN cache. You can map the Domain Name and SSL Certificates(You can use AWS issued free SSL Certificates through AWS Certificate Manager) to CloudFront while the EC2 instance is plugged as an origin behind CloudFront as shown in the following diagram.
In the diagram I have optionally added, which is a common practice in designing applications in AWS.
Hosting the Angular App in S3
Using Autoscaling & Loadbalancing for EC2 instances.
You need to use Apache or other web server as a reverse proxy. Start here -
https://devops.profitbricks.com/tutorials/configure-apache-as-a-reverse-proxy-using-mod_proxy-on-ubuntu/
You then will need to setup a custom domain name. The easiest option is to just use an ELB (now called Classic Load Balancer). More details are here -
http://docs.aws.amazon.com/elasticloadbalancing/latest/classic/using-domain-names-with-elb.html

Uploading Angular 2 app to web hosting

So far I've used web hosting such as https://uk.godaddy.com/hosting/web-hosting for my websites, but seem like running angular 2 app has different way for publication.
So, since I found nothing about running Angular 2 app to be available public, and not only in localhost
My questions are -
What providers do allow such apps to be hosted on them? now I'm using npm start in my project folder to run my app, does it works the same way?
Since my backend is Laravel and supposed to be in the same domain as the Angular2 frontend, These providers allow to host the API's too?
Thanks in advance!
I have also hosted my laravel backend and angular front end using openshift. In terms to your application, I recommend you the following two providers.
Amazon Web Service. You can get 1 year free trial, EC2 is really wonderful to host whatever you want. In EC2, you can configure the environment for angular 2 and laravel by yourself. You can run any command including npm install in EC2
Openshift. You can freely create 3 gears to host your application. The environment is very easy to configure. If you want
to deploy angular 2, laravel applications, there are specific gears for these frameworks, so openshift
should be the best choice.
The answer to your second question : Yes, they allow to host the APIs !

Can I have multiple heroku subdomains for my app?

Say you have two apps hosted on heroku: appA and appB. They will be accessible at appA.herokuapp.com and appB.herokuapp.com. Is there a way to "share" the subdomains? As in, can I have appA listening on both urls?
I suppose I could have appB forward all its traffic to appA, but I'm more curious if it can be done through some heroku setting.
Thanks!
No, this cannot be done through a heroku setting. You either need one of the two apps acting as a reverse proxy to the other app, or else you need a third server running a dedicated reverse proxy such as nginx.
Heroku support once suggested using a third heroku app as an nginx reverse proxy with a custom buildpack to accomplish this, although I decided not to go that route. It is unfortunate that there is no systematic support for multiple apps on the same domain at Heroku, but that would add significant complexity to their currently predictable and transparent routing platform (which is itself a non-configurable reverse proxy).

Resources