The Bearcam Companion application was pretty much ready to go after my last post on Lambdas. The final step (at least for a minimum viable product) was to publish the site. Not surprisingly, I chose to use AWS Amplify Hosting.
AWS Amplify Hosting
There is an overview on how to use Amplify to set up hosting for your site in the AWS Amplify User Guide. I used the Amplify Console to get started.
Connect to GitHub
Since I already have my code in a GitHub repository (as described here), decided to use a continuous integration flow. In the setup, I selected GitHub and connected Amplify to my repository. I only have one branch and one back end (staging) so far, so I selected those. The build settings were automatically detected for both the front end and back end, so I confirmed them. After clicking Save and Deploy, the build process started.
Auto-build Process
The build process goes through 4 steps:
- Provision - Sets up the build environment on a default host.
- Build - Clones the repo, deploys the backend and builds the front end.
- Deploy - Deploys artifacts to a managed hosting environment.
- Verify - Screen shots of the application are rendered.
The first build failed because I didn't have aws-amplify in the GitHub repo. I ran
npm install aws-amplify
and committed the change. Once I pushed it to GitHub, the Amplify build process started automatically.
This time the build was successful, and I was able to view the application at the provided URL:
https://master.d7ijzylsc7qfm.amplifyapp.com/
The build history, and all the details for each step, are available in the console.
Every time I push commits to the main repo, the above process kicks off, ending with a fresh new deployment of the site.
Custom URL
The default URL is not very user friendly. I want the web application to appear as part of the BearID Project (http://bearid.org/). Specifically, I want to set it up at app.bearid.org.
To achieve this, I followed the Set up custom domains section of the Amplify User Guide. Essentially, you need to add some DNS records wherever your domain is managed. In my case, I had to add 2 CNAME records. The first record maps the subdomain (app) to the default Amplify app url above. The second record points to the AWS Certificate Manager (ACM) validation server, which enables TLS, and therefore, https. Finally I set up a subdomain forward so that all accesses to my URL go to the Amplify application.
Once I completed the setup, I had to wait a few hours for all the records to propagate and for the SLL configuration to complete:
Once the Domain Activation step above completed, I am able to view the Bearcam Companion at https://app.bearid.org/.
Conclusion
In this post I discussed hosting my application with Amplify, connecting it to my GitHub repo for automatic deployment and setting up a custom URL. Once again, Amplify made the process extremely easy.
If you find yourself watching the Brooks Falls Brown Bears cam on Explore.org and you are interested in learning who is who, sign up and log in to the Bearcam Companion. If you already know the bear of Brooks River, log in and help us label the images!
Top comments (0)