Infrastructure & Framework

Also, see How to: Create and Deploy a new Microfrontend inside edX.

• Paragon / "Design System"
• Reusable components upstreamed to Paragon
• Uses frontend runways for common functionality (free with frontend-template-application cookie cutter)
• frontend-platform (authentication, analytics, i18n, logging)
• frontend-build (webpack config, babel, eslint, jest)
• Deployment
• Prod / Stage
• Devstack
• Sandbox
• Edge, if appropriate
• Open edX, if appropriate

Observability & Analytics

• Observability
• Error Logging; Alerting & Monitoring
• Analytics
• Work with Data Eng to understand how changes in URLs (retiring HTML rendering endpoints, usage of new/existing APIs) may affect analytics data flow.
• Segment integration → Snowflake (data warehouse)
• Segment integration → Tracking logs
• [Optional] Hotjar
• Ensure that PII is suppressed with data-hj-suppress attribute

Architecture concerns

• Manifesto
• SOLID Principles: Single Responsibility & Extensions
• Boundaries: Clear Bounded Contexts
• Asynchronous Client-side Integrations
• ADRs: Decision Records
• APIs
• Client usability: discoverable and self-serve
• Docs: Swagger sustainable and better integrated
• Limits: Pagination, Rate Limiting
• Compliance with MFE-related OEPs
• OEP-48 Brand Customization (pending)
• OEP-23 Style Customization (outdated)
• OEP-11 MFE Tech standards (outdated)
• Code Linting
• Code Coverage
• OEP-16 Bootstrap (outdated)
• OEP-19 Developer Docs
• OEP-47 Semantic Versioning
• OEP-31 Internationalization (pending)

Testing

• a11y (Today, this is done manually)
• Performance (compare new and old using Speedcurve)
• Multi-device support (tested using Browserstack)
• Unit tests (see OEP-11 for tech choice)
• [Optional] Acceptance tests (Cypress is being assessed as a technology)
• [Optional] Consumer-based contract tests (looking for a pilot drive of this pattern)