Jarvis Portal Shell
What is Jarvis Portal Shell?
Jarvis Portal Shell (or JShell) is a web application that provides infrastructure for dynamic portals in order to allow users access to content and services related to their HP printing assets.
This consists of:
- Components to create basic portal structures supporting micro frontends or MFEs
- Tools to build and configure portals that take advantage of HP digital ecosystem features
- A shift in design towards interfaces centered on users
Jarvis Portal Shell encapsulates services developed by various teams, as reusable micro frontends which display in HP user portals based on user roles, entitlements, program level, context, etc. It is being developed in conjunction with initiatives such as Enterprise Control Portal (ECP), SMB Portal, and Printables.
What is a micro frontend?
Micro-frontend (MFE) architecture is a design approach in which a front-end, user-facing app (i.e., a dashboard or a user portal) is composed of individual, semi-independent microapps (e.g., devices, services, etc.,) that may be owned by separate, independent teams.
This approach provides more freedom to make case-by-case decisions on individual parts of products, and to make incremental upgrades and enhancements to architecture, dependencies, and user experience.
Micro-frontends embody many of the ideals of a Progressive Web App, including reaching anyone, anywhere, on any device with a single codebase, built with modern APIs to deliver enhanced capabilities, reliability, and installability.
What is the process for creating a micro frontend app?
Step 1: Create a page using the starter template
Using the Jarvis React component starter template ensures your creation conforms to standard Jarvis-recommended technologies like Typescript, Sass, HP Veneer for common UI components, React-Styleguidist for documentation, HP Codeway pipeline, Sonar Qube, React-Testing-Library, etc.
Step 2: Set up state management
Application state is a combination of multiple microapp states, and is managed with an observer design pattern.
Step 3: Set up dependencies
These include Jarvis portal additions to facilitate integration with UCDE Portal.
Step 4: Define what the micro frontend does
Add functionality and connectivity to any backend services.
Step 5: Deploy your micro frontend
Run a pipeline to push your micro frontend so that it loads and renders correctly.
Learn more about getting started here.