Scott Hanselman

NerdDinner being updated to MVC3 with Razor, HTML5, GeoLocation, EF CodeFirst, jQuery Mobile, YepNope and Modernizr and a fixed Mobile Device Capabilities ViewEngine

August 26, '11 Comments [28] Posted in ASP.NET | ASP.NET MVC | HTML5 | IE9 | Mobile | NerdDinner
Sponsored By

NerdDinner with jQuery Mobile on an iPhone asking for my locationTwo years ago Rob, Phil, and I released our MVC 1.0 book with the Gu helping with the big intro. I created the basic Nerd Dinner sample application (code here) and released the first 185 pages for free. Since the initial 1.0 release, we've had help from lots of people like Dave Ward, Andrew Aarnott and Jon Galloway on a lot of little things like JavaScript and OpenAuth support, then John V. Petersen moving us to MVC3 with Razor Views, and Peter Mourfield taking on lots of JavaScript and new features. These guys started working on a feature here and a feature there in our spare time. It's been a collaborative effort with folks dropping in, contributing here and there with long periods of silence in between.

After John V. Petersen moved us to MVC3 and Razor, Peter Mourfield got on a feature tear and now we've added or updated:

Now, to be clear, this isn't a release, it's an initial almost release. Call it an Alpha. That said, it's up live at http://www.nerddinner.com and the source continues to move forward in the Trunk on Codeplex. We've got some inconsistencies with the mobile site and back  button, and geoloc is not working completely on an iPhone but it's decent on a browser. We're working on this an hour here and an hour there, but if you, Dear Reader, find any bugs in the trunk or obvious stupid mistakes, please to let us know and *cough* submit a patch *cough*. Or at least leave a nice Issue we can track.

As we get these features working rock solid, Pete and I will do a series of posts digging in to what worked well and what didn't in each feature. Already Pete has a good blog post talking about adding HTML5 Geolocation to Nerd Dinner with yepnope.js, and Modernizr. He used yepnope, a great library for saying "do you support this feature? Yep? Get this JS. Nope? Get this JS. For example:

<script type="text/javascript">
$(document).ready(function () {
yepnope({
test: Modernizr.geolocation,
yep: '@Url.Content("~/Scripts/geo.js")',
nope: '@Url.Content("~/Scripts/geo-polyfill.js")',
callback: function (url, result, key) {
getCurrentLocation();
}
});
});
</script>

Love it. More details and code on Pete's blog post. In the image below you can see IE9 warning me that my local site wants to track my physical location.

Geolocation in IE9

Here's Firefox prompting me for a location on the live site:

Firefox wants to know where I am

And Chrome:

Chrome knows where you live!

As I said, there are surely lots of bugs and subtleties we need to iron out, but I'm glad we're actually moving this sample forward. Hope you enjoy, and do feel free to fix our bugs for us, Dear Reader. ;)

About Scott

Scott Hanselman is a former professor, former Chief Architect in finance, now speaker, consultant, father, diabetic, and Microsoft employee. I am a failed stand-up comic, a cornrower, and a book author.

facebook twitter subscribe
About   Newsletter
Sponsored By
Hosting By
Dedicated Windows Server Hosting by ORCS Web
Friday, August 26, 2011 10:31:20 PM UTC
Scott, this is very exciting to see all of these modern features being included in the NerdDinner release, Wow!! Have you considered responsive / adaptive design instead of a mobile view engine?

Also, not to turn this into a "my favorite libary needs to be included" request, but Compass Style has become one of my go to tools for getting good cross browser (vendor specific prefix) tools for writing CSS3.
Tom Rankin
Friday, August 26, 2011 10:38:51 PM UTC
Tom - Yes, I've been exploring Progressive Enhancement lately with this blog, in fact. This blog wasn't a good candidate for jQuery mobile so we tried it on NerdDinner. I'd be interested in what could be done to the NerdDinner site to make it look decent on an iPhone. Long story short, we're going back and forth. Sometimes a mobile view is helpful, other times not. Your feedback is welcome!
Friday, August 26, 2011 11:33:48 PM UTC
Scott,

Any chance you guys can get rid of those ugly ass markers and use something that look a little less tacky?

These look interesting: http://mapicons.nicolasmollet.com/category/markers/
Athtar
Friday, August 26, 2011 11:36:23 PM UTC
Athtar - Ugly ass? That's a little harsh. Perhaps you would like to do it for us?
Saturday, August 27, 2011 12:29:30 AM UTC
It would appear that half of the features for an anonymous user on nerddinner.com don't appear to work right now...

Definitely an alpha release.

Might I suggest setting up subdomain(s) for new version and keeping the main domain running the stable version.

None the less, thanks for keeping at this project. It has been a great resource over the years for learning how to implement new features.
Saturday, August 27, 2011 2:07:42 AM UTC
My apologies Scott. I didn't mean to come off as being rude. I was going more for witty/jestful but I should've been more careful with my choice of words.
Athtar
Saturday, August 27, 2011 3:08:53 AM UTC
Scott, this is awesome! Can't wait to download and check it out. I really like the addition of jQuery Mobile. This project has always been a great resource for devs and it's great to see the activity.
Saturday, August 27, 2011 4:54:15 AM UTC
Athtar - NO worries, thanks for the links!

