Il y en a pour tous les goûts et des incontournables, même si je pense que certaines d’entre elles sont déjà installées sur votre petit bijou de technologie.

Les plus classiques que tout le monde connait, mais je me dois de les renommer :

- Facebook

- Twitter

Pour les autres un petit résumé ne serait pas de refus :

- Eurosport :

L’application ultime pour tous les fans de sport en tout genre : résultats, résumés, vidéos, articles, … Tous les paramètres sont présents pour faire du sport sans bouger son cul de son canap’.

- Dans Ton Chat

Vous aimez les perles du net de Bashfr vous adorerez celle de Dans Ton Chat (ou DTC pour les intimes). Une sélection des choses les plus tordantes qui se passent sur les IRC et les Tchat en tout genre. Prenez vos mouchoir et préparez les slips de rechange.

- iFon.fr

Vous voulez suivre les nouveautés sur les nouvelles applications, le matériel, les aides à l’utilisation de l’iPhone, iPad et tout ce qui touche à Apple en général : cette appli est faite pour vous, et en plus vous avec une sélection tous les soirs des appli exceptionnellements gratuites ou en baisse de prix.

- Gamekult

Depuis la nouvelle version : Gamekult est L’APPLICATION à avoir pour tous les fans de jeux vidéos. A mort les critiques faites par des sites qui ne sont pas impartiaux, Gamekult envoi du rêve sur vos mobiles. Pas de prise de tête après avoir acheté un jeu bien noté alors qu’il est nul comme sur jeuxvideo.com, vous avez affaire à de vrais pros.

- Flipboard

Beaucoup d’entre vous en ont marre d’ouvrir plusieurs appli pour suivre les news (Facebook, Twitter, 20minutes, ….), et bien avec cette appli vous pouvez toutes les ouvrir en même temps. C’est un livre ouvert sur les infos que vous voulez voir (seul bémol : vous ne pouvez pas avoir les notifications et les messages Facebook). Elle est facile d’utilisation et a un design simple mais c’est sympa, ha oui c’est SYMPA.

- soTV FR

L’application qu’il vous faut pour suivre ce qu’il se passe sur le petit écran. Vous pouvez la paramétrer comme vous le souhaitez, choisir vos chaines préférées, regarder le programme d’heure en heure ou de toute la soirée. Bref une appli sans faille pour ceux qui regardent encore la télévision … ou juste pour se foutre de la gueule de ceux qui la regarde encore !

- VDM

On ne le présente plus : VDM, le site des gens qui n’ont pas de chance et qui feraient mieux de s’acheter une corde. VDM ou le site qui répertorie toutes les histoires les plus farfelues de la vie de tous les jours, enfin de tous les jours, façon de parler car faut vraiment le provoquer des fois. A ne pas manquer.

- 20minutes.fr

Une très bonne appli pour suivre l’actualité avec la possibilité de les suivre par thème ou chronologiquement. Les articles sont un peu juste des fois mais ça suffit amplement à mon goût pour se tenir au courant de ce qui se passe dans le monde. Par exemple aujourd’hui en 4 secondes j’ai su que je ne devais pas regarder la télé…

 - Dolphin

Et enfin le navigateur internet Dolphin Browser. Une très bonne appli pour plus de rapidités qu’Opera ou Safari, et de très bonnes fonctionnalités (comme par exemple : la page d’accueil avec vos favoris, le multi-touch, une barre d’adresse qui propose l’auto-complétion lors de la frappe …) et puis c’est joli.

Bien sûr cet article est écrit avec une grande objectivité et j’espère que cela vous plaira pour mon premier essai : Votez 1 pour un rappel ou 2 pour que je la ferme au 3615 (0.15 cts plus coût d’un sms).

Sur ce je vous laisse DL ce dont vous avez besoin, bien sûre toutes ces appli sont gratuites.

Topette !

Une époque bien avant celle de Caramail ou encore celle où tu grillais 20 minutes de ton forfait 50 heures AOL pour consulter tes cheats sur l’ETAJV de jeuxvideos.com pour foutre Lara Croft à poil.

Je veux bien entendu parler des jeux qui ont bercé toute une génération. Ces merveilles auxquelles vous avez joué et suivi l’évolution technologique.

Le titre de l’article fait référence au niveau de jeu le plus simple du jeu Wolfenstein 3D, un bon vieux jeu de tir en vue subjective.  Le décor est planté !

Wolfenstein 3D

Personne n’aurait osé appeler cela un « Doom-Like » à l’époque. Pourquoi ? Parce que Wolf 3D est sorti 1 an avant Doom. Si tu aimais le pixel, ce jeu était fait pour toi. L’objectif ? Buter du nazis, des mutants et des bergers allemands. Ouais ça donne envie de sortir du maquis.

Tu incarnais Blazkowicz, un immigrant d’une famille polonaise qui avait grandi sous le drapeau ricain, prêt à servir son pays et envoyé en Europe sur les terres de l’occupation. Mis à part éliminer Hitler, l’objectif était de s’échapper du château wolfenstein.

Les jeux vidéos d’aujourd’hui se basent sur les guerres du golfe, d’Irak et d’Afghanistan.
Mais bon comme dirait Rambo « C’est pas Ma Guerre« .

Les aventures de Moktar: A la recherche de la Zoubida

En 1993, j’imagine encore le brainstorming dans le bureau de Titus, les développeurs qui ont eu l’idée de se taper un délire en créant un jeu vidéo incarnant le personnage du videoclip « La Zoubida » de Vincent Lagaf   »Moktar« .

C’est comme si en 2002, ils avaient réitéré avec le personnage de Félicien et baptisé le jeu « CumCum Mania ». (Je tiens peut-être un concept…)

Finalement un bon jeu à licence qui s’est avéré potable pour l’époque au niveau graphismes et assez bien reçu par le public. L’histoire d’un maghrébin, qui cherche à fuguer vers Marrakech en emmenant « sa pine-co La Zoubida » (je parle le verlan des années 90)  en traversant Paname et ses rues infestées de Skinheads, de chiens enragés,  et d’ivrognes qui jettent des canettes de Cacolac.
Fallait pas vivre à Paris en 93, à en croire le scénario ça craignait pas mal, mais souvenez-vous  son tapis volant qui lui permettait de faucher ses ennemis.

Prince Of Persia

La base du jeu de plateforme, le premier jeu de la série bien connue est sorti en 1989. L’objectif est simple, t’as 60 minutes pour torcher le jeu et sauver la princesse, dans un univers des milles et une nuits. (C’est l’instant envoûtant, vole en tapis volant, vers la magie des nuits d’orieeeeents. Ô nuits d’arabiiiie, mille et une foliiiie…)

Un jeu passionnant avec des mouvements souples et fluides (sauter, s’accroupir, donner des coups d’épée et courir) pour éviter les pièges, résoudre les énigmes et éliminer les gardes sur votre passage. Il me semble qu’aucun héro ne s’est autant fait empaler sur des pièges ou éclater 15 mètres plus bas en ratant un saut.

Le seul véritable challenge était de terminer le jeu en moins d’une heure, aucun score n’est disponible. Cela n’a pas empêché les joueurs d’accueillir cette belle série.

The Incredible Machine

Pour les fanatiques de Puzzle, on passait sur un autre concept que d’assembler chaque pièce pour former une illustration d’une biche dans une clairière. Le jeu TIM, pour les inTIMes (il fallait la faire),  avait pour objectif de créer des machines super compliquées pour arriver à un but… exploser un ballon ou mettre une balle dans un trou etc…

Je suis d’accord avec vous, se casser la tête pour mettre un ballon de basket dans un panier, on aurait pu trouver plus palpitant.

Il suffisait d’enchaîner la centaine de niveaux en positionnant des éléments sur le puzzle: des ciseaux, des ficelles, des ventilateurs pour ensuite lancer l’animation et essayer de déplacer le ballon avec les ventilos pour le faire exploser.

Bon je crois qu’à l’époque les développeurs ne s’étaient pas foulés sur le principe de la sauvegarde. Un mot de passe en fin de niveau permettait de revenir au dernier niveau terminé. Tu avais intérêt d’avoir ton bloc-note à coté de ton clavier pour noter ton évolution.

Si tu voulais te la jouer au professeur TIM, tu avais la possibilité de créer tes propres niveaux pour défier tes potes qui n’avaient pas de PC chez eux.

Battle Chess 

Pour tous les joueurs d’échec, ce jeu était la référence ! Sorti en 1988, tu pouvais même inviter ton copain qui n’avait pas d’ordinateur chez lui, car le jeu disposait d’un mode multijoueur. (2 joueurs… en même temps à 3 c’était compliqué)
Mais si tu n’avais pas d’ami, tu pouvais aussi jouer contre une intelligence artificielle.

Ce jeu n’était rien d’autre qu’une simple partie d’échec, mais ses animations l’ont rendu célèbre. En effet, une fois que l’on avait choisi la destination des pièces, les Pions prenaient vies et s’engageaient dans un combat épic.

C’était toujours plus palpitant que de jouer aux échecs avec Tonton Jean-Claude le Dimanche après-midi.

Rien que d’y repenser, j’ai envie de chialer…

C’était mieux avant 

Tu vas me dire « Mouais, il y avait mieux comme jeux… », je suis désolé j’ai sélectionné les 5 disquettes qui me sont tombées sous la main. Si tu n’as plus de disquette, vas-donc faire un tour sur http://www.abandonware-france.org/, tu n’auras pas le son brutal du lecteur de disquette mais la nostalgie renaîtra.

C’est pour cela que je vous propose ce petit tutoriel, afin de créer un superbe slider, type accordéon, uniquement en CSS3. Il est vrai que la plupart des slider sur les sites web (comme celui présent sur ma page d’accueil), utilise une couche de Javascript pour animer les différentes images. Mais avec les nouvelles propriétés CSS3, vous pouvez désormais réaliser votre slider sans cette surcouche de code. De plus, il s’adapte à toutes les résolutions.

Alors voyons comment réaliser cela.

Partie HTML

La partie HTML est assez basique. Vous allez créer une div qui recevra le style et les « animations » au survol de chaque image. Le slider sera défini à base de ul – li.

Vous rajouter un style à chaque image, afin de placer une légende sur chaque image.

<div class="accordeon">
	<ul>
		<li>
			<div class="image_title">
				<a href="#">Bench</a>
			</div>
			<a href="#">
				<img src="assets/img/imgSlider1.png"/>
			</a>
		</li>
		<li>
			<div class="image_title">
				<a href="#">Embarcadero</a>
			</div>
			<a href="#">
				<img src="assets/img/imgSlider2.png"/>
			</a>
		</li>
		<li>
			<div class="image_title">
				<a href="#">Bay Bridge</a>
			</div>
			<a href="#">
				<img src="assets/img/imgSlider3.png"/>
			</a>
		</li>
		<li>
			<div class="image_title">
				<a href="#">Haight & Ashbury Shrooms</a>
			</div>
			<a href="#">
				<img src="assets/img/imgSlider4.png"/>
			</a>
		</li>
		<li>
			<div class="image_title">
				<a href="#">San Francisco By Night</a>
			</div>
			<a href="#">
				<img src="assets/img/imgSlider5.png"/>
			</a>
		</li>
	</ul>
</div>

Partie CSS 

.accordeon {
	width: 805px; height: 320px;
	overflow: hidden;

	margin: 100px auto;
	box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
	-webkit-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
	-moz-box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.35);
}

.accordeon ul {
	width: 2000px;

}

.accordeon li {
	position: relative;
	display: block;
	width: 160px;
	float: left;

	border-left: 1px solid #888;

	box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0 0 25px 10px rgba(0, 0, 0, 0.5);
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;

}

.accordeon ul:hover li {width: 40px;}

.accordeon ul li:hover {width: 640px;}

.accordeon li img {
	display: block;
}

.image_title {
	background: rgba(0, 0, 0, 0.5);
	position: absolute;
	left: 0; bottom: 0;
	width: 640px;	

}
.image_title a {
	display: block;
	color: #fff;
	text-decoration: none;
	padding: 20px;
	font-size: 16px;
}

Et voila, comme je l’ai dit pas de Javascript.

Vous pouvez visualiser l’exemple ici, et même télécharger le code source.

Et n’oubliez pas le concours organisé sur JFPalmier.fr, en partenariat avec les éditions ENI, qui vous permet de remporter un exemplaire de l’ouvrage « jQuery – le framework Javascript du web 2.0″.

Si vous voulez travailler vos évènements, et surtout qu’ils soient appelés, il faut les mettre dans la méthode $(document).ready(). Cette méthode permet de dire à votre navigateur de ne s’occuper de tout ce qu’il y a à l’intérieur qu’une fois que votre DOM sera chargé mais avant que votre page ne soit affichée. Ainsi, tous les éléments de votre page seront connus, mais vous pourrez les modifier de la façon que vous désirez avant qu’ils ne soient affichés.

Cette méthode vous permet aussi de travailler dans des fichiers séparés, afin de bien différencier votre code HTML de vos traitements javascript, ce qui rends votre code plus propre et plus facile à maintenir. Et plus besoin nom plus d’appeler votre méthode dans le onload de votre balise <body></body>.

Nous allons directement passer par un petit exemple pour éclairer vos lanternes.

Quelle différence avec $(document).ready() ?

Partons d’un exemple tout simple, une page avec 3 éléments affichés dans une liste :

<html>
<head>
<title>jQuery de Zéro - Lesson 2 : $(document).ready()</title>
<script type="text/javascript" src="jquery.min.js"></script>

<script type="text/javascript" >
$('li:first-child').text('Hello World');
</script>

</head>

<body>

<ul>
	<li>Element 1</li>
	<li>Element 2</li>
	<li>Element 3</li>
</ul>

</body>
</html>

Nous avons donc déclaré 3 éléments <li></li> contenant chacun un texte à l’intéreur. Et nous avons demandé en Javascript de modifier le premier élément de la liste en le renommant « Hello World« . Testez cette page et voyez le résultat :

• Element 1
• Element 2
• Element 3

La modification n’a pas été effectuée. Maintenant passez votre script à la fin de vos déclarations dans le body.

<html>
<head>
<title>jQuery de Zéro - Lesson 2 : $(document).ready()</title>
<script type="text/javascript" src="jquery.min.js"></script>
</head>

<body>

<ul>
	<li>Element 1</li>
	<li>Element 2</li>
	<li>Element 3</li>
</ul>

<script type="text/javascript" >
$('li:first-child').text('Hello World');
</script>

</body>
</html>

Résultat : 

• Hello World
• Element 2
• Element 3

Avec cet exemple ci, le premier élément de la liste à bien été renommé en « Hello World ».

La différence ici est que dans le premier exemple, votre navigateur va lire votre code ligne par ligne. Et lorsqu’il va tomber sur la déclaration Javascript $(‘li:first-child’).text(‘Hello World’);, il va se dire Okay, je veux bien travailler sur tes éléments li, mais ils sont où. A ce moment là, il n’a pas encore connaissance de vos déclarations qui seront effectuées dans le body. Du coup, il passe à travers et continue ses traitements.

Dans le second exemple, comme on est passé par les déclarations de vos li, il peut travailler dessus.

Et bien la méthode $(document).ready() est là pour pallier à ce problème, et ne lancer ses traitements qu’une fois que le DOM aura été chargé, et que toutes vos déclarations auront été lues et prises en compte.

Alors comment marche $(document).ready() ?

Maintenant que vous avez compris l’utilité de cet appel à jQuery, nous allons voir comment l’utiliser.

Tout d’abord, étudions sa structure :

$(document).ready(function() {});

Vous passez donc à jQuery l’objet document, de la même façon que vous passeriez un sélecteur css. Ainsi, il sais à quel type d’objet il à affaire. Vous pouvez voir en ouvrant votre fichier jquery.js (la version développement bien sûr, si vous ouvrez la version minifiée vous allez très vite le regretter) et que vous étudiez le code l’appel à jQuery, vous verrez qu’il va effectuer une série de test afin de définir de quel type est le sélecteur passé en paramètre. Et lorqu’on lui passe le document, il va le retourner une fois chargé.

Ensuite, on lui précise la méthode ready(), afin de lui spécifier que, lorsque le DOM sera chargé, alors il faudra effectuer les traitement passés en paramètres à cette méthode.

Puis, je lui passe le paramètre function()  {}. Ici, je lui passe une fonction anonyme, mais vous pouvez très bien définir votre fonction précédemment et lui passer en paramère. Il est plus simple et plus clair de lui passer une fonction anonyme de cette façon, afin de ne pas avoir à chercher partout les traitements à effectuer. Vous savez qu’ils sont à l’intérieur.

Reprenons maintenant l’exemple que nous avons précédemment testé, en utilisant $(document).ready().

<html>
<head>
<title>jQuery de Zéro - Lesson 2 : $(document).ready()</title>
<script type="text/javascript" src="jquery.min.js"></script>

<script type="text/javascript" >
$(document).ready(function() {
	$('li:first-child').text('Hello World');}
);
</script>

</head>

<body>

<ul>
	<li>Element 1</li>
	<li>Element 2</li>
	<li>Element 3</li>
</ul>

</body>
</html>

Résultat : 

• Hello World
• Element 2
• Element 3

Comme vous pouvez le voir, j’ai effectué mes traitements jQuery avant que le DOM ne connaisse mes éléments li, et pourtant il a bien modifié. Car cette fois ci, jQuery à attendu que le DOM soit entièrement chargé pour effectuer ses traitements et modifier le premier élément de la liste en le renommant.

C’est fini pour aujourd’hui

Oui, ça passe vite. Mais vous avez déjà compris les bases de jQuery et la méthode $(document).ready(). Dans le prochain cours, nous verrons comment manipuler le DOM avec jQuery. Tenez vous prêt pour ce chapitre. Sur ce, à bientôt.

Et n’oubliez pas le concours organisé sur JFPalmier.fr, en partenariat avec les éditions ENI, qui vous permet de remporter un exemplaire de l’ouvrage « jQuery – le framework Javascript du web 2.0″.

La suite CreateJS comprends plusieurs librairies, chacune d’elles répondant à des besoins précis (animation, son, préchargement, …), ainsi qu’un outil permettant d’exporter des animations SWF, pour qu’elles puissent être utilisées dans un Canvas.

La suite Create.JS – plusieurs librairies pour un seul projet

Comme je vous l’ai explique, la suite CreateJS vous propose plusieurs librairies pour tous vos projets HTML5, que vous pouvez aussi bien faire fonctionner individuellement qu’en partenariat. Voici donc une vue d’ensemble de la qualité qui vous est proposée.

EaselJS

EaselJS fournit des solutions permettant de travailler avec des graphismes riches, ainsi que l’interactivité avec Canvas HTML5. Il fournit une API qui sera familière aux développeurs Flash, mais qui garde la sensibilité et la flexibilité de Javascript. Il se compose d’une liste complète d’outils, d’un  affichage hiérarchique, un modèle d’interaction de base et des classes d’assistance qui facilitera énormément votre travail.

Vous pourrez donc réaliser, par exemple, avec EaselJS, des évènements déclenché à la souris ou par une touche de clavier sur un élément HTML, ou même gérer les apparitions d’éléments sur votre application.

TweenJS

