Comment développer des applications de bureau utilisant HTML / CSS / JavaScript?
Premièrement, je ne suis pas intéressé à faire cela professionnellement. Je suis un développeur Web. Un de mes collègues est récemment parti pour Spotify et a déclaré qu'il travaillerait principalement en JavaScript pour l'application Spotify Desktop. Il a dit qu'il utilise "Chrome frame" et que tout à l'intérieur est fait comme une application Web (HTML/JS/CSS).
En tant que développeur Web qui n'a jamais rien construit pour Desktop, c'est une excellente nouvelle. Si je peux utiliser les technologies que je connais déjà et les implémenter dans une sorte de "cadre", je peux toujours créer une application Windows ou, mieux encore, multiplateforme.
Je sais que je n'ai rien dit à propos de la base de données, mais même une simple application de bureau hello world avec les technologies Web serait un atout.
Alors, comment peut-on s'y prendre? Exactement ce que j'ai besoin/besoin de savoir?
Vous pouvez commencer par Titanium for desktop dev. Vous pouvez également consulter Chromium Embedded Framework. Il s’agit essentiellement d’un contrôle de navigateur Web à base de chrome.
Il est écrit en C++ pour vous permettre de faire tout ce que vous voulez dans votre système d’exploitation (Growl, icônes de la barre des tâches, accès aux fichiers locaux, ports de communication, etc.), puis toute la logique de l’application et son interface graphique en HTML/JavaScript. Il vous permet d'intercepter toute requête http pour servir des ressources locales ou effectuer une action personnalisée. Par exemple, une requête à http://localapp.com/SetTrayIconState?state=active peut être interceptée par le conteneur, puis appeler la fonction C++ pour mettre à jour l'icône de la barre des tâches.
Il vous permet également de créer des fonctions pouvant être appelées directement à partir de JavaScript.
Il est très difficile de déboguer JavaScript directement dans CEF. Il n'y a pas de support pour quelque chose comme Firebug.
Vous pouvez également essayer AppJS.com (permet de créer des applications de bureau. Pour Linux, Windows et Mac à l'aide de HTML, CSS et JavaScript)
De plus, comme l'a souligné @Clint, l'équipe de brackets.io (Adobe) a créé un superbe shell utilisant Chromium Embedded. Cadre qui facilite beaucoup le démarrage. C'est ce qu'on appelle les crochets Shell: github.com/Adobe/brackets-Shell Pour en savoir plus à ce sujet ici: clintberry.com/2013/html5-desktop-apps-with-brackets- Shell
NW.js
(Précédemment connu sous le nom de node-webkit)
Je suggérerais NW.js si vous êtes familier avec Node ou expérimenté avec JavaScript.
NW.js est un environnement d'application basé sur Chromium et node.js.
Caractéristiques
- Applications écrites en HTML5, CSS3, JS et WebGL modernes
- Prise en charge complète des API Node.js et de tous ses modules tiers.
- Bonne performance: Node et WebKit s'exécutent dans le même thread: les appels de fonctions sont simples; les objets sont dans le même tas et peuvent juste se référencer
- Facile à emballer et à distribuer des applications
- Disponible sur Linux, Mac OS X et Windows
Vous pouvez trouver le repo NW.js ici , et une bonne introduction à NW.js ici . Si vous avez envie d'apprendre Node.js je recommanderais this SO poster avec beaucoup de bons liens.
Awesomium facilite l'utilisation de l'interface utilisateur HTML dans votre application C++ ou .NET
Mise à jour
Ma réponse précédente est maintenant obsolète. Ces jours-ci, vous seriez fou de ne pas chercher à utiliser Electron pour cela. De nombreuses applications de bureau populaires ont été développées par-dessus.
Il semble que les solutions pour les applications de bureau HTML/JS/CSS ne manquent pas.
Une solution que je viens de trouver est TideSDK: http://www.tidesdk.org/ , ce qui semble très prometteur si l’on regarde la documentation.
Vous pouvez développer avec Python, PHP ou Ruby, et le configurer pour Mac, Windows ou Linux.
Désolé de faire éclater votre bulle, mais le client de bureau Spotify l'est n simple navigateur Webkit . Bien sûr, il expose des fonctionnalités supplémentaires spécifiques, mais il ne peut exécuter que JS et restituer le code HTML/CSS, car il possède un moteur JS ainsi qu'un moteur de rendu Chromium. Cela ne vous aide pas à coder une application Web côté client et à effectuer un déploiement sur plusieurs plates-formes.
Ce que vous recherchez est similaire à Sencha Touch - une structure qui permet aux applications HTML5 d’être déployées de manière native sur les appareils iOS, Android et Blackberry. Il agit essentiellement comme un intermédiaire entre certains appels d'API et les fonctionnalités disponibles spécifiques à l'appareil.
Je n'ai aucune expérience avec appcelerator , mais il semble que ce soit exactement le cas - et obtenez des commentaires très favorables en ligne. Vous devriez essayer (à moins que vous ne souhaitiez revenir à 1999 et lancer avec MS HTA ;)
Je sais car il y a Fluide et Prism (il y en a d'autres, c'est celui que j'avais l'habitude d'utiliser) qui vous permettent de charger un site Web dans ce qui ressemble à une application autonome.
Dans Chrome, vous pouvez créer des raccourcis sur le bureau pour les sites Web. (vous le faites à partir de Chrome, vous ne pouvez pas/ne devriez pas emballer cela avec votre application) Chrome Le cadre est différent:
Google Chrome Frame est un plug-in conçu pour Internet Explorer et basé sur le projet open-source Chromium. il apporte les technologies Web ouvertes de Google Chrome à Internet Explorer.
Vous auriez besoin d'une sorte de wrapper comme celui-ci pour votre application Web, le reste étant constitué des technologies Web auxquelles vous êtes habitué. Vous pouvez utiliser HTML5 stockage local pour stocker des données lorsque l'application est hors ligne. Je pense que vous pourriez même être capable de travailler avec SQLite.
Je ne sais pas comment vous vous y prendriez pour accéder aux fonctions spécifiques à un système d'exploitation. Ce que j'ai décrit ci-dessus a les mêmes limites que tout site Web "classique". Espérons que cela vous donne une sorte de guide sur le point de départ.
Vous pouvez créer des applications Javascript avec Adobe AIR… http://www.Adobe.com/products/air.html
CEF offre beaucoup de flexibilité et d’options de personnalisation. Mais si le but est de développer rapidement node-webkit, c'est aussi une bonne option. Node-web kit offre également la possibilité d’appeler des modules de nœud directement à partir de DOM.
S'il n'y a pas de modules natifs à intégrer, Node-Webkit peut offrir un meilleur kilométrage. Avec les modules natifs C/C++ ou même C #, c'est mieux avec CEF.