Bootstrap celebrated its 4th birthday on August 19. To congratulate the framework community on such a joyous occasion, the company made an alpha release of Bootstrap 4. If your web projects are powered by this framework, read our post to find out how you can update them. At its end, there is also a little surprise for you from Bootstrap developers.
As a short foreword, we’d like to mention that the alpha version of Bootstrap is still incomplete. For that reason, you shouldn’t use it for your projects straight away. However, it can give a clear insight into the cool stuff that will become available to you soon. As it may be quite challenging to dig into each Bootstrap feature, our overview highlights its major peculiarities. So, read on to check what’s new in Bootstrap 4.
Move to LibSass
Bootstrap codebase was moved from Less to LibSass. As a result of this move, the new version of the framework is compiled much faster than its predecessors.
Better Grid System
To improve the grid system, a new tier was added to it, which allows targeting users of mobile devices more than ever. Semantic mixins also underwent a total overhaul. Now, you can get necessary mixins in any place out of the box.
Support for Flexbox is also among Bootstrap 4 new features. This is a flexible box layout model capable of arranging elements in a way that fits the viewport. You can easily utilize a Flexbox-based grid system and its components by switching a boolean variable and recompiling CSS.
In the alpha release of Bootstrap 4, cards took the place of wells, thumbnails and panels. Although these components are new, they will still feel quite familiar to you. In fact, cards perform the same functions as wells, thumbnails and panels, but they do their job much better.
All the HTML resets were merged into a brand new module dubbed Reboot. Compared toNormalize.css, it provides more opinionated resets included to a single CSS file.
Gradients, transitions, shadows and other styling options were embedded into Sass variables. You can enable these options through the variable update and recompilation.
No Support for IE8
Bootstrap 4 doesn’t support IE8, which can set you free from CSS hacks and fallbacks and help you make the most of CSS. However, those of you who still need IE8 support should stay with Bootstrap 3.
Rems & Ems
Instead of pixels, the new framework version utilizes rems and ems. These units are more favorable for responsive typography and facilitate the process of resizing components.
Plugins Rebuilt in ES6
Tooltips & Popovers Improvement
Completely rewritten in Markdown, the documentation of Bootstrap 4 is much easier to use. There are also several convenient plugins meant to enhance examples and code snippets. Soon, you will also get an access to an upgraded search option.
In fact, Bootstrap 4 offers much more to users besides the above-mentioned features. New utility classes, handy form controls, margin and padding classes, – these and other options will become at your hand if you update the current Bootstrap version to its latest one.
Plans for the Near Future
At present, Bootstrap 4 features around 1.100 commits and 120.000 lines of updates, but the work has been finished yet. Check below what else you can expect to see soon:
- a few more alpha releases;
- 2 beta releases after deciding on functionalities and testing them;
- 2 RCs (release candidates) to test the framework’s work in the production environment;
- the final release.
Bootstrap 3 Support
Although Bootstrap developers stopped supporting the 2nd version of the framework, things won’t be the same with the 3rd one. Fans of Bootstrap 3 can keep on using their favorite version, as it will be fully supported. Its documentation won’t only remain available after the launch of the 4th version, but will also be improved. Furthermore, the team is planning to release critical bug fixes for Bootstrap 3.
Apart from the release of the 4th framework version, the team behind Bootstrap has another surprise for their community. They have created 3 themes powered by Bootstrap 3, namely Dashboard, Application and Marketing. The themes are not just ordinary Bootstrap re-skins, but are full-featured toolkits like the framework itself. In addition to the contents of Bootstrap, each of them comes with extra plugins, components, custom docs, and cool real world examples. Licensed for multiple use, the themes provide lifetime updates for free.
Over 4 years, this responsive framework has undergone multiple changes, and the alpha release of Bootstrap 4 looks worthy to try, doesn’t it? So, what are you waiting for? Click here and give it a try!