Archiving alert: While the code for this post is still available, I have deactivated the Cloud Run service to avoid subscription payments. You can still run in a container locally!

The utility below is a Typescript React application that is running inside a Docker container on Google’s Cloud Run, primarily meant to demonstrate React concepts like functional components, asynchronous services, and state.

It uses the axios library to make asynchronous RESTful requests for literary quotes from a public API I developed based on one I found in this Medium article. The code for the front end of the project is on my GitHub at bens-blog-react. The database of quotes on the back end connects to the front end with a FastAPI service found here.

The Cloud Run service is will automatically update the application with any changes to either project repository. Ideally, I can use this service to randomly provide custom quotes to the blog home eventually. I might also upgrade this code to use SASS to generate the CSS styles to reduce the overlap in my selectors and to improve the application file structure and use these repos as demos for unit testing.

I will accompany this post with a follow-along tutorial edition explaining how this demo was made!

Also, if the Cloud Run service is unavailable, sometimes it just needs a minute to fire up, but there may an issue with an update that will prevent it from rendering on the page. I will monitor this, but please contact or comment below if it doesn’t restart soon enough and I can fix it! I can demonstrate rollbacks and reliability in another post focused on DevOps.