WicketIntroduction

lundi 30 juillet 2007

Wicket est un framework Web opensource qui simplifie le développement d’applications web basées sur des composants. L’un des avantages de Wicket est qu’il se base sur le HTML pour la présentation et sur Java pour la navigation, les contrôles et les traitements, pas besoin d’utiliser un compilateur comme pour GWT. De plus, il est plus simple à utiliser que Struts et JSF

Un exemple de base

L’objectif est de créer une application HelloWorld pour débuter, d’autres articles suivront sur les formulaires, les listes, l’intégration avec Spring, les tests unitaires JUnit, Ajax.

  • Déclaration dans le fichier pom.xml de Maven 2:
<project xmlns=“http://maven.apache.org/POM/4.0.0”
	xmlns:xsi=“http://www.w3.org/2001/XMLSchema-instance”
	xsi:schemaLocation=“http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd”>
…
	<dependencies>
		<dependency>
			<groupId>wicket</groupId>
			<artifactId>wicket</artifactId>
			<version>1.2.6</version>
		</dependency>
		<dependency>
			<groupId>log4j</groupId>
			<artifactId>log4j</artifactId>
			<version>1.2.13</version>
		</dependency>
		<dependency>
			<groupId>junit</groupId>
			<artifactId>junit</artifactId>
			<version>3.8.1</version>
			<scope>test</scope>
		</dependency>
	</dependencies>
	<build>
		<resources>
			<resource>
				<filtering>false</filtering>
				<directory>src/main/java</directory>
				<includes>
					<include>**</include>
				</includes>
				<excludes>
					<exclude>**/*.java</exclude>
				</excludes>
			</resource>
		</resources>
	</build>
</project>
  • Déclaration de la servlet Wicket dans le fichier web.xml
<?xml version=“1.0” encoding=“UTF-8”?>
<web-app xmlns=“http://java.sun.com/xml/ns/j2ee”
	xmlns:xsi=“http://www.w3.org/2001/XMLSchema-instance”
	xsi:schemaLocation=“http://java.sun.com/xml/ns/j2ee http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd”
	version=“2.4”>
	<display-name>wicket-test</display-name>
	<servlet>
		<servlet-name>wicket-servlet</servlet-name>
		<servlet-class>wicket.protocol.http.WicketServlet</servlet-class>
		<init-param>
			<param-name>applicationClassName</param-name>
			<param-value>jfhelie.wicket.HelloWorldApplication</param-value>
		</init-param>
		<load-on-startup>1</load-on-startup>
	</servlet>
	<servlet-mapping>
		<servlet-name>wicket-servlet</servlet-name>
		<url-pattern>/helloworld/*</url-pattern>
	</servlet-mapping>
</web-app>

La classe jfhelie.wicket.HelloWorldApplication correspond à la page appelée au lancement de l’application, elle permet de définir des informations globales à l’application.

  • Créer la classe jfhelie.wicket.HelloWorldApplication
package jfhelie.wicket;
import wicket.protocol.http.WebApplication;
public class HelloWorldApplication extends WebApplication {
	public Class getHomePage() {
		return HelloWorld.class;
	}
	protected void init() {
		super.init();
	}
}

Cette classe référence la classe HelloWorld qui sera lancée au démarrage de l’application

  • Créer le fichier HelloWorld.html dans le package jfhelie.wicket
<html>
<title>Welcome to Wicket Application</title>
<body>
Welcome To Wicket Mr <span wicket:id=“message”>Message goes here</span>
</body>
</html>
  • Créer la classe jfhelie.wicket.HelloWorld:
package jfhelie.wicket;
import wicket.markup.html.WebPage;
import wicket.markup.html.basic.Label;
public class HelloWorld extends WebPage {
	public HelloWorld() {
		super();
		add(new Label(“message”, “Jeff”));
	}
}
  • Lancer mvn install pour que les fichier html soient copiés dans le répertoire target/classes
  • Tester la page
 http://localhost:8090/wicket-test/helloworld

JavaMail

vendredi 13 juillet 2007

Cet article décrit comment lire les messages sur un serveur Mail en POP3 et envoyer des messages en SMTP.

Lire des messages

Avant de commencer, il faut récupérer les librairies javax.mail, à partir de Maven 2, rajouter les dépendances suivantes:

<dependency>
	<groupId>javax.activation</groupId>
	<artifactId>activation</artifactId>
	<version>1.1</version>
</dependency>
<dependency>
	<groupId>javax.mail</groupId>
	<artifactId>mail</artifactId>
	<version>1.4</version>
</dependency>

L’exemple suivant permet d’afficher les informations sur les 10 derniers messages:

PasswordAuthentication authentication = new PasswordAuthentication(user, password);
Properties props = new Properties ;
props.put(“mail.user”, user);
props.put(“mail.host”, host);
props.put(“mail.store.protocol”, “pop3”);
props.put(“mail.transport.protocol”, “smtp”);
session = Session.getInstance(props, this);
Store store;
try {
	store = session.getStore ;
	store.connect ;
	Folder root = store.getDefaultFolder ;
	Folder inbox = root.getFolder(“inbox”);
	inbox.open(Folder.READ_WRITE);
	int n = inbox.getMessageCount ;
	Message msgs = inbox.getMessages(n - 10, n);
	for (int i = msgs.length-1; i >= 0; i--) {
		MimeMessage msg = (MimeMessage) msgs[i];
		System.out.print(“    From: ” + msg.getFrom [0]);
		System.out.print(“    Date: ” + msg.getSentDate );
		System.out.print(“    To: ” + msg.getAllRecipients );
		System.out.print(“ Subject: ” + msg.getSubject );
		System.out.println(“ Content: ” + msg.getContent );
	}
	inbox.close(true);
	store.close ;
} catch (Exception e) {
	e.printStackTrace ;
}

Envoyer des messages

L’exemple suivant permet d’envoyer un message en SMTP:

MimeMessage msg = new MimeMessage(session);
msg.addRecipients(Message.RecipientType.TO, to);
msg.setSubject(subject);
msg.setText(content);
Transport.send(msg);

Ressources

JQuery

jeudi 12 juillet 2007

JQuery est une librairie Javascript moderne qui permet de manipuler le DOM HTML, de faire des appels AJAX et qui permet de faire du javascript non intrusif. Cette librairie vient des plugins permettant de créer des interfaces Web 2.0. Cet article décrit une partie des fonctionnalités et des plugins JQuery que j’ai utilisés sur mes applications. Avant de commencer, je vous conseille de lire le tutorial JQuery

JQuery

  • Attendre que le chargement du DOM HTML soit fini:
$(document).ready(function() {
}
  • Définir le texte d’une balise:
 $(“#divid h1”).html(“contenu de h1 du div avec comme id divid”);
  • Définir le click d’un lien:
$(’#import’).click(mafonctionjavascript);
  • Validation d’un formulaire “render”
$(“#render”).submit(function()  {
});
  • Cacher / Montrer un élément:
 $(“#content”).hide() ;
$(“#post”).show() ;
  • Récupérer la valeur d’un élément:
 $(“textarea”).val() ;
  • Mettre à jour la valeur:
$(“textarea”).val(“newval”);
  • Vider le contenu d’une table:
$(“#dlgSearch table tbody”).empty();
  • Modifier les liens d’images avec une boucle:
$.each($(“#content img”),function(i, img){
  img.src = img.src + “&page=” + $s;
 });
  • Ajouter du texte dans un élément:
$(“#dlgSearch table tbody”).append(’blabla’);
  • Ajouter un attribut avec une valeur dans le champ input de nom name dans le formulaire d’id attributeForm:
$(“input[@name=name]”,“#attributeForm”).attr(“readonly”,“readonly”);
  • Récupérer la valeur de l’attribut:
$(“input[@name=name]”,“#attributeForm”).attr(“readonly”);

Plugins

Boîte de dialogue

jqModal permet d’afficher des boîtes de dialogue modale dans une page Web:

  • Créer la boite de dialogue:
<div class=“jqmWindow” id=“dlgSearch”>
…
</div>
  • Créer le style associé:
.jqmWindow {
   display: none;
   overflow: auto;
   height: 500px;
   position: fixed;
   top: 17%;
   left: 50%;
   margin-left: -300px;
   width: 600px;
   background-color: #fff;
   color: #333;
   border: 1px solid black;
   padding: 12px;
}
.jqmOverlay { background-color: #000;
}
* iframe.jqm {position:absolute;top:0;left:0;z-index:-1;
 width: expression(this.parentNode.offsetWidth+’px’);
 height: expression(this.parentNode.offsetHeight+’px’);
}
* html .jqmWindow {
    position: absolute;
    top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + ’px’);
}
  • Manipulation de la boite de dialogue:
// initialiser la boîte de dialogue
$(’#dlgSearch’).jqm() ;
// montrer la boite de dialogue
$(’#dlgSearch’).jqmShow() ;
// cacher la  boite de dialogue
$(’#dlgSearch’).jqmHide() ;

Ajax Upload

Ajax Upload permet d’uploader un fichier sans avoir besoin de recharger la page:

  • Utilisation d’Ajax Upload:
var tform = document.forms[’importForm’];
var turi = ’file-upload?page=’+$s;
$.ajaxUpload({
uploadform: tform,
url: turi,
secureuri: false,
success: function (msg) {
$(’#dlgUpload’).jqmHide() ;
}
});

Navigation dans un tableau

Table Navigation permet d’utiliser le clavier pour se déplacer dans un tableau HTML.

  • Création du tableau
<table class=“navigateable”>
 <tbody></tbody>
</table>
  • Activation de la navigation sur le tableau
jQuery.tableNavigation() ;

Raccourcis clavier

shortKeys permet de gérer des raccourcis clavier facilement.

  • Exemple:
$(’#dlgUpload’).shortkeys(
{ ’Escape’: function   { $(’#dlgUpload’).jqmHide ; }}
);

SVNBackup

mardi 10 juillet 2007

SVN Backup est un script perl permettant de faire un backup d’un repository Subversion et de le recharger si nécessaire. Il permet de faire un dump d’une seule version ou de toutes les versions.

Installer et configurer le script

  • Récupérer les scripts svnbackup et svnbackup.conf à partir du lien suivant https://open.datacore.ch/read-only/svnbackup/trunk/ et les placer dans /etc
  • Créer un répertoire de backup avec les droits en écriture: //Ex: /usr/www/code-backup//
  • Configurer le fichier svnbackup.conf:
$REPOSITORY_NAME{’src’} = ’Code Exemple’;
$REPOSITORY_SRC{’src’}  = ’/usr/www/code’;
$REPOSITORY_DUMP{’src’} = ’/usr/www/code-backup’;
$REPOSITORY_LOG{’src’} = ’/tmp/svnbackup.log’;
$cmd_svnlook         = ’/usr/bin/svnlook’;
$cmd_svnadmin        = ’/usr/bin/svnadmin’;
$cmd_compress        = ’bzip2’;
$cmd_compress_args   = ’-c -z -v -9’;
$cmd_decompress      = ’bzip2’;
$cmd_decompress_args = ’-c -d -v’;
1;

Créer un backup

  • Créer le répertoire de backup déclaré dans le fichier svnbackup.conf. Ex: /usr/www/code-backup
  • Lancer la commande suivante où test est le nom du repository à backuper et dump all correspond à une commande de dump de toutes les versions de Subversion:
sudo perl /etc/svnbackup --rep test dump all
  • Un message de succès doit s’afficher

Charger un backup

  • Lancer la commande suivante où test est le nom du repository de backup, load correspond à la commande de récupération d’un backup et le répertoire de création du repository subversion qui sera créé à partir du backup
sudo perl /etc/svnbackup --rep test load /usr/www/repo-test2
  • Il est possible de remplacer l’ancien repository par le nouveau, mais il ne faut pas oublier de donner les droits en lecture / écriture à apache:
sudo chown -R www-data.www-data /usr/www/repo-test2

Samba

Cet article décrit comment utiliser le client Samba sur Ubuntu pour accéder à des partages Windows

  • Installer Samba
sudo apt-get install samba
  • Installer le client samba
sudo apt-get install smbclient
  • Créer un montage d’un partage Windows (/mnt/partage doit exister)
sudo mount -t cifs -o username=xxx,password=xxx //machine-windows/partage /mnt/partage
  • Supprimer le montage
sudo umount /mnt/outils

MethodesAgiles

mercredi 4 juillet 2007

Cet article résume l’essentiel de ce que j’ai pu apprendre sur les méthodes agiles au cours d’une formation menée par Claude Aubry. Cette formation présentait l’essentiel sur les méthodes agiles et s’interessait plus particulièrement à Scrum.

Qu’est ce que l’agilité

Manifeste agile

L’agilité se base sur un manifeste appelé Manifeste Agile issu de http://www.agilemanifesto.org, en particulier l’agilité s’attache:

  • Aux personnes et leurs interactions
  • A un logiciel qui fonctionne
  • A la collaboration du client dans le projet
  • A l’adaptation au changement

Définition

Définition: “L’agilité est la capacité à favoriser le changement et à y répondre en vue de s’adapter au mieux à un environnement turbulent.” (Jim Highsmith)

Valeurs Agiles

  • Communication
  • Feedback
  • Simplicité
  • Courage
  • Respect
  • Eviter de gaspiller

Principes Agiles

  • Fournir rapidement et fréquemment des versions opérationnelles
  • Accueillir favorablement le changement
  • Assurer une copération forte entre le client et l’équipe de développement
  • Mesurer l’avancement et être transparent
  • Garder un rythme raisonnable
  • Garder un niveau de motivation
  • Se remettre en cause régulièrement

Points essentiels

  • Développement par itérations de 2/3 semaines
  • Approche empirique: basée sur l’expérience
  • Communication avec le métier
  • Responsabilité de l’équipe

Responsabilisation de l’équipe

Contrairement à une approche traditionnelle, l’équipe est responsable:

  • elle connaît les besoins et les priorités
  • elle fait les estimations
  • elle décide de son organisation
  • elle produit un travail de qualité
  • elle remonte les problèmes

Bénéfices

L’agilité augmente la valeur par une prioritisation des livraisons à forte valeur, des releases fréquentes, une autonomie de l’équipe, une réponse favorables aux changements,…

L’agilité réduit les coûts par une réduction des activités qui ne produisent pas de valeur, par une communication rapide et régulière, par des outils permettant de faire de la qualité.

Scrum

Scrum est un processus agile qui permet de produire la plus grande valeur métier dans la durée la plus courte. Du logiciel qui fonctionne est produit à chaque sprint, c’est à dire toutes les 3 / 4 semaines. Le métier définit les priorités, l’équipe s’organise elle-même pour déterminer la meilleure façon de produire les exigences les plus prioritaires. A chaque fin de sprint, tout le monde peut voir fonctionner le produit courant et décider soit de le livrer dans l’état, soit de continuer à l’améliorer pendant un sprint supplémentaire.

Le cadre Scrum

Rôles

  • Un directeur de produit qui est soit le client, soit une personne représentant le client, il:
    • définit les fonctionnalités du produit
    • choisit la date et le contenu de la release
    • responsable du retour sur investissement
    • définit les priorités dans le backlog en fonction de la valeur métier
    • ajuste les fonctionnalités et les priorités à chaque sprint si nécessaire
    • accepte et rejette les résultats
  • Un ScrumMaster qui:
    • représente le management de projet
    • est responsable de faire appliquer les valeurs et les pratiques de Scrum par l’équipe
    • résout les problèmes
    • s’assure que l’équipe est complètement fonctionnelle et productive
    • facilite une coopération poussée entre tous les rôles et fonctions
    • protège l’équipe des interférences extérieures
  • Les équipiers qui:
    • se composent de 5 à 10 personnes
    • regroupent tous les rôles: architecte, concepteur, analyste, développeur, testeur, …
    • est à plein temps sur le projet
    • s’organisent eux-mêmes
    • ne changent pas de composition pendant un sprint

Réunions

  • Planification de sprint:
  • Revue de sprint:
  • Rétrospective:
  • Scrum quotidien

Artéfacts

  • Backlog de produit: liste ordonnée des exigences qui apporte chacune de la valeur métier
  • Backlog de sprint: liste des tâches définie à partir des éléments du produit
  • Graphes d’activité: permet entre deux itérations de connaître la velocité de l’équipe

Le déroulement d’un projet

  • Démarrage: écriture d’une vision, des histoires utilisateurs
  • Estimation et planification
  • Déroulement d’une itération

Vision

Exemple: Pour les professionnels qui souhaitent écrire des articles rapidement avec un système de gestion des versions, le wiki ajax subversion qui permet d’écrire rapidement des articles sous le format wikimodel et qui bénéficie des raccourcis clavier et de la technologie Ajax avec un stockage dans un repository subversion contrairement à d’autres produits comme DokuWiki répondra à leurs besoins.

Histoire utilisateur

Exemple: En tant que redacteur, j’écris des articles au format wiki.

Estimation et planification

Une release se compose de plusieurs itérations, chaque itération contient 2 à 3 histoires utilisateurs. Chaque histoire utilisateur se découpe en tâches. Chaque tâche possède un nombre de points qui correspond à la taille de son exigence en terme de travail et de complexité. Les différents acteurs participent sur l’attributions des points de toutes les tâches et se mettent d’accord. Une fonctionnalité avec un point précis sert de référence pour l’estimation des points des autres tâches. Les points suivent la suite de Fibonacci: 1 2 3 5 8 13.

Dans le cadre du suivi, seul le reste à faire est pris en compte. Le reste à faire se compte en heures. La vélocité de l’équipe correspond au nombre de points faits pendant une itération. Le suivi peut se faire à l’aide d’un graphe d’activité de l’équipe (burndown).

Ressources