Component Diagram
The Sunbird portal is the browser-based interface for the Sunbird application stack. It provides a web app through which all functionality of Sunbird can be accessed.
Last updated
The Sunbird portal is the browser-based interface for the Sunbird application stack. It provides a web app through which all functionality of Sunbird can be accessed.
Last updated
The Sunbird ED portal is divided into two folders
App : Contains the Backend code base which used Node.js framework for server-side.
Client : Contains the Forntend code base which used Angular framework for client-side
Client Folder includes the client source code for the Angular application. This folder includes various components, modules, services, styles, and other assets necessary to build the front end of the application.
The key module which is used in Sunbird Portal UI
The main objective of this folder is to provide all the public route (i.e. consumers) in one place which can further be leveraged.
This folder contains routing for the modules which can be accessed by everyone and does not have any auth required Ex: guest user/anonymous user.
The main objective of this folder is to provide a static screen component which is present in every route in one place. which can further be leveraged if needed.
The folder contains those components which are statically positioned though data will be dynamic, we integrate the core components at the app level so that they are present in every route and also provides the routes to different modules such as the header, footer, search, main menu, and language dropdown.
The main objective of this folder is to provide all reusable features in one place which can further be leveraged if needed.
The Folder contains all the reusable components across the portal such as the loader, popup, card,sb-data table, alert popup, slick etc...
Manage Learn contains tools or solutions like Observation, projects, and surveys. These tools are used to help the learners to learn in a structured manner.
In the portal, lots of UI capabilities are generalised in terms of formConfig. to reduce the code dependency by decoupling form logic from the portal code.
The Purpose of all the libraries is to make the UI more consistent across all the clients who are using this library.
| Library Name | GitHub Repo | Description |
|---|---|---|
Common-Consumption | These components are designed to be used in Sunbird consumption platforms ( web portal, offline desktop app) to drive reusability, maintainability hence reduce the redundant development effort significantly. | |
SB-Forms | This Library expects a configuration and renders form according to the view. | |
SB-Dashlet | Library used for Reusable charts. Supported by charts has an extensible, general purpose analytical presentation capabilities like graphs, tables, charts etc.. | |
Client-Services | Library used to create API calls with Sunbird Environment. Includes necessary typescript code to do search, content read, corresponding data models of the platform are available. | |
Quml Player | The library which is responsible for rendering questions and question sets created according to the QuML specification. | |
Collection-Editors | Library which supports to create all type of collections like Book, Course, PlayList & QuestionSet | |
Video Player | The Video player library is used to play video/audio content in Sunbird ED | |
PDF Player | The PDF player library is used to play pdf content on Sunbird ED | |
Epub Player | The Epub player library is used to play epub content on Sunbird ED |
App Folder(without client) Includes backend API interface which is used Node.js framework.
It leverages a keyCloakHelper file to handle login and logout functionalities while adopting token-based session storage to manage user sessions effectively.
Additionally, the interface integrates multiple API middleware functions to accomplish tasks such as token verification, API whitelisting, and customizing request headers as needed.
It is used in web development for the server-side entry point of a Node.js application.
It acts as the main starting point of the server, responsible for initializing the server, defining routes, and handling incoming requests from clients.
it is used to store the session based on Anonymous & Logged in User
It handles all the API routes. which are triggering from the client side. such as content/*, content/copy/questionset etc.
Contains all the js files which are used for user authentication and authorization.
Contains the API Whitelist js file which Handles whitelisting and role checks of Portal API(s).
it contains the set-up method such as decoraterequestHeader, verifyToken, and isApiwhitelisted which validates whether the API request is valid or not with proper role check and auths token.
ResourceBundles: it contains the resource bundles for internationalization and localization purposes in the application. it is used for translations and provides a seamless way to display the application's user interface in different languages based on user preferences.
It contains the envHelperFile which is responsible for storing the env variable that is required in the portal from DevOps.
Lots of front-end Libraries and services we are leveraging from the other building blocks
