Best Way to deploy a React and Express application on AWS
React App Deployment:
AWS Amplify is a development platform for building secure, scale-able mobile and web applications. Amplify covers the complete mobile application development workflow from version control, code testing, to production deployment, and it easily scales with your business from thousands of users to tens of millions. It gets your React, Angular, Vue applications into production within few minutes.
Deploy React App with AWS Amplify Console:
- Create Project
- Connect it with your favorite git hosting services like GitHub, Git-Lab, Bit-Bucket etc.
- Configure build settings
- Deploy your application
- Bonus: You can connect your custom domain with Amplify and get free SSL Certificate.
Express App Deployment:
AWS Elastic Beanstalk
A good reliable and scalable application needs the Load Balancer, Auto Scaling, Secure Network a fast and reliable storage and all of these features are available and easily configurable through the AWS Elastic Beanstalk. EB supports other languages besides PHP, such as Java, .NET, Node.JS, Python, Ruby, Docker, and Go.
The below diagram is the architecture diagram of a sample highly available and highly scalable application running in the cloud.
Deploy Express App with AWS Elastic Beanstalk Console:
- Create New Application
- Configure Application – Application Name, Description
- Configure your environment
- Create Web Server
- Select the platform. In our case Node.js
- Upload your source code
- Select Configure more options:
- You can configure Software, Instances, Capacity, Load Balancer, Monitoring and much more.
- For adding Load Balancer and auto scaling to you project choose high availability as a preset for your configuration.
- After you are done click on create application, it will automatically provision all the required resources.
- Accessing your Elastic Beanstalk Application
- Go to the main Elastic Beanstalk Dashboard
- Select your application
- Click on the URL displayed, your application will be running if everything went well.
- You can also add the wrap to this URL with your custom web added in amplify, so that your applications front-end and back-end run on the same domain. For this purpose, use AWS Route 53 service.