Introducing my new Side Project

With all the research and blogging about my research, one could wonder what’s the point of it all. Well, I have a point and that point is my side project. I have been a sometimes developer for a long time. I’m definitely not the one you want to be writing the next blockbuster application, but I get by; mostly by struggling for hours with simple code. This year I decided that I would actually spend the time to become at least as proficient as a college graduate programmer. I learn by doing so I decided I would direct my attention at a particular side project.

That side project is an online application that emulates a Dungeons and Dragons Character Sheet. Since Dungeons and Dragons is a tabletop paper and pencil game generally, the character sheets, where you write down all the statistics about your character, are similarly paper driven. I figured this would be a good time to update this for a tablet world. There are likely to be three parts to this application:

  1. An online portal that you can use to view and manage your characters
  2. A Web API so that I can write other (offline, perhaps) applications to use the data
  3. A Windows “Modern” application for a tablet experience

All of this, of course, should use the absolutely latest and greatest technologies. I will use ASP.NET vNext for the backend with Entity Framework 7 doing the database work for me. I’ll host the application in Azure App Services so that it is always available.

The front end work also will get the latest and greatest treatment. All the code will use ECMAScript 6, style sheets will be coded in LESS and I’ll use the latest thinking in Web Components with perhaps a touch of Polymer.

In terms of build environment, I’m opting for Visual Studio 2015 for my main IDE; jspm for my module handling; gulp for my client-side build automation. I’ll use babel, autoprefixer and other tools as they are appropriate.

Starting with Identity

My starting point was the recent ASP.NET Identity Tutorial that I wrote. There are nine parts to it:

  1. Setting up the Database
  2. The Login Process
  3. Registration
  4. The Registration Callback
  5. Forgotten Passwords
  6. Refactoring for Areas
  7. Logging
  8. Transient Services for the User Profile
  9. Wrapping up some bugs

If you are following along, I suggest you start with these nine articles as they have all been included in the character sheet initial version. Aside from that, I’ve done some styling work to make my Account screens look like the application I envision.

Where is the Code

Each section check-in will be tagged in the blog-code repository on GitHub. In addition, the version will be revved for each major section. Right now, I’m at cs-0.0.1. The project name is called CharacterSheet

Cloning the Repository

You can clone the repository directly within Visual Studio. Just use View -> Team Explorer. Click on the green plug (Connect to Team Projects). You should see a section for Local Git Repositories. Click on Clone:


Enter the information as above, selecting the location on your disk (not mine). By default, Visual Studio will pick a good place for you. Currently, the repository is small so it won’t take too long to clone. Once that is done, you can double-click on the repository to be taken to the Solutions:


Double-click on the CharacterSheet.sln solution to open up the project. You will need to manually select the Solution Explorer after you have done this.

Preparing the Solution

Visual Studio 2015 CTP 6 does not have support for jspm. The package restore won’t happen automatically as a result. You have to do it. To do this, open up a PowerShell prompt and install jspm, then run jspm install. Make sure you add it to your PATH or set up an alias for jspm as you will need to drop down to a command prompt to install new packages. I’ll let you know when this has to happen.

Visual Studio Extensions

I have a few Visual Studio Extensions installed. All of these extensions can be installed from the Tools -> Extensions and Updates menu option.

  1. Bootstrap Snippet Pack
  2. CommentsPlus
  3. Grunt Launcher
  4. Indent Guides
  5. jQuery Code Snippets
  6. Open Command Line
  7. Regex Tester
  8. Trailing Whitespace Visualizer
  9. Web Essentials 2015.0 CTP 6
  10. SideWaffle Template Pack

I will likely add to this list. Extensions like these make development easier, so I’ll blog about the useful extensions I find along the way as well.

Target Browsers

It’s all well and good developing good responsive design, but you have to test everywhere. For my main machine I have Windows 10 Technical Preview (on the fast track) with the following browsers installed:

  1. Google Chrome 41
  2. Internet Explorer 11
  3. Project Spartan

In addition I have an iPad 3 and a Dell Venue 8 as my tablets. I’ll install other browsers and operating systems on my “other boxes”. I have a Mac Mini for running mac browsers and a Hyper-V box that I can run random operating systems and their browsers on.

Running in Azure

I don’t run my development stuff in Azure. Firstly, it costs money. More importantly, the code is likely to be unstable. I’ll have to figure out the pushing to Azure piece, especially with the database in the mix. I’ll post another blog about that process when I actually do it. I do have an Azure account though; this blog is run out of Azure App Services.

That’s pretty much it for the run-down of my side project. I hope you’ll join me on my journey through web applications and developing my Side Project.