TweenJS est une bibliothèque pour l’animation des éléments en Javascript. Il a été développé pour s’intégrer avec la bibliothèque EaselJS, mais sans en être obligatoirement dépendante. TweenJS prend en charge l’interpolation des deux propriétés de l’objet numérique et les propriétés de style CSS. L’API est simple mais très puissante, ce qui rend facile de créer des interpolations complexes par des commandes de chaînage.

Cette librairie vous permettra donc d’effectuer des rotations, des translations sur vos objets, par exemple.

SoundJS

Le support multi-navigateurs pour l’audio est actuellement un casse-tête sans nom avec HTML5. Mais SoundJS travaille pour résoudre ces problèmes et ainsi vous permettre d’ajouter du son à vos jeux ou applications, et rendre l’expérience utilisateur beaucoup plus riche.

Vous pourrez donc adapter tous vos sons suivants les plateformes et les navigateurs.

PreloadJS

PreloadJS est indispensable pour précharger toutes vos données : images, sons, Javascript, … . Il utilise XHR2 pour obtenir les informations qui sont chargées en temps réel, les fallback si le chargement échoue.

Il permet aussi les files d’attentes multiples, ainsi que les pauses dans ces files, les connexions multiples, et tant d’autres possibilités.

Zoë

Zoë est une application AIR qui convertit les animations SWF en sprite sheets.

Il vous suffira de glisser un fichier SWF dans l’application, et Zoë va automatiquement détecter les dimensions requises pour chaque images , de maintenir les données de ces images , et ensuite l’exporter vers une spritesheet.

Zoë possède encore beaucoup d’autres fonctionnalités toutes plus utiles les unes que les autres.

CreateJS et sa Documentation/Communauté

En plus d’être un groupement de librairies très puissant, CreateJS possède une documentation de très grosse qualité, proposant des démonstrations, des tutoriaux et une doc précise pour chaque librairie qui la compose.

De plus, les communautés de chaque librairies aident à ce projet, en proposant une base de connaissances et de bugs rencontrés, afin d’améliorer les futurs développements que vous pourrez rencontrer.

« LA » suite à utiliser pour créer ses jeux et ses application riches

Vous l’aurez donc compris, cette suite est réellement sur-puissante, proposent des outils plus qu’adaptés pour chaque besoins que vous rencontrerez pour vos développements futurs, en terme de jeux vidéos jouables dans le navigateur ou sur mobile, ainsi que pour vos applications riches ayant des besoins d’animations et de sons, avec une très grosse expérience utilisateur. Vous pourrez découvrir sur leur site les projets qui ont vu le jour grace à CreateJS.

Site Officiel

Et n’oubliez pas le concours organisé sur JFPalmier.fr, en partenariat avec les éditions ENI, qui vous permet de remporter un exemplaire de l’ouvrage « jQuery – le framework Javascript du web 2.0″.

C’est un livre très complet et très bien expliqué, pour démarrer et devenir un vrai ninja de la librairie jQuery. Vous voulez en savoir plus ? Ne bougez pas, on y va tout de suite.

jQuery – le framework Javascript du web 2.0

Les éditions ENI, l’éditeur n°1 de livres d’informatique en français, vous offrent donc un ouvrage parmi des centaines : « jQuery – le framework Javascript du web 2.0« .

C’est un livre qui s’adresse aux débutants comme aux experts, qu’ils soient développeurs, intégrateurs, … qui travaillent dans la création de site et d’applications web. L’auteur privilégie une approche structurée et progressive pour, au fur et à mesure des chapitres, vous apprendre à maitriser la librairie jQuery, à travers de la théorie, des exemples et des mises en pratique.

Les principaux thèmes abordés sont :

• Les sélecteurs
• La manipulation des attributs
• La manipulation des feuilles de style
• Les évènements
• Les animations/effets
• La manipulation du DOM
• AJAX
• Développer ses propres plugins
• …

Un ouvrage qui rendra donc vos sites et application beaucoup plus dynamique et puissants. Même une fois la lecture terminée (pour ceux qui lisent les livres d’informatique comme des romans, il deviendra votre livre de chevet), il vous servira de bible jQuery à garder prêt de soi lors de ses développement. Vos collègues seront jaloux et vont même tenter de vous le piquer.

Comment gagner cet ouvrage

Mais oui Jamy, on fait comment pour participer ?

Et bien mon petit Fred, c’est tout simple. Il vous suffit de :

• Poster un commentaire sur cet article (comme ça j’aurai votre adresse mail, pour vous contacter si vous gagnez)
• Suivre le compte @jeffpalmier sur Twitter
• Et de tweeter le message suivant : « Gagnez un ouvrage de « jQuery – le Framework Javascript du web 2.0″ gràce à @jeffpalmier et @EditionsENI http://goo.gl/RNsh0″

Et tout ceci avant dimanche 27 mai à minuit. Un gagnant sera tiré au sort parmi les participants.

Vous pouvez augmenter vos chances de gagner en relayant cet article sur plus de réseaux (Facebook, Google+, votre blog, …).

Sur ce, je vous souhaite bonne chance !!!

Mais ce n’est pas toujours la technique qui fait la réputation d’un application, beaucoup plus les idées, comme on a pu le voir avec Instagram par exemple.

Voici donc une vue d’ensemble des meilleures applications existantes sur l’AppStore.

Draw Something

Draw Something est le jeu qui buzz en ce moment. L’objectif est des plus simples : Faire deviner à votre partenaire un mot en le dessinant. C’est le principe du Pictionnary, mais en ligne. Vous disposez de 4 couleurs (bleu, jaune, rouge et noir), 4 épaisseurs de traits, une gomme et la possibilité de tout effacer d’un coup. Vous pouvez aussi acheter de nouvelles couleurs et options pour enrichir vos capacités.

C’est un incontournable actuellement, pas besoin de savoir dessiner, juste d’avoir de l’imagination. Vous pouvez jouer avec vos amis ou bien jouer contre d’autres personnes au hasard, lesquels sont vite trouvés.

Bref un jeu très addictif, et qui permet de voir de très belles créations.

Instagram

Peut être une des plus belles réussites que l’on ai pu connaitre sur smartphones (avec la série Angry Birds, mais qui, quand à elle, est payante).

Instagram est une application photo sur smartphone (iOs, Android) qui permet d’affecter des effets très sympathiques à vos photos. La nouvelle version permet même d’essayer les filtres en direct, pendant la prise. Ce service intègre également un réseau social, grace auquel vous pouvez partager vos photos mais aussi suivre celles de vos amis. Il est également possible de partager toutes vos photos sur Facebook ou Twitter.

Dernièrement, Instagram à été racheté au prix d’1 milliard de dollars par Facebook. Il y a fort à parier que le réseau social numéro 1 a une idée derrière la tête avec ce service de photographie.

Shazam

Je ne sais pas s’il est encore utile de présenter Shazam. Cette application est extrêment pratique : Elle peut reconnaitre une musique dans n’importe quelles conditions, que vous soyez à l’extérieur ou bien chez vous, et vous donne le titre et l’artiste après seulement une écoute d’une vingtaine de secondes. Vous pourrez ensuite partager ce titre ou même l’acheter directement sur l’appstore.

Fini le temps où vous entendiez une musique et vous passiez un temps monstre à essayer de la retrouver, en tapant un pathétique « musique qui fait lalala lala nanana lala » sur Google.

Skype

Racheter dernièrement lui aussi, mais par Microsoft, Skype est un logiciel de communication très complet. Tout le monde le connait sur ordinateur, c’est un indispensable pour les communications vidéo, les vidéos conférence et même les appels téléphoniques.

Mais sa version smartphone n’est pas en reste. Vous avez les même possibilités que sur votre ordinateur : discuter avec vos contacts, communications vidéos et même appels par IP. Si jamais vous possédez un compte Skype, alors l’application iPhone est un indispensable pour vous.

GMail

A quoi bon prendre l’application GMail alors qu’on peut utiliser le client mail de l’iPhone, qui fait le boulot aussi bien ?

Et bien parcequ’il ne fait pas le boulot aussi bien justement. Cette application est bien plus adaptée à GMail que ne peut l’être le client mail. Les dossiers sont plus clairs, l’ajout de pièces jointes peut se faire directement du mail, vous pouvez activer les réponses automatiques de votre iPhone, … Bref, beaucoup plus puissant, il n’y a rien à dire.

Et je sais que personnellement, j’ai beau avoir configuré mon client mail comme il faut, il y a toujours des fois où j’ai des petites problèmes. Avec cette appli, plus un seul souci.

Les Guignols de l’info

En voila une application que l’on attends depuis très longtemps. Personnellement, depuis que j’ai joué aux jeux des Guignols sur PC, sortis à la fin des années 90.

Bon là, il n’est pas tout a fait question de jeu. Vous allez surtout pouvoir accèder à toutes les émissions des Guignols diffusés sur Canal+, des bonus, des sketchs, les duplex …

Mais ils vous offrent tout de même un jeu : PrésiJump. Celui ci est un Doodle-Jump Like, dans lequel il faut faire monter la marionnette du candidat le plus haut possible. Une parodie de Doodle Jump qui vous amusera beaucoup.

Around Me

Une application plus qu’indispensable sur votre smartphone.

Around Me vous permettra de trouver tous les commerces, restos, … qui se trouvent autour de l’endroit où vous vous trouvez, gràce à la géolocalisation. Il vous donnera la distance qui vous sépare de ceux ci, et vous propose une liste très détaillée. A savoir que vous pouvez également effectuer une recherche par rapport à un magasin ou une enseigne précise.

Ca en sera désormais fini de chercher le bureau de tabac le plus proche des apparts de vos amis.

Bump

On ne peut dire que Bump est l’application la plus utile de l’histoire, mais son principe est très bon.

