Book Image

Bootstrap for ASP.NET MVC

By : Pieter van der Westhuizen
Book Image

Bootstrap for ASP.NET MVC

By: Pieter van der Westhuizen

Overview of this book

<p>Bootstrap, a leading open source frontend framework, takes care of typography, form layouts, and user interface components, allowing a developer to focus on writing code. Integrating ASP.NET's powerful components can further enhance its capabilities. This book guides you through the process of creating an ASP.NET MVC website from scratch using Bootstrap.</p> <p>You will learn about various Bootstrap components as well as techniques to include them in your own projects. The book includes practical examples to show you how to use open source plugins with Bootstrap and ASP.NET MVC and will guide you through building a website using Bootstrap, utilizing layout and user interface components. In the process, you will also learn to build HTML helpers and T4 templates as well as how to use the jQuery DataTables plugin. At the end of this book, you will find some valuable tips and tricks, which will help you in getting the most out of your Bootstrap and ASP.NET MVC integrated website.</p>

Related Content you might be interested in

Current Title:

Small book image
Bootstrap for ASP.NET MVC
Pieter van der Westhuizen
Aug, 2014 | 198 pages
No titles found
Table of Contents (18 chapters)
Bootstrap for ASP.NET MVC
Bootstrap for ASP.NET MVC
Credits
Credits
About the Author
About the Author
Acknowledgments
Acknowledgments
About the Reviewers
About the Reviewers
www.PacktPub.com
www.PacktPub.com
Preface
Preface
Free Chapter
1
Getting Started with ASP.NET MVC and Bootstrap
Getting Started with ASP.NET MVC and Bootstrap
The Bootstrap distribution
Using Bootstrap with a site created with the standard Visual Studio project template
Creating an empty ASP.NET MVC site and adding Bootstrap manually
Creating the site Layout file
Creating a home controller with a Bootstrap-themed view
Adding Bootstrap files using NuGet
Improving your site performance with bundling and minification
Summary
2
Using Bootstrap CSS and HTML Elements
Using Bootstrap CSS and HTML Elements
The Bootstrap grid system
Bootstrap HTML elements
Form layout and elements
Bootstrap validation styles
Creating editor templates for primitive types
Bootstrap image classes
Summary
3
Using Bootstrap Components
Using Bootstrap Components
The Bootstrap navigation bar
List groups
Badges
The media object
Page headers
Breadcrumb
Pagination
Input groups
Button dropdowns
Alerts
Progress bars
Summary
4
Using Bootstrap JavaScript Plugins
Using Bootstrap JavaScript Plugins
Data attributes versus the programmatic API
Cascading dropdowns
Modal dialogs
Tabs
Tooltips
Popovers
The accordion component
The carousel component
Summary
5
Creating ASP.NET MVC Bootstrap Helpers
Creating ASP.NET MVC Bootstrap Helpers
Built-in HTML helpers
Creating a custom helper
Creating helpers using static methods
Creating helpers using extension methods
Creating fluent HTML helpers
Creating self-closing helpers
Summary
6
Creating T4 Templates to Scaffold Bootstrap Views
Creating T4 Templates to Scaffold Bootstrap Views
An overview of scaffolding
T4 templates
Customizing the generated code for controllers
Customizing the generated code for views
Creating a custom scaffolder extension
Summary
7
Converting a Bootstrap HTML Template into a Usable ASP.NET MVC Project
Converting a Bootstrap HTML Template into a Usable ASP.NET MVC Project
Working with prebuilt HTML templates
Creating the ASP.NET MVC project
Creating the master layout
Adding a view for the home controller
Adding the menu plugin library
Adding different page views
Adding charts to your views
Summary
8
Using the jQuery DataTables Plugin with Bootstrap
Using the jQuery DataTables Plugin with Bootstrap
jQuery DataTables
Adding DataTables to your ASP.NET MVC project
Loading and displaying data in jQuery DataTables
DataTables extensions
Summary
9
Making Things Easier with the TwitterBootstrapMVC Library
Making Things Easier with the TwitterBootstrapMVC Library
The TwitterBootstrapMVC library
Including TwitterBootstrapMVC in your project
Using the TwitterBootstrapMVC helpers
Summary
Bootstrap Resources
Bootstrap Resources
Themes
Add-ons
Editors and generators
Index
Index

Working with prebuilt HTML templates

It is a well-known fact that most developers are not necessarily good designers. We prefer to work on the backend, building great-performing and intelligent software, and sometimes, we tend to think of the user interface as an afterthought.

By using a predesigned HTML Bootstrap template, we can give our users an intuitive and well-designed user interface that was designed by a professional designer. If the design was based on Bootstrap, the developer is already familiar with most of the CSS class names, components, and plugins, and does not have to relearn anything.

The Web offers an assortment of free and premium Bootstrap templates. ThemeForest (www.themeforest.net) provides a mind-boggling array of different premium site styles and designs.

For our example in this chapter, we'll use the free SB Admin 2 template designed by Start Bootstrap (www.startbootstrap.com). The SB Admin 2 template is an admin theme that uses Bootstrap 3 and is ideal for a backend...

Previous Section
End of Section 2
Next Section