Naif.Blog: 0. Setting the Stage
I am building my own Blog application using ASP.NET Core, as a means of diving into some of the key new features of the ASP.NET Core Platform. In this first post I am going to describe the initial state of my application. This initial state (version 0) is somewhat modified from the basic ASP.NET template, so this first post describes the starting point for my development.
The first thing to note is that I have removed all the content from the ASP.NET Core template. When the application is run it looks like the figure below.
I have also removed the extra views, just leaving the Index.cshtml View, and I have renamed the HomeController, BlogController, in anticipation of building out the application.
The biggest change that I have made is how I have handled the bootstrap framework. One of the biggest benefits in using ASP.NET Core and Visual Studio 2015 is that the source files can be kept separate from the website (wwwroot). The ASP.NET Core template adds the bootstrap (and jQuery) files directly into a css folder in wwwroot. I have removed them from this location. Instead I am going to treat bootstrap as a “dependency” using the Node Package Manager (NPM) support built into Visual Studio.
The NPM packages can be managed in “package.json” which works similarly to the server-side dependencies that ASP.NET Core manages in project.json. Visual Studio also supports Bower as a client-side dependency manager, but most common packages are available on NPM, and angular 2 which I will probably use for any client-side coding is only available on NPM.
My package.json file is quite simple:
There are two separate dependency sections – the “dependencies” section is for dependencies that my application uses – in this case bootstrap 3.3.6. The “devDependencies” section is for libraries that are used for development only, in this case I am using gulp 3.9.0 and del 2.2.0. The dependencies show up in the Dependencies pseudo-folder, which corresponds to the physical node_modules folder (which Visual Studio hides).
Which brings us to the next big change in Visual Studio 2015. VS 2015 has built in support for common client-side Task Runners. It supports both gulp and grunt but I will be using gulp. Gulp is a JavaScript based task runner than can be used for all kinds of tasks, for example copying files from the node_modules folder where NPM keeps its packages to wwwroot.
Each gulp task can be wired up to a number of different Visual Studio Build events, so they can execute when you compile the server side code. I have wired up the “build” task to the After Build Visual Studio binding, and the “clean” gulp task to the Clean Visual Studio binding.
Now when I Build my Visual Studio project I also copy the bootstrap files to the wwwroot/css folder.
So that's the starting point for our Blog application. In the next post I will start to build out a very simple list of blog posts.
Source
The source for Naif.Blog can be found at https://github.com/cnurse/Naif.Blog. If you want to find the state of the repository used in this post then you can find that at the tagged release v0.0.0 (https://github.com/cnurse/Naif.Blog/tree/v0.0.0)