Sara J Chipps

Party with a Purpose - MongoDB WAN Party

 Tonight we had a very different WAN Party. I have been wanting to learn about document databases for a long time. I tweeted about it the other day and someone mentioned that we should do it together on the WAN party. I thought that was a great idea, so tonight we went about implementing it. I used some screensharing software to show everyone my desktop, then all together we went about removing Linq-to-SQL and adding MongoDB to http://bundl.it. It didn’t take us too long, and we all got to learn together. It was really great, and I hope we can do this more often.

 

Anyway, I thought it would be a good idea to share what we learned here. MongoDB seems pretty awesome from the little I’ve used it (basically just tonight). You are able to map your objects and store them in really simple ways.  

We used these blog posts as references for our education session: Jason Alexander's, Fredrik Kalseth's

So, the first thing you do is download the executable for Mongo here.

I then opened Mongod.exe to get the server running on my machine, and then mongo.exe to look at and play with our data. What I did next was find a driver so I could access my data from my application (http://bundl.it is written in ASP.NET and C# MVC 3.5 Framework). Someone suggested Norm, it’s a project by Rob Conery and it seemed like it would be up for the task. We downloaded the repo, opened the project, and built it in Release mode. We then went over to the bundl.it solution and included the Norm.dll.

Ok, so, next step was replacing Linq-to-SQL in the bundl.it solution. I gutted all my data access methods, the idea was to get the application back up and working again using MongoDB. The next step was mapping out some classes. There was much dismay at my “BundleManager” class, also my throwing two objects in one class file, however this was for the sake of time and will be fixed before I deploy.

The ease of setting up my objects to Save and Request from MongoDB was suprising. Norm provides a connector class “MongoQueryProvider” within which you pass the name of your datastore as a string. The cool thing is if you haven’t created that particular store yet it will create it for you.

Step next was making sure my objects saved. The syntax on that was “mongoQueryProvider.DB.GetCollection<T>().Insert(object)” or “mongoQueryProvider.DB.GetCollection<T>().Save(object)” (this also does an Update).  Retrieving them was just as easy: “mongoQueryProvider.DB.GetCollection<T>().FindOne(new Object {Property = property})”

 

One thing I loved was the ability to find a list of child objects by passing in the parent using “mongoQueryProvider.DB.GetCollection<Child>().Find(new Child() {Parent = new Parent() {ParentProperty = parentProperty}})” I didn’t have to map out these relationships in a painful ORM manner.

 

I don’t have enough experience with MongoDB to accurately cover the bonuses and pitfalls. However, the little I have worked with so far I really have enjoyed.

 

I’m going to make a “tldr;” how-to below to make life easy:

 

Step 1: Download the mongo executables and unzip.

 

Step 2: Run the mongod.exe from your command line

 

Step 3: Run the mongo.exe from your command line

 

Step 4: Download NoRm 

 

Step 5: Build the NoRm project and Release

 

Step 6: Include the NoRm dll in your project

 

Step 7: Create a MongoQueryProvider

 

Step 8: Add new object

 

Step 9: Update existing object

 

Step 10: Retrieve object

 

Bonus step: Retrieve children via parent.

 

 

I plan to do the same “learn together” format for the next WAN. I have an idea of what we will learn, but if you have any desire one way or another let me know.

 

 

 

 

 

 

 

 

 

Rock Out Like a Girl Developer

I don't know about you but I can't work without good music.

I love Pandora because I feel I get a real variety and I think whatever algorithm they use totally works because I'm always dancing in my chair. I don't know if you have been paying attention (I haven't) but apparently they have been involved in litigation recently over their service. Apparently  Copyright Royalty Board (which is apparently a board incharge of copyright royalties?). I got a nice email from the owner oif Pandora this week apoligizing for the inconvenience and stating that my listening was now limited to 40 hours a month. I could get more, however, if I opted to pay their service of $.99/month. I thought the email sent the message that they really care about their customers.

Before we get started though, you HAVE to check this song made by a guy named Dale Chase. It's called Coder Girl and it's amazing.

So, without further ado, here is what I listen to when I am coding like a mad woman. I figured I'd share with you in case you wanted to join me.

Sara Jo Radio   These are my favorite artists playing some of my favorite songs. Listen at your own risk, Hanson really rules.

Summer 09 Mix I made this station and seeded it with all the awesome tunes I've been rocking out to this summer.

Donated Station A guy named Chris sent me this awesome station he made, it's called "Kanye West"  but it's mostly awesome old school rap. Love it.

Ska Throwbacks Nothing says high school like some Less Then Jake or Save Ferris. I bop at my desk a little harder to these guys.

Rainy Day Radio  More slow jams for when you're just in one of those rainy day moods.

Mellow Radio Some great 70s beats from Cat Stevens, Hall and Oats, Cher and more of my favorites.

Caitlyn Radio  I got together with an old friend lately, and I threw this station full of the songs we used to love together. Hint: I seeded it initially with Trick Daddy

If you listen let me know what you think, if you have good ones of your own I'd love to hear them.

Adding the Linq to SQL ORM to your .NET project

I am working on a new personal project (I mentioned it in my videocast), I am building it in MVC, since it is a small project I wanted an easy to use and implement ORM. I chose LINQ to SQL after hearing several good things. It has been a real breeze to set up and use. So, without further ado, I have put together a tutorial on how to set up LINQ-TO-SQL.

First add a new Linq to SQL class to your project. Since I'm using MVC, I'm putting my Linq to SQL classes in my Model folder. However, you can put them wherever you want. When I add the classes I get the Object Relational designer telling me to drag over items from my server explorer to map them.

Now you need to add your SQL server to your project's Server Explorer. Right click on data connections and go to add a new connection.  Put in the ODBC info for your server, and make sure to test your connection before closing. Now, if you expand your tables all you have to do is drag them over to the OR Designer.

You can very easily add relationships to your objects. I'm not sure if that would automatically happen if they are related in the DB. Someone will need to try and let me know. In order to add a relationship you right click on one of your tables, click "Add" and choose "Relationship." You can then specify the parent and child tables as well as what columns hold the relationship.

Next I'm going to build an interface to list my methods that I'm going to build to deal with my objects quickly. As you can see, mine are specific to my application, but I think they will be helpful to you anyway.

To create these methods, first I'm going to create an instance of the Data Context that was created with my .dbml. Then I'm going to use LINQ to query my objects for me and return them. I'm just making a basic Save method, and some small queries that I think I will need.

There you have it. That's how easy it is. I KNOW! You can download my source here. Now we have my model set up we can move to the rest of our MVC for web forms developers series. Stay tuned!!

How To: Use Dynamic Images in the ASP.NET SiteMapPath control

ASP.NET offers all kinds of controls for all of your development needs. I'm convinced that in 5 years there will be one control <asp:YourWebsite runat=”server”/> However, until that part there is still use for us programmers. Recently, I had use to use a new one and I thought I'd share my experience.

So, the SiteMapPath control is very convenient when you are adding breadcrumbs to your web application. However, if you want to make your breadcrumbs a little more dynamic then they are packaged, you will need to do it pro grammatically, I will share my process below. 

Ok, so step one: Creating your site map. Your control needs a datasource , and you have to add that in the form of an asp SiteMap. It's basically an xml page the guts of which look a little like this:

<siteMapNode url="Default,aspx" title="Home" >

<siteMapNode url="DoSomeJunk.aspx" title="Here's Where Users Do Junk" >

<siteMapNode url="AboutUs.aspx" title="About Us" />

</siteMapNode>

 

The outer node is the parent for the others, and that is how you indicate it in the site map. Ok, now creating your SiteMapPath control, your default datasource will be the web.sitemap, if you want it to point to a different site map you can set the SiteMapProvider property.

 

Your default SiteMapPath ends up coming out like this:

 

 

<asp:SiteMapPath ID="siteMapPath" runat="server">

</asp:SiteMapPath>

 

Now, you can leave it like that and it will look like this when you are on the About Us page:

 

Home > About Us

 

However, some of us like adding some snazz to our apps. My designer gave me breadcrumbs that look like kind of like this:

  HOME LOCAL SEARCH

 

Now, the SiteMapPath allows you to add images inbetween your links by populating the SMP (SiteMapPath)'s “PathSeparatorTemplate” property. There are a few templates in the SMP, the others are “CurrentSeperatorTemplate” which is the node that represents the page you are on, the “ParentSeperatorTemplate” which is the parent node (obv), and the “RootSeperatorTemplate (you get the drift). You can put an image in the PathSeperatorTemplate, or some words, a picture of your kids... whatever you want, and it will go between each one of your nodes like so:

However, since I had different pictures inbetween each of my nodes I needed to dynamically load the images in runtime after testing which nodes were displayed and where. Upon learning that the SMP had a ItemDataBound event I was able to load I t like a repeater (a control I use a little more often.) There are two ways to do this, I used an if statement,but it got a little long... It looks like this:

 

 

protected void siteMapPath_ItemDataBound(object sender, SiteMapNodeItemEventArgs e)

{

 

      var node = e.Item.SiteMapNode;

      if (e.Item.ItemType == SiteMapNodeItemType.PathSeperator)|

     {

          if (node.Url == "/Default.aspx")

         {

               ((Image) e.Item.FindControl("imgNode")).ImageUrl = "~/Images/blue-dot-small.gif";

         }

        if (node.Url == "/Classifieds.aspx")

        {

          ((Image) e.Item.FindControl("imgNode")).ImageUrl = "~/Images/green-dot-small.gif";

        }

 

        if (node.Url == "/ViewCalendar.aspx")

        {

             ((Image) e.Item.FindControl("imgNode")).ImageUrl = "~/Images/grey-dot-small.gif";

       }

}

}

 

So I graduated to naming my images after my pages and did this:

 

protected void siteMapPath_ItemDataBound(object sender, SiteMapNodeItemEventArgs e)

{

      var node = e.Item.SiteMapNode;

      if (e.Item.ItemType == SiteMapNodeItemType.PathSeperator)

      {

           ((Image) e.Item.FindControl("imgNode")).ImageUrl = "~/Images/" + node.Title + “_Breadcrumb.gif”;

     }

}

 

 

And that, I decided, was the best way, for now. So that's how you add dynamic images to your asp.net SiteMapPath control! Thanks for reading, and as usual:

 

Beauty vs. Usability - a Tale of Two Masters

We as passionate developers (or managers, CTO’s, help desk jockeys…etc) have one thing in common, we are attracted like moths to a flame towards the latest and greatest. If something new is coming out we are all talking about it, reading up on it, we could probably tell you five things it lacks before it’s even released. That’s one of the main reasons we are in this, all the cool sh*t we get to play with. This trait comes with a dangerous side effect, which is getting lost in the bright flashy lights of new technology and forgetting what we are here to do in the first place:  solve problems and make the user experience more pleasing.

I have heard stories, and have seen myself, situations where a system has a hodge-podge of very cool stuff, but isn’t usable. Also, there are applications that have been refactored to death, turned into a bloated barely functional mess. What it means when this happens is that someone couldn’t find the balance between what they think is neat, and what will benefit the business. I myself am coming up on a project I am very excited about. When I first started the planning process in my head I was going to use MVC for URL rewriting (ugly url’s are becoming inexcusable) and LINQ for my SQL and I was going to set up all the designers with the Expression Suite and it was going to be the pinnacle of forward development and everyone would be impressed with what I knew. However, after taking a step back, realizing that organizing a project like this is new for me, I decided to go with more familiar methods like active record sets and stored procedures. The new things I am going with are the 3.5 framework, and VS 2008 from 2005. Why? Well, they both cost me very little “learning overhead” time and the 3.5 Framework is better with paging than 2.0 and VS 2008 has better JavaScript debugging, two things that will save me a lot of time. (seriously, how did it take this long to get good JS debugging? It’s only been around as long as, I don’t know, the internet?).

So, how do we avoid this issue? What are some questions we can ask ourselves that will help us choose a good advancement over one that will spin our wheels but not benefit the application. Well, let’s start at the part where you find something exciting. The first thing you need to think of is your feature debt, what does it look like? How does adding this element to your existing application help to lower that debt? Will it save you time that you can use for development? If so, how much time? Will it eliminate some of that debt? Really? Will it, or are you just saying that so you can feel better about playing with it?

Another great way to tell if your investment is worth taking is to convince your end users or project owners that it is. Non intar-people don’t want to hear about refactoring, or code integrity, or WPF. They want to see bright shiny flashy things that look cool and make their lives easier. Convincing them that they need something they’ve never heard of and don’t care about will be a great barometer to see if this change is worth making.

Someone called the solution this quandary an Aristotelian Mean the other day. I had to look that up, but it basically means a perfect balance between two extremes, which is applicable only if you can attain it. Perfect code is beautiful, but if we keep going back and second guessing ourselves we aren’t always helping our users. All my advice is well and good, but while I have the knowledge I lack the experience of finding this Golden Mean between these development poles. I’m sure I’ll learn on my way, but if anyone has any more suggestions, I’d love to hear them.

 

 

Five good reasons to stay away from third party applications (even open source ones)

So, I’ve been wrestling with this third party app  that’s been acting up for a few days now. It has been really frustrating. Enough for me to ask several times why it didn’t get completely developed in-house.  Looking at it there is no reason for it not to have been done by one developer. It is some linkbuttons and some pretty colors and borders that are dynamically created by metadata. Its been really annoying blindly trying to get past some of these bugs. This isn’t the first time this has happened to me when using payware OR freeware. In the future, I plan on staying as far away as possible. Here are the reasons why.I think you should too:

 

You didn’t make it – Duh. I mean, you think its not that big of a deal, that code is code (or apps are apps) but think of how you feel when you’re sitting in front of a brand new application. The learning curve that is behind debugging something you didn’t build with your own fingers is a chore. When you understand an application you may not know exactly what’s causing the bug, but you know generally where to look and have a much better idea why it may be happening.

Email support packages – Nothing is worse than an email support package (except for maybe a smoke signal support package) ESPECIALLY when you are dead in the water either in production or development. Waiting that “1-3 business days” between questions and answers is torture. Especially when they don’t get your question the first time, or when their answer isn’t the solution…. It can go on for weeks and its extremely tedious. Phone support packages can be dreadfully expensive, upwards of $1000. It’s a tough call to make not knowing just how much you will be using this package. Of course as developers (personally, I like “web-hero”) we say things like “no, don’t buy the package. Its too much to pay, this is open source so if it blows up I can fix it.”

Sales people – Listen, I don’t hate sales people. Some of my best friends are in sales (seriously, if you need a Pitbull Tire Lock let me know. They are great security for your vehicle, and the bonus is they have the hottest sales girl…..pretty much ever). That in mind, we all know they make LOTS of promises. Can your application be used with 1.1? Sure! Can I integrate this while keeping my high security model? Definitely! Will your program make my code infallible? Of course! I have been mislead several times only to get an email support message that says something like “Oh, we apologize for the confusion, that’s not supported in this version. However, it is in development and will be made available with our next release.”

We don’t support that application anymore – You want to think that your application is so cutting edge that it would only incorporate the latest and greatest but you have to admit these little companies that produce integratable applications are popping up in alarming rates. Just as scary, they are disappearing just as fast. Do you want to pay $3000 for a feature that breaks in a year and there is no one to email about it? (You can email me, but I will only say “Told you.”)

Ugly Code – I was taught to take pride in things I create, to make sure everything matches and has similar structure. To pay attention to patterns and conventions in order to make a smooth and agile application. To produce a product in which any decent developer can sit down and say “Wow, this is very self explanatory.” Now you’re taking someone else’s stuff and just slapping it in there. Not only that but a lot of times companies don’t care what the code looks like, just that it works. Today I got to edit things like “LinkButton8” and “Label29”. If Project Awesome was something I created myself it would make me physically ill to see these things polluting up my legacy. Like putting dirty clothes on your children, it may make them look better than nothing, but it’s still pretty bad.  

There are some really awesome products out there that can make your web app shiny and flashy, and believe me I like these things. You have to think, though, if someone else did it, so can you. I think 90% of the time it's a better investment of your time to do-it-yourself, you just may learn something. Sometimes, like in the case of PA (Project Awesome) there may be one developer working alone and it’s just not realistic time wise to do all these things on your own. I guess my only advice (if you must) is to thoroughly research each tool before you buy it  utilize free trials, and speak to the developers before giving them company money. After all, it’s only your code and schedule that will suffer if you choose unwisely.

 

 

 

 

UI Design - Developer Kryptonite?

Ok, so we’ve all been there. You tell a compu-gentile what you do and they say something like “Oh, wow, web development that must be fun. Web designers are so cool.” NO! You have to clarify, “I am not a designer, sorry. I do the backend stuff. I’m not good at making things look nice. I have people that do those things for me.” There is a certain stigma that is attached to “softer science” of interface design. Kind of like “NO, I’m the architect, not the decorator. “ However, this is an important facet in any developer’s knowledge base. Like hardware setup, and server installs. Not technically part of the gig, but it makes you a more resourceful, and valuable asset.

“Awesome. So the girl starts out by attacking UI design. Softball.” Hey, give me a minute. This is something that I have recently become quite passionate about. I’m really trying to change some minds out there when it comes to friendly, intuitive design. (No, this has nothing to do with a boy.) Plus, I will be re-designing the front end of Project:Awesome within the next few months so this is something that has been brewing.

So how do I personally go about designing a new interface?

1.        Steal other people’s sh*t. Seriously, not kidding right now. If you’re a developer designing a front end you are most likely in a small organization. You don’t have the money for focus groups and research teams. This type of thing is important though. Remember, the most important thing in web design, you want to make a site that people want to be at. There are an unlimited number of websites out there. Unlike physical business people aren’t limited by location. If you think you have something unique you don’t. If you do it won’t be for long. So, first, go take a look at some sites that are in the same genre as yours and get some ideas. I’m not saying steal their style, I’m saying glean some knowledge from the buku bucks they are spending.

2.        What do you hate? Ok, so we all have our pet peeves when it comes to websites. Por exemplo: I hate when a site has huge ads all over the place. In the middle of articles, monster quarter page flashy “SOMEONE HAS A CRUSH ON YOU CLICK HERE TO FIND OUT WHO” “KILL THE SPIDER TO SAVE 234098723 DOLLARS A YEAR ON YOUR CAR INSURANCE FREE MORTGAGE WITH PURCHASE” I know that ads are a large portion of the revenue for many sites, but there is a way to make it tasteful. Yes a 400x500 px monstrosity will get you the big bucks, but how much traffic will you lose? Facebook manages ad placement perfectly. Trust in your instincts. Also, ask other people what they dislike about the web.

3.        What do you like? I like AJAXy looking JS submenus. They save you page space and look snazzy. I like lots of information in a little area. The fact that I am logged in, that I have 54709 new messages, that I have a new comment… all in the same place. These are things that I will remember when doing my redesign.

4.        Web Fashion No joke this past Saturday I went to a makeup event and the one girl said “Looks from the 40s are really in this season.” HELLO??? That’s so Winter ’07. No, but seriously, like clothing the web has a fashion as well. Right now if you take a look around you will find very dual-chromatic themes. Meaning one, maybe two colors on white. Simple ROYBGIVs. Reds, blues, very big. Simplicity is key. I see rounded edges on pages and components. Square corners on menus.

5.      Find the least intar-friendly person you know and ask them if it makes sense to them.One of the best developers I’ve ever had the privilege of working with sent me this article: http://www.joelonsoftware.com/uibook/fog0000000249.html (It’s a tie btw him and this guy, really can’t call it). It’s an older article but the wisdom is timeless. One of the most important pieces of wisdom I garnered from that is make sure it makes sense to the people that are the least comfortable with the web. I use my mom, but she’s getting better at the whole web thing so I could use a new candidate.

 

 

 

These are my 5 steps to simple and effective web design. Remember, its nothing to be afraid of. It doesn’t make you less technical to be a good designer. That’s an antiquated notion along the lines of HD DVD and two way pagers. Learn it!