Contoso Real Estate:企业级JavaScript参考架构解析
Contoso Real Estate是一个智能化的企业级JavaScript参考架构,为构建现代化的可组合前端(或微前端)和云原生应用提供了最佳实践、架构模式和功能组件。这个项目集成了OpenAI、Azure Developer CLI模板和Playwright测试等先进技术,展示了如何在Azure上构建和部署现代JavaScript应用。
项目概述
Contoso Real Estate是一个面向企业内部的房地产应用,允许Contoso公司的员工通过Web应用搜索和预订重新安置住房。这个应用主要由两部分组成:
- 公共博客:使用Next.js构建,托管在Azure Container Apps上,通过Strapi CMS管理内容。
- 安全门户:使用Angular构建,托管在Azure Static Web Apps上,后端API由Azure Functions提供支持。
该应用还集成了多项Azure服务,如Azure Cosmos DB、Azure Database for PostgreSQL、Azure Blob Storage等,以提供全面的企业级解决方案。
核心功能
Contoso Real Estate包含以下核心应用场景:
- AI聊天机器人集成(RAG模式)
- 与Stripe集成的支付功能
- 实时通知
- 门户应用程序,包括房源列表、收藏夹、用户认证和个人资料
- 无头CMS和博客
技术架构
该项目采用了现代化的技术栈:
- 前端: Angular(门户)、Next.js(博客)
- 后端: Azure Functions、Strapi CMS、Fastify
- 数据库: Azure Cosmos DB(MongoDB)、Azure Database for PostgreSQL
- 存储: Azure Blob Storage
- 托管: Azure Static Web Apps、Azure Container Apps
- DevOps: GitHub Actions、Azure Developer CLI
- 监控: Azure Application Insights
开发环境
项目针对GitHub Codespaces进行了优化,提供了云端开发环境。开发者可以通过以下步骤快速开始:
- Fork项目仓库
- 创建新的GitHub Codespaces
- 运行
npm install && npm start
启动开发服务器
AI聊天机器人集成
Contoso Real Estate可以集成基于Azure OpenAI构建的AI支持聊天机器人,为用户提供智能化的交互体验。
部署到Azure
项目使用Azure Developer CLI (azd
)来配置基础设施、打包和部署应用到Azure。主要步骤包括:
- 登录azd
- 配置基础设施和azd开发环境
- 打包并部署应用
项目结构
项目使用npm workspaces管理,主要包含以下包:
- api: 无服务器Azure Functions API
- portal: Angular Web门户
- blog: Next.js博客
- blog-cms: Strapi CMS
- docs: 开发者指南网站
- stripe: Stripe webhook
- testing: Playwright测试
开发指南
项目提供了独立的开发者指南,使用Docusaurus平台实现为交互式网站。开发者可以通过该指南深入了解项目的各个方面。
结语
Contoso Real Estate展示了如何利用Azure的各种服务构建一个全面的企业级JavaScript应用。它不仅提供了参考架构,还包含了最佳实践和功能组件,为开发者提供了宝贵的学习资源。无论是构建微前端、集成AI功能,还是实现DevOps流程,这个项目都提供了详细的指导和实践示例。
对于希望在Azure上构建现代化JavaScript应用的开发者来说,Contoso Real Estate无疑是一个极具价值的参考项目。通过深入研究和实践这个项目,开发者可以掌握构建企业级云原生应用的关键技能和最佳实践。