web-dev-qa-db-fra.com

Utilisation de ionic comme application Web de bureau

Ionic est un excellent framework pour développer des applications mobiles en utilisant html5. Nous voulons également que la même application soit utilisée sur un navigateur de bureau. Sera-ce une bonne idée de créer une interface utilisateur réactive unique qui fonctionne le mieux sur le navigateur de bureau et le navigateur mobile et de créer une application. OR nous devrions faire un développement différent pour le navigateur et l'application mobile.

40
Rohit Bansal

Pour développer un peu ce qui a déjà été dit, Ionic est conçu et testé pour mobile uniquement. Internet Explorer par exemple n'est pas testé et ne gère pas correctement un certain nombre de fonctionnalités d'Ionic Les navigateurs de bureau ont des fonctionnalités différentes de leurs homologues de navigateur mobile. Vous limiteriez sérieusement les navigateurs qui peuvent utiliser votre application sur un bureau.

Très probablement, vous devez fournir deux applications différentes pour le bureau et le mobile. À moins que vous n'ayez le courage ou la capacité de dire à vos utilisateurs qu'ils doivent utiliser Chrome (ou Opera) pour exécuter votre site Web, vous aurez besoin de deux applications distinctes. Vous pouvez toujours utiliser Ionic pour un site Web mobile cependant, mais sans pouvoir utiliser l'intégration complète de la plate-forme de Cordova (vous seriez limité aux API HTML natives fournies par le navigateur). Vous pourriez certainement conserver une grande partie de votre logique métier dans un commun noyau partagé entre les deux applications. Cela nécessiterait la création d'un angular angulaire). Je l'ai fait dans un projet avec une application Ionic et une application de bureau normale Angular (avec Bootstrap).

Il existe plusieurs façons de détecter si un visiteur provient d'un ordinateur de bureau ou d'un appareil mobile. Je ne connais pas de méthode 100% parfaite, car ils reposent généralement sur la chaîne d'agent utilisateur du navigateur (et peuvent être usurpés, modifiés, etc.). Voir http://detectmobilebrowsers.com/ pour certains scripts ou exemples courants sur la façon d'implémenter la détection mobile sur un serveur ou dans un langage de programmation.

27
Jeremy Wilken

Cette question a été posée à ng-europe plus tôt cette semaine. La réponse des gars de ionic était de partager vos services et contrôleurs, mais d'utiliser des vues différentes pour le bureau. Ionic est purement axé sur le mobile).

26
Nat Wallbank

Fait intéressant, il semble possible de produire une version de bureau d'une application Ionic en utilisant une boîte à outils nommée 'Electron' qui est une sorte d'équivalent de bureau de Cordova/Phonegap, comme expliqué dans cet article:

http://alexbergin.com/2015/streamlining-desktop-and-mobile-app-development

Electron (anciennement nommé Atom Shell) empaquette une vue Web Chromium intégrée pour produire une "vraie" application. Cela signifie également que les problèmes entre les navigateurs ne sont pas un problème.

L'auteur de l'article ci-dessus l'a utilisé avec succès avec une application Ionic.

Si vous vous engagez dans cette voie, vous devrez probablement utiliser des techniques réactives pour optimiser l'UX sur le bureau.

Je n'ai pas essayé cela, donc je ne connais pas les avantages et les inconvénients de cette approche, mais je peux imaginer qu'il y a des cas où vous voulez simplement créer rapidement une version de bureau d'une application que vous avez déjà.

13
leo

Mon commentaire est devenu trop grand. Il s'agit d'élaborer et d'ajouter à l'excellente réponse de Jeremy Wilken.

Il ne s'agit pas seulement de limiter les navigateurs sur un ordinateur de bureau, mais de montrer l'écran mobile sur une partie de l'écran immobilier semble carrément ridicule (il est temps de repenser ce que signifie d'abord le mobile :)). Le besoin d'une API appropriée ne peut pas être souligné davantage car le flux (navigation) variera très probablement sur plus d'écrans au format mobile qu'au format PC, bien que la fonctionnalité puisse être la même.

Je suis d'accord avec l'observation de Jeremy selon laquelle la logique métier doit être maintenue séparée et exposée comme un grain fin REST APIS, par exemple, utiliser un serveur basé sur le cadre Express.js avec MySQL/MongoDB/Redis ou tout autre magasin de données commercial. Ainsi, l'API REST peut être utilisée à travers l'interface utilisateur Mobile/Phablet/Mini Tablet (avec Ionic) et l'interface utilisateur Desktop/Laptop (avec Bootstrap + AngularJS.) Bien sûr, je suis un fan de JS, OP peut utiliser n'importe quelle langue de son choix pour le serveur.

4
SheshPai

Je recommanderais d'utiliser ionic pour mobile et surtout si vous utilisez ionic 2 utilisez le même code pour le bureau en angular 2 avec juste des modifications mineures

0
Geoff

Le cadre est uniquement pour l'application hybride mobile bien qu'il fonctionnerait comme une application HTML normale.

0
stevemao