JQuery Mobile

Introduction to The One ASP.NET Platform/Ecosystem

December 25, 2012 .NET, .NET Framework, .NET Framework 4.5, ADO.NET, All, ASP.NET, ASP.NET 4.5, ASP.NET AJAX, ASP.NET MVC, ASP.NET MVP, C#.NET, Community, HTML, HTML5, IIS, JavaScript, JavaScript, jQuery, JQuery Mobile, KnowledgeBase, LINQ, Microsoft, MSDN, SignalR, Updates, VB.NET, VisualStudio, VS2012, WCF, Web, Web API No comments

Introduction

ASP.NET has travelled a long way through evolutions. Earlier when ASP.NET 1.0 was released as part of .NET Framework 1.0 in Jan 2002, there was only ASP.NET – a framework for building dynamic web applications and it provided lots of flexibility web developers in building robust, dynamic web applications.  ASP.NET was and is the successor to Microsoft’s Active Server Pages (ASP) technology.

ASP.NET is built on the Common Language Runtime (CLR), allowing programmers to write ASP.NET code using any supported .NET language. The ASP.NET SOAP extension framework allows ASP.NET components to process SOAP messages.

From that, today we reached ASP.NET 4.5 and platform/web framework has changed a lot through the 10 years of journey.

Before going further lets go through a quick summery of additions in each releases:

ASP.NET 1.0 (January 16, 2002)

  • Object-oriented Web application development supporting inheritance, polymorphism and other standard OOP features
  • Support for generic HTML controls and ASP.NET dynamic web controls
  • Event based programming
  • The developer can make use of DLL class libraries and other features of the Web server to build more robust applications that do more than simply rendering HTML.
  • Integrated development support using Visual Studio .Net 2002

ASP.NET 1.1 (April 24, 2003)

  • With ASP.NET 1.1 – an update to .NET framework 1.0 called as .Net framework 1.1 – we received support for Mobile Web Controls, Automatic input validation
  • Integrated development support using Visual Studio .Net 2003

ASP.NET 2.0 (November 7, 2005)

ASP.NET 2.0 introduced major updates to ASP.NET framework with introduction of Master pages and new data controls.

The interesting features included in this release were:

  • Integrated development support using Visual Studio 2005
  • New data controls (GridView, FormView, DetailsView)
  • New technique for declarative data access (SqlDataSource, ObjectDataSource, XmlDataSource controls)
  • Navigation controls
  • Master pages
  • Login controls
  • Themes
  • Skins
  • Web parts
  • Personalization services
  • Full pre-compilation
  • New localization technique
  • Support for 64-bit processors
  • Provider class model
  • Web Sites projects are introduced. An alternative to Web Application project model in earlier versions.
  • ASP.NET AJAX has been introduced as a separate installer. Included ScriptManager, UpdatePanel etc.

ASP.NET 3.5 (November 19, 2007)

This was an incremental update to ASP.NET 2.0 and .NET Framework 2.0. Base level the Runtime was depending on .NET Framework 2.0 and set of additional runtime extension components been introduced in this release.

The interesting features included in this release were:

  • Integrated development support using Visual Studio 2008
  • New data controls (ListView, DataPager, LinqDataSource)
  • ASP.NET AJAX included as part of the framework
  • Support for HTTP pipelining and syndication feeds.
  • WCF support for RSS, JSON, POX and Partial Trust
  • All the .NET Framework 3.5 changes, like LINQ etc.

With .NET Framework 3.5 Service Pack 1, some more features been introduced

  • Integrated development support using Visual Studio 2008 – Service Pack 1
  • Incorporation of ASP.NET Dynamic Data
  • Entity Framework support
  • Support for controlling browser history in an ASP.NET AJAX application
  • Ability to combine multiple JavaScript files into one file for more efficient downloading
  • New namespaces System.Web.Abstractions and System.Web.Routing
  • JQuery is included as part of the template.
  • ASP.NET MVC is born

Now ASP.NET framework is spitted in to three based on the purpose

ASP.NET Core Services – all the major ASP.NET runtime components has been built in to this and will act as a base layer for all other ASP.NET components such as Web Forms, MVC, Dynamic Data etc.

