The default project layout is a good start for any ASP.NET MVC project, but for the sample project we'll be building throughout this book, we'll create an empty ASP.NET MVC site and add the necessary files manually. This is done by performing the following steps:
Start by creating a new ASP.NET web application project in Visual Studio and name the project
Northwind.Web
.This time, select the Empty template in the New ASP.NET Project dialog and make sure the MVC checkbox is selected, as shown in the following screenshot:
An empty project layout will be created for you and you'll notice that we do not have the
Content
,Fonts
, orScripts
folder—we'll add them ourselves!
To add the Bootstrap style sheet files to your project, complete the following steps:
Create a new folder by right-clicking on the new project's name inside Visual Studio's Solution Explorer and navigating to Add | New Folder, name the new folder
css
.Next, right-click on the newly created
css
folder and navigate to Add | Existing Item… from the context menu.Browse to the folder in which you've extracted the Bootstrap distribution files and select the
bootstrap.css
file that you can locate in thecss
folder.
Add the required Bootstrap fonts by performing the following steps:
As with the style sheets, create a new folder called
fonts
.Next, browse to the location to where you've extracted the Bootstrap download and add all the files from the
fonts
folder to yourfonts
folder in Visual Studio.There should be four files in total, each named
glyphicons-halflings-regular
but with the following different file extensions:.eot
.svg
.ttf
.woff
The final Bootstrap file we'll need is bootstrap.js
. To add it, perform the following steps:
Before adding the
bootstrap.js
file to your Visual Studio project, create a new folder calledjs
.Add the
bootstrap.js
file to this folder.Once completed, the project layout should look similar to the following screenshot in the Visual Studio's Solution Explorer: