Thursday, August 27, 2009

ComicsInventory.com

I just wanted to share a little project I've been working on called ComicsInventory.com.

I have been a big fan of comic books for years and have over the years accumulated a very large collection. Sometime ago I decided to start organizing my collection and finding out how much each issue was worth. I looked around the net for a solution but found very over priced solutions or free solutions that had very bad interface designs or poorly written code. This gave me the opportunity to merge my love of comics with my love of code. Plus I figured I could use the site as a testing ground for anything new that comes out in the coding world ;-)

For my framework I decided to use (at the time) the beta of Asp.net MVC. I liked the freedom it gave you and its minimalistic design. It's faster, lighter and gets you back to html and http. No server controls or viewstate! But I've already talked about this before.

Since theres so many different ways to organize comics. I decided to build the site around a labeling system. This gave me the flexibility to assign multiple labels to comics and group them in different categories. A side benefit that came about was when I added the "total price" feature. This made it very convenient when getting values for all your spider-man comics. But also if some of those spider-man comics were CGC'd. I could create a CGC label and see how much all my CGC comics were worth.

Another big feature is the Image Viewer and Image Upload. This was tricky because I had to reliably upload an image, create 2 copies (1 large & 1 thumbnail) and upload those images to Amazon's S3 service. All in 1 step. I used the awesome flash plugin Uploadify to constrain the image sizes and handle the image upload to the site. I then used the .NET image classes to copy and resize the images. Instead of making my own Amazon S3 library I decided to use ThreeSharp. This library was fantastic and had an active discussion section.

Designing the interface and the look of the site was very important to me. I wanted the site to be very clear, easy to use, but also minimalistic. I spent time at 37signals, studying there site but also there philosophy on feature creep and really focusing in on what features are important to ship with first. It helped a lot with designing the Home page where I wanted to show what the site was about.

I learned a lot about the MVC architectural pattern, designing and using third party services to extend your site. But the best thing is I now have a place to inventory my comics and in the process created a service that others can benefit from.

Site Architecture

Core
  1. OS: Windows Server 2008
  2. Web: IIS 7.0
  3. Database: SQL Server 2008
  4. Language: C#

Dev Tools
  1. IDE: Visual Studio 2008 Team
  2. Framework: ASP.NET MVC
  3. Data Access helper: Microsoft Enterprise Library
  4. Browser Framework: jQuery
  5. Source Control: Subversion
  6. Subversion Client: AnkhSVN
  7. Compare Tool: WinMerge

Third party libraries
  1. Uploadify - flash plugin to handle uploads & constraints
  2. ThreeSharp - Amazon S3 library
  3. Json.NET - JSON Serializer/Deserializer
  4. Google Analytics - web site statistics
  5. UserVoice - feed back system