- Overview
- Transcript
2.2 What’s New in Bootstrap 5?
In this lesson, we’re going to take a look at what’s new in Bootstrap version 5. Let’s go.
Related Links
2.2 What’s New in Bootstrap 5?
Welcome back to the course. In this lesson, we're gonna to take a look at what's new in version 5 of Bootstrap. Let's go. The team behind Bootstrap has been working on this new release for several months actually. There were three alpha and three beta released before the stable one. And there are actually a lot of differences between v4 and v5. I won't go over every single change and addition, because it's gonna take too much time, but instead focus on a few key ones. If you want to see the full list of changes, check out this blog post, you'll find the link in the video description. All right, so let's quickly go over a few key changes. That's right, no more jQuery. This dependency has been removed in favor of Vanilla JavaScript. You can still use jQuery of course, but it's no longer required by Bootstrap. With that said, the framework is not entirely dependency free, because it still uses the Popper.js library for things like tooltips and such. Microsoft recently adopted the Chromium engine for its Edge browser, which means it will have all the modern JavaScript and CSS features. Because Internet Explorer is a browser of the past nowadays, Bootstrap has removed support for version 10 and 11, which, if you ask me, is a very good thing. Bootstrap 5 offers some custom designed form controls that have the same look and feel in all browsers. These controls include the likes of input, checkbox, switch checkbox, radio button, select, file and range. Finally in Bootstrap we have RTL support, meaning we can now easily develop websites that use languages written from right-to-left like Arabic, Hebrew and Persian. Bootstrap now uses CSS custom properties or CSS variables, in short. The reason it didn't before is that CSS variables are not supported by Internet Explorer. But since v5 dropped support for IE, that's no longer a problem, and custom properties are being used in a few components and layout options. The grid system got a refresh as well. We now have an XXL tier for a very large displays, the gutter classes have been replaced with .g* classes and we have some new classes for a vertical spacing. And finally, in version 5, we have some new icons. Bootstrap now uses its own SVG icon library with more than 1300 icons, and it's really easy to use them, either as an embedded SVG, an SVG sprite, a standalone image, or even as an icon font. These icons are free to use in any project with or without Bootstrap. I've already added these to my icon library. So those are the main changes going from v4 to v5, definitely, some great improvements there. Now, I think it's time we'll do some coding with the Bootstrap, but for that we need to install it first. And that's coming up in the next lesson, so I'll see you there.
