mozilla

Revision 528211 of Building Web apps

  • Revision slug: Web/Apps/Build
  • Revision title: Building Web apps
  • Revision id: 528211
  • Created:
  • Creator: chrisdavidmills
  • Is current revision? No
  • Comment

Revision Content

{{ draft() }}

In this section of content we'll introduce you to the topic of developing Open Web Apps, and the areas we think are most vital for you to concentrate on when building apps that will not only work across different browsers and devices, but also work well when installed on platforms such as Firefox OS.

App development topics

Installable apps
App installation and management APIs, manifest files, packaged and hosted apps, handling API permissions.
Basic data flow
Setting up the data flow through your application, HTTP basics, Ajax.
Gather and modify data
Retrieving data from files, device hardware (e.g. battery, proximity, light sensor) and key services (e.g. camera, contacts).
Control data display and feedback
Full screen, orientation, system notifications, alarms, vibration.
Implement user input and control mechanisms
Mouse, keyboard, pointer lock, touch inputs, drag and drop, and more.
Work offline
appCache, localStorage, and IndexedDB.
Manipulate media
Video, audio, and images.
Advanced network communication
CORS, system Ajax, WebRTC, Web sockets.
Play games
Special considerations for game app developers, above and beyond the basics of Web app development, can be found in our Game development zone.
Utilize User services
Here we look at APIs designed to facilitate common user services, such as taking payments and login functionality.
Canvas and WebGL
Best practices for using HTML5 canvas and WebGL for web-based 2D and 3D graphics.
Location
Advice for creating location-based applications.

FAQ

App development FAQ
This FAQ is a compilation of answers to all the common app development questions received every week by our Business Development and Partner Engineering teams.

Other key topics

Porting
Advice, tips and techniques for those wishing to porting existing apps over to the open web platform, including native apps and web-related platforms such as Chrome apps.
Performance
Articles about making your web apps more performant.
Web apps architecture
An overview of the architecture behind the Open Web Apps project's design and implementation. NOT SURE IF WE NEED THIS ANYMORE; WE DO WANT AN APP LIFECYCLE DOCUMENT, WHICH SOME OF THIS CONTENT COULD BE REUSED IN.
Templates and components
In this section of our apps docs, we discuss the different templates and components available to speed up app structural development.
Validating web apps with the App Validator
The Apps Validator is a tool designed to scan open web apps for problems and invalid code. By using a combination of various techniques and detection mechanisms, the validator is capable of being both efficient as well as thorough. This article explains how to use it. THIS MAY WELL GO INTO THE TOOLS TOP LEVEL ITEM

 

Revision Source

<p>{{ draft() }}</p>
<div class="summary">
 <p dir="ltr">In this section of content we'll introduce you to the topic of developing Open Web Apps, and the areas we think are most vital for you to concentrate on when building apps that will not only work across different browsers and devices, but also work well when installed on platforms such as Firefox OS.</p>