Now we have three Presentation Frameworks/Components that utilizes the ASP.NET Core runtime components

  1. ASP.NET Web Forms – based on traditional ASP.NET web application model – dynamic *.aspx pages with code behind file.
  2. ASP.NET MVC – based on MVC model – *.aspx pages for View, no code behind file. Simply depended on Controller and model.
  3. ASP.NET Dynamic data – the quick and easy – rapid application development model with help of LINQ and Entity Framework. ASP.NET Dynamic Data helps you quickly build a fully customizable, data-driven application without writing code. Dynamic Data provides a rich scaffolding framework that is easily extensible by using the traditional ASP.NET programming model.

ASP.NET 4.0 (April 12, 2010)

The .NET Framework version 4 includes enhancements for ASP.NET 4 in targeted areas. Visual Studio 2010 and Microsoft Visual Web Developer Express also include enhancements and new features for improved Web development.

The interesting features included in this release were:

  • Integrated development support using Visual Studio 2010
  • jQuery Included with Web Forms and MVC
  • Content Delivery Network Support
  • Setting Meta Tags with the Page.MetaKeywords and Page.MetaDescription Properties
  • ASP.NET MVC 3.0 with Web Pages and razor support
  • IISExpress Support through Service Pack1
  • and more… You can read about it in detail on the MSDN page What’s New in ASP.NET 4 and Visual Web Developer

 

ASP.NET 4.5 (August 15, 2012)

This was a long awaited release since ASP.NET 4.0, which includes the new improved support for Web Pages, MVC and new Web API support. With the release of .NET Framework 4.5 and Visual Studio 2012, decided to go away from Service Packs and release incremental updates whenever available.

The interesting features included in this release were:

  • Async support – HttpRequest, Response, HTTP Modules and Handlers are capable of handling Async request and responses.
  • AntiXSS library is integrated
  • WebSockets protocol support
  • Lazy request validation
  • ASP.NET Web Forms – Model binding similar to ASP.NET MVC
  • HTML5 support
  • ASP.NET MVC 4, Web Pages 2.0, Web API, ASP.NET MVC 4 – Mobile Web Templates using jQuery Mobile
  • and more… You can read about it in detail on the MSDN page What’s New in ASP.NET 4.5 and Visual Web Developer

ASP.NET and Web Tools 2012.2 update

This .2 update adds a number of new templates and features including:

  • Enhancements to Web Publishing
  • New Web API functionality
  • New templates for Facebook Application and Single Page Application
  • Real-time communication via ASP.NET SignalR
  • Extensionless Web Forms via ASP.NET Friendly URLs
  • Support for the new Windows Azure Authentication
  • and more… You can read about it in detail on the MSDN page What’s New in ASP.NET and Web Tools 2012.2 Update

SignalR

SignalR is a new member of the ASP.NET family that facilitates adding real-time functionality to web applications using WebSockets and other down-level transports. SignalR is a self-contained library installed via NuGet that is targeting a 1.0 RTW as part of the Fall Update. This will include item templates for adding SignalR connections and hubs to an ASP.NET application as well as a full project template that integrates with ASP.NET MVC and ASP.NET Web API.

