Bootstrap Resource Packages in Advantage CSP: Integrating Front-End Frameworks

Bootstrap resource packages

Advantage CSP comes with the Bootstrap 5 package installed out-of-the-box. The package includes the capabilities of the respective Bootstrap front-end framework version. For more information, see the Bootstrap site.

 

NOTE: As of version 9.0+, Advantage CSP ships with the Bootstrap 5 resource package only, and this is the officially supported Bootstrap version.

The Advantage CSP Bootstrap package contains front-end assets, CSS source files, and widget templates based on the framework, such as News, Blogs, Images, events, and so on.

The Bootstrap 5 package provides the following benefits:

  • Npm scripts infrastructure Bootstrap 5 comes with a build infrastructure that uses npm scripts. To enhance customization capabilities, the Bootstrap 5 package provides you with various configuration options in package.json. Such options include package distribution folder name, styles distribution folder name, main SCSS import file name, and so on.
  • RTL support With Bootstrap 5, RTL support for multilingual sites is aligned with Bootstrap RTL approach. RTLCSS project is used to build 2 versions of the main CSS file, for LTR and RTL, from one code base. Which CSS file is loaded is determined in the layout file depending on the page language.
  • Accessibility improvements With the Bootstrap 5 package, you easily meet accessibility standards such as WCAG 2.1 Level AA or section 508. Bootstrap 5 follows the most common accessibility best practices for developers and provides out-of-the-box support for:

 

JavaScript

Bring Bootstrap to life with our optional JavaScript plugins. Learn about each plugin, their data and programmatic API options, and more.

 

Angular Bootstrap

Angular widgets built from the ground up using Bootstrap 5 CSS with APIs designed for the Angular ecosystem. The only dependencies are Angular, Bootstrap 5 CSS and Popper

React Bootstrap

Each component has been built from scratch as a true React component, without unneeded dependencies like jQuery.

BootstrapVueNext and Bootstrap

BootstrapVueNext provides one of the most comprehensive implementations of the Bootstrap v5 component and grid system available for Vue.js v3 / Nuxt.js 3, complete with extensive and automated WAI-ARIA accessibility markup.

When working with Resources packages and Bootstrap 5, you need Node.js and npm installed. For more information, see Introduction to Node.js on Node.js site.

NOTE: Keep in mind that meeting website accessibility standards is a collective effort that requires designers, developers, and content authors to work together. This is an iterative process, and each subsequent change must be made with accessibility in mind and be properly tested.

 

Back to Top Button