jQuery Mobile and ASP.NET MVC 4

Introduction to jQuery Mobile
(Pause) This is Scott Allen and this course is going to cover jQuery Mobile framework. jQuery Mobile is a JavaScript library that builds on top of the popular jQuery library. It allows you to build web applications that will work with patch interfaces and it looks great on all the popular mobile web browsers. It supports iPhones, iPads, Androids, Windows phones and BlackBerry. It also supports the Kindle Tree and the Kindle Fire as well as palm devices running webOS. And it also supports desktop browsers like Chrome, Firefox, Opera and Internet Explorer because this is just JavaScript, HTML, CSS, and web standards all the way down. In this course, we're going to add mobile features to an existing ASP. NET MVC application, the MVC Music Store sample application that will be using MVC 4, a beta, a Visual Studio 2011, jQuery Mobile and the entity framework. We'll mostly be focusing on jQuery Mobile though so you can see how this library works and you can use these concepts with any service sever side technology, Ruby on Rails, PHP, anything that's out there. But in this course, we'll get to see some of the new features in ASP. NET MVC4. jQuery Mobile, the library, you can download it from jquerymobile. com. It's not just a widget library or a loose collection of UI features like some of the other libraries and plug-ins in the jQuery space. JQM gives you a unified user interface system, meaning it does have some constraints and rules that you have to obey or you're going to fade against the framework. When you do follow up these constraints, what you'll produce is an application where jQuery Mobile automatically does a lot of hard work for you, adding features like asynchronous page navigation, progressive enhancement, responsive design, accessibility, touch support, theming. If you don't know what any of that stuff means, don't worry. I'm going to be demonstrating those features during this course.

Page, Dialogs, and Navigation with jQuery Mobile
Hi this is Scott Allen and in this second module on jQuery Mobile will build upon what we learned in the introduction and add mobile features to an existing web application. As we do this I want to focus on some of the page navigation features provided by jQuery Mobile, understanding what JQM is doing behind the scenes for us with regards to navigation, its crucial to working with this framework and avoiding some pain. So in the last module we learned a bit about the structure of a jQuery Mobile page as we explore a mobile only web page. But as web developers we usually don't have the luxury of building a website that supports only mobile users. So in this module we'll optimize the mobile browsing experience for the ASP. NET MVC Music Store, this is a sample application you can download from the CodePlex website and it does work with a mobile web browser, but it doesn't deliver an optimal experience. So we'll be adding jQuery Mobile support to the site and Ill show you some of the trade offs to evaluate and tricks you can use to support both mobile and desktop browsers. I can say upfront that this job is a lot easier if you maintain a separation of concern in your UI layer and that's something that is very natural for an MVC application. It separates the responsibilities of the model, the view and the controller. And what I want to do when adding mobile features to a web app is to reuse as much code ad possible. With MVC that means I can reuse the models and the controllers as much as possible, perhaps even reuse some views but I do have the ability with ASP. NET MVC to have a customized view for a mobile device and we'll see just how easy that is very soon now ( Pause )

jQuery Mobile Widgets
Hi. This is Scott Allen, and we are in the process of working on the ASP. NET MVC Music Store to make the application better for mobile devices. In this module, we'll look at a few more of the available jQuery Mobile widgets and see how we can use them to improve the mobile experience for our user. We'll look at buttons, collapsibles, grids, form elements and more, and we'll continue where we left off in the last module.

jQuery Mobile APIs
Hi, this is Scott Allen. In this module, we're going to look at the API of jQuery Mobile. We'll cover some of the events, defaults, selectors and methods that you can use and we'll look at some specific scenarios where you need to write some script. A lot of this will be familiar if you've done some jQuery programming in the past. But there are some twists with jQuery mobile. We'll start off by reviewing some of the defaults. ( Pause )