I have an Elastic Beanstalk instance serving a backend app running natively HTTP and an Angular app hosted on a S3 instance.
Now, I would like to put these on a single domain www.example.com, behind a SSL protected Load Balancer which will route the request internally by the URI, either to the backend (/api/) or angular app (/). For this I setup a Route53 DNS which I wired to the LB.
I don't see an option to route directly from LB to the S3 instance though. I've read that, I should create a CloudFront distribution for the angular app and specify the LB as the origin but after configuring CF distro, I don't see any option inside of the LB to connect it to the angular app. How should I approach it?
Routing should be handled on CloudFront not on load balancer in this case. You can create multiple behaviors in CloudFront, each pointing to a different origin. So you can choose default CloudFront behavior(*) to point to your s3 bucket and create second behavior that is used whenever URL contains /api to point to your load balancer origin.