This project serves to demonstrate creating SKYUX Add-ins for the Blackbaud Raiser's Edge NXT Portal by mimicking an event registration application. It's an Angular 17 project that manually deploys to Github pages.
ng serve will run the project locally.
Running ng deploy --base-href=/skyux-portal-addin-demo/ will deploy your current local project to Github pages, assuming you have access to the repo.
The code that is deployed will be available at https://blackbaud.github.io/skyux-portal-addin-demo/.
Note that it will not automatically deploy the main branch - it will deploy whatever branch you are currently on.
This SPA contains 3 main components under the addins folder. Each component is designed to demonstrate a different extension point of the Portal. It loosely follows the theme of registering for an event. None of the data is persisted, so each part is not connected to any of the others; however, you can add data persistence to this application to make it fully functional.
This add-in demonstrates how to create a settings add-in used by a back-office user in RENXT. It is located in the addins/settings folder. It displays a small item in the Portal settings that allows the back-office user to turn off event registration or view events that are eligible for registration.
This add-in demonstrates creating a home page action for a portal user. It is located in the addins/portal-action folder. It displays an action button in the Portal home page that when clicked opens a modal that allows the portal user to register for an event. This uses the portal user's RENXT Constituent ID as the identifier for the user, and demonstrates how to get that ID from the User Identity Token.
This add-in demonstrates creating a profile tab for a portal user. It is located in the addins/profile-tab folder. It displays a tab in the Portal profile page that allows the portal user to view events that they have registered for. This uses the portal user's RENXT Constituent ID as the identifier for the user, and demonstrates how to get that ID from the User Identity Token.
If you want to see what these look like in RENXT and the portal, you can create an application that uses the add-ins.
- Create a SKY Application or find an existing one
- Register the add-ins in the application:
- On the
Portal Feature Configuration Itemextension point, register an add-in with URLhttps://blackbaud.github.io/skyux-portal-addin-demo/addins/settings - On the
Portal Home Page Actionextension point, register an add-in with URLhttps://blackbaud.github.io/skyux-portal-addin-demo/addins/action - On the
Portal Profile Page Tabextension point, register an add-in with URLhttps://blackbaud.github.io/skyux-portal-addin-demo/addins/profile
- On the
- Connect your application to an RENXT environment that has the Portal enabled (or enable the Portal https://host.nxt.blackbaud.com/tools-settings/)
- The Settings add-in can be seen by a back-office user https://host.nxt.blackbaud.com/tools-settings/
- The other two add-ins can be seen by launching the portal at your configured URL, and viewing both the home page of the portal and the profile page of the portal.
For more information on Blackbaud's SKY Add-in framework, see https://developer.blackbaud.com/skyapi/docs/addins.