Actualités | Audio/Vidéo | Evènements | DIY | Domotique | Informatique | Maison | Mobile | Sécurité

OpenPicus : Mise en place du serveur web, et rendu Bootstrap et jQuery (4/5)

Envoyer Imprimer PDF
Note des utilisateurs: / 6
MauvaisTrès bien 

Tous les capteurs sont en état de fonctionner, nous affichons la valeur de chacun d’eux sur un écran oled et dans cette partie nous allons connecter notre prototype à notre réseau local.

Le fait de rendre ce prototype connecté au réseau permettra d’afficher les valeurs sur n’importe quel appareil connecté disposant d’un navigateur web. Nous allons utiliser 2 Frameworks bien connu des développeurs web. Bootstrap et jQuery. L’interet d’un Framework est d’arriver à un résultat sans avoir à reinventer la roue.

Pour informations :

Le projet Bootstrap a été publié en août 2011, Il a été mis à disposition du public sous licence Apache. Cette plate-forme a été conçue par deux développeurs faisant partie de la mouvance de développeurs qui gravitent autour de Twitter, Mark Otto et Jacob Thornton (@mdo et @fat). Ce framework permet de créer une interface élégante et optimisée pour un site ou une application « Responsive Web Design » (RWD), avec un effort minimal et cela avec une garantie maximale de compatibilité entre les divers navigateurs.

 

Bootstrap est une boîte à outils HTML, CSS et JavaScript permettant de créer rapidement et efficacement des applications web. Cette boite à outils contient des codes HTML et CSS, des formulaires, boutons, outils de navigation et autres éléments interactifs, ainsi que des extensions JavaScript en option. C'est l'un des projets les plus populaires sur la plate-forme de gestion de développement.

jQuery est un framework javascript libre développé initialement par John Resig et qui est aujourd'hui maintenu et mis à jour par la communauté jQuery Team Sous licence MIT. jQuery vous permet notamment :

- gérer des interactions AJAX (communication asynchrone avec le serveur)
- parcourir et manipuler le DOM (l'arbre des éléments HTML) gérer des événements utilisateurs (clic souris, survole, …)
- ajouter des effets et animations visuels (fondu, disparation,...)

 

Voilà pour les présentations, au niveau de la Flyport nous allons utiliser un fichier « status.xml » qui va contenir les valeurs des différents capteurs. Le contenu sera structuré d’une façon bien particulière qui s’appelle le XML.

L'Extensible Markup Language ( « langage de balisage extensible » en français) est un langage informatique de balisage générique.

Cet article n’a pas pour objectif de vous apprendre à coder en HTML – CSS, JavaScript et XML nous sommes vraiment dans la découverte du projet OpenPicus. Néanmoins si vous voulez en apprendre plus à ces sujets je vous invite à vous rendre sur le site du zero qui possède de nombreux cours et tutoriaux à ces sujets.


Comme toujours je vous laisse à disposition le code source sur le Github de la série de d’articles de cette semaine.

Dès lundi 15 juillet je vous propose de gagner ce prototype ou des coupons de réduction en participant à un concours. Les liens dont vous aurez besoins : http://twitter.github.io/bootstrap/ http://www.siteduzero.com/

Vous n'avez pas compris un point ? Vous vous posez une question ? Vous pouvez nous contacter via le bouton Assistance sur votre gauche. N'hésitez pas à demander un rendez-vous téléphonique avec Domotics.

Vous avez aimé cet article ? Vous pouvez le partager sur vos réseaux sociaux pour soutenir son auteur et l'encourager à écrire de nouveaux articles ...

 

Cet article vous est proposé par Hotfirenet :Débutant dans le domaine de la domotique, Johan est passionné depuis des années par le High-tech et les nouvelles technologies. Il s'intéresse à tout ce qui touche au web et particulièrement la création et la gestion de sites Web (XHTML, CSS, PHP, SQL, Python). Vous pouvez le suivre sur son blog, et sur Twitter.

Mise à jour le Dimanche, 26 Octobre 2014 21:17  

Ajouter un Commentaire


Code de sécurité
Rafraîchir

Recherche

Newsletter ?

Bon Plan

Instagram

Publicité



Connexion