mozilla

Revision 474955 of Developing app functionality

  • Revision slug: Web/Apps/Quickstart/Build/Developing_app_functionality
  • Revision title: Developing app functionality
  • Revision id: 474955
  • Created:
  • Creator: chrisdavidmills
  • Is current revision? No
  • Comment

Revision Content

We have already looked at developing web apps — in Your first app we reviewed the basic code steps required to make an app installable, talked about different open web app types, and said a few words about Web APIs and permissions required to use certain device APIs. Read it first if you've not already done so. In this article we talk about the types of functionality you might want to implement in a bit more detail.

Open web technologies

Open web apps are no different to normal web sites/pages in terms of how you code functionality. They run on regular open web technologies, all of whihc you can find detailed documentation for on this site, for example:

There are a few differences here and there. A manifest.webapp file is required to define app information such as permissions, locales, icons, etc., and there are a variety of special APIs available to allow you to implement install functionality, charge money for your apps, and access device features such as contacts, battery status and device storage. Note that some of the APIs we've implemented are not yet W3C standards, but we are aiming to standardize them as soon as we can.

You can find a list of APIs and required permissions at App permissions, and a more general index of all API interfaces.

App center development pages

MDN contains a whole wealth of guides and reference docs to teach you about just about any front end web technology you want to use. However, in addition to all the other information we have included some special development pages in the app center. First of all we have several reference apps, including developer walkthroughs, source code and other information. You can feel free to download, install, play with and modify them, with the aim of learning by experimentation.

Next, we have a variety of

Revision Source

<p>We have already looked at developing web apps — in <a href="/en-US/docs/Web/Apps/Quickstart/Build/Your_first_app">Your first app</a> we reviewed the basic code steps required to make an app installable, talked about different open web app types, and said a few words about Web APIs and permissions required to use certain device APIs. Read it first if you've not already done so. In this article we talk about the types of functionality you might want to implement in a bit more detail.</p>
<h2>Open web technologies</h2>
<p>Open web apps are no different to normal web sites/pages in terms of how you code functionality. They run on regular open web technologies, all of whihc you can find detailed documentation for on this site, for example:</p>
<ul>
  <li><a href="/en-US/docs/Web/Guide/HTML/HTML5">HTML5</a></li>
  <li><a href="/en-US/docs/Web/CSS">CSS</a></li>
  <li><a href="/en-US/docs/JavaScript">JavaScript</a></li>
  <li><a href="/en-US/docs/HTML/Canvas">Canvas</a></li>
  <li><a href="/en-US/docs/AJAX">Ajax</a></li>
  <li><a href="/en-US/docs/HTML/Using_the_application_cache">Offline resources in Firefox</a></li>
  <li><a href="/en-US/docs/Web/Guide/DOM/Storage">DOM Storage</a></li>
  <li><a href="/en-US/docs/IndexedDB">IndexedDB</a></li>
  <li><a href="/en-US/docs/DragDrop/Drag_and_Drop">Drag and drop</a></li>
</ul>
<p>There are a few differences here and there. A <a href="/en-US/docs/Web/Apps/Manifest"><code>manifest.webapp</code></a> file is required to define app information such as permissions, locales, icons, etc., and there are a variety of special APIs available to allow you to implement <a href="/en-US/docs/Web/API/Apps.installPackage">install</a> functionality, <a href="/en-US/docs/Web/Apps/Quickstart/Build/Payments">charge money for your apps</a>, and access device features such as <a href="/en-US/docs/WebAPI/Contacts">contacts</a>, <a href="/en-US/docs/WebAPI/Battery_Status">battery status</a> and <a href="/en-US/docs/WebAPI/Device_Storage">device storage</a>. Note that some of the APIs we've implemented are not yet W3C standards, but we are aiming to standardize them as soon as we can.</p>
<p>You can find a list of APIs and required permissions at <a href="/en-US/docs/Web/Apps/App_permissions">App permissions</a>, and a more general <a href="/en-US/docs/Web/API">index of all API interfaces</a>.</p>
<h2>App center development pages</h2>
<p>MDN contains a whole wealth of guides and reference docs to teach you about just about any front end web technology you want to use. However, in addition to all the other information we have included some special development pages in the app center. First of all we have several <a href="/en-US/docs/Web/Apps/Reference_apps">reference apps</a>, including developer walkthroughs, source code and other information. You can feel free to download, install, play with and modify them, with the aim of learning by experimentation.</p>
<p>Next, we have a variety of</p>
Revert to this revision