Skip to main content Link Menu Expand (external link) Document Search Copy Copied

Exercise 03 - Split and repackage the Contoso Hotel app components and deploy the updated app

To improve the scalability of the app, Contoso plans to split the front-end components (HTML, CSS, and JavaScript files) from back-end components (APIs). In this exercise you’ll split the components and refactor some code. Then, you’ll deploy the front-end and back-end components to separate containers. Finally, you’ll push the containers to ACR and run the updated app.

The updated app will use the following architecture:

bax0ke9c.png

Objectives

After completing the tasks in this exercise, you’ll be able to:

  • Separate front-end components from back-end components.
  • Refactor the front-end views.py file.
  • Refactor other front-end files.
  • Refactor the back-end views.py file.
  • Build the containers for front-end and back-end components.
  • Create the container apps in Azure.
  • Configure CORS in the back-end source code.

Exercise Duration

Estimated time to complete this exercise: 60 minutes


Table of contents