Navigate to Register Modules and Install required modules.  

Module Terminology and Scoping 

Header Scope: e.g. - Login, are activated only once for the Site and provide Authentication functionality to the site. A completely anonymous site may not need this Module. 

Page Scope: Modules available for configuring a Page.

Is Module: Defines Modules that identify a set of Functionality. A Side-Navigation Page with multiple links, with ability to bookmark and display on the Menu. 

Data – Url Scoped: Defines custom extensible
Modules that are powered by a custom database, an API, and a react module. All sub-navigations are forwarded to the custom UI with server-side data fetched as per the navigation defined in the json specification for the module (Sub Navigations specification). 

Data Scoping is the basic block for complete extensibility, both at a UI (React) Level, and at an API powered Database level.   

e.g. – Blogs Module  

"dataScopedApiUrl": "/baseapi/",

"subNavigations": [

{

"key": "",

"value": "Blogs"

},

{

"key": "[a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{12}/BlogPosts",

"value": "Blogs/GUID0:{0}/BlogPosts"

}]

Consider a Blogs page is configured with URL of - Blogs

Navigation - Blogs 

When a User Navigates to the site, the framework will make a call to the dataScopedApiUrl json attribute - /baseapi/Blogs and package the server-side data for the react module to render. The react module uses the DOM Load method to bind the data, reducing the latency and ensuring SEO compatibility. Alternatively, the react module can use a Server-Side-Rendering (RenderAsString) which can be Hydrated on client side and bind to the api data.  

The Out-Of-Box Login Module uses Hydration to load the admin-configured Application User Menus interactively, when a user is logged in. Alternatively, one can extend the framework to provide a StaticHtmlMarkup (No Interaction Requirement) and load it as the Page Content.

Navigation - BlogPosts 

When a User Navigates to the site with the BlogPost link, the framework will make a call to the dataScopedApiUrl json attribute - /baseapi/Blogs/{:BlogId}/BlogPosts, and package the server-side data for the react module to render reducing roundtrips while ensuring SEO practices. 

The react binding cycle renders the Page from 50ms – 600ms (Estimated Times of sample sets), depending on the complexing of the rendered JSON, and well within the crawlers wait time for indexing. 

Note: The ability to fetch the data server side and provide to the React Package is a feature and not a requirement. You can skip the server side fetching and use Client-Side calls for the same, e.g. A Reporting Module can provide custom components that individually fetch server data.