Récemment, à l'occasion de // BUILD / 2015, Microsoft a annoncé le plus simple moyen de créer des applications hébergées sur plusieurs plates-formes. Bien que John Shewchuk, chargé de recherche technique et directeur de la technologie pour la plate-forme de développement Microsoft, ait réussi à créer une application Web hébergée directement sur scène (vous pouvez voir le récapitulatif ici), je souhaiterais entrer dans les détails, pourquoi vous devriez utiliser des applications Web hébergées et comment en créer une pour vous en utilisant manifoldJS.
Les applications Web hébergées offrent le meilleur du Web pour stocker des applications avec un minimum d'effort. Ils constituent un excellent moyen d’accroître la portée des utilisateurs grâce à l’expérience déjà acquise. Et lorsque vous mettez à jour votre expérience Web, vos utilisateurs obtiennent également la même mise à jour dans les applications Web hébergées.!
Le problème est que, jusqu'à présent, la difficulté des applications hébergées était la différence de processus sur toutes les plateformes. ManifoldJS change cela en mettant l'accent sur le Manifeste pour les applications Web du W3C - une approche open source basée sur des normes pour créer des applications - puis utilise ces métadonnées pour créer une application native hébergée sur Android, iOS et Windows..
Lorsqu'une plate-forme prend en charge les applications hébergées, nous la construisons de manière native, puis nous utilisons Cordova pour polyfiler les plates-formes qui ne disposent pas d'un support natif..
Il y a fondamentalement deux façons de commencer. Si vous êtes un développeur Web vivant en ligne de commande, commencez par l'interface CLI. Pour les développeurs souhaitant utiliser plusieurs versions du cloud, nous avons les mêmes outils sur le site Web..
La première chose à faire est de créer un manifeste pour votre site Web. Cela devrait être assez familier pour les développeurs Web, car c'est un objet JSON assez simple. Voici un échantillon de mon propre site:
"name": "This Here Web", "short_name": "THW", "icons": ["src": "images / tiny.png", "tailles": "70x70", "type": " image / png "]," start_url ":" index.html "," scope ":" http: //*.thishereweb.com "," display ":" autonome "," orientation ":" paysage "
Pour plus de détails sur la création d'un fichier manifeste, y compris sur la procédure à suivre pour le servir à partir de votre serveur Web, consultez ce message sur le manifeste. Si vous voulez un peu d'aide pour créer ce manifeste, essayez le générateur de code sur le site manifoldjs.com. Nous vous expliquerons les valeurs dont vous avez besoin avec l'Assistant, puis nous vous fournirons un manifeste complet pour votre site Web à la fin..
ManifoldJS utilise une technologie connue. La seule condition requise est que Node.js soit installé. ManifoldJS fonctionnera sur n’importe quel système (Mac, Linux, Windows), mais ne pourra créer des applications que pour les plates-formes prises en charge sur ce système..
Installation de l'outil:
npm installer manifoldjs grunt manifoldjs
ManifoldJS gérera l’installation pour toutes ses dépendances via NPM. A partir de là, vous passez simplement dans votre site web:
ManifoldJS http://www.thishereweb.com
À partir de là, deux choses vont se passer:
Si vous souhaitez voir ce qui se passe, activez simplement la journalisation et gardez un œil sur la console. En plus de la journalisation, nous avons un certain nombre d’options que vous pouvez définir pour contrôler la sortie de l’outil..
Paramètre | La description |
| (Champs obligatoires) URL du site hébergé |
-m | -manifest | (optionnel) Emplacement du fichier manifeste W3C Web App (URL ou chemin local). S'il n'est pas spécifié, l'outil recherche un manifeste dans l'URL du site. Sinon, un nouveau manifeste sera créé en direction de l'URL du site.. |
-répertoire d | | (optionnel) Chemin des fichiers de projet générés (valeur par défaut: répertoire actuel) |
-s | -shortname | (optionnel) Nom abrégé de l'application. Lorsque spécifié, il remplace la valeur short_name du manifeste |
-l | -loglevel | (optionnel) Options de niveau de journal de traçage; Niveaux de journalisation disponibles: déboguer, trace, info, avertir, erreur (valeur par défaut: prévenir) |
-p | -plates-formes | (optionnel) Plateformes à générer. Plateformes supportées: fenêtres, androïde, ios, chrome (valeur par défaut: toutes les plateformes) |
-b | -build | (optionnel) Force le processus de construction |
Toutes ces mêmes fonctionnalités sont également disponibles dans notre outil Web. Visitez le générateur Web et lancez-vous.
Une fois que vous avez terminé les étapes, il vous suffit de cliquer sur le téléchargement à la fin et un zip avec tous vos colis vous sera envoyé..
Le manifeste pour les applications Web vous permet de spécifier la «portée» de votre application. Cela aide à déterminer où votre application s'arrête et où le Web ouvert commence. Seules les URL de votre portée apparaîtront dans l'application. Si vous utilisez plusieurs domaines ou appelez du contenu depuis nos domaines, ajoutez simplement des valeurs d'accès URI à votre manifeste..
En tant que développeurs Web, nous demandons toujours des API qui nous aident à brouiller les frontières entre les fonctionnalités des applications natives et celles du Web. Les applications Web hébergées constituent un environnement de confiance sur la plupart des plates-formes, où le code est directement lié à un développeur. De ce fait, certaines plates-formes vous permettent d’avoir accès à des API natives que vous ne pouvez pas atteindre dans le navigateur..
Sur Android, iOS et Windows, nous utilisons Cordova pour polyfill pour les applications hébergées. L'avantage supplémentaire est que vous pouvez ajouter les fichiers Cordova js sur votre site Web et utiliser ces API dans votre application hébergée. Cependant, sous Windows 10, vous avez en fait accès à toute la surface API des applications universelles Windows, du Bluetooth aux interfaces humaines de bas niveau. Pour autoriser ces API pour votre application, ajoutez simplement ceci à votre manifeste:
"mjs_urlAccess": ["url": "http://manupjs.azurewebsites.net/", "url": "http://www.manifoldjs.com/"],
Avec les règles d'accès en place, nous activerons les API pour que vous puissiez appeler directement ou par le biais des API Cordova..
Nous travaillons à rendre le processus de création d'applications Web hébergées encore plus facile, mais pour le moment, les développeurs ont encore quelques étapes finales à compléter..
Pour chaque plate-forme, nous fournissons des conseils sur le déploiement dans chaque App Store. Les tests constituent une partie importante du développement d'applications, et nous proposons également des conseils et des suggestions pour tirer le meilleur parti de votre application Web hébergée. En outre, les applications doivent toutes être soumises aux magasins d'applications appropriés, et nous vous indiquerons également la direction à suivre..
Les applications Web hébergées vous permettent de développer des applications de magasin tout en préservant l'intégrité et l'unicité du Web. Maintenant, développer ces applications est un peu plus simple avec ManifoldJS. Vous vous concentrez sur les standards Web, nous ferons le reste.
Cela vous surprendra peut-être un peu, mais Microsoft propose un grand nombre d’apprentissage gratuit sur de nombreuses rubriques JavaScript open source et nous avons pour mission de créer beaucoup plus avec Microsoft Edge. Découvrez les séries d'apprentissage de notre équipe:
Et quelques outils gratuits: Communauté Visual Studio, Azure Trial et outils de test multi-navigateurs pour Mac, Linux ou Windows..
Cet article fait partie de la série Web de développement Web de Microsoft. Nous sommes ravis de partager Microsoft Edge et le nouveau Moteur de rendu EdgeHTML avec toi. Obtenez des machines virtuelles gratuites ou testez à distance sur votre appareil Mac, iOS, Android ou Windows @ http://dev.modern.ie/.