Gustafson - Sorry, had a bad deploy this afternoon. Those features are working now. Thanks!
Saturday, August 27, 2011 7:47:24 AM UTC
Thanks Scott. Your attentiveness shows that you have a passion for what you do and is one of the many reasons I am a fan.
Saturday, August 27, 2011 10:49:27 AM UTC
Man... this is cool. Thanks Scott. Very impressed and really cool.
Riza Marhaban
Saturday, August 27, 2011 1:35:32 PM UTC
Hello Scott, what about the book it will be updated ?
Ahmed gomaa
Saturday, August 27, 2011 5:15:19 PM UTC
I have a suggestion for the site. When returning a mobile version of the site give users an option to switch to a full version. With the growing number of tablet devices it should be a standard.
Monday, August 29, 2011 4:22:14 AM UTC
Hi scott, when I allowed the site to track my physical location, is my location being saved in the database or a cookie or how does it remember my location? Thanks.
Ray
Monday, August 29, 2011 5:24:48 AM UTC
Do you also update ASPNET MVC EBook to MVC3?
Monday, August 29, 2011 9:06:06 AM UTC
Hi Scott, nice to have an up-to-date reference sample.
Could you consider to add the use of head.js and/or HTML5 Boilerplate as well, please?
I think those can speed up the initial loading performance of the website. Thanks for the info and inspiration!
Monday, August 29, 2011 8:59:02 PM UTC
Dhili - Not yet, no time!

Teun - Good idea. Add it as an issue on the CodePlex site?

Ray - Your location isn't stored anywhere, it's requested on the client side with JavaScript from your browser and used only once.
Tuesday, August 30, 2011 9:38:45 AM UTC
I am using Firefox 6.0. I allowed my location to be shared. Location was found then I clicked Search button. In result of this page is reloading constantly :) Same URL works fine in IE9 and Chrome. It might be a Firefox issue but it is interesting to know why it is happening on first place.

PS Well, colleague of mine pointed me to this post http://stackoverflow.com/questions/7110023/firefox-6-infinite-page-refresh-with-page-with-hash-tags. Seems you have to update the scripts guys :)

Cheers
Georgi Hadzhigeorgiev
Tuesday, August 30, 2011 5:26:00 PM UTC
Great job Scott & everyone else working on NerdDinner! I'm glad to see the code continue to evolve, improve, and address complex "real-world" web development issues like mobile support, OAuth, and polyfills.
Thursday, September 01, 2011 3:42:28 AM UTC
I've preferred your mobile detection/view switching over all of the other solutions out there. Is the version you're pointing to in this post supposed to replace your last blog post too?

(http://www.hanselman.com/blog/ABetterASPNETMVCMobileDeviceCapabilitiesViewEngine.aspx)

Thanks for your work in this area!
Sunday, September 04, 2011 3:31:24 AM UTC
The beauty of Nerd Dinner was in the MVC tutorial that was using it. It was "Hello World" of ASP.NET MVC. I would say that most visitors on this blog don't need a primer any more and are looking at Nerd Dinner the way I was looking at "Kernighan and Ritchie" or Straustrup books.

For people new to MVC - the code without the book isn't very helpful (I saw one of my colleagues struggling with MVC2 version without a book and I expect even more of the same with MVC3).

So, please! update the Nerd Dinner book to MVC3 as well!
Monday, September 05, 2011 6:25:12 AM UTC
hi scott,
will you prapare videos about nerddinner innovations. not all the site, some inportant changes...
Tuesday, September 06, 2011 11:16:20 AM UTC
I love that this work has been done to help promote the use of MVC but I feel that more effort should be made in projects like this to follow best practise as much as humanly possible.

At present the solution on codeplex would fail a stylecop audit badly. There is complicated code in there there simply isn't commented. How is someone new to MVC supposed to follow what is going on?

Please please get someone to tidy up the solution before adding more features. Hell you'll probably spot and prevent a few more 'subtleties' by doing this.

Us mere mortals can't keep up!
Monday, October 03, 2011 3:46:08 PM UTC
http://mourfield.com/ seems to be down/abandoned. That's where Pete's blog posts were. Maybe he moved? .. or forgot to renew his hosting? :)
Thursday, November 17, 2011 3:50:05 PM UTC

I've been doing ASP.NET since 2002 and I have to say MVC3 works well and it's great to see Nerd Dinner in it's MVC3 glory. We took the plunge a few weeks ago to switch to MVC3 and now there's no going back ...

Thanks!
Tuesday, March 13, 2012 3:39:35 AM UTC
without the tutorial, this project is useless, do not even bother publishing it anywhere
mvc3 learner
Thursday, April 05, 2012 10:31:59 AM UTC
@Georgi Hadzhigeorgiev
Hi thanks for your valuable post, however after updating the script, search is still reloading constantly in FF (v. 11).
Search within Chrome and IE are fine.
P.S. I'm working on NerdDinner MVC 2., since the tutorial/pdf still somewhat applies for this.
Monday, April 16, 2012 8:19:14 PM UTC
Hy,

Can anyone give an example of the mobile pages in mvc3. I only saw you have to put .Mobile.cshtml in a view and it's a mobile view. But I need an example to see what to put in the view please.

Regards
Vlad
Friday, April 20, 2012 6:36:45 PM UTC
Hi Scott, I download the project from codeplex. when I try to open the solution, I get this popup message to logon into tfs.codeplex.com server. Could you please help?
thank you
Comments are closed.

Disclaimer: The opinions expressed herein are my own personal opinions and do not represent my employer's view in any way.