There are a lot of advantages to separating your front-end logic out from your back-end logic, and deploying them separately.
Separation of Code
The first big reason is that doing things this way allows you to separate your business logic (your API) from your design (your front-end).
You can keep both projects in separate Git repos. You can have your designers ship as many updates to the front-end project as they want, without ever needing to bother an engineer.
Doing that in a single monolithic project (on Elastic Beanstalk, for instance): would be nearly impossible, as designers would need to iterate their code through the engineering team.
Separation of Deployment
Web servers are slow. File servers (like S3) are fast. The reason they are fast is that there is no 'code' running to access files from a file server -- there is just a file being downloaded.
If you have a single monolithic web application served from an EC2 instance, for example, this means that to view a page, you need to run some code to generate that HTML.
If you deploy your front-end code to S3, however, that file can be directly downloaded by the web browser MUCH faster.
PROTIP: You can also put your S3 website behind CloudFront (a CDN) to speed up your website EVEN MORE by keeping a cached copy if it in multiple data centers around the world.
Faster Iteration
When you have your projects separated, and deployed separately, you can iterate faster.
Let's say your front-end team finds a bug in the website. They can easily patch / release a fix WITHOUT going through engineering.
The same is true of your engineers -- they now have more time to focus on building the core application logic, and can deploy fixes without worrying about UI changes, etc.
Simpler Product Logic
When you deploy things separately as you've described, you also get the benefit of simplifying your back-end logic.
By having your core engineers just build APIs, and stop worrying about front-end concerns, you can ship updates significantly quicker than you could otherwise.