</div>
<div class="row topicpage-table">
 <div class="section">
  <h2 id="App_development_topics">App development topics</h2>
  <dl>
   <dt>
    <a href="/en-US/docs/Web/Apps/Build/installable_apps" title="/en-US/docs/Web/Apps/Developing/installable_apps">Installable apps</a></dt>
   <dd>
    App installation and management APIs, manifest files, packaged and hosted apps, handling API permissions.</dd>
   <dt>
    <a href="/en-US/Apps/Build/Basic_data_flow">Basic data flow</a></dt>
   <dd>
    Setting up the data flow through your application, HTTP basics, Ajax.</dd>
   <dt>
    <a href="/en-US/docs/Web/Apps/Build/gather_and_modify_data" title="/en-US/docs/Web/Apps/Developing/gather_and_modify_data">Gather and modify data</a></dt>
   <dd>
    Retrieving data from files, device hardware (e.g. battery, proximity, light sensor) and key services (e.g. camera, contacts).</dd>
   <dt>
    <a href="/en-US/docs/Web/Apps/Build/Control_the_display" title="/en-US/docs/Web/Apps/Developing/Control_the_display">Control data display and feedback</a></dt>
   <dd>
    Full screen, orientation, system notifications, alarms, vibration.</dd>
   <dt>
    <a href="/en-US/Apps/Build/User_input_methods">Implement user input and control mechanisms</a></dt>
   <dd>
    Mouse, keyboard, pointer lock, touch inputs, drag and drop, and more.</dd>
   <dt>
    <a href="/en-US/docs/Web/Apps/Developing/offline" title="/en-US/docs/Web/Apps/Developing/offline">Work offline</a></dt>
   <dd>
    appCache, localStorage, and IndexedDB.</dd>
   <dt>
    <a href="/en-US/docs/Web/Apps/Build/Manipulating_media" title="/en-US/docs/Web/Apps/Developing/Manipulating_media">Manipulate media</a></dt>
   <dd>
    Video, audio, and images.</dd>
   <dt>
    <a href="/en-US/Apps/Build/Advanced_network_communication">Advanced network communication</a></dt>
   <dd>
    CORS, system Ajax, WebRTC, Web sockets.</dd>
   <dt>
    <a href="/en-US/docs/Games">Play games</a></dt>
   <dd>
    Special considerations for game app developers, above and beyond the basics of Web app development, can be found in our Game development zone.</dd>
   <dt>
    <a href="/en-US/docs/Web/Apps/Build/User_services" title="/en-US/docs/Web/Apps/Developing/User_services">Utilize User services</a></dt>
   <dd>
    Here we look at APIs designed to facilitate common user services, such as taking payments and login functionality.</dd>
   <dt>
    Canvas and WebGL</dt>
   <dd>
    Best practices for using HTML5 canvas and WebGL for web-based 2D and 3D graphics.</dd>
   <dt>
    Location</dt>
   <dd>
    Advice for creating location-based applications.</dd>
  </dl>
 </div>
 <div class="section">
  <h2 id="FAQ">FAQ</h2>
  <dl>
   <dt>
    <a href="/en-US/Apps/Developing/App_development_FAQ">App development FAQ</a></dt>
   <dd>
    This FAQ is a compilation of answers to all the common app development questions received every week by our Business Development and Partner Engineering teams.</dd>
  </dl>
  <h2 id="Other_key_topics">Other key topics</h2>
  <dl>
   <dt>
    <a href="/en-US/Apps/Build/Porting">Porting</a></dt>
   <dd>
    Advice, tips and techniques for those wishing to porting existing apps over to the open web platform, including native apps and web-related platforms such as Chrome apps.</dd>
   <dt>
    <a href="/en-US/Apps/Build/Performance">Performance</a></dt>
   <dd>
    Articles about making your web apps more performant.</dd>
   <dt>
    <a href="https://developer.mozilla.org/en-US/docs/Web/Apps/Architecture">Web apps architecture</a></dt>
   <dd>
    An overview of the architecture behind the Open Web Apps project's design and implementation. NOT SURE IF WE NEED THIS ANYMORE; WE DO WANT AN APP LIFECYCLE DOCUMENT, WHICH SOME OF THIS CONTENT COULD BE REUSED IN.</dd>
   <dt>
    <a href="https://developer.mozilla.org/en-US/docs/Web/Apps/Developing/Templates_and_components">Templates and components</a></dt>
   <dd>
    In this section of our apps docs, we discuss the different templates and components available to speed up app structural development.</dd>
   <dt>
    <a href="https://developer.mozilla.org/en-US/Apps/Developing/App_Validator">Validating web apps with the App Validator</a></dt>
   <dd>
    The Apps Validator is a tool designed to scan open web apps for problems and invalid code. By using a combination of various techniques and detection mechanisms, the validator is capable of being both efficient as well as thorough. This article explains how to use it. THIS MAY WELL GO INTO THE TOOLS TOP LEVEL ITEM</dd>
  </dl>
 </div>
</div>
<p>&nbsp;</p>
Revert to this revision