Get started with Contoso Real Estate enterprise app
The Contoso Real Estate application contains the reference architecture and components for building enterprise-grade modern composable frontends (or micro-frontends) and cloud-native applications. It is a collection of best practices, architecture patterns, and functional components that can be used to build and deploy modern JavaScript applications to Azure.
The Contoso Real Estate app
The Contoso Real Estate enterprise app allows employees of the Contoso company to search for a reserve relocation housing through a web app. This web app is an internal tool used by Contoso HR and new hire or relocating employees. Both authenticated Talent Managers, and new hires can interact with the application features, while nonauthenticated users can access some parts of it.
- Learn Live: Learn more about this solution by watching the Learn Live sessions.
- Learn Collection: Learn more about this solution with the Learn Collection.
Prerequisites
To deploy this entire app solution to Azure, you need:
- An Azure subscription - Create one for free
- A GitHub account. If you don't have one, sign up for free.
- A Strapi account for headless CMS
- A Stripe account for payments
Application
The Contoso Real Estate app has two client applications, the portal and the blog. The blog publicizes new real estate offerings and if visible without authentication. The portal app requires authentication to view, reserve, and pay for listings. Separate development teams have built and support this end-to-end architecture with their own choice of technical stack.
Public blog with Next:
The blog and its API are hosted from Azure Container Apps. The blog content is served from a headless Strapi CMS with data stored in Azure Database for PostrgreSQL. The CMS also stores the real estate listings. Property images for listings are stored in Azure Blob Storage.
Secure portal client with Angular
The portal is hosted in an Azure Static Web app with API support from an Azure Functions App. It also uses the listings held in the Azure Database for PostrgreSQL. The portal provides authentication through social providers such as Microsoft, Google, and Facebook.
Once a user signs in, and selects a property, they can choose to reserve the property then pay for it with a Stripe integration.
Other Azure services used include:
- Azure Key Vault to store keys, secrets, and certificates
- Azure Cosmos DB to store user data
- Azure API Management to provide API to protect, accelerate, and observe APIs
Packages
This application is divided into several packages. Each package describes a scenario of what is in the package and step-by-step instructions to help you build and deploy the package to Azure.
| Package | technology stack |
|---|---|
| Blog, Blob-CMS | Next.js app with a Strapi CMS, both hosted in an Azure Container app. |
| Portal, API | Angular web portal hosted from Static Web Apps with Azure Functions API app for the backend. |
| Stripe | Fastify API Payment service API in an Azure Container app. |
| Testing | End to end testing with Playwright. |
| Docs | Learn more about this end to end solution. |
Next step
Feedback
Coming soon: Throughout 2024 we will be phasing out GitHub Issues as the feedback mechanism for content and replacing it with a new feedback system. For more information see: https://aka.ms/ContentUserFeedback.
Submit and view feedback for