Un framework Web python dans une bouteille Introduction à Bottle Bottle est un framework Web très simple à mettre en oeuvre et qui permet d'écrire des applications Web rapides avec peu de lignes de code. Il suffit de lire l'exemple fourni sur la page du projet pour s'en rendre compte. Pour illustrer son fonctionnement, nous allons créé un outil simple de diffusion d'un diaporama. Contexte de notre application On aimerait pouvoir diffuser un briefing (suite de diapositives) à un ensemble de personnes via leur navigateur Web. On aura donc un serveur disposant : d'une application/serveur Web qui pointe sur un répertoire donné et affiche la dernière image disponibled'un accès FTP sur ce même répertoire sur lequel on va placer des images de notre briefing On aura N clients qui iront sur l'URL fournie par l'application et ils disposeront d'un bouton pour interroger régulièrement le serveur sur l'image en cours à afficher. Contraintes techniques Les clients auront une interface très simple : L'environnement de développement Le script de base <!
Maîtriser les tableaux HTML avec JavaScript Au cours de vos projets, vous serez sûrement amenés à développer, supprimer ou simplement lire le contenu d'un tableau HTML, surtout si vos structures, ou celles que vous devrez traiter, seront en tableaux HTML. Ici, je vous présente une manière sûre d'y arriver. Oui ! Totalement sûre, car les outils que nous allons utiliser sont issus du DOM level 1, c'est-à-dire l'ensemble des standards publiés par le W3C en 1998. Ils sont donc disponibles dans tous les navigateurs dès Internet Explorer 5 et Netscape 6. Ce tutoriel demande des connaissances en JavaScript, et en particulier sur les objets. J'essaierai d'être le plus clair possible en expliquant les nouvelles notions. Ainsi ce tutoriel ne s'adresse pas uniquement à ceux qui doivent traiter des tableaux HTML, mais aussi à tous ceux qui veulent progresser en JavaScript. Voici un exemple de ce que vous pourrez facilement faire : aperçu.
L'élément HTML 5 Canvas - Tutorial Pour commencer, voyons brièvement qu'est-ce que ce fameux élément Canvas. Introduction Le HTML 5 introduit dans ses spécifications la balise Cette balise est plutôt récente et n'est pour le moment implémentée que par quelques navigateurs: FirefoxOpéraSafariKonqueror Internet Explorer est encore en retard là dessus ... Vos applications Canvas ne pourront pas être executées sur tous les navigateurs, il faut bien garder cela en tête. Chaque élément canvas dispose d'un contexte. Seul Opéra supporte en version bêta le contexte 3D. Une fois qu'un élément HTML canvas est déclaré, il faudra utiliser du Javascript pour créer les graphiques dynamiques. Déclaration du canvas en HTML La déclaration de l'élément est relativement simple: L'élément canvas prend en paramètres: width: La largeur de la zoneheight: La hauteur de la zoneid: L'id de l'élément qui servira au Javascript Si vous voulez voir toute la spécification HTML 5 sur le Canvas, rendez vous sur ce lien. Ca y'est !
Réaliser un IHM web avec Python et Bottle Il existe de nombreux frameworks de développement web en Python. Le plus connu, et à mon avis le plus efficace, reste Django mais je voudrais vous présenter Bottle, une solution très légère dont la philosophie est complètement différente de celle de Django. Idéal pour développer très rapidement par exemple une IHM web. La légèreté comme philosophie Django se veut le framework des perfectionnistes sous pression. Bottle a une approche beaucoup plus minimaliste d'un framework web. Une page web = Une fonction Python Du point de vue du code, là aussi Bottle recherche la légèreté. import bottle@bottle.route("/")def index(): return "Hello world!" bottle.run() #lance le serveur web en localhost sur le port 8080 Ouvrez un navigateur sur la page et la page affiche "Hello world!". Les décorateurs pour simplifier le développement Il n'y a pas de magie là dessous mais une utilisation très judicieuse des décorateurs Python. def trace(fn): #le code decorateur print "appel", fn.
Dynamisez vos sites web avec Javascript ! Bienvenue à toutes et à tous, Qui n'a jamais entendu parler du JavaScript ? Créé dans les années 90 en tant que simple langage de script, JavaScript est désormais un des poids lourds du développement Web ! Qui plus est, il se démocratise au sein d'autres environnements comme les serveurs avec le célèbre Node.js, les applications pour smartphones et tablettes, avec PhoneGap d'Adobe, les applications pour Windows 8, mais aussi les logiciels multiplateformes. Bref, JavaScript est partout ! Voici quelques exemples de ce qui est réalisable grâce au JavaScript : Sur ce, bonne lecture !
20 canvas HTML5 pour vous inspirer Ah les canvas en HTML5 c'est vraiment sympa et le débat est toujours aussi animé entre l'utilisation de Flash et des canvas HTML5. Mais depuis qu'Adobe a annoncé se concentrer sur HTML5 au détriment de Flash, je pense qu'il est temps de voir quelques réalisations croustillantes de canvas HTML5 pour vous inspirer. L'utilisation des canvas a besoin de décoller car en ce moment il en est encore à son stade "trial" en raison de la limitation au niveau des navigateurs et le manque de ressources au niveau du code et des tutoriaux. HTML5 offre de grandes possibilités et de fonctionnalités avancées par rapport à ce que l'HTML est capable de faire. Dans la suite de cet article vous trouverez 20 canvas HTML5 avec des animations, des jeux et des outils
POO/IHM Objectifs Développement d'Interfaces Homme-Machine (IHM). Sensibilisation à la conception d'IHM. Mise en œuvre du concept de séparation couche de présentation - couche applicative. Plan Introduction à la notion d'IHM (1 séance) IHM en SWING (3 séances) IHM en GWT (3 séances) IHM en Flex (3 séances) 2 séances supplémentaires pour ajuster le planning en fonction de l'état d'avancement des étudiants Détail des séances Mode d'évaluation Contrôle continu (1/3 de la note globale). Vous êtes libre de développer avec IDE ou sans. JavaScript Tutorial HTML5 animation and CSS filters | Creative droplets Predefined filter effects are now implemented in WebKit browsers (Chrome, Safari 6, iOS Safari 6, BB10 browser). You only have to set CSS properties to blur a DIV, drop a shadow, saturate an image (or the opposite with grayscale), or play with the opacity or the gamma (brightness) information. Then you can use CSS animations and transitions to create cinematic effects on your web pages. Adobe is actively working with the W3C on CSS filters. Actually, this is just a start. Edge Animate 1.5 New panel on the left of the screen: Filters. The latest release of Adobe Edge Animate (version 1.5 – Feb 2013) lets you play and animate CSS filters. Simple animation with Edge Animate 1.5 Here is a short video tutorial that explains how to create a simple animation with Edge Animate and CSS Filters. Roll-over buttons Adding a blur filter, you can easily simulate a depth of field. I’ve seen several ways on the web to create rollover buttons. on mouse over: this.play()on mouse out: this.playReverse();
motion Motion est un logiciel de détection vidéo et qui permet de diffuser un flux vidéo via internet par le protocole HTTP. C'est une solution simple pour diffuser le flux de sa webcam en ligne ou pour détecter des mouvements dans le champ d'une caméra par exemple. Pré-requis Disposer d'une connexion à Internet configurée et activée. Pour vérifier l'installation de votre webcam saisir dans un terminal : gstreamer-properties dans Video/Test, le test devrait afficher l'image de votre webcam. Installation Lancement automatique Par défaut, le daemon motion n'est pas activé/démarré. Si l'on veut l'activer, il faut mettre à 'Yes' la variable start_motion_daemon dans le fichier /etc/default/motion. En mode utilisateur (hors daemon), le mieux est de copier le fichier /etc/motion/motion.conf dans son propre dossier personnel. sudo cp /etc/motion/motion.conf ~/ Puis, mettre les bons droits : sudo chown $USER ~/motion.conf Configuration de base pour une webcam Maintenant nous allons éditer le fichier motion.conf
Dynamisez vos sites web avec Javascript ! Bienvenue à toutes et à tous, Qui n'a jamais entendu parler du JavaScript ? Créé dans les années 90 en tant que simple langage de script, JavaScript est désormais un des poids lourds du développement Web ! Qui plus est, il se démocratise au sein d'autres environnements comme les serveurs avec le célèbre Node.js, les applications pour smartphones et tablettes, avec PhoneGap d'Adobe, les applications pour Windows 8, mais aussi les logiciels multiplateformes. Bref, JavaScript est partout ! Voici quelques exemples de ce qui est réalisable grâce au JavaScript : Sur ce, bonne lecture !
Ajax, JavaScript, CSS, HTML 5 et interfaces graphiques crée vos logiciels - Le blog: Web, Python, Django, Javascript ... Il existe de nombreux frameworks de développement web en Python. Le plus connu, et à mon avis le plus efficace, reste Django mais je voudrais vous présenter Bottle, une solution très légère dont la philosophie est complètement différente de celle de Django. Idéal pour développer très rapidement par exemple une IHM web. La légèreté comme philosophie Django se veut le framework des perfectionnistes sous pression. Il est pensé comme une solution complète apportant l'ensemble des outils nécessaires pour développer rapidement un site internet. Bottle a une approche beaucoup plus minimaliste d'un framework web. Une page web = Une fonction Python Du point de vue du code, là aussi Bottle recherche la légèreté. import bottle@bottle.route("/")def index(): return "Hello world!" bottle.run() #lance le serveur web en localhost sur le port 8080 Ouvrez un navigateur sur la page et la page affiche "Hello world!". Les décorateurs pour simplifier le développement Par exemple: