Développement d'Applications pour les développeurs Web

  • Raccourci de la révision : Applications/Pour_développeurs_web
  • Titre de la révision : Démarrer quand on est développeur web
  • ID de la révision : 266209
  • Créé :
  • Créateur : teoli
  • Version actuelle ? Non
  • Commentaire page display name changed to 'Démarrer quand on est développeur web'

Contenu de la révision

{{ TranslationInProgress() }}

Minimum requirements

If you are a Web developer and you have a website or Web application that you would like to make into an installable Open Web app, there is technically very little that you need to do. The minimum requirements are few:

  1. Create an app manifest.
  2. Serve the app manifest in a file with a file extension of .webapp.  Set the Content-Type header to application/x-web-app-manifest+json
  3. Publish the app, either on your own site or in an app store (or both). Publishing it yourself requires adding some code to your site to manage installing and updating the app in users' browsers.

Optional features

Philosophically, the idea of an installable Open Web app is much more than simply adding a manifest to your site. Web standards technologies can be viewed as a full-blown application platform that happens to use a browser engine for rendering user interfaces and interpreting code, and happens to use Web protocols for communicating with a server. Mozilla offers "Web runtime" executables for various platforms so that apps can run in their own window, without a browser window frame.

If you want to take full advantage of the capabilities of installable apps, there is plenty more that you can do. For example:

  • Use responsive Web design to look good and work well on all devices.
  • Charge money for apps.
  • Provide a way to identify users.
  • Enable offline caching so the app can be used when the device is not on the Internet.
  • Store data locally using either localStorage or IndexedDB.
  • Launch the app natively (with an icon on the desktop or the home screen).
  • Use device APIs to interact with hardware, such as geolocation and orientation.
  • Give users a way to give you feedback. Mozilla's user research shows that users want to give feedback to app developers, and want to know that there is a human receiving it. They want to make suggestions and get help with problems. They may stop using an app if they have a problem and there is no way to get help with it.

Useful technologies

Here are some Web technologies that may be useful in writing installable apps. Notice that there is nothing on this list that is unique to Open Web apps!

See also

{{ languages( {"en": "en/Apps/For_Web_developers"} ) }}

Source de la révision

<p>{{ TranslationInProgress() }}</p>
<h2>Minimum requirements</h2>
<p>If you are a Web developer and you have a website or Web application that you would like to make into an installable Open Web app, there is <em>technically</em> very little that you need to do. The minimum requirements are few:</p>
<ol> <li>Create an <a href="/en/Apps/Manifest" title="App Manifest">app manifest</a>.</li> <li>Serve the app manifest in a file with a file extension of <code>.webapp</code>.  Set the <code>Content-Type</code> header to <code>application/x-web-app-manifest+json</code>. </li> <li>Publish the app, either on your own site or in an app store (or both). Publishing it yourself requires <a href="/en/Apps/Apps_JavaScript_API" title="/en/Apps/Apps_JavaScript_API">adding some code to your site to manage installing and updating the app</a> in users' browsers.</li>
</ol>
<h2>Optional features</h2>
<p><em>Philosophically</em>, the idea of an installable Open Web app is much more than simply adding a manifest to your site. Web standards technologies can be viewed as a full-blown application platform that happens to use a browser engine for rendering user interfaces and interpreting code, and happens to use Web protocols for communicating with a server. Mozilla offers "<a href="/en/Apps/Apps_architecture#Web_runtime" title="https://developer.mozilla.org/en/Apps/Apps_architecture#Web_runtime">Web runtime</a>" executables for various platforms so that apps can run in their own window, without a browser window frame.</p>
<p>If you want to take full advantage of the capabilities of installable apps, there is plenty more that you can do. For example:</p>
<ul> <li>Use <a href="/en/Web_Development/Responsive_Web_design" title="en/Web development/Responsive Web design">responsive Web design</a> to look good and work well on all devices.</li> <li>Charge money for apps.</li> <li>Provide a way to <a href="/en/Apps/Identity_integration" title="Identity integration for apps">identify users</a>.</li> <li><a href="/en/Apps/Using_apps_offline" title="/en/Apps/Using apps offline">Enable offline caching</a> so the app can be used when the device is not on the Internet.</li> <li>Store data locally using either <a href="/en/DOM/Storage" title="DOM Storage">localStorage</a> or <a href="/en/IndexedDB" title="IndexedDB">IndexedDB</a>.</li> <li><a href="/en/Apps/Platform-specific_details" title="/en/Apps/Launching apps">Launch the app</a> natively (with an icon on the desktop or the home screen).</li> <li>Use device APIs to interact with hardware, such as <a href="/En/Using_geolocation" title="Using geolocation">geolocation</a> and <a href="/en/DOM/Orientation_and_motion_data_explained" title="Orientation and motion data explained">orientation</a>.</li> <li>Give users a way to give you feedback. Mozilla's user research shows that users want to give feedback to app developers, and want to know that there is a human receiving it. They want to make suggestions and get help with problems. They may stop using an app if they have a problem and there is no way to get help with it.</li>
</ul>
<h2>Useful technologies</h2>
<p>Here are some Web technologies that may be useful in writing installable apps. Notice that there is nothing on this list that is unique to Open Web apps!</p>
<ul> <li><a href="/en/HTML/HTML5" title="HTML5">HTML5</a></li> <li><a href="/en/CSS" title="CSS">CSS</a></li> <li><a href="/en/JavaScript" title="/en/JavaScript">JavaScript</a></li> <li><a href="/en/HTML/Canvas" title="Canvas">Canvas</a></li> <li><a href="/en/AJAX" title="/en/Ajax">Ajax</a></li> <li><a href="/en/Using_the_Application_Cache" title="/en/Offline resources in Firefox">Offline resources in Firefox</a></li> <li><a href="/en/DOM/Storage" title="DOM Storage">DOM Storage</a></li> <li><a href="/en/IndexedDB" title="IndexedDB">IndexedDB</a></li> <li><a href="/En/DragDrop/Drag_and_Drop" title="Drag and drop">Drag and drop</a></li>
</ul>
<h2>See also</h2>
<ul> <li><a class="external" href="http://smus.com/mobile-web-app-tech-stack" title="http://smus.com/mobile-web-app-tech-stack">A mobile web application stack </a></li>
</ul>
<p>{{ languages( {"en": "en/Apps/For_Web_developers"} ) }}</p>
Revenir à cette révision