Bootstrap 5 alpha version

Bootstrap 5 alpha version released. The Bootstrap team has been working for months to refine what they started in v4, and although it has progressed well, they want to add new features.

Bootstrap version 5 is no longer dependent on jQuery and has reduced support for Internet Explorer. Its focus is on building tools that are more forward-looking, and while it has not yet fully reached that stage, faster, less JavaScript, less dependency, and better APIs definitely make better sense to us.

Before you go for the update, please keep in mind that v5 is now in alpha mode and will change until the first beta comes.

Now let's get acquainted with some of its highlights.

New look and feel

Document homepages have been improved. Document pages are no longer wide to make them more readable. In addition, the sidebar has been upgraded to use expandable sections for faster movement.

There's also a brand new logo that looks nice, and of course more so when Bootstrap 5 was fixed.

JQuery and JavaScript

Over the past decade and a half, JQuery has provided millions (possibly billions) of people with unprecedented access to complex JavaScript behavior. We should be thankful to jQuery for the empowerment and support it gave us to write front-end code, learn new things, and accept plugins.

Thanks to advances in front-end development tools and browser support, we can release jQuery as a dependency, but you will never notice the difference. This migration was done by Johann-S @, the main JavaScript maintainer. This is one of the biggest changes to the framework over the years, and it means that projects built with Bootstrap 5 are significantly lighter in terms of file size and page load.

In addition to dropping jQuery, there have been other useful changes and enhancements to JavaScript in v5 that focus on code quality and fill the gap between v4 and v5. Another big change is the removal of many Button plugins for HTML and CSS just to make it better.

Custom CSS Features

As mentioned, thanks to the release of Internet Explorer support, custom CSS features have been used in Bootstrap 5. In v4 only a few root variables for color and font were included, and now they have been added for a number of components and layout options.

Improved document customization

Documentation has been improved, more explanations have been provided, ambiguities have been removed, and more support has been provided for Bootstrap development. It all starts with a whole new Customize section.

Updated forms

In addition to the new Customize section, the components and documentation of the forms have also been revised. All Form Styles are integrated in a new Forms section.

Along with the new document pages, all form controls have been redesigned. The v4 introduced a wide range of custom form controls (checks, radios, switches, files, etc.), but these were all that the browser provided by default. Fully customized with v5.

API Utility (Application API)

A new application API has been implemented in Bootstrap 5. Since Utilities are a preferred way to build, the Bootstrap team strives to find the right balance to implement them in Bootstrap while providing control and personalization. In v4 this was done with the global enable - * $ classes, which were also implemented in v5. But with an API-based approach, a language and syntax has been created in Sass so you can create your Utilities instantly while you can modify or delete the items available to you. All of this is thanks to @MartijnCuppens, who also runs the RFS project, and is responsible for initial PR and subsequent improvements.

Strengthen the grid system

Bootstrap 5 design is not a complete exit from v4. The Bobstrap team wants to make it easier for people to upgrade to the next version after hearing about the issues surrounding the v3 to v4 upgrade path. For this reason, they have kept much of the build system in place, and also built it onto the existing grid system instead of replacing it with newer things.

Here is what has changed in the grid:

A new grid level has been added.

Gutter classes. Replaced with .g * applications, such as margin / padding applications. Grid gutter spacing options have also been added that are compatible with the spacing applications you were already familiar with.

Form layout options have been replaced with the new grid system.

Vertical spacing classes have been added.

Columns no longer have a position: they are relative by default.

in the future

There are many things that the Bootstrap team has not yet had time to put in the alpha version. No improvements have been made to further documentation, bug fixes and quality changes. Items such as offcanvas and RTL will also be reviewed during v5 development.