Il vous suffit d’ouvrir l’application et de taper (pas trop fort s’il vous plait) un autre iphone qui possède l’application. Cela vous permettra de partager vos contacts, vos photos et aussi de connaitre vos amis en commun.

C’est un peu plus marrant que d’envoyer les photo par bluetooth ou par MMS.

PhotoSynth

Une très bonne surprise sur l’iPhone. Et celle ci vient de la part de Microsoft. Alors que la firme de Redmond propose une application gratuite est déjà une bonne chose, mais la qualité de cette application en est une bien meilleure.

Photosynth est une application photographique qui vous permet de réaliser une photographie 3D de l’endroit dans lequel vous vous trouvez. Vous y découvrirez de nombreuses fonctionnalités et une très bonne intégration de Bing.

Tout le savoir faire de Microsoft dans une application à posséder de toute urgence.

iSeries

Avec l’avènement des séries qui nous controle tous depuis plusieurs années, il était important de pouvoir gérer tout cela de son iPhone. Sachez qu’il y a une application pour ça.

iSéries vous permet de renseigner les séries que vous suivez, les épisodes que vous avez déjà vu et elle vous dira dès qu’un nouvel épisode est sorti. Vous pourrez même recevoir une notification à chaque nouveautés.

Et vous, avez vous des applications gratuites qui auraient mérités leur place dans ce top 10 ? N’hésitez pas à me le dire en commentaire.

La première version ne travaillait que sur les coordonnées (latitude, longitude), mais l’auteur à ajouté la possibilité d’utiliser les adresses dans sa nouvelle version. Il faut avouer que c’est beaucoup plus simple de partir d’une adresse directement.

Comment se servir du plugin gMap ?

Vous allez tout d’abord avoir besoin de votre propre clé de l’API GoogleMaps. Vous pourrez trouver cela ici.

Il vous faudra ensuite appeler l’API Google Maps, jQuery et votre plugin.

<script type="text/javascript" src="http://maps.google.com/maps?file=api&;amp;v=2&amp;key=API_KEY"></script>
<script type="text/javascript" src="javascripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="javascripts/jquery.gmap-1.0.0.min.js"></script>

Vous n’aurez ensuite qu’a déclarer une div qui intégrera votre carte.

<div id="map"></div>

Enfin, faites appel à la classe gMap et le tour est joué.

	$(function() {
		$("#map").gMap();
	});

Il existe de nombreuses options pour utiliser au mieux ce plugin :

• Travailler sur les adresses
• Travailler sur les latitudes/longitudes
• Gérer la position du zoom
• Adapter les markers à vos besoins
• Activer/désactiver le scroll à la molette
• Modifier les icones
• …

Et vous, que pensez vous de ce plugin ? L’avez vous déjà utilisé ou travaillez vous avec d’autres plugin ?

Site officiel

Définition

Un mod, qui vient de l’anglais modification (vous me direz, en français c’est le même mot. Oui, mais les anglais l’ont sûrement inventé en premier, ça doit être pour ça), est un jeu vidéo créé à partir d’un jeu déjà existant, le modifiant tout ou partie, qui peut ensuite se greffer à l’original. Ces mods se recontrent principalement sur PC, plateforme sur laquelle les éditeurs de jeux vidéos proposent souvent un SDK ou juste un éditeur de cartes, afin de faciliter le travail des modeurs.

Il est alors possible de modifier tout ce qui ne touche pas au moteur du jeu, sinon ça pourrais vite devenir le bordel. Vous pouvez donc modifier les armes, les personnages, les vêtements, les décors, les ennemis, le scénario … C’est amplement suffisant pour se faire plaisir sur un jeu et recréer un tout nouveau concept. Les créateurs peuvent aussi choisir de rendre ce mod jouable en solo, en offrant une nouvelle histoire, ou bien en multijoueurs, en apportant bien souvent une grose dose de fun au jeu.

On retrouvent principalement ces mods sur FPS ou des STR, jeux les plus adaptés pour ce type de modifications. Le plus célèbre du genre est certainement Counter Strike, qui était à l’origine un mod de Half Life et est devenu un jeu à part entière, bien plus fréquenté que son papa. De nombreux autres jeux ont été affublés de mods, comme Quake, GTA, Warcraft3, Starcraft2, Minecraft, etc.

Faisons donc un petit tour au pays des mods qui auront laissés leur trace.

Un petit clic pour l’homme, un grand pas pour le monde du jeu vidéo

Counter Strike

Je ne pouvais pas commencer cette liste des meilleurs mods par un autre jeu que Counter Strike. C’est sûrement le mod le plus connu et le plus joué du monde, de nombreux joueurs ne sachant même pas qu’il descend du grand Half Life. Counter Strike est une modification complète (ou Total Conversion) de Half Life, créé en 1999 par Minh Lee et jess Cliff.

Le but, s’il est besoin de le rappeler, est d’opposer deux équipes, les terroristes et les antiterroristes, qui, pour remporter une manche, doivent soit accomplir les objectifs de la carte (poser/désamorcer une bombe, sauver les otages, …), soit élminer complètement l’équipe adverse. Chaque joueur commence avec les mêmes points de vie que les autres, mais peut choisir ses armes et son équipement parmi un large choix de pistolets, fusils, mitraillettes, fusil sniper, grenades, kevlar, … Les frags et les victoires de chaque manches rapportent de l’argent, qui permet au fur et à mesure d’acheter des équipements et armes plus puissantes.

Sur Counter Strike, contrairement à la plupart des FPS en multijoueur, ne permet pas un respawn après chaque mort, mais doit attendre la fin de la manche. Il devient alors observateur, sans bien sûr pouvoir discuter avec ses partenaires. Counter Strike est un des jeux ayant reçu le plus de récompenses et le plus joué en ligne de l’histoire. Il est encore actuellement énormément joué en LAN et en tournoi, sur sa dernière version « Counter Strike Source« .

DotA (Defense of the Ancients)

DotA est une carte personnalisée sur Warcraft3 : Reign of Chaos et Warcraft3 : The Frozen Throne, inspiré de la map Aeon Strife pour Starcraft. Deux équipes de plusieurs joueurs s’affrontent, chacun possédant son héros et étant assisté d’unités contrôlées par l’IA, doivent détruire un batiment nommé the « Ancient », situé dans la base adverse. DotA comptait, en 2009, plus de 15 millions de joueurs et était joué lors de grand tournois internationaux, comme la BlizzCon, par exemple.

Il a d’ailleurs énormément influencé le monde des jeux vidéos, dont certains ont repris son système, comme League Of Legend ou Heroes of Newerth. D’ailleurs, un mod pour Starcraft2 nommé Blizzard AllStars est en développement actuellement.

MarineArena

Comme la plupart des jeux de Blizzard, Starcraft ne déroge pas à la règle et possède lui aussi de nombreux mods. MarineArena est donc un mod de Starcraft2, un des plus populaire actuellement. Quatre équipes composées de deux joueurs s’affrontent, sur une grande map, avec un point statégique au milieu, permettant d’améliorer ses troupes ou d’en engager de nouvelles. Des marines spawn toutes les 2 secondes dans vote base, et vous pouvez choisir une autre unité en mercenaiers, dont le temps de spawn sera réalisé suivant la puissance de chaque unité. Les ressources sont gagnées en fraggant ses adversaires. il ne faut donc pas spécialement attendre d’avoir beaucoup de troupes pour attaquer, sous peine de se retrouver face à des armées uberstuffées et améliorées à l’extrême.

MarineArena apporte également à Starcraft le système de héros, qui n’existe pas dans sa version originale et dans les parties sur le ladder.

Killing Floor

Killing Floor, qui est à l’origine un mod de Unreal tournament, est un FPS Survival Horror se déroulant à Londres.

Dans un genre très proche de Left4Dead, votre but est de survivre à des hordes de zombies qui deviennent de plus en plus puissantes, le tout en mode coopératif. Un très bon jeu à tester si vous ne le connaissiez pas.

Conclusion

Les mods sont donc des personnalisations très intéressantes dans le jeux vidéos, vous apportant une dose de nouveauté et de créativité à certaines parties trop redondantes.

Si vous n’avez jamais testé un seul de ces 4 mods, je vous conseille de les essayer sans plus attendre.

Il est encore temps de commander une dernière fois ton Tee-shirt Fido Dido ou ton survêtement Champion USA.

La fin des services du Minitel a été annoncé il y a quelques mois, pour juin 2012. Mais voilà tu t’en fous, tu as enterré ton Minitel au fond du Jardin en 2001, en contractant un abonnement AOL 50h/mois.

« 3615 Code TAVIE Rubrique Jmenfous »

Environ 800.000 Minitels sont actuellement (et encore) en service aux 4 coins de l’hexagone. (Et là tu comptes le nombre de coins que comporte un hexagone)

D’irréductibles professionnels ont encore du mal à passer aux services Internet. Pour les nouvelles générations, la consultation des horaires des séances de cinéma, réservation SNCF, commande aux 3Suisses, restent un lointain souvenir. Quoique, je lance le défi à tonpetit frère de réussir à se connecter aux services Minitel. (JeffPalmier.fr se charge de lui offrir un PushPop s’il réussit)

Oui mais Voilà quoi!

Chers Minitélistes, préparez-vous à vous équiper d’un ordinateur, d’un modem-routeur et d’un abonnement internet pour consulter le « 3617 Annu… si vous avez le numéro vous retrouverez le nom », 1 à 3 fois par mois.

Evidemment ça risque de gueuler dans les chaumières, la simplicité et la rapidité des manipulations des services Minitel risquent de déstabiliser plus d’un utilisateur lors du passage à internet.

Et « ULLA » dans tout ça ? 

Rassurez-vous, le service de rencontres « cochonnes » devenu mythique (et pas Meetic) reste accessible depuis le www.ulla.com
Il est donc temps pour vous de passer à l’Internet illimité, et de découvrir enfin des photos de femmes en haute définition,