[ Quoted from http://aspnet.codeplex.com  ]

THE ONE ASP.NET PLATFORM

Now the ASP.NET ecosystem would look as in the image, with 2012.2 release: Single platform – multiple, extensible solutions

All the parts of ASP.NET, all the subsystems are all part of the larger ASP.NET community 

[Image courtesy Scott Hanselman’s blog]

Scott Hanselman of Microsoft Quotes:

The idea behind One ASP.NET is that we want folks to be able to make apps that have real-time components with SignalR, clean, simple APIs with Web API, all in one pages with KnockoutJS, pages with MVC, Web Forms or Web Pages, as well as existing ASP.NET systems like OData, ASMX, and more.

We want open source projects like JSON.NET, KnockoutJS, SignalR, Backbone, MongoDB, Scaffolding, NHIbernate, Ninject (and the list goes on) to all play in the same ASP.NET LEGO sandbox.

We’ll put all these subcomponents on NuGet and they’ll live alongside community components and you’ll be able to build ASP.NET applications starting from some base template and add just the pieces you want. We are getting there. We want folks to use the parts they want, and swap out the parts they don’t. Everything should work together.

ScottGu Quotes
The new runtime functionality is delivered to ASP.NET via additional NuGet packages. This means that installing this update does not make any changes to the existing ASP.NET binaries, and thus does not cause any compatibility issues with existing projects. New projects will contain the new functionality and existing projects can be updated with the new NuGet packages.

You can further read about it through Scott Hanselman’s article and ScottGu’s blog 
 

Conclusion

Now with ASP.NET 4.5 and Updates we reached a place where we have a vast variety of technologies to choose from, to develop rich, dynamic web applications for Desktop browsers as well as for mobile browsers.

ASP.NET Ecosystem is growing and is moving in the right pace with the release to open source development of most of the components through http://aspnet.codeplex.com/ 

It is challenging and interesting for ASP.NET developers to be able to develop using such cutting edge technologies.

Information Sources & Courtesy: Wikipedia, MSDN and Microsoft Developer blogs

HTML5 Definition Complete, W3C Moves to Interoperability Testing and Performance

December 19, 2012 All, ANDROID, Community, CSS, CSS 3, HTML, HTML5, IE, IE10, Internet Explorer 10, iOS, iPhone, JavaScript, JQuery Mobile, KnowledgeBase, Mobile Frameworks, mobile web, Mobile-Development, MSDN, StyleSheets, Web No comments

The World Wide Web Consortium (W3C) has published —  the complete definition of the HTML5 and Canvas 2D specifications on 17 December 2012.

Quoting from the announcement here

  • Though not yet W3C standards, these specifications are now feature complete, meaning businesses and developers have a stable target for implementation and planning.

  • HTML5 is the cornerstone of the Open Web Platform, a full programming environment for cross-platform applications with access to device capabilities; video and animations; graphics; style, typography, and other tools for digital publishing; extensive network capabilities; and more.

W3C also announced today the first draft of HTML 5.1 and Canvas 2D, Level 2, an early view of the next round of standardization.

To reduce browser fragmentation and extend implementations to the full range of tools that consume and produce HTML, W3C now embarks on the stage of W3C standardization devoted to interoperability and testing (called "Candidate Recommendation"). Expecting the broad HTML5 Interoperability in 2014.

During this stage, the W3C HTML Working Group will conduct a variety of activities to ensure that the specifications may be implemented compatibly across browsers, authoring tools, email clients, servers, content management systems, and other Web tools.

  • The group will analyze current HTML5 implementations, establish priorities for test development, and work with the community to develop those tests.

  • The HTML Working Group has planned for this implementation phase to last into mid-2014, after which W3C expects to publish the final HTML5 Recommendation, available Royalty-Free to implementers under the W3C Patent Policy.

Sencha(Leading cross platform mobile framework product developer) – has published a blog on HTML5 readiness here

Quoting from Sencha’s report

Feature Standardization Status:

A long list of major HTML5 technologies has now reached advanced stages of standardization.

Here is a list of just some of the big technologies in advanced standardization status with the date of the most recent standard:

Candidate Recommendation:

  • CSS Multi-column (2011)
  • CSS Flexbox (2012)
  • CSS Values & Units 3 (2012)
  • CSS Backgrounds and Borders 3 (2012)
  • CSS Images & Replaced Content 3 (2012)
  • CSS Style Attributes (2010)
  • Web Storage (2011)
  • Web Sockets (2012)
  • Web Workers (2012)
  • Web Messaging (2012)
  • Touch Events

Proposed Recommendation

  • Geolocation (2012)

Full Recommendation

  • CSS Media Queries (2012)
  • CSS Selectors 3 (2011)
  • CSS Namespaces (2011)
  • CSS Color 3 (2011)
  • Media Fragments (2012)
  • SVG 1.1 (2nd Ed) (2011)

HTML5 Feature Implementation Progress in Browsers

The very good news is that HTML5 and CSS3 implementations across all major browsers on desktop and mobile have become increasingly convergent. The chart below shows the progress of HTML5 feature implementation across major desktop and mobile browsers in the last three years using the HTML5test.com scoring methodology.

Adoption on Desktop Browsers

HTML5 Support on Dektop Browser

Adoption on Mobile Browsers

HTML5 Support on Mobile Browser

HTML5 features have been rapidly adopted by all major browsers – with Internet Explorer’s progress on both mobile and desktop being particularly impressive. The feature implementation ramp from IE8 in 2010 to IE9 in 2011 to IE10 this year has been very steep.

Information Sources:

http://www.sencha.com/blog/html5-progress-report

http://www.html5test.com

http://www.w3.org/2012/12/html5-cr

Great News! for all Mobile and Web Developers

HTML5 – Bye Bye ‘WebSQL’/’SQLite’ – Welcome ‘IndexedDB’

December 18, 2012 All, ANDROID, Community, CSS, CSS 3, HTML, HTML5, IE, IE10, Internet Explorer 10, Internet Explorer 9, iOS, iPhone, JavaScript, JQuery Mobile, KnowledgeBase, Mobile-Development, MSDN, Web, Windows Phone, Windows Phone 8 No comments

Since November 18, 2010, the W3C announced that Web SQL database(Sqlite) is a deprecated specification. This is a recommendation for web developers to no longer use the technology as effectively, the spec will receive no new updates and browser vendors aren’t encouraged to support this technology. The new alternative is IndexedDB which is already available on Chrome 12+ and Firefox 5+, and, soon, in IE 10 as well.

The new web database standards adoption progress report as per Html5Test.com – how standards setting can work well.

  • WebKit browsers originally shipped a copy of the SQLite — an embedded relational database — and then proposed “WebSQL” as a specification to standardize it.
  • Mozilla objected to its standardization on the grounds that the SQL 92 standard was a poor basis for a web standards technology, and that an implementation (SQLite) shouldn’t be the basis for standard.
  • As a result, WebSQL standardization was abandoned in favor of a new database standard, IndexedDB which is now the standard database of record for all major browsers.
  • Firefox, IE and Chrome now support IndexedDB on the desktop.
  • Chrome for Android is the first browser to support it on mobile devices.
Category WebSQL IndexedDB
Advantages A real, relational database implementation on the client (SQLite). * Allows fast indexing and searching of objects, so in a web application scenario, you can manage your data and read/write it fast.
* A NoSQL database that let you work with your JavaScript objects and indexing them based on your application needs.
* Works in asynchronous mode with moderately granular locking per transaction. This allows you to work inside the event-driven module of JavaScript.
Disadvantages * The spec is deprecated.
* Overhead of SQL language you need to master and transform your JavaScript objects into relational schema
* Not object driven		 Harder to understand if you are coming from the world of relational databases.
Location Tables contain columns and rows objectStore contains Javascript objects and keys
Query Mechanism SQL Cursor APIs, Key Range APIs, and Application Code
Transaction Lock can happen on databases, tables, or rows on ‘readwrite’ transactions Lock can happen on database ‘versionchange’ transaction, on an objectStore ‘readonly’ and ‘readwrite’ transactions.
Transaction Commits Transaction creation is explicit. Default is to rollback unless we call commit. Transaction creation is explicit. Default is to commit unless we call abort or there is an error that is not caught.

Ref Link:

http://www.w3.org/TR/IndexedDB/

http://www.html5rocks.com/en/tutorials/webdatabase/websql-indexeddb/

http://www.steveworkman.com/html5-2/standards/2011/the-limitations-of-websql-and-offline-apps/

http://www.html5rocks.com/en/tutorials/indexeddb/todo/

http://html5test.com/compare/feature/storage-sqlDatabase.html ( WebSQL – Current Support on browsers)

http://html5test.com/compare/feature/storage-indexedDB.html ( IndexDB – Current Support on browsers)

jQuery Mobile 1.1.0 Final Released!

April 15, 2012 All, HTML, HTML5, JavaScript, jQuery, JQuery Mobile, Mobile Frameworks, mobile web, Mobile-Development No comments

Jquery team has released final version of Jquery Mobile 1.1.0. 

jQuery Mobile is a touch-optimized web framework (additionally known as a JavaScript library or a mobile framework) currently being developed by the jQuery project team. The development focuses on creating a framework compatible with a wide variety of smartphones and tablet computers, made necessary by the growing but heterogeneous tablet and smartphone market. The JQuery Mobile framework is compatible with other mobile app frameworks and platforms such as PhoneGap, Worklight and more.

[Wikipedia]

Jquery Mobile 1.1.0 improvements  are true fixed toolbars, completely re-vamped animated page transitions and AJAX loader, refined form element design and feature set, and improved documentation

Read through the release announcement http://jquerymobile.com/blog/2012/04/13/announcing-jquery-mobile-1-1-0/  for more details on this updated release.

Mobile Application Development

April 7, 2012 All, ANDROID, CSS 3, HTML, HTML5, iOS, iPhone, JavaScript, JQuery Mobile, Mobile Frameworks, Mobile SDK, mobile web, Mobile-Development, Windows Mobile, Windows Phone, Windows Phone 7 1 comment , , , , , , , , , , , , , ,

Mobile Applications are rapidly developing segment in the global mobile sector. Developing mobile applications targeting different mobile platforms such as Windows Phone, iOS, Android, Blackberry and Bada(Samsung’s Proprietary OS) is the trend setter now.

Quoting from Wikipedia

Mobile application development is the process by which application software is developed for small low-power handheld devices such as personal digital assistants, enterprise digital assistants or mobile phones or smart phones. These applications are either pre-installed on phones during manufacture, downloaded by customers from various mobile software distribution platforms, or web applications delivered over HTTP which use server-side or client-side processing (e.g. JavaScript) to provide an "application-like" experience within a Web browser.

[Wikipedia]

Why is it so different from other application development?

Or

Why do we need to give special care when doing mobile development?

Mobile devices have certain limitations in terms of hardware, they have limited screen display, limited space for applications to operate and network capabilities. These limitations will vary in different models as the Mobile ecosystem is very large and there is innumerous amount of devices in the world. So we need to give special care in developing the mobile applications ensuring the compatibility across all the platforms.

Some of the things we need to consider when we do mobile development are:

  • Small screen size and mobile ecosystem – This makes it difficult or impossible to see text and graphics dependent on the standard size of a desktop computer screen.
  • Lack of windows/ multi-tasking – On a desktop computer, the ability to open more than one window at a time allows for multi-tasking and for easy revert to a previous page. Historically on mobile web, only one page can be displayed at a time, and pages can only be viewed in the sequence they were originally accessed. Latest mobile platform releases such as iOS, Android and Windows Phone are supporting multi tasking capability, which allows you to run more than one applications parallel, yet only one application can be displayed on the screen.
  • Navigation – Most mobile devices do not use a mouse like pointer, but rather simply an up and down function for scrolling or touch inputs, thereby limiting the flexibility in navigation.
  • Hardware and Resource limitation – all the upcoming mobile devices are having Dual Core or Quad core mobile processors with decent amount of memory. But still if you need you device to function well and be responsive, you should develop application in such a way it will be using low memory foot print.
  • Targeting Or Supporting wide variety Mobile Platforms/ Execution environments – this is the most complicated or important feature set we should be taking in to consideration when developing an application. Android, iOS, BlackBerry, HP webOS, Symbian OS, Bada from Samsung, and Windows Mobile support typical application binaries as found on personal computers with code which executes in the native machine format of the processor (the ARM architecture is a dominant design used on many current models).

Also read this article on 7 Limitations when designing for mobile: http://baymard.com/blog/mobile-design-limitations 

For Technical point of view we can differentiate mobile applications in to three categories

1. Native Applications

Native applications developed against native platform APIs and It would be having full(or limited for some platforms) access to the device capabilities. Each of the platforms for mobile applications also has an integrated development environment which provides tools to allow a developer to write, test and deploy applications into the target platform environment.

Examples are using Applications developed using Native/Platform Mobile SDK’s such as iOS SDK, Android SDK, Windows Phone SDK etc.  Windows Mobile, Android, HP webOS and iOS offer free SDKs and integrated development environments to developers. These applications will be able to utilize or interact with all device capabilities.

 

Five reasons for developing Native Applications:

  • Performance
  • Offline Mode
  • Findability / Discoverability ( through a central location such as Apple’s AppStore , Google’s Market, Windows Phone Market etc)
  • Device Attributes
  • Monetization

The disadvantage is obviously the development cost. No two mobile platforms can share the same mobile application, and there are too many Mobile operating systems (or platforms) existing in the market. If you develop a mobile application to market it widely, you need to develop that in  Symbian, Mac iPhone, Android, Blackberry and Windows mobile.

2. Mobile Web Applications  / Browser based Applications

Mobile Web applications are web sites that are scaled down/optimized to display on a mobile web browser. Mobile web applications are developed in such a way keeping in mind less payload delivery per each request. These applications are typically a scale down version of actual website which you can browse over any desktop browser such as Internet Explorer, Chrome, Firefox and Opera.

Every action mobile web application makes a round trip to server.

The advantages of having mobile web application is that:

  • Server Driven – we have full control on the website. and we can customize it any time, so that user will get the latest look and feel.
  • Targeting multiple platforms & connectivity – most of the mobiles and smartphones have a browser.  One-third of humankind currently has access to the Internet through a mobile device. That makes it easy to deliver our applications in any platform.
  • It enables services to take advantage of mobile device capabilities such as clicking on a phone number to call it or add it to the device address book. It can provide location-sensitive content. Location technologies can enable location-sensitive information be provided to a user. This can reduce the steps required for the user to reach useful content, and so makes it accessible with the least amount of effort.
  • For users, they don’t have to download an application or any maintenance updates, but instead “call up” a URL via their mobile browser which instantly delivers the most up-to-date application to their device.
  • Cross platform compatibility.
  • low development cost.

and the disadvantage is the bandwidth limitations and the limitations of Mobile websites, which does not access your Phone’s components like your Address book, Camera, etc.

The Mobile Web refers access to the world wide web, i.e. the use of browser-based Internet services, from a handheld mobile device, such as a smartphone, a feature phone or a tablet computer, connected to a mobile network or other wireless network.

Traditionally, access to the Web has been via fixed-line services on large-screen laptops and desktop computers. The shift to mobile Web access has been accelerating with the rise since 2007 of larger multitouch smartphones, and of multitouch tablet computers since 2010.

Both platforms provide better Internet access and browser- or application-based user Web experiences than previous generations of mobile devices have done.

Mobile Web access today still suffers from interoperability and usability problems. Interoperability issues stem from the platform fragmentation of mobile devices, mobile operating systems, and browsers. Usability problems are centered around the small physical size of the mobile phone form factors (limits on display resolution and user input/operating). 

[Wikipedia]

3. Hybrid Mobile Applications

Hybrid Mobile Applications are Applications that use BOTH browser interfaces and native mobile components. With HTML5 and JavaScripts, now the browsers are becoming capable of accessing a phone’s built in features like contacts, camera etc.

There are mobile frameworks based on HTML5 and JavaScript’s that would be able to access the device features such as Accelerometer, Compass, Contacts, Camera and device file system etc. Some popular such mobile frameworks are PhoneGap, Appcelerator’s Titanium etc. These frameworks helps in developing applications that would able to target most of the mobile platforms such as “iOS”, “Android”, “Windows Phone”, “Symbian” and “Blackberry”.

Appcelerator Titanium is a platform for developing mobile, tablet and desktop applications using web technologies.

Key to successful Hybrid Apps:

  • Make the experience feel like a native application.
  • Take advantage of the enhanced features.
  • Don’t simply release a hybrid version of the mobile web site.
  • Optimize performance

 

Mobile world is growing and you can see lots of opportunities for innovation. If you are a fan of building mobile applications go ahead and develop something that is in your dreams and leave it over to the rest of the world to carry forward.

 

Resources for Developing mobile applications:

PhoneGap (was called by the name Apache Callback, but now Apache Cordova) is an open-source mobile development framework produced by Nitobi, purchased by Adobe Systems. It enables software programmers to build applications for mobile devices using JavaScript, HTML5 and CSS3, instead of lower-level languages such as Objective-C. The resulting applications are hybrid, meaning that they are neither truly native (all layout rendering is done via the webview instead of the platform’s native UI framework) nor purely web based (they are not just web apps but packed for appstore distribution, and have access to part of the device application programming interface).

http://phonegap.com/ 

 

Appcelerator Titanium is a platform for developing mobile, tablet and desktop applications using web technologies. Appcelerator Titanium is developed by Appcelerator Inc.

Appcelerator Titanium Mobile is one of several phone web based application framework solutions allowing web developers to apply existing skills to create native applications for iPhone and Android. Yet, while using the familiar JavaScript syntax, developers will also have to learn the Titanium API, which is quite different from familiar web frameworks such as jQuery.

http://www.appcelerator.com/ 

 

Android Application Development: http://developer.android.com/index.html

Apple iOS Application Development: https://developer.apple.com/

Windows Phone Development: http://create.msdn.com/en-US/

http://msdn.microsoft.com/en-us/library/ff402535(v=vs.92).aspx

Blackberry Application Development:  https://bdsc.webapps.blackberry.com/devzone/

Bada Development: http://developer.bada.com

Symbian Development: http://www.developer.nokia.com/Devices/Symbian/

HP WebOS Development: https://developer.palm.com/

 

jQuery Mobile: Touch-Optimized Web Framework for Smartphones & Tablets

http://jquerymobile.com/ 

Sencha Touch: Sencha Touch was the first HTML5 mobile JavaScript framework for web applications that feel native on Android, BlackBerry, and iOS.
http://www.sencha.com/products/touch 

and more…

and some interesting learning resources

http://baymard.com/blog/responsive-web-design

Beginning HTML5 Development with Visual Studio 2010

January 3, 2012 .NET, .NET Framework, All, ASP.NET, ASP.NET MVC, ASP.NET MVP, CSS, CSS 3, HTML, HTML5, jQuery, JQuery Mobile, Microsoft, Mobile-Development, VisualStudio, VS2008, VS2010 3 comments

Recently I was doing some research works on HTML5 development using ASP.NET  on Visual Studio 2010.  Really liked the cool features HTML5, CSS3 and Javascript API’s. Major part of my research was around building mobile web applications using jQuery Mobile and Responsive Web.

Quick Intro of HTML5

  • HTML5 will be the new standard for HTML, XHTML, and the HTML DOM.
  • The previous version of HTML came in 1999. The web has changed a lot since then.
  • Today, some elements in HTML 4.01 are obsolete, never used, or not used the way they were intended to. These elements are deleted or re-written in HTML5.
  • HTML5 is still a work in progress. However, most modern browsers have some HTML5 support.
  • HTML5 is a cooperation between the World Wide Web Consortium (W3C) and the Web Hypertext Application Technology Working Group (WHATWG).
  • WHATWG was working with web forms and applications, and W3C was working with XHTML 2.0. In 2006, they decided to cooperate and create a new version of HTML.

Some rules for HTML5 were established:

  1. New features should be based on HTML, CSS, DOM, and JavaScript
  2. Reduce the need for external plugins (like Flash)
  3. Better error handling
  4. More markup to replace scripting
  5. HTML5 should be device independent
  6. The development process should be visible to the public

and that’s  enough about HTML5.

If you are not aware of HTML5, you can read more about HTML5 later through the below links

http://dev.w3.org/html5/spec/Overview.html

http://en.wikipedia.org/wiki/HTML5

http://www.w3schools.com/html5/default.asp

Coming to jQuery Mobile…

  • jQuery Mobile, is a framework that will help you rapidly and confidently develop mobile app user interfaces across popular mobile device platforms like iOS and Android, is perhaps the most popular project out there.
  • The framework boasts a lightweight code base (weighing in at 20KB when minified and gzipped) and a huge bevy of standard user interface elements that mobile device users are accustomed to, such as switches and sliders.
  • JQuery Mobile, hails from a royal family of frameworks and spawned from community of jQuery, the most famous cross platform JS library.
  • Works great with mobile browsers from Symbian, Android through iOS to Blackberry, Window Phone 7, WebOS.
  • Visit http://jquerymobile.com for more details

JQueryMobile has been included as a standard binary include in upcoming ASP.NET MVC 4.0 by Microsoft.

Okey, that was little bit over talk about jQuery Mobile :-), lets look at the point I want to make.

