I’ve been a fan of Bootstrap since before I knew it existed. The theme I had on my site several years ago was built with a very early version of Bootstrap 2 and I’ve used it in dozens of projects myself since I found out about it. I also updated that theme to work with Bootstrap 3.
Changes in Bootstrap 4 – From LESS to SASS
Now that Bootstrap 4 is in alpha it’s time to get ready and make a start using it. It’s sort of a re-thought again from the ground up change so it’ll take some time to get used to and to learn the new .classnames but another major change is that it has swapped from less to sass for css. For me that’s a big change – I’ve never used sass. I’ve only recently learned to use less and the reason why was because css pre-processors are more efficient and modular – I had to start using one – and I picked less purely based on the fact that Bootstrap used it.
Well that’s changed and I’ll happily move over to sass, but it’s one more thing in a long list of things that I need to learn in a short space of time.
Getting Bootstrap 4 Files
If you’ve worked with Bootstrap and git before you’ve probably cloned the repo at some point. If you have just go into the directory and run a git pull to grab any updates and then checkout one of the v4 branches. There’s an official alpha branch but I chose to use the v4-dev branch as it’ll likely be updated frequently and I’ll get upcoming changes between releases as soon as they are merged.
If you don’t have repo cloned grab it from github or get precompiled files from the site. You could even install it with npm or as a ruby gem.
Bootstrap 4 Migration Time
So I already have a theme that is powered by Bootstrap 3 that I like a lot. I’m going to convert it to work with Bootstrap 4. It’ll take a lot of work (I remember doing this for v3 and it did…) but mostly it’ll involve .classname changes and possible structure reworks but it’s doable. I’ll probably do a search and replace to make a lot of it happen, particularly when it comes to the layout and grid classes. I’ll may use grep to do it but if I have the project open for anything I will likely just use the search and replace in my editor -Atom.
FYI Atom is awesome, you should try it.