Everand Logo

Welcome to Everand!

  • Discover millions of ebooks, audiobooks, and so much more with a free trial

    From $11.99/month after trial. Cancel anytime.

    Bootstrap for ASP.NET MVC - Second Edition
    Bootstrap for ASP.NET MVC - Second Edition
    Bootstrap for ASP.NET MVC - Second Edition
    Ebook323 pages1 hour

    Bootstrap for ASP.NET MVC - Second Edition

    By Pieter van der Westhuizen

    ()

    Read preview

    About this ebook

    Combine the power of ASP.NET Core with Bootstrap 4 to build elegant, responsive web apps

    About This Book
    • Updated for Bootstrap 4 and ASP.Net MVC 6, this book shows how to take advantage of the latest new features introduced in both of these industry-leading frameworks
    • Build responsive, mobile-ready apps by combining the power of ASP.NET MVC with Bootstrap
    • Grasp the intricacies of Bootstrap and how to use it with ASP.NET MVC
    • Build your own tools and helpers to assist you in creating ASP.NET MVC Bootstrap sites easily and quickly
    • Master the use of Bootstrap components and plugins with ASP.NET MVC
    Who This Book Is For

    If you are an ASP.NET MVC developer and would like to know how to incorporate Bootstrap into your projects, then this book is invaluable to you. Developers with entry-level experience of ASP.NET MVC development and limited experience with Bootstrap will also benefit from this book.

    What You Will Learn
    • Create a new ASP.NET MVC project that uses Bootstrap for its styling and learn how to include external libraries using the new package managers
    • Learn to use the various Bootstrap CSS and HTML elements, and how to use the new Bootstrap 4 grid layout system
    • Explore the different input groups and implement alerts, progress bars, and badges
    • Explore JavaScript components by illustrating and walking through the process of using JavaScript/jQuery to add interactivity to Twitter Bootstrap components
    • Build your own ASP.NET MVC helpers and tag helpers to reduce the amount of HTML needed to generate Bootstrap elements
    • Convert a Bootstrap HTML template into a usable ASP.NET MVC project
    • Use the jQuery DataTables plugin with Bootstrap and ASP.NET MVC
    In Detail

    One of the leading open source frontend frameworks, Bootstrap has undergone a significant change and introduced several features that make designing compelling, next-generation UIs much simpler. Integrating Bootstrap with 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. After a primer on the fundamentals of Bootstrap, you will learn your way around and create a new ASP.NET MVC project in Visual Studio. You will move on to learn about the 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 guides you through building an ASP.NET MVC website using Bootstrap, utilizing layout and user-interface components. At the end of this book, you will find some valuable tips and tricks to help you get the most out of your Bootstrap-integrated and ASP.NET MVC-integrated website.

    Style and approach

    This is a compact, step-by-step guide that focuses on combining the power of Bootstrap with ASP.Net MVC to build next-generation web apps. With clear instructions, this book will show how to build a complete ASP.Net MVC-integrated web app from scratch using Bootstrap. It will also cover several tricks for integrating Bootstrap and ASP.Net MVC, and getting the most out of both frameworks.

    LanguageEnglish
    PublisherPackt Publishing
    Release dateSep 30, 2016
    ISBN9781785885235
    Bootstrap for ASP.NET MVC - Second Edition

    Related to Bootstrap for ASP.NET MVC - Second Edition

    Related ebooks

    Programming For You

    View More
    View More

    Related podcast episodes

    Related articles

    • UNLIMITED

      FLASK Web Frameworks

      Jun 4, 2019

      The main focus of Python has always been to get you cracking on with your coding – the language was never made for web programming. However, this has just made it more interesting to extend the language for the web, or to create an interface to web-b

      9 min read

    • UNLIMITED

      Contributing For Non - Coders

      Jan 10, 2023

      Contributing For Non - Coders
      9 min read

    • UNLIMITED

      Readers’comments

      Sep 10, 2020

      Readers’comments
      3 min read

    • UNLIMITED

      Usability

      Oct 19, 2021

      Usability
      3 min read

    • UNLIMITED

      DJANGO Create A Database-driven Website

      Jun 4, 2019

      The Django web framework was named after the famous guitarist Django Reinhardt and was first created by web developers at a small newspaper in Kansas. The main goals of Django is to enable fast development of complex websites with database needs. It

      7 min read

    • UNLIMITED

      Craft A Perfect Personal Document Library

      Jan 26, 2023

      There are countless apps available that can be used to organise your notes and also many word processors designed to help you create smart-looking documents, but Craft aims to do both in style. The idea is to include a huge number of advanced documen

      1 min read

    • UNLIMITED

      Mind Your Language!

      Apr 4, 2023

      Mind Your Language!
      9 min read

    • UNLIMITED

      Top 10 Programming Languages

      Jan 5, 2023

      Top 10 Programming Languages
      8 min read

    • UNLIMITED

      Visual Studio Code 1.74

      Mar 7, 2023

      Visual Studio Code 1.74
      2 min read

    • UNLIMITED

      Extra Features

      May 3, 2022

      Extra Features
      1 min read

    • UNLIMITED

      Extra Features

      May 3, 2022

      Extra Features
      1 min read

    • UNLIMITED

      Code An Admin Back-end In Django

      Dec 13, 2022

      Credit: www.djangoproject.com OUR EXPERT Matt Holder has been a fan of the open source methodology for over two decades and uses Linux and other tools where possible. More featurepacked source code for this project can be downloaded from https://

      6 min read

    • UNLIMITED

      Ditch the MONTHLY PAYMENTS

      Dec 9, 2021

      Ditch the MONTHLY PAYMENTS
      7 min read

    • UNLIMITED

      Password Managers

      Feb 6, 2024

      Password Managers
      14 min read

    • UNLIMITED

      Vivaldi

      Sep 7, 2023

      With a full-blown email client, calendar with offline access, RSS reader, task manager, notes app and lots more available through extensions, it’s tempting to ask whether Vivaldi is more of an operating system than a web browser. The company isn’t bl

      4 min read

    • UNLIMITED

      Create Smaller Sized Apps With React

      Nov 19, 2019

      You may not be surprised that some developers have criticised Electron (see tutorials LXF256), mostly regarding the memory usage of its final binaries. The initial binary is over 100MB, because a major chunk of code from Chrome is embedded. When you

      6 min read

    • UNLIMITED

      Letter

      Aug 26, 2019

      Letter
      2 min read

    • UNLIMITED

      Discover Easy-to -build Desktop Apps

      Oct 22, 2019

      Electron is actually a browser packaged with node.js and a few APIs. Because it’s built on top of the Chromium browser, you have everything available from there to add to your application. GitHub developed it as part of the Atom editor; it was open-s

      7 min read

    • UNLIMITED

      HotPicks

      Jul 28, 2020

      HotPicks
      13 min read

    • UNLIMITED

      Create A Webpage Or Blog

      Mar 26, 2020

      Create A Webpage Or Blog
      12 min read

    • UNLIMITED

      Your Bonus Software

      Sep 9, 2021

      Your Bonus Software
      3 min read

    • UNLIMITED

      Documentation And Community

      Feb 8, 2022

      How large the community around an editor is becomes an important factor in how easy it is to find out information about it. Visual Studio Code benefits in this regard from its popularity on a variety of platforms. In addition, the official documentat

      1 min read

    Related categories

    Reviews for Bootstrap for ASP.NET MVC - Second Edition

    0 ratings

    0 ratings0 reviews

    What did you think?

    Tap to rate

    Review must be at least 10 words

      Book preview

      Bootstrap for ASP.NET MVC - Second Edition - Pieter van der Westhuizen

      (missing alt)

      Table of Contents

      Bootstrap for ASP.NET MVC Second Edition

      Credits

      About the Author

      About the Reviewer

      www.PacktPub.com

      eBooks, discount offers, and more

      Preface

      What this book covers

      What you need for this book

      Who this book is for

      Conventions

      Reader feedback

      Customer support

      Downloading the example code

      Downloading the color images of this book

      Errata

      Piracy

      Questions

      1. Getting Started with ASP.NET Core and Bootstrap 4

      Files included in the Bootstrap distribution

      Bootstrap style sheets

      Bootstrap JavaScript files

      Bootstrap fonts/icons

      Bootstrap source files

      CSS pre-processors

      Creating an empty ASP.NET MVC site and adding Bootstrap manually

      Enabling MVC and static files

      Creating the default route controller and view

      Adding the Bootstrap 4 files using Bower

      Compiling the Bootstrap Sass files using Gulp

      Adding Gulp npm packages

      Enabling Gulp-Sass compilation

      Running Gulp tasks

      Binding Gulp tasks to Visual Studio events

      Installing Font Awesome

      Creating a MVC Layout page

      Content Delivery Networks

      Summary

      2. Using Bootstrap CSS and HTML Elements

      The Bootstrap grid system

      Bootstrap Grid components

      Containers

      Rows

      Columns

      Bootstrap HTML elements

      Bootstrap tables

      Enabling MVC Scaffolding

      Scaffolding an MVC List View page

      Styling Bootstrap tables

      Bootstrap contextual table classes

      Responsive and smaller tables

      Bootstrap buttons

      Outline buttons

      Form layout and elements

      Vertical/basic forms

      Inline forms

      Grid-based forms

      Bootstrap images

      Bootstrap figures

      Summary

      3. Using Bootstrap Components

      The Bootstrap navigation bar

      Basic navbar

      Responsive navbar

      Navbar with dropdown menus

      Navbar color schemes

      List groups

      Badges

      Media object

      Breadcrumbs

      Pagination

      Input groups

      Button dropdowns

      Alerts

      Progress bars

      Basic progress bar

      Contextual progress bars

      Striped and animated progress bars

      Cards

      Summary

      4. Using Bootstrap JavaScript Components

      Data attributes versus the programmatic API

      Cascading dropdowns

      Modal dialogs

      Modal size and animation

      Tabs

      Tooltips

      Popovers

      The accordion/collapse component

      The carousel component

      Summary

      5. Creating MVC Bootstrap Helper and Tag Helpers

      Built-in HTML Helpers

      Built-in Tag Helpers

      The difference between HTML Helpers and Tag Helpers

      Creating HTML Helpers using static methods

      Using the static method helper in a view

      Creating helpers using extension methods

      Using the extension method helper in a view

      Creating self-closing helpers

      Using the self-closing helper in a view

      Creating a Bootstrap button Tag Helper

      Using the Bootstrap button Tag Helper

      Creating a Bootstrap Alert Tag Helper

      Using the Bootstrap Alert Tag Helper

      Summary

      6. 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 different page views

      Adding charts to views

      Adding Google Charts to views

      Server-side data processing with Google Charts

      Summary

      7. Using the jQuery DataTables Plugin with Bootstrap 4

      jQuery DataTables

      Adding DataTables to your ASP.NET MVC project

      Using the DataTables Bower package

      Using the CDN

      Adding Bootstrap styling to DataTables

      Loading and displaying data in jQuery DataTables

      DataTables plugins

      Date sorting

      Rendering

      DataTables extensions

      The ColReorder extension

      The ColVis buttons extension

      The copy and print buttons extension

      Summary

      8. Creating Bootstrap 4 ASP.NET MVC Sites Using Visual Studio Code

      What is Visual Studio Code?

      Installing Visual Studio Code

      Creating an empty ASP.NET project

      Scaffolding a project using Yeoman

      Enabling ASP.NET MVC and static files

      Adding a default route controller and view

      Using Bower to add the Bootstrap 4 files

      Using Gulp to compile the Bootstrap Sass files

      Creating a MVC layout page

      Testing the site

      Summary

      A. Bootstrap Resources

      Themes

      Add-ons

      Editors and generators

      Bootstrap for ASP.NET MVC Second Edition

      Bootstrap for ASP.NET MVC Second Edition

      Copyright © 2016 Packt Publishing

      All rights reserved. No part of this book may be reproduced, stored in a retrieval system, or transmitted in any form or by any means, without the prior written permission of the publisher, except in the case of brief quotations embedded in critical articles or reviews.

      Every effort has been made in the preparation of this book to ensure the accuracy of the information presented. However, the information contained in this book is sold without warranty, either express or implied. Neither the author, nor Packt Publishing, and its dealers and distributors will be held liable for any damages caused or alleged to be caused directly or indirectly by this book.

      Packt Publishing has endeavored to provide trademark information about all of the companies and products mentioned in this book by the appropriate use of capitals. However, Packt Publishing cannot guarantee the accuracy of this information.

      First published: August 2014

      Second edition: September 2016

      Production reference: 1270916

      Published by Packt Publishing Ltd.

      Livery Place

      35 Livery Street

      Birmingham 

      B3 2PB, UK.

      ISBN 978-1-78588-947-9

      www.packtpub.com

      Credits

      About the Author

      Pieter van der Westhuizen is a freelance software and web developer specializing in ASP.NET MVC, web technologies, and MS Office development. He started his career in web development using classic ASP, Visual InterDev, HoTMetaL, and FrontPage. Pieter has over 16 years of experience in the IT industry and is also one of the people fortunate enough to have his hobby become his full-time profession.

      He is also a technology evangelist for Add-in Express (www.add-in-express.com), which focuses on tools for Microsoft Office integration.

      This is Pieter's second book and he has been blogging since 2007 on his personal blog at www.mythicalmanmoth.com and on the Add-in Express blog since 2010. He lives with his wife and two dogs in Pretoria, South Africa.

      To everyone who contributed to this book, thank you! A big thanks to the team at Packt Publishing, for their guidance, advice, and professionalism. Thanks to my technical reviewer, Dony Perdana, for patiently reading each chapter, reviewing each line of code, and contributing suggestions. You helped shape this book into what it is. I'd like to express my greatest love and gratitude towards my wife, Andrea, for all her support, impromptu editing sessions, being a soundboard for brainstorming sessions, and the general motivational pep talks during the writing of this book. Lastly, thanks to you for buying this book. I hope this can help you become a better programmer. If you have any questions regarding this book, please visit www.bootstrapforaspnetmvc.com.

      About the Reviewer

      Dony Perdana is an enthusiast and full-stack .NET developer from Indonesia. He has been involved with various banking project solutions for the past 5 years, especially on .NET server side web technologies such as ASP Web API, ASP MVC, ASP Core 1.0, and ServiceStack. He is also proficient with frontend web development, including various JavaScript frameworks (JQuery, AngularJS, BackboneJS, KnockoutJS, and ReactJS).

      He developed many applications, including content management systems, real-time and scheduler application, social media apps, web service-based applications.

      He has strongly believes that design-pattern practices and agile development can tackle any problem and increase team productivity in software development.

      In his spare time, he participates in many learning resources such as reading books, chess, and going to conferences and meetups to keep up with the latest technologies and methodologies for programming. He also helps people on Stack Overflow and contributes to opensource projects on GitHub repositories.

      www.PacktPub.com

      eBooks, discount offers, and more

      Did you know that Packt offers eBook versions of every book published, with PDF and ePub files available? You can upgrade to the eBook version at www.PacktPub.com and as a print book customer, you are entitled to a discount on the eBook copy. Get in touch with us at [email protected] for more details.

      At www.PacktPub.com, you can also read a collection of free technical articles, sign up for a range of free newsletters and receive exclusive discounts and offers on Packt books and eBooks.

      eBooks, discount offers, and more

      https://www.packtpub.com/mapt

      Get the most in-demand software skills with Mapt. Mapt gives you full access to all Packt books and video courses, as well as industry-leading tools to help you plan your personal development and advance your career.

      Why subscribe?

      Fully searchable across every book published by Packt

      Copy and paste, print, and bookmark content

      On demand and accessible via a web browser

      Preface

      Twitter Bootstrap, known simply as Bootstrap, is the leading open source CSS/HTML and JavaScript framework on the Internet. Shortly after its launch, it was the most popular project on GitHub. It is so popular that Microsoft announced at their Build 2013 conference that all the web app project templates in Visual Studio 2013 will use Twitter Bootstrap by default.

      One of the main reasons Bootstrap is so prevalent is that it allows developers, many of whom are notoriously bad at user interface design, to build aesthetically pleasing sites with a relatively small amount of effort. Bootstrap also offers a rich ecosystem of free and commercial templates, third-party components, tools, and an active and helpful community.

      Using CSS Frameworks and Bootstrap in particular with ASP.NET MVC is a natural fit. Bootstrap takes care of the typography, form layouts, and user interface components, which allows the developer to focus on what they are good at – writing code.  This aspect is particularly valuable for smaller development companies who do not necessarily have an in-house designer.

      .NET Core is a new and exciting framework written from the ground up. It can be used to develop a variety of applications, not just web applications. It promises the ability to target different platform, such as Linux and Mac as well as smaller deployment footprints. ASP.NET Core has been built upon the .NET Core and is a rewrite of the ASP.NET platform .NET developers have known for many years.

      What this book covers

      Bootstrap for ASP.NET MVC walks you through the process of creating a fully functioning ASP.NET MVC website, using Bootstrap for its layout and user interface.

      Chapter 1, Getting Started with ASP.NET Core and Bootstrap 4, introduces you to the files in the Bootstrap 4 distribution, creating an empty ASP.NET site as well as providing an introduction to using Bower and Gulp.

      Chapter 2, Using Bootstrap CSS and HTML Elements, examines all the various Bootstrap CSS and HTML elements, how to include them in your ASP.NET MVC project, and how to configure and use their various options.

      Chapter 3, Using Bootstrap Components, makes you familiar with the Bootstrap navigation bar, button groups, alerts, and introduces

      Enjoying the preview?
      Page 1 of 1