Recent months there is an increasing trend of mobile web applications using HTML5, as most of the recent mobile browsers supports partially or up to certain level on HTML5 capabilities. The idea is that Multi Platform targeted mobile web application development.

 

To enable HTML5 syntax intelli- sense in Visual Studio 2010 we have the following options to try

1.) Visual Studio 2010 Service Pack 1 – Visual Studio 2010 was originally released without HTML5 support, so does SP1 finally add support for it, to some extent.

The entire HTML5 specification isn’t supported but most of the new elements and attributes are. That means you get both intellisense and validation for HTML5 with SP1.

2.) HTML 5 Intellisense for Visual Studio 2010 and 2008 Extension from  Mikhail Arkhipov (Microsoft)

Since Visual Studio 2010 doesn’t have complete support for all HTML5 and CSS3 syntax’s we can try this add-in to enable the support in Visual Studio 2010 and 2008.

3.) Web Standards Update for Visual Studio 2010 SP1

Web Platform and Tools team, spearheaded by Mads Kristensen  has released this update in Visual Studio Gallery. This adds better support for HTML5, CSS3 and new JavaScript features to ALL versions of Visual Studio.

Web Standards Update provides the much wanted HTML5 & CSS3 support to Visual Studio 2010 SP1. It brings VS 2010 intellisense & validation as close to W3C specification as we could get via means of an extension.  The most notable supported features by this extension are:

