Pour faire mon boulot d’intégrateur, j’ai toujours préféré coder sur un éditeur de texte léger que sur un IDE complexe. A chaque fois que j’essaye de me mettre à Eclipse ou Aptana, je trouve que ça ne me convient pas vraiment.
Ça fait donc quelque temps que Notepad++ me suffit largement. Et puis j’ai commencé à entendre les louanges de Sublime Text 2 sur Twitter… alors je l’ai essayé…
Première impression : c’est beau !
Oui, il faut être un peu atteint pour trouver un éditeur de code *beau*, mais bon…
Et c’est rapide…
Comparé à d’autres éditeurs que j’ai pu tester, je trouve Sublime Text 2 vraiment réactif et il laisse toujours la main à l’utilisateur (même pendant une recherche dans les dossiers).
Quelques fonctions pratiques
- Rechercher un fichier
En tapant Ctrl+P, on effectue une recherche dans tous les fichiers du projet.
La recherche fonctionne un peu comme la « awesome bar » de Firefox. C’est-à-dire qu’on peut taper des bouts du chemin et avoir des suggestions correctes.
En ajoutant ‘:’ vous ouvrez le fichier en plaçant le curseur directement à la ligne voulue. C’est particulièrement utile lorsque vous repérez d’un coup d’œil dans Firebug le nom du fichier css à ouvrir et le numéro de ligne à modifier.
- Changer le layout de l’éditeur
Pour éditer plusieurs fichiers côte à côte, il suffit de choisir le nombre de colonnes souhaitées avec Alt+Maj+1, Alt+Maj+2, etc…
- Édition multicurseurs (attention, c’est génial !)
Il y a plusieurs façons d’ajouter des curseurs :
Ajouter un curseur sur la ligne suivante (ou précédente) : Ctrl+Alt+Bas (ou Ctrl+Alt+Haut)
Ajouter un curseur à un endroit précis à la souris : Ctrl+Clic
Zone rectangulaire : Tracer une zone avec le bouton milieu de la souris
- Multi Copier Coller
L’édition multicurseurs permet aussi de coller sur plusieurs lignes à la fois
Les plugins
Un autre point fort de Sublime, c’est son installeur de plugins.
Il existe des plugins pour tout : faire des diffs, réindenter le code HTML, coloration syntaxique de LESS, minifiers, etc…
Zen coding
Mais si il y a un plugin qui change la vie d’un intégrateur, c’est Zen Coding ! (disponible également pour Notepad++, Coda, TextMate, Dreamweaver…)
Pour faire simple, Zen Coding permet de générer du code (HTML, CSS) au lieu de le taper entièrement.
Le fonctionnement est très simple, il suffit de taper une abréviation puis de l’étendre en tapant sur TAB.
Mais comme un gif animé vaut mille mots :
L’écriture des abréviations est très intuitive pour un intégrateur puisque la syntaxe ressemble à CSS.
Il est possible d’imbriquer des éléments avec ‘>’, d’en ajouter côte à côte avec ‘+’, de les multiplier avec ‘*’, de les regrouper avec ‘()’, d’incrémenter un nombre avec ‘$’.
Avec ces quelques raccourcis, on peut construire une structure HTML très rapidement.
























Grâce à cet article, je sais que le gif a encore de beaux jours devant lui. Merci pour cela
http://www.grafikart.fr/tutoriels/sublime-text-2/sublime-text-2-180
J’ai découvert sublime text 2 et zen coding grace a grafikart, il fait présente très bien les fonctionnalité de l’éditeur avec ses tutoriel vidéo.
Je vous conseille fortement cet éditeur.
@Bastien, excellente cette vidéo ! Merci
Salut,
J’essaie à Sublime Text depuis tout à l’heure, des plugins à conseiller ?
@Thierry, ça dépend du travail que tu fais. Tu trouveras une bonne liste ici : http://wbond.net/sublime_packages/community
Je conseillerai « Tag », « FileDiffs », « Can I Use » qui renvoie sur le site du même nom pour avoir plus d’infos sur une propriété CSS par exemple. Et « Zen Coding » bien sûr
Sublime est aussi très pratique pour les gens qui travaillent sur différents OS. Personnellement je l’utilise sur Windows, Mac et Ubuntu sans avoir à me poser de questions.
Son « défaut » par rapport à un Notepad++ est qu’il est payant même s’il est pour l’instant utilisable sans licence.
je l’utilise depuis plusieurs mois et ai totalement abandonné komodo edit depuis que j’ai trouvé l’extension komodo pour Sublime text !
outre une excellente auto complétion, il apporte l’auto complétion sur des classes « importées » comme un require_once() en PHP
ok il sera payant, mais vu que c’est l’outil principal d’un développeur, je ne vois pas le soucis
happy coding
Tu as fini de me convaincre!
Par contre mon Notepad ne te dit pas merci.
ps : je rejoins ta première impression.
A ne pas manquer : le vintage mode qui permet d’ajouter un « command mode » et de retrouver un peu de VIM
Disponible de base, il suffit de supprimer ce mode des ignored packages de votre fichier de préférences.
awsome !
Salut,
Sympa j’ai encore appris de nouvelle fonctionnalité
Ceci dit, j’ai installer ZenCoding via le package contrôler et je ne trouve pas le raccourcis pour étendre mon expression :/ (ce n’est pas Tab).
Merci d’avance.
étrange… pour moi c’est bien Tab.
sinon tu peux taper Ctrl+Alt+Entrée, c’est moins pratique mais ça marche aussi
Mea culpa!
J’essayais, et malheureusement ce n’est pas possible, d’étendre du ZenCode directement dans du texte PHP.
Je passe souvent par PHP directement pour écrire mon HTML plutôt que de fermer la balise php puis la réouvrir.
Je ne sais pas s’il y a moyen (et si oui comment) de changer ça dans le « context » de la commande pour étendre le code zen ceci dit.
Merci pour votre réponse
Bonjour,
J’ai essayé de tapper « html:5″ et appuyer sur « tab », cela me l’étend correctement par contre « p[title] » le fait pas alors que « p[title]*1″ fonctionne.
J’ai essayé aussi de faire un « ctrl + alt + entrée » en alternative à « tab » mais cette combinaison ne fonctionne pas. Je ne sais pas s’il y a un conflit de raccourci. D’ailleurs, je ne sais pas comment checker cela facilement. Pour information j’utilise ST2 sur OSX Lion.
Si vous avez une petite idée pour activer le developpement du code ça serait sympa. Je vais continuer de chercher ça me « turlupine » :p
Merci d’avance !!! :p
À savoir que Zen Coding s’appelle maintenant Emmet : http://docs.emmet.io/
Donc essaye d’updater ta version et voir si ça corrige ton problème.
Sinon va voir ici https://github.com/sergeche/emmet-sublime#tab-key-handler ils expliquent des trucs sur la fonction tab.
Bonjour. Je cherche les raccourcis de la fonction rechercher/remplacer sous Mac et je ne trouve pas.
Sous PC c’est CTRL+F puis CTRL H. Sous Mac nous avons CMD + F pour la première… et puis pour la suivante je ne sais pas (CMD + H génère la fermeture de la fenêtre). Si quelqu’un peut me donner un tuyau, merci d’avance.
@Olivier Un peu tard pour répondre, mais sur Mac tu peux voir les raccourcis en allant dans le menu contextuel > find.
Et donc, pour répondre à ta question, pour rechercher/remplacer, on fait SHIFT + CMD + F.
Et moi, je m’en vais m’entraîner à ZenCoder