construire un plugin pour jquery 1.5+

36
CONSTRUIRE UN PLUGIN POUR JQUERY 1.5 ET + ConFoo 2012 – Montréal, Hôtel Hilton Bonaventure Mathieu ROBIN

Upload: mathieu-robin

Post on 23-May-2015

1.403 views

Category:

Technology


2 download

DESCRIPTION

Conférence tenue pour la ConFoo 2012 à Montréal.

TRANSCRIPT

Page 1: Construire un plugin pour jQuery 1.5+

CONSTRUIRE UN PLUGIN POUR JQUERY 1.5 ET +

ConFoo 2012 – Montréal, Hôtel Hilton BonaventureMathieu ROBIN

Page 2: Construire un plugin pour jQuery 1.5+

• Mathieu ROBIN (@mathrobin)• 25 ans• Ingénieur logiciel chez Companeo• Contributeur Developpez.com• Blogueur

• http://www.mathieurobin.com• http://www.recettesensolo.com

Page 3: Construire un plugin pour jQuery 1.5+

Pourquoi ?

Page 4: Construire un plugin pour jQuery 1.5+

Parce que ?

42 ?Pourquoi pas ?

Le chef le demande ?

Page 5: Construire un plugin pour jQuery 1.5+
Page 6: Construire un plugin pour jQuery 1.5+

Bienvenue en enfer !

Page 7: Construire un plugin pour jQuery 1.5+

Libraires de « lignes »

Page 8: Construire un plugin pour jQuery 1.5+

Impossibilité de personnaliser

Page 9: Construire un plugin pour jQuery 1.5+

Aucune intuitivité

Page 10: Construire un plugin pour jQuery 1.5+

Et même beaucoup de global !

Page 11: Construire un plugin pour jQuery 1.5+
Page 12: Construire un plugin pour jQuery 1.5+

Réécriture de $.Ajax

Page 13: Construire un plugin pour jQuery 1.5+

Deferred / Promises

http://www.mathieurobin.com/2011/02/labs-jquery-deferred-nouveaute-jquery-1-5

Page 14: Construire un plugin pour jQuery 1.5+

jQuery.sub()

http://www.mathieurobin.com/2011/02/labs-jquery-sub-nouveaute-jquery-1-5

Page 15: Construire un plugin pour jQuery 1.5+

http://docs.jquery.com/Plugins/Authoring

Page 16: Construire un plugin pour jQuery 1.5+

C'est parti !

Page 17: Construire un plugin pour jQuery 1.5+

Règles

Page 18: Construire un plugin pour jQuery 1.5+

Un fichier JS

Page 19: Construire un plugin pour jQuery 1.5+

Un fichier CSS

Page 20: Construire un plugin pour jQuery 1.5+

Une API simple

Page 21: Construire un plugin pour jQuery 1.5+

Documentez !

Page 22: Construire un plugin pour jQuery 1.5+

/* … */// ...

Page 23: Construire un plugin pour jQuery 1.5+

Vérifiez !

Page 24: Construire un plugin pour jQuery 1.5+

http://www.jslint.com

http://www.mathieurobin.com/2011/12/installer-jslint-sur-sa-machine/

Page 25: Construire un plugin pour jQuery 1.5+

Démontrez !

Page 26: Construire un plugin pour jQuery 1.5+

http://www.jsfiddle.net

Page 27: Construire un plugin pour jQuery 1.5+

Lightbox

Page 28: Construire un plugin pour jQuery 1.5+

Quand ?Où ?

Quoi ?Comment ?

Page 29: Construire un plugin pour jQuery 1.5+

Clic sur n'importe quel élément du

DOM

Page 30: Construire un plugin pour jQuery 1.5+

Par dessus l'existant

Page 31: Construire un plugin pour jQuery 1.5+

Affiche la photo avec un arrière

plan noir

Page 32: Construire un plugin pour jQuery 1.5+

Via un plugin jQuery !

Page 33: Construire un plugin pour jQuery 1.5+

Go !

Page 34: Construire un plugin pour jQuery 1.5+

Crédits PhotosCompujeramey : http://www.flickr.com/photos/compujeramey/4506013626/

Hycus : http://blog.hycus.com/

JSFiddle

JSLint

Page 35: Construire un plugin pour jQuery 1.5+

https://joind.in/6021

Page 36: Construire un plugin pour jQuery 1.5+