Adieu le Pixel.

C’est aussi émouvant que le jour où j’ai vu « la Cinq » disparaître…

Qu’est ce que Subversion

Subversion, plus couramment appelé SVN, est un logiciel de gestion de versions, conçu pour remplacer CVS, tout en s’appuyant pour ses concepts, distribué sous licence Apache. Bon ça, c’est pour la petite histoire.

Plus clairement, SVN va se charger de gérer vos sources et de les versionner, afin de :

• Facilement récupérer un projet et toute sa mise en place
• Pouvoir travailler en collaboration sur le même projet et les mêmes fichiers
• Garder un historique des différentes versions des fichiers d’un projet
• Pouvoir revenir en arrière sur la version d’un fichier
• Récupérer les informations sur les commit (date, auteur, …)

Il existe bien évidemment un grand nombre de logiciels de ce type, comme CVS, GNU Arch, Git, Superivision, etc. Si j’ai choisi SVN, c’est surtout parce qu’il est libre, multiplateforme et celui que je connais le mieux.

Il faut savoir qu’il est aussi simple d’utiliser Subversion en client/serveur qu’en mode privé, sur un seul PC. Dans ce cas ci, ce ne sera plus pour du travail collaboratif mais plus dans un but de sauvegarde et de versionning personnel.

Petit point sur le versionning

Vous n’êtes pas sans savoir que chaque logiciel est livré avec une version, que ce soit vos jeux, lecteur multimédia ou navigateur.

C’est très important, que ce soit pour l’éditeur ou pour l’utilisateur, afin de connaitre les modifications et mises à jour qui ont été effectuées, et ainsi les fonctionnalités auxquelles nous aurons accès.

Subversion ne force pas le versionning obligatoire et vous laisse donc libre de le gérer de la façon dont vous désirez. Seulement, il est pratique de suivre les conventions de nommage des versions afin d’être cohérent.

Le principal système de version est GoRoCo, utilisé pour la plupart des logiciel et très clair pour se repérer.  GoRoCo signifie plus clairement Génération/Révision/Correctif. Ces chiffres vont être définis de la manière suivante :

• Génération : c’est la génération du logiciel (souvent nommé V1, V2). Il représente les versions principales de l’application, et change pour de grosses modifications et mises à jour.
• Révision : On peut l’identifier comme un service pack, que vous devez connaitre sous Windows par exemple. Ce sont certaines fonctionnalités qui sont ajoutés afin de pallier certains manquent dans celles qui sont déjà implémentées dans la version courante. A noté que les habitudes sont de donner un numéro de révision pair ; les révisions impaires sont utilisés pour préciser que la version contient encore des bugs à éliminer dans la révision suivante.
• Correctif : Comme son nom l’indique, ce sont des corrections de bugs.

Cela peut donner, par exemple, pour une application dont vous livrez certaines améliorations et plusieurs corrections de bugs : G1R2C8, qui sera ensuite nommée de la façon que vous voudrez en production. Le principal est de se repérer sur les versions en développement.

Utiliser un client ou non ?

Je pense personnellement qu’utiliser un client SVN peut être beaucoup plus pratique ; vous n’avez pas à retenir les lignes de commande à taper, et vous avez surtout une interface graphique beaucoup plus intuitive. Après, libre à chacun de préférer travailler en ligne de commande.

Voici une liste des principaux clients SVN :

• Tortoise SVN (Windows)
• RapidSVN (MultiPlateforme)
• JSVN (Multiplateforme)
• SubClipse (Plugin Eclipse)
• AnkhSVN (Plugin Visual Studio)

Si vous utilisez des clients SVN qui ne sont pas dans cette liste et qui, d’après vous, valent la peine d’être mentionnés, n’hésitez pas à m’en faire part dans les commentaires.

Définitions

Pour ne pas vous jetez des opérations et expressions inconnues en pleine face, je vais commencer par vous donner une définition des principaux termes :

Dépôt (ou repository) : Le dépôt peut être vu comme un explorateur de fichiers, dans lequel vous  pouvez lire/écrire, suivant les droits que vous possédez. Mais c’est surtout l’emplacement où sont stockés vos projets, ses données, l’historique de chaque version de ce projet avec leurs auteurs, les logs, …

Projet : C’est, comme son nom l’indique, votre projet. Il sera décomposé en 3 dossiers distincts, dont les noms ne sont pas spécialement parlants. C’est d’ailleurs pour cela que je vous explique le projet, je pense tout de même ce mot comme acquis.

Un projet est donc composé de :

• D’un dossier Trunk (le tronc) : Comme son nom l’indique, ce sera donc votre projet principal, celui sur lequel vous travaillez actuellement et sur lequel vous effectuez vos modifications.
• D’un dossier branch (les branches) : Les branches sont les versions précédentes de votre projet. Cela vous permet de stocker vos anciennes versions, pour y jeter un œil quand vous en avez besoin.
• D’un dossier tags : Les tags sont, quand à eux, des dépôts de sécurité. Ce sont des versions stables et livrables mises de côté, que vous pouvez reprendre pour des développements futurs.

Copie de travail (Working Copy) : La copie de travail est une copie d’une révision donnée des fichiers du dépôt, situé en local sur votre poste. Cela vous permet de travailler sur le projet sans impacter les autres développements. A chaque fois que vous avez terminé certains développements, vous pouvez mettre à jour le repository à partir de votre copie de travail.

CheckOut / Import : Le CheckOut consiste à redescendre un projet situé sur votre dépôt dans un répertoire de votre ordinateur afin de posséder une copie de travail. L’import est l’inverse du CheckOut, c’est-à-dire le fait de monter sur le serveur SVN une version disponible sur votre poste de travail.

Update / Commit : Un update mets à jour votre copie de travail sur les différentes modifications qui ont pu être réalisées par d’autres développeurs. Ainsi, votre projet reste à jour, même si vous êtes encore dans vos développements et que vous n’avez pas Commit vos changements. Le Commit est donc le fait de sauvegarder vos modifications réalisées sur le projet actuel. A noter que pour qu’un Commit puisse être effectué, vous devez avoir précédemmment Update voter projet afin de posséder la dernière version disponible sur le repository. Je vous épargnerais les soucis qui peuvent être rencontrés suite à cela, afin de ne pas vous effrayer trop vite.

Les Conflits : Bon ok, je vous parle des soucis que l’on peut rencontrer lors d’update et commit dans vos projets. Outre les centaines d’erreurs que vous renvoie Visual Studio après un Update, qui vous fait regretter cette mise à jour matinale, il peut arriver que, si êtes plusieurs à avoir réalisé des modifications sur un fichier, des conflits apparaissent. Cela veut dire que SVN ne sais pas trop qui croire, entre vos modifications et celles du stagiaire qui n’y connait rien. Pourtant ça crève les yeux ! Il va donc vous créer 3 fichiers temporaires : le votre, celui de la personne qui a aussi effectué des modifications, et un fichier intermédiaire. Et votre fichier actuel sera plein de petits dessins en ASCII tels :

< ======== Mine

===== >

Je ne pourrais que trop vous conseiller de vérifier ces conflits à la main. Bien que la plupart des clients SVN s’en chargent très bien, il est toujours plus précis de checker chaque conflit manuellement pour être sûr que ça ne mets pas un bazar monstrueux, que vous ne remarquerez que quelques heures avant la mise en production. True Story.

Utilisation de SVN

Vous vous rendrez compte que l’utilisation de SVN est assez simple et répétitive. Pour ces exemples d’utilisation, je me base sur l’utilisation de Tortoise SVN. Cela pour une raison, c’est que je l’utilise et je serais donc plus à même de vous l’expliquer. En tant que développeur .NET, je suis très rarement sous Linux, donc très rarement à utiliser les lignes de commandes. Et j’ai choisi Tortoise SVN car c’est celui sur lequel j’ai débuté. Pour être honnête, je ne connais pas d’autre client, et Tortoise n’est peut être pas le meilleur. A vous donc d’en essayer certains si vous le voulez et de vous faire votre propre idée.

Création d’un nouveau projet

Dans le cas de la création d’un nouveau projet SVN (en partant de zéro, il faut bien sûr tout d’abord créer le répertoire du projet), il vous suffira de cliquer droit sur votre dossier racine – > TortoiseSVN – > Import.

Ainsi, votre projet sera monté sur le serveur et vous pourrez désormais travailler avec.

Récupération d’un projet existant

Si vous travaillez sur un projet déjà existant et « SVNisé » (un joli mot qui fera bientôt son apparition dans le Gros Robert), il vous suffit de créer un répertoire qui sera la racine du projet, cliquer droit dessus et choisir SVN CheckOut.

Vous aurez juste à sélectionner le répertoire de voter projet sur le serveur et de le descendre sur votre poste.

Récupérer la dernière version du Projet / Update du projet

Dès que vos collègues ont fait des modifications et que vous devez les récupérer, ou tous les matins, afin d’avoir un projet toujours à jour en local, il faut Update son projet afin de récupérer la dernière version des fichiers qui ont été modifiés par vos collègues.

Pour ce faire, il suffit d’un clic droit sur le dossier (racine ou sous dossiers, suivant les besoins) et de cliquer sur Update. Vous verrez les fichiers qui seront mis à jours sur votre poste et, mais il faudra croiser les doigts pour les éviter, les conflits qui surviennent.

Mettre à jour le projet sur le repository / Commit du projet

Vous avez fini votre correctif et souhaitez le mettre à jour sur le serveur, afin que vos collègues puissent jouir d’un bug en moins.

Cliquez droit sur le dossier contenant vos modifications, ou le dossier racine si vous avez impacté plusieurs dossiers avec vos modifications et cliquez sur Commit.