HTML5 – Video, Audio, Input Type, Drag & Drop, WAI-ARIA, Microdata, Schema.org
Browser API – GeoLocation & Local Storage
CSS3 – 2D Transforms, 3D Transforms, Animations, Background & Borders, Basic Box Model, Basic UI, Behavior, Color, Flexible Box Layout, Fonts, Paged Media, Hyperlink Presentation, Line, Lists, Marquee, Media Queries, Multi Column, Namespaces, Presentation Levels, Ruby, Selectors, Speech, Syntax, Template Layout, Text & Transitions. It also supports vendor specific prefixes like -ms, -webkit & -moz.

Refer to  Scott Hanselman’s blog for more detailed update : http://www.hanselman.com/blog/AnnouncingTheWebStandardsUpdateHTML5SupportForTheVisualStudio2010Editor.aspx

Get Web Standards Update for Microsoft Visual Studio 2010 SP1

4.) A Little Old Way 

To enable Intellisense to work with HTML 5, perform the following steps:

  1. Download the HTML5 support package for Visual Studio 2008 from the Visual Web Developer team here.
  2. Copy the html_5.xsd in C:Program Files (x86)Microsoft Visual Studio 10.0Common7Packagesschemashtml
  3. Edit the correct registry file and replace 9.0 with 10.0
    The file will look like this ( 64 bit VS 2010 Ultimate for me ):

