Bootstrap 4 Migration for Visual Studio 2017

There’s not much reliable information online if you want to get up to speed quickly in moving to Bootstrap 4 for Visual Studio 2017.  In 2014, my firm launched the first Bootstrap website for the managed services industry soon followed by my Kevin Fream official website and best-selling book micro-sites. As a strategy, learning this technology allows less code than a traditional WordPress Theme for faster load time – and faster turnaround for content updates without the ongoing expense of a web development firm or add-on products for landing pages as an example.

Bootstrap is a free and open-source front-end framework for developing mobile responsive websites, originally developed in 2011 by Mark Otto and Jacob Thornton at Twitter. Since then it has been licensed by MIT with a Twitter 2018 copyright. Bootstrap 4 is a major rewrite requiring extensive migration and update of components from version 3.

Theme Customization

The magic for quickly changing the look and feel of a bootstrap site is updating the two Cascading Style Sheets (CSS) of boostrap.css and bootstrap.min.css. However, bootstrap is a design model that is regularly updated by Twitter, so you shouldn’t just manually edit those files like traditional web development. Not only is the task daunting over pages of code, but any changes you make would have to be made again and tested with each successive version of bootstrap.

Fortunately, Bootswatch is a site by Thomas Park that offers free themes for Twitter Bootstrap that provides a dozen themes showcasing various looks. Using the utility sites Git and Node, you can clone an existing Bootswatch theme with a framework to then just update a few settings as desired. By editing the special _variables.scss and _bootswatch.scss files, you specify aspects such as fonts, colors, and sizes. Finally, you combine your customizations with the default CSS using the command: grunt swatch.

Leave a Reply