What is new in Bootstrap 4?

Bootstrap is the most popular front-end development framework. As you may know, everyone loves Bootstrap. If you are not using it, here are some reasons why designers choose Bootstrap and you should too:

• It saves time and it is easy to use
• It is customizable
• It is fully responsiveness
• It is compatible with all major platforms
• It is very detailed documented
• It is Open source

What is new in Bootstrap 4?
As of this summer, the guys behind Bootstrap have announced the alpha version of Bootstrap 4. If you are already using Bootstrap and are on the 3rd version or if you think about starting with the new update, here are some interesting facts. Bootstrap 4 comes with a big number of features and updates.

1. Goodbye Less, welcome Sass. One of the biggest changes is switching from Less to Sass via Libsass Sass Complier written in C/C++ Bootstrap 4. The advantage of this change is that now Bootstrap compiles faster than ever and also Sass has a huge community of users or developers. Now you can customize styles such as color, spacing, link styles, typography, tables, grid breakpoints and containers via _variables.scss file.
2. Improved grid system. If in Bootstrap 3, grids are measured via pixels, in Bootstrap 4, grids are measured via ems and rems. Bootstrap 4 has this new smaller grid tier to better target mobile devices. It’s helpful if you are working on a Photoshop layout design and you are going to see what the equivalent measurement of ems to pixel.
3. New entries: Cards. Cards are new components to Bootstrap and they do everything wells, thumbnails, and panels did, but better. Also, it supports links, text, images, headers, footers with a variety of background colors.
4. Opt-in Flexbox for Responsive Design. If you want to take advantage of CSS3's Flexbox Layout mode, now you can. Flexbox is a layout mode that makes the arrangement of the elements inside a page be responsive: the elements expand or shrink inside the flexible container depending on the viewport.
5. From Normalize.css to Reboot.css. Reboot steps in where Normalize.css stops. Reboot was built upon Normalize.css to provide a simple baseline which are styles using only element selectors.
6. Dropped Support for IE8. This means we can take advantage of the best parts of CSS without being held back with CSS hacks. If you still try to make sites work perfectly on old browsers, then keep using Bootstrap 3.
7. JavaScript Plugins are Rewritten. Every plugin has been rewritten in ES6 which comes with UMD support, generic teardown methods, options and more.
8. Improved Auto-Placement of Tooltips and Popovers. Improved auto-placement of tooltips and popovers thanks to Tether. If you want to use this you can include tether.min.js just before thebootstrap.js.
9. Improved documentation. Bootstrap 4 rewrote it all in Markdown and added a few plugins to streamline examples and code snippets. Improved search is also on its way.
10. Colors. Bootstrap 4 comes with five colors inside and these colors come with their respective classes and prefixes which can be re-used across different components.

To sum up, the 4th version of Bootstrap is a better one, helping you get more stuff done and keeping up with the latest trends in web design. While we are waiting for the beta version to be live, before switching over all of our products to v4.0, we highly recommend you test it out. Play with it and be ready to fully integrate it when the time comes or you will be left behind.