Okay, welcome back. In this lecture, I'm going to provide you with a quick, high-level review of the architecture used to create this application. In doing so, you will understand the messaging and networking requirements to make this application functional, and also, as used in the setup in this course and the next course when we deploy it into Kubernetes. 

From an end user point of view, the application provides a web frontend, which allows the end user to vote for their favorite programming language. As the application initially launches, an AJAX call is made to the API to request the particulars for each displayed programming language. In this case, three AJAX calls are made. After the page has completed loading, the end user can then click on any one of the +1 voting buttons to vote for their preferred language. This again results in an AJAX call that is directed at the API.

The API, as we now know, has been developed in Go and simply reads and writes to a back-end MongoDB database. The high-level architectural view, as shown here, documents the composition of the application. The application consists of the following three components, packaged as containers.

• The front-end: a React-based web application, which provides a voting interface. 
• The API: a REST-based API developed in Go - this provides typical Create, Read, Update and Delete API endpoints. The front-end web application generates AJAX calls which are then sent and serviced by this API. 
• The database: a MongoDB database. The API connects to the database and performs the required read/writes. 

In the next course, we'll set up MongoDB within Kubernetes as a replica set for redundancy purposes.

The following sequence diagram shows the messaging as used within the application when the application first loads. Key points of this diagram are:

1. The browser loads the main application, HTML, JavaScript and CSS files.
2. Each programming language component makes an individual AJAX call to the /languages/{name} API endpoint to retrieve the details about the programming language keyed on the programming language name.
3. The API, in turn, connects to the back-end MongoDB database and performs a db.collection.find, filtered on the programming language name to return the document that contains all the details about the programming language.
4. A response containing the programming language then flows back all the way to the browser.
5. The browser renders the final full application view. 

The following sequence diagram shows the messaging as used within the application when an end user clicks on the +1 voting button for a particular programming language. Key points of this diagram are: 

1. Clicking the Vote button for any one of the three programming languages will result in an AJAX call being made from within the Vote component to the API endpoint languages/{name}/vote.
2. The API, in turn, connects to the back-end MongoDB database and performs a db.collection.updateOne, filtered on the programming language name and increments the Vote field on the respective document.
3. An update success code is returned in the response and is passed all the way back to the originating AJAX call.
4. The browser renders and increments the respective Votes div within the Vote component.

Okay, that completes this lecture on a brief but important high-level architectural review of the entire cloud-native application. 

Go ahead and close this lecture and we'll see you shortly in the next one where we'll review the React-based front-end code base, exploring the key components.