Developing Web Apps: Getting Started

Web apps do not differ much from traditional web applications, except for three details:

• Can be installed on the local device (mobile, tablet, desktop)
• Can be performed offline
• Have access to APIs and manipulate local device capabilities like camera, accelerometer, GPS, etc.

In addition, web apps are written with open and responsive technologies that are based on the triad HTML5, CSS3 and JavaScript. Thus it is possible, for example, run a web application on an Android device like a native application with access to resources that the machine offers!
But what is the magic behind it all?
Some mobile operating systems, such as Firefox OS, perform the web apps directly. Others like Android and iOS, require applications to be packaged in any form and compiled with specific APIs so they can be installed and run.
Anyway, web apps can not be written without discretion. They must follow certain patterns that involve, for example:

• HTML5/CSS3 specific code design patterns that fit the various screen resolutions (responsive design);
• Possible to be performed offline;
• Support 'touch';
• Standards and conventions dictated by each platform.

Below we examine some tools, libraries and frameworks that help in the development of web apps, among IDEs, libraries, frameworks, and other resources.
IDEs with support for HTML5
NetBeans is undoubtedly one of the best HTML editors to develop apps. It has extensive support for HTML5, CSS3, JavaScript and other languages. Furthermore, it comes with a built-in WEB server and many facilities for debugging and automatic integration with various JavaScript libraries.
Sublime Text: this editor has one of the best implementations of the feature "Auto Completion" I've ever seen. Also has a new feature: The "minimap", which presents a miniaturization of the entire source code, making navigation easier.
NotePad++ and Eclipse are two other excellent options for editing HTML code.
JavaScript libraries for general use
HTML5 Boilerplate is a set of best practices and HTML / CSS / JavaScript settings for creating responsive websites that includes features such optimizations, reconciliations cross-browser, compression and so on. There is also the Mobile Boilerplate version.
JQuery Mobile is a touch version of consecrated JavaScript library compatible with a wide variety of mobile and desktop browsers. See also other alternatives: Zepto and JQTouch.
oCanvas is a JavaScript library that greatly facilitates the handling of HTML5 CANVAS object-oriented manner. It has also supported Mobile.
Buzz allows easy manipulation of the HTML element SOUND.
Hammer a library that implements multi-touch support in their applications.
Frameworks for game development
Construct2 is a complete environment for creating games consists of a JavaScript framework and an IDE. The schedule is totally visual, via drag-and-drop, in a logic-based events and behaviors. Game Maker and Game Salad are other software that follow the same line of approach.
Crafty provides a framework for building HTML5 games. Among its features are: cross browser, choice of Canvas or DOM maps sprites, collision detection and modularization. Quintus, EnchantJS and ImpactJS are other software in the same category.
Hybrid Mobile Frameworks
Are frameworks that act as a bridge between the web app and the device, which can be Android, Windows Phone, Apple, etc..
PhoneGap allows you to create cross-platform native apps using HTML5, CSS3 and JavaScript triad, but with access to own the various mobile devices such as the accelerometer, camera, compass, geo-location, sound files and other resources. Their "rivals" are: CocoonJs and Intel XDK.
Frameworks for servers
Node.js is a server JavaScript (!!!) That, properly packaged, enables run your web app as a desktop application! That's right, an executable windows, Linux, Mac or any other OS which run the Node.js
That's all. I hope this information will help them create their first web application running on various mobile devices.