Windows Registry Editor Version 5.00

[HKEY_LOCAL_MACHINESOFTWAREWow6432NodeMicrosoftVisualStudio10.0Packages{1B437D20-F8FE-11D2-A6AE-00104BCC7269}SchemasSchema 23]
“File”=”htmlhtml_5.xsd”
“Friendly Name”=”HTML 5”
“URI”=”http://schemas.microsoft.com/intellisense/html-5”

  1. Run the registry file to merge it with your registry.
  2. Open Visual Studio 2010
  3. Go to Tools->Options->Text Editor->HTML->Validation
  4. Select target as HTML 5

This would allow you to get Intellisense for your HTML 5 based projects.

referenced from http://amargalla.com/Blog/general/169-html-5-with-visual-studio-2010

Not only that Visual Studio Gallery is having lots of cool Extensions such as Mobile Ready Templates using HTML5, and other extension templates you could try.  Some of them are….

Mobile Ready HTML5 MVC.NET

Creates a mobile ready MVC 3.0 project using the Razor’s view engine and jQuery mobile. Both mobile and desktop versions can be tested using mobile emulators or browsers.

CSS 3 Intellisense Schema

jQuery Mobile Site

Yet another Mobile Ready ASP.NET MVC Template. Use this MVC 3 Razor Site Template with jQuery Mobile boilerplate layout, scripts and CSS referenced to create adaptable websites for a variety of devices.

So we do have wide variety of ways we can enable HTML5 support when using Visual Studio 2010. Of course we already having HTML5 support included with ASP.NET MVC 3.0 Tools Update,  but the above options will help us in enabling Intellisense support for normal ASP.NET applications as well. 

Hope this will help you with your HTML5 development..

Happy Coding !!!