Complex, dynamic routing for nested runtime micro front ends
AssigneeCapital One Services, LLC
InventorJonathan RICKLIS
Life of this patent
Estimating the term…
Abstract
Provided herein are systems and method for providing routing of complex dynamically updated website applications using micro front ends (MFEs). The MFEs can be instantiated in a nested fashion. Each MFE can be agnostic to other levels of the website application structure that are not directly adjacent to the MFE in the hierarchy of the nesting. Navigation events can be bubbled up to a shell application to retain top-level control of routing within the website application without requiring the shell application to have all levels of routing in the hierarchy.
Claims20
A method, comprising:
- parsing, in a shell application of a web application, a uniform resource locator (URL) for the web application into a first route label and unmatched portions;
- loading, in the shell application, a first micro front end (MFE) of the webpage application based on the first route label;
- sending, by the shell application, the unmatched portions to the first MFE;
- and
- loading, by the first MFE, a second MFE nested in the first MFE, wherein the second MFE and the shell application are agnostic to one another.
A method, comprising:
- receiving, at a first micro front end (MFE), first uniform resource locator (URL) data parsed from a URL;
- determining, in the first MFE, a first route label for a second MFE based on the first URL data;
- and
- loading, by the first MFE, the second MFE nested in the first MFE based on the first route label, wherein the second MFE is agnostic to a parent application of the first MFE and the parent application is agnostic to the second MFE.
A system, comprising:
- one or more processors;
- memory communicatively coupled to the one or more processors, the memory storing instructions which, when executed by the one or more processors, cause the one or more processors to:
- provide a shell application configured to:
- navigate to a uniform resource locator (URL) by:
- parsing the URL into a first route label and unmatched portions, the first route label corresponding to a first micro front end (MFE);
- loading the first MFE based on the first route label;
- and
- sending the unmatched portions to the first MFE;
- provide the first MFE configured to:
- receive the unmatched portions from the shell application;
- determine a second route label from the unmatched portions, the second route label corresponding to a second MFE;
- load the second MFE based on the second route labels;
- and
- provide the second MFE;
- wherein the shell application, the first MFE, and the second MFE together are configured to provide a web application that can be run in a browser;
- and
- wherein the shell application is agnostic to the second MFE and the second MFE is agnostic to the shell application.
Dependencies are inferred from the claim text.