Notez cependant que vous devez avoir Update avant de Commit, afin de posséder les toutes dernières modifications et ne pas créer de conflits inutiles dans les fichiers.

Récupérer une version antérieure d’un fichier / dossier

Il se peut que vous ayez besoin de revenir en arrière sur un ou plusieurs fichiers, car les dernières modifications ont posé des problèmes, par exemple. Il vous suffira juste de faire un revert sur ce/ces fichiers, ou sur un dossier directement.

Donc, cliquez droit sur votre fichier – > TortoiseSVn – > Revert.

Sachez tout de même que vous pourrez revenir à la version la plus récente, en allant dans les logs (Show Log) et en sélectionnant une révision et en faisant Update to Revision. Vous pouvez en faire de même pour Revert sur une version plus ancienne de votre fichier.

Ajouter un fichier à votre projet

Les fichiers que vous créer dans votre projet, et je pense que ça arrivera souvent, ne sont pas automatiquement ajoutés à votre repository. Il faut donc préciser à SVN que vous désirez ajouter des fichiers, qui seront montés sur le serveur au prochain Commit.

Il faut donc faire un clic droit sur ce(s) nouveau(x) fichier(s) – > TortoiseSVN – > Add.

Ne pas ajouter des fichiers / dossiers à votre projet

A l’inverse, il peut arriver que vous ne désiriez pas monter certains fichiers sur le repository. Il faudra donc les mettre dans la liste des fichiers à ignorer.

Clic droit sur le fichier / dossier – > Tortoise SVN – > Add to ignore List.

Résolution des conflits

Comme je vous l’ai expliqué précédemment, il est souvent plus propre de résoudre les conflits à la mano, mais SVN peut très bien le faire pour vous aussi. Si suite à un Update, vous voyez certains fichiers en conflits, vous n’aurez qu’à cliquer droit dessus, et sélectionner Resolve Conflict.

Pensez tout de même à vérifier que la résolution s’est bien déroulée.

L’historique des fichiers / dossiers

Vous pouvez avoir besoin de connaitre l’historique de modification de chaque fichier, leurs dates de modifications, l’auteur des modifications pour lui demander de l’aide (entendez plutôt pour lui taper sur les doigts).

Clic droit sur le fichier / dossier – > TortoiseSVn – > Show Log.

Conclusion sur SVN

Et bien voilà, cet article touche à sa fin. Si vous ne deviez retenir qu’une chose de cet article, c’est surtout que lors de travail collaboratif sur un projet, un système de versionning est plus qu’indispensable. C’est le meilleur moyen d’avoir un seul projet propre plutôt que 5 projets chacun de leur côté, qu’il faudra merge.

J’espère avoir fait un tour suffisant de SVN, vous avoir bien expliqué les bases qu’il faut connaitre pour l’utiliser et profiter au mieux de ses fonctionnalités. N’hésitez pas à me faire part de vos remarques ou questions.

Les pages web reposant sur ce thème se verront automatiquement être adaptée à Metro sur les smartphones tournant sur Windows Phone 7.5 Mango.

Développé par la filiale de Microsoft, en collaboration avec jQuery Mobile et PhoneGap, Microsoft tend à ouvrir un maximum les possibilités de développement sur sa plateforme, sûrement afin de rattraper son retard vis à vis de ses concurrents. En offrant la possibilité de développer des applications hybride, Microsoft étend le développement d’applications Windows Phone à tous les développeurs web en général et non plus seulement aux développeurs .NET.

De quoi enrichir son store d’applications en tout genre.

Le projet est hébergé sur GitHub : http://sgrebnov.github.com/jqmobile-metro-theme/

Et vous pouvez voir une démonstration des possibilités ici.

Donc n’ayez aucune crainte dans l’utilisation de cette nouvelle technologie. Et les nouveautés sont assez intéressantes et parfois impressionnantes :

• Légèreté
• Dégradé
• Ombrage
• Transparence
• Les sélecteurs
• Border-Radius (cons arrondis)
• Une meilleure gestion des polices
• …

Alors, sans plus tarder, sous vos yeux ébahis, voici une sélection des meilleurs frameworks et outils CSS3 :

Bootstrap

Bootstrap, créé par Twitter, est un framework très complet et extrêmement simple à prendre en main. Il vous permet, en moins de 5 minutes, d’avoir un design adapté à vos besoins. Il offre un design « responsive », c’est à dire adapté à toutes les résolutions, donc pour le mobile également.

Et le petit plus de Bootstrap, il propose des script jQuery adapté à votre CSS.

Site Officiel

960 Grid System

960 Grid System est un Framework permettant de mettre en forme la structure de votre site très facilement, en la quadrillant en 12 ou 16 colonnes afin d’aligner vos éléments tels des boites. La largeur est fixée à 960px, afin d’être optimisée pour la résolution la plus faible actuellement (1024*768). Cela rendra votre site adapté pour tous les utilisateurs.

960.gs est d’ailleurs très léger, il pèse uniquement 3,6Ko dans sa version compressée.

Site officiel

Bluetrip

Ce Framework est un mix de plusieurs outils : BluePrint, Tripoli, Hartija pour le style à l’impression, et la simplicité de 960 Grid System.

Ajoutez à cela le reset CSS d’Eric Meyer, la gestion des liens externes ou l’inversion des contrastes et beaucoup de styles pour la gestion des textes. Cela fait donc de Bluetrip un framework très complet et très puissant.

Site Officiel

CSS3 Button Maker

Un outil très pratique pour réaliser vos boutons en CSS3 pur. Vous pouvez gérer sa taille, son radius, et toutes les colorisations, que ce soit le background, le contour, la couleur du texte, …

A garder dans ses favoris, ça sert très souvent !!

Site officiel

CSS3 Transform Code Generator

Maintenant que CSS3 offre des animations et des transformations, pourquoi se passer de ces fonctionnalités ?

C’est ce que propose cet outil, un générateur de transformations CSS3. Un gain de temps pour réaliser ses animations par soi même.

Site Officiel

CSS3 Gradient Generator

Un dernier outil pour la route, un générateur de dégradé.

Et oui, depuis CSS3, plus besoin de créer des images et de les répéter à l’ancienne. Désormais, vous pouvez créer vos dégradés directement en CSS. Et ce générateur vous permettra de le faire très simplement.

Site Officiel

J’espère que cette liste vous aura plu et intéressé, n’hésitez pas à me faire part d’outils ou de Frameworks que vous utilisez et qui auraient leur place dans cette liste.

Apprise va vous redonner goût aux Alerts

Apprise est un plugin jQuery qui, comme j’ai pu l’introduire précédemment, va vous permettre d’afficher de jolies alerts sur votre page web, afin de prévenir vos utilisateurs, de leur demander des renseignements, …

• Simple alert box ou affichage de texte (alert)
• Alert box avec demande de confirmation (confirm)
• Demande de saisie avec texte et confirmation (prompt)
• …

Avec Apprise, vous allez pouvoir contrôler le style, le contenu, la position et les fonctionnalités de vos alerts, tout cela dans un mode très «  UserFriendly  ». Ce plugin est de plus très léger (moins de 5kb). Et tout cela pour la modique somme de … non, je m’égare, mais je pense que je ferais tout de même un très bon vendeur de téléachat.

Utilisation d’Apprise

Nous allons donc voir comment se servir d’Apprise. C’est tout simple, ça prends pas de temps, alors mettons nous y sans plus attendre.

Tout d’abord, il faut penser à inclure Apprise dans voter page, ainsi que la librairie jQuery bien sûr. Ajoutez y le fichier css fourni par Apprise pour utiliser leur UI.

<!-- Chargement de jQuery et d'Apprise -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="js/apprise-1.5.full.js"></script>
<!-- Chargement du fichier CSS fourni par Apprise -->
<link rel="stylesheet" href="css/apprise.css" type="text/css" />

Ensuite, côté Javascript :

$(document).ready(function()
  {
  apprise(Voyez vous ce message ?', {'verify':true}, function(r)
    {
    if(r)
        {
        // Clic sur oui
        ...
        }
    else
        {
        // Clic sur non
		// j’avoue, le clic sur non ne devrait pas souvent arriver
        ...
        }
    });
  });

Et vous avec une tripotée d’options pour paramétrer et personnaliser au mieux votre Alert :

{
	'confirm' : false, // Boutons Ok et Cancel
	'verify' : false, // Boutons Yes et No
	'input' : false, // Text Box
	'animate' : false, // Insérer une animation
	'textOk' : 'Ok', // Texte du bouton OK
	'textCancel' : 'Cancel', // Texte du bouton Cancel
	'textYes' : 'Yes', // Texte du bouton Yes
	'textNo' : 'No' // Texte du bouton No
}

Et pour lancer une alert « Made In Apprise » :

<a href="http://www.lycos.fr"
onclick="apprise(Vous voulez vraiment aller sur ce moteur de recherche ');">
Va chercher
</a>

Il ne vous reste plus qu’a l’adapter à votre design et le tour est joué.

Site Officiel 

Pour ce qui est des fonctionnalités, ce sera plus votre travail. Ici, je vais essayer de vous proposer un plugin qui offrira une expérience utilisateur proche des applications bureaux, en permettant de glisser déposer vos élements où vous le désirez, ainsi que les redimensionner suivant les besoins. Et cette fonctionnalité peut être adaptée pour quasiment toute application web.

jQDnR vous disiez ?

Oui, le plugin que je vais vous présenter s’appelle jQDnR, nom assez barbare derrière lequel se cache l’anagramme de «  jQuery Drag N Resize  ». Tout est dit à partir de là.

Ses principales fonctionnalités sont :

• Permet le drag’n’drop d’éléments
• Offre un redimensionnement simple
• Le déplacement rend l’élément translucide pour plus de clarté
• Un plugin très léger, afin de coller avec la qualité première de jQuery

Mais dit moi Jamie, c’est génial mais comment on s’en sert ?

J’y arrivais Fred, et pas plus tard que maintenant.

Tout d’abord, comme tout bon plugin jQuery, il faut bien sûr inclure la librairie à votre projet. Commencez donc par là, en utilisant une version locale ou bien une version hébergée. Et bien évidemment, inclure aussi le plugin, cela va de soi.

<!-- Pour la version hébergée -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<!-- ou pour une version locale -->
<script type="text/javascript" src="jquery.js"></script>
<!-- inclure le plugin jqdnr -->
<script type="text/javascript" src="jqdnr.js"></script>

Pour ce qui est de la partie HTML, vous n’aurez pas grand-chose à faire. Juste définir la classe jQDnR à la div que vous souhaitez voir devenir draggable et resizable (retenez bien sûr que les deux peuvent être dissociés. Vous pouvez la rendre juste draggable ou juste resizable). Ajoutez y ensuite 2 div, une ayant une classe draggable, et une seconde resizable, comme l’exemple suivant vous le montre :

<div id="exemplejQDnR" class="jqDnR">
  <div class="jqHandle jqDrag"></div>
  <br />
  Voici un exemple de box<br />
  Vous pouvez me redimensionner et me déplacer
  <div class="jqHandle jqResize"></div>
</div>

Il faudra ensuite gérer le CSS, afin que votre div reçoivent des indicateurs pour montrer à l’internaute qu’il peut redimensionner cet élément, par exemple.

.jqHandle {
   background: red;
   height:15px;
}

.jqDrag {
  width: 100%;
  cursor: move;
}

.jqResize {
   width: 15px;
   position: absolute;
   bottom: 0;
   right: 0;
   cursor: se-resize;
}

.jqDnR {
    z-index: 3;
    position: relative;
    width: 180px;
    font-size: 0.77em;
    color: #618d5e;
    margin: 5px 10px 10px 10px;
    padding: 8px;
    background-color: #EEE;
    border: 1px solid #CCC;
}

Le CSS étant assez simple, une classe par fonction. Je ne vois pas trop quoi dire sur le CSS, je pense qu’il parle de lui-même. Désormais, vous n’avez plus qu’à appeler jQDnRet le tour est joué :

<script>
$().ready(function() {
  $('#ex3').jqDrag('.jqDrag').jqResize('.jqResize');
});
</script>

Voici le résultat, qui bien qu’extrêmement basique graphiquement, vous démontre ses capacités :

J’espère que ce petit plugin vous a plu et convaincu. N’hésitez pas à me faire part de vos impressions ou me préciser si vous connaissez d’autres plugins du même type que vous utilisez.

Site Officiel

Google Drive – Le Cloud Made In Moutain View

Google Drive est donc une offre de stockage en ligne de vos fichiers, tel que le propose déjà actuellement DropBox, SkyDrive, Hubic, Box.net … Cela va vous permettre de stocker plusieurs centaines de fichiers sur des serveurs, afin d’y accéder de partout, sur n’importe qu’elle plateforme. Il va automatiquement gérer vos Google Docs, que vous pourrez utiliser en local et hors connexion, mais aussi vos fichiers personnels. Voici comment Google définit son service Drive :

« Drive est un espace centralisé pour créer, partager, collaborer et conserver vos documents. Que vous établissiez un budget prévisionnel avec vos collaborateurs, que vous élaboriez une présentation avec un groupe de travail ou que vous organisiez un séminaire, vous pouvez désormais le faire dans Drive. »

Comment Google Drive fonctionne-t-il ?

Il vous suffit de vous connecter à votre compte Google, et de vous rendre à l’adresse suivante : https://drive.google.com/start

Si vous pouvez visualiser un écran tel que l’image ci dessous, c’est que vous y avez d’ores et déjà accès. Sinon, il vous faudra patienter quelques temps.

Vous allez ensuite télécharger le client drive, tel qu’il vous sera proposé, afin de pouvoir utiliser toutes les possibilités de ce service. Ce logiciel va vous créer un répertoire sur votre disque dur, qui sera synchronisé à chaque modification avec les serveurs de Google. Ainsi, vous aurez toujours des documents à jour. Ce dossier sera placé sur votre Bureau, afin d’y accéder plus rapidement.

Pour ajouter des fichiers, il vous suffit de les déposer dans le dossier Google Drive, de la même manière que vous le feriez entre deux différents dossiers sur votre disque dur.

Sachez que Drive va synchroniser par défaut tous les documents que vous posséder dans vos Google Docs, ainsi que vous images sur Picasa.

Vous pouvez aussi accéder à Google Drive sur mobile, malheureusement seulement disponible pour les smartphones Android actuellement. Mais son arrivée sur les autres plateformes ne sauraient tarder.

Une plateforme ouverte, compatible avec plus de 30 formats 

Bien sûr, cet outil ne pouvait être vraiment intéressant que s’il permet de lire de nombreux formats de fichiers. Sachez qu’il permet la lecture de vidéo en HD, des documents office, des images et même des formats Illustrator et Photoshop.

La recherche demeurant le fer de lance de Google, la recherche des fichiers reste un des principaux avantages que je retire de cet outil. J’ai tenté d’uploader une photo de la tour Eiffel, en supprimant toute référence au nom de ce monument. En cherchant simplement « Eiffel », Drive a immédiatement trouvé ma photo. Bluffant !! Une très bonne utilisation de la technologie de reconnaissance déjà présente dans Google Images.

Google met aussi à dispositions des APIs, afin de permettre aux développeurs de lier leurs documents dans une page ou une application web par exemple.

Google Drive face à la concurrence

Alors que Google s’implante dans un marché qui est déjà bien installé, avec des concurrents de choix, comme DropBox ou Skydrive, son offre est importante bien sûr, mais assez décevante.

Proposer 5Go gratuitement, c’est bien. Mais leurs offres payantes, bien qu’attractives, restent en dessous de celles de certains concurrents. Par exemple, un stockage d’1 To coûte 49,99$ par mois, quand OVH (et son service Hubic) nous propose un illimité à 84€ par an. Bien sûr, il faut relativiser. Tout un chacun n’a pas besoin d’1 To de stockage de fichiers en ligne, je cherche juste à comparer les offres.

En conclusion

Google Drive est donc une très bonne solution de stockage dans le cloud, offrant des fonctionnalités très intéressantes, en réutilisant toutes les technologies qu’ils ont à leur disposition. Il reste seulement un peu cher si l’on veut l’utiliser à grande échelle. Mais il ravira tous les utilisateurs lambda de stockage en ligne.

Je vous propose donc de vous rendre sur le site officiel de Google Drive, et de visionner la vidéo de démonstration de cet outil :

Et encore, je dis 600 plugins à l’heure actuelle, mais cette liste augmente de jours en jours, pour vous offrir le plus grand choix possible.

En plus de vous exposer les 30 derniers plugin mis à jour sur ce site, vous pourrez chercher votre bonheur parmi 32 catégories, parmi lesquelles :

• AJAX plugins
• Charts
• Grid
• Animation
• Formulaires
• Drag’n'Drop
• Games
• File Upload
• Photo Gallery
• Search
• Browser tips
• Sliders
• Accordions
• Navigation
• …

Vous pourrez aussi trouver de nombreux tutoriaux sur ce site, dont certains pour développer vos propres plugins et ainsi, trouver votre place chez jQueryList. Vous pourrez également vous abonner au flux RSS  afin d’être le premier informé des nouveaux plugins disponibles.

Alors n’hésitez pas à faire un tour sur cette plateforme et à faire votre choix parmi ces 600 plugins.

Tel pourrait être le message que vous pourriez vous envoyé par le biais de Futureme. Ce site vous offre la possibilité de vous écrire un mail, et de l’envoyer dans le futur, à votre futur vous.

Si jamais vous avez une promesse à vous faire, des espoirs que vous mettez dans vos études ou dans vos croyances, alors créez vous un rappel temporel pour bien remémorer à votre futur vous même qu’il faut pas lâcher prise !!

Sachez que vous pouvez aussi bien l’envoyer à une autre personne.

Bon le seul point important de ce système, c’est qu’il faut espérer que vous aurez toujours la même adresse mail, et surtout que les mails existeront toujours dans le futur. Encore que, si la fin du monde arrive en fin d’année, vous aurez peut être perdu quelques minutes de votre précieux temps à écrire un message inutile.

A vous de décider, mais si ça vous tente, n’hésitez pas à aller sur Futureme.

Alors Marty, fait chauffer la Delorean, j’ai des mails à lire dans le futur.

Une chose est sûre, les bons vieux CMS « usines à gaz », pleins de possibilités mais finalement beaucoup trop complexes à coder, et parfois même à utiliser ont de moins en moins le vent en poupe. Les développeurs comme  les utilisateurs préfèrent aujourd’hui une solution la plus adaptée possible à leur projet de site web, et décident donc de s’en tenir à une structure simple et efficace pour le domaine auquel elle est destinée.

Faisons un petit tour de ces nouvelles solutions destinées à un public de plus en plus néophyte

Le bien connu WordPress avait déjà commencé il y a bien longtemps à se spécialiser dans le domaine du blog, jugé plus simple et plus accessible à des utilisateurs ne souhaitant pas se compliquer la vie, tout en saisissant malgré tout les opportunités qu’offre le web. Aujourd’hui, après un essor formidable ces dernières années, le CMS de blogs tend à devenir, si ce n’est déjà fait, une plateforme tout à fait acceptable pour de petits sites d’entreprise et de micro sites communautaires.

Depuis Facebook, Twitter et compagnie, une demande croissante concernant les sites communautaires se faisait entendre dans le milieu du net. Il n’a pas fallu attendre longtemps pour voir arriver un CMS spécialisé dans le domaine. Il s’agit de Elgg. Certes relativement récent et soutenu par une communauté restreinte bien que très active, ce CMS communautaire créé par Dave Tosh en 2004 a su devenir un outil fort agréable à l’utilisation, simple et fonctionnel.

Dans le domaine du e-commerce, nul besoin de présenter les leaders du marché: Prestashop, Magento et OS Commerce. Bien que chacun d’eux ait ses propres caractéristiques, ses avantages et ses défauts, ces trois principaux CMS du marché des boutiques en ligne ont réussi à convaincre une bonne partie des créateurs de commerces sur le web, y compris les professionnels de la conception web, qui voient dans ces solutions un gain de temps considérable et une charge de travail réduite permettant de se concentrer sur une optimisation du référencement et des graphismes plus esthétiques.

Les forums sont aussi bien servis en terme de CMS tel que PHPBB, leader incontestable dans le domaine, permettant de créer simplement un forum de grande qualité et fonctionnel pouvant accueillir un grand nombre d’utilisateurs avec des graphismes et des fonctionnalités optimisés pour ce type de plateformes.

Mais les CMS multifonctionnels tels que Joomla, Drupal ou encore Spip sont-ils pour autant dépassés ?

Ces véritables plateformes conçues pour répondre aux besoins les plus divers ne se laissent pas si facilement abattre par la concurrence de ces nouveaux arrivants. Concevoir un site internet avec ces outils déjà bien rodés et rassemblant une communauté importante de développeurs et d’utilisateurs devient de plus en plus accessible et bien que parfois difficiles à optimiser tant ils sont complexes de par leur conception, ils permettent à de nombreux utilisateurs de créer des sites avec de nombreuses fonctionnalités.

En conclusion, les CMS spécialisés ont un bel avenir devant eux. De plus en plus plébiscités par un grand nombre d’acteurs du web tels que les agences de communication et les concepteurs de sites internet, ils tendent à devenir les principaux générateurs de sites web.

Est-ce là une bonne chose pour la diversité du web ? Ou bien est-ce que le fait de rendre accessible à tous la conception de sites web risque de faire perdre la qualité de l’ensemble de la toile et de voir se multiplier des sites plus ou moins uniformes visant une même population ?

Qu’en pensez-vous ?

Mais je me suis rendu compte qu’en parcourant plus en détail le code du framework, on comprenait bien plus son fonctionnement et on pouvait nettement améliorer son utilisation et ses développements. Alors que sur ce blog, je vous ai souvent présenté de superbes plugins, bien plus que vous en expliquer le fonctionnement, je me suis dit que je devrais peut être aussi opter à vous proposer un apprentissage plus complet de cette librairie.

C’est donc ainsi que va débuter cette série de cours sur jQuery, baptisé « jQuery de Zéro« , en essayant de toucher un plus grand nombre de développeurs Javascript et web en général. Les débutants pourront apprécier de découvrir ce framework à partir des bases les plus élémentaires, tandis que les plus expérimentés pourront revoir leurs classiques ainsi que de comprendre certains points qui ont peut être été zappés. J’espère vous présenter tout cela de la manière la plus claire et précise possible, n’hésitez pas à me faire part de vos remarques afin que je m’améliore.

C’est donc parti pour ces cours, sortez vos cahiers, votre trousse … et silence au fond de la classe !!

Découvrons les bases de cette librairie

Le premier cours sera même sûrement trop basique pour la plupart de vous, mais je préfère passer par là.

jQuesry est donc une librairie Javascript sous license GPL et MIT, qui vous permet d’interagir avec le CSS et HTML, et surtout de faciliter vos développements. Elle est très légère, fonctionne sur la plupart des navigateurs (IE6+, FF2.0+, Safari 2+, Opera 9.0+, Chrome) et a l’avantage de posséder une grande communauté et une très bonne documentation.

Ses principales fonctionnalités sont :

• Parcours et modification du DOM
• Gestion des évènements
• Animations, transitions et effets
• Manipulation du CSS
• Support de l’AJAX
• Compatible avec d’autres librairies
• Possède une nombre incroyable de plugins
• …

Téléchargement de jQuery

Bien sûr, pour utiliser cette librairie, il faut d’abord la télécharger. Pour ce faire, rendez vous sur le site officiel de jQuery.

Vous allez avoir le choix entre 2 versions :

• La version de production : Vous n’en aurez pas besoin pour l’instant. Cette version est une version minifiée de la librairie, c’est à dire que tous les espaces et caractères inutiles ont été retirés du fichier, afin de le rendre plus rapide à charger. Par contre, cela rends le fichier illisible. C’est pour cela qu’elle n’est jamais utilisée pendant les développements, car il est très dur de se répérer dans le fichier et toutes ses fonctions.
• La version de développement : C’est sur cette version que nous allons travailler. Cette version est plus lourde que la version minifiée (200kb de différence) mais elle vous permettra de taper dans le code dès que vous en aurez besoin. Car il est pratique de pouvoir jeter un oeil aux différentes fonctions que jQuery propose, afin de connaitre les retours des fonctions, les paramètres requis, etc.

Je vous propose donc de télécharger la version de développement sur votre ordinateur et de l’insérer dans vos dossiers de projet. L’usage est de créer un dossier js dans votre projet. Cela facilite la recherche de fichier, car vous vous rendrez vite compte que dans des projets d’envergure, le rangement est très important. Je vous conseille d’ailleurs de créer un dossier spécialement pour vous fichier javascript, un pour vos fichiers css et un pour vos images. Les autres peuvent être laissés à la racine.

Une autre solution pour utiliser jQuery est de prendre la version online de cette librairie. Vous pourrez la trouver hébergée chez Google par exemple, à cette adresse. J’utilise celle que Google héberge car je sais qu’elle restera accessible tout le temps. Il y a peu de chance que leurs serveurs tombent en rade. L’avantage d’utiliser une version hébergée est de gagner du temps en chargement de votre page web. Sachez que lorsque vous chargez votre page, sur votre serveur, les fichiers js et css se chargent deux par deux. C’est à dire un js et un css simultanément. Donc si vous devez charger 3 js et 3 css, cela peut vous prendre un peu de temps. Mais si vous avez inclue des fichiers hébergés sur d’autres serveurs, le chargement sera largement optimisé car vous ne les prendrez plus 2 par 2 mais peut être 4 par 4 ou 6 par 6.

Une bonne solution pour gagner quelques centaines de millisecondes. Cela peut paraître insignifiant à première vue, mais vous savez bien que lorsqu’une page mets trop de temps à se charger, l’internaute va la quitter directement. L’inconvénient de cette pratique reste cependant que si vous ne possédez pas de connexion, vous ne pourrez utiliser la librairie. Il est vrai que nous avons maintenant quasiment toujours accès à Internet, mais si vous développez dans le train, dans l’avion ou dans votre voiture (pour les geeks les plus téméraires).

Inclure jQuery dans vos projets

Maintenant que vous possédez la librairie jQuery, il faut l’inclure à votre projet.

<script type="text/javascript" src="js/jquery-1.7.2.js"></script>

On a souvent tendance à appeler ses fichiers Javascript dans la section <head></head>, de la même manière que les fichiers CSS. Autant, les fichiers CSS DOIVENT être inclu dans le head, afin que le rendu graphique de votre page soit cohérent, autant pour une question de performance, il est conseillé d’appeler ses fichiers Javascript à la fin de vos déclarations dans la section <body></body>.

<!-- Préférez donc -->

<html>
<head>
<link rel=\"stylesheet\" href=\"css/style.css\">
</head>
<body>

<!-- Votre code HTML -->

<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
</body>
</html>

<!--Plutôt que -->

<html>
<head>
<link rel=\"stylesheet\" href=\"css/style.css\">
<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
</head>
<body>

<!-- Votre code HTML -->

</body>
</html>

Un petit point sur les IDE

Oui, car on a tendance, et moi le premier, à utiliser Notepad++ pour nos développements. Il est vrai que cet éditeur est tout à fait suffisant pour les développements. Ses seuls inconvénients à mon goût, sont le manque d’autocomplétion (ou du moins une autocomplétion plus précise), ainsi qu’une réelle intégration des projets.

C’est pour cela que je travaille sur Notepad++ pour des développements léger, mais je passe sur EclipsePHP lorsque je travaille sur des projets plus importants (ou Visual Studio pour le .NET bien sûr). Il en existe de nombreux autres, qui ont des fonctionnalités plus ou moins pratiques, une interface plus ou moins ergonomique, … l’important est de se sentir à l’aise sur votre IDE préféré. Car lorsque l’on passe 8 heures par jour dessus, il est important dy avoir ses aises.

Ce point n’avait pas pour but de vous faire une liste des meilleurs IDE sur le marché, mais plutôt de vous conseiller de bien choisir le votre. Je compte réaliser un article là dessus prochainement, mais vous trouverez surement sur la toile de nombreux articles relatant des éditeurs qui pourront aussi vous forger une opinion à ce niveau. Et c’est surtout pour les développeurs débutants, qui n’ont pas encore leurs habitudes sur un IDE en particulier, pour lesquels je conseille d’en tester plusieurs avant de faire son choix. On peut gagner pas mal de temps en ayant un outil de développement vraiment optimisé à nos besoins, qui sur un projet complexe, peu tout de même faire gagner au final une journée de boulot (si si, en cumulant les minutes gagnés par ci par là, on y arrive).

C’est fini pour aujourd’hui

Déjà ? Oui déjà, ce fut bref, mais c’est un passage obligé afin de se préparer à tout ce qui vous attends dans les prochains cours. En attendant, chauffez vous les articulations car on rentre dans le vif du sujet dans le prochain article.