Boostez votre productivité avec Brackets !

[Yhraen]

<r>Beaucoup d'entre nous utilisent Brackets pour coder (et pour ceux qui ne l'utilisent pas <B><s></s>#MarceauSurBlocNote<e></e></B> : <URL url="http://brackets.io/">http://brackets.io/</URL> ), je vais donc vous présenter quelques extensions très utiles afin de booster votre productivité !<br/>
<br/>
<SIZE size="200"><s></s><COLOR color="#FF8000"><s></s>Installation d'une extension<e></e></COLOR><e></e></SIZE><br/>
<br/>
Tout d'abord, pour installer une extension sur Brackets deux solutions s'offrent à vous.<br/>
Il vous faut déjà cliquer sur le bouton présenté ci-dessous.<br/>
<br/>
<URL url="http://www.hostingpics.net"><s></s><IMG src="http://img15.hostingpics.net/pics/639955Imagesanstitre.png"><s>[img]</s><LINK_TEXT text="http://img15.hostingpics.net/pics/63995 ... stitre.png">http://img15.hostingpics.net/pics/639955Imagesanstitre.png</LINK_TEXT><e>[/img]</e></IMG><e></e></URL><br/>
<br/>
<COLOR color="#FF8000"><s></s><SIZE size="150"><s></s>Directement via la recherche brackets<e></e></SIZE><e></e></COLOR><br/>
<br/>
Puis taper le nom de l'extension dans le champ de recherche.<br/>
<br/>
<URL url="http://www.hostingpics.net"><s></s><IMG src="http://img15.hostingpics.net/pics/531542Imagesanstitre.png"><s>[img]</s><LINK_TEXT text="http://img15.hostingpics.net/pics/53154 ... stitre.png">http://img15.hostingpics.net/pics/531542Imagesanstitre.png</LINK_TEXT><e>[/img]</e></IMG><e></e></URL><br/>
<br/>
<COLOR color="#FF8000"><s></s><SIZE size="150"><s></s>Avec l'url ou le fichier ZIP<e></e></SIZE><e></e></COLOR><br/>
<br/>
Entrez l'url fournie pour chaque extension pour la télécharger et l'installer automatiquement ou faîtes glisser le fichier ZIP téléchargé manuellement.<br/>
<br/>
<URL url="http://www.hostingpics.net"><s></s><IMG src="http://img15.hostingpics.net/pics/869419Imagesanstitre.png"><s>[img]</s><LINK_TEXT text="http://img15.hostingpics.net/pics/86941 ... stitre.png">http://img15.hostingpics.net/pics/869419Imagesanstitre.png</LINK_TEXT><e>[/img]</e></IMG><e></e></URL><br/>
<br/>
<COLOR color="#FF8000"><s></s><SIZE size="200"><s></s>Emmet<e></e></SIZE><e></e></COLOR><br/>
<br/>
Anciennement Zen Coding, cet extension est un must-have qui vous permet de gagner un temps fou et d'améliorer grandement votre workflow, avis aux flemmards : cette extension est faîte pour vous !<br/>
<br/>
Vous voulez créer une liste ?<br/>
<B><s></s><br/>
ul#nav>li.item$*5 <e></e></B><br/>
<br/>
Ensuite vous appuyez sur tab et voilà :<br/>
<br/>
<B><s></s><ul id="nav"><br/>
<li class="item1"></li><br/>
<li class="item2"></li><br/>
<li class="item3"></li><br/>
<li class="item4"></li><br/>
<li class="item5"></li><br/>
</ul><e></e></B><br/>
<br/>
Cela fonctionne pour absolument tout, même pour le css : <B><s></s>bg<e></e></B> puis tab et vous obtenez <B><s></s>background: ;<e></e></B><br/>
<br/>
Vous pouvez retrouver la liste complète des commandes sur la documentation d'Emmet (<URL url="http://docs.emmet.io/">http://docs.emmet.io/</URL>) et la cheat sheet (<URL url="http://docs.emmet.io/cheat-sheet/">http://docs.emmet.io/cheat-sheet/</URL>).<br/>
<br/>
Download : <URL url="https://github.com/emmetio/brackets-emmet">https://github.com/emmetio/brackets-emmet</URL><br/>
<br/>
<COLOR color="#FF8000"><s></s><SIZE size="200"><s></s>Autosave Files on Window Blur<e></e></SIZE><e></e></COLOR><br/>
<br/>
Adieu, ctrl+s ! Permet gagner du temps et des APMs en sauvegardant vos fichiers lorsque vous switchez de fenêtre, pratique pour visualiser son rendu quand on n'utilise pas le live refresh !<br/>
<br/>
Download : <URL url="https://github.com/martypenner/brackets-autosave-files-on-window-blur"><LINK_TEXT text="https://github.com/martypenner/brackets ... indow-blur">https://github.com/martypenner/brackets-autosave-files-on-window-blur</LINK_TEXT></URL><br/>
<br/>
<COLOR color="#FF8000"><s></s><SIZE size="200"><s></s>Beautify<e></e></SIZE><e></e></COLOR><br/>
<br/>
L'indentation pour vous c'est quelque chose d'aussi effrayant que Chtulu en personne ? Beautify s'occupe de cela pour vous en formatant votre HTML/CSS/JavaScript automatiquement à chaque sauvegarde, vous permettant de gagner énormément en lisibilité.<br/>
<br/>
Une fois installé, cochez <B><s></s>"Beautify on save"<e></e></B> dans l'onglet <B><s></s>"Modifier"<e></e></B>. Combiné le avec l'addon précédent et vous obtenez un bonus de set +50 en flemmardise !<br/>
<br/>
Download : <URL url="https://github.com/brackets-beautify/brackets-beautify">https://github.com/brackets-beautify/brackets-beautify</URL><br/>
<br/>
<COLOR color="#FF8000"><s></s><SIZE size="200"><s></s>W3CValidation<e></e></SIZE><e></e></COLOR><br/>
<br/>
Check votre code en temps réel via le service de validation du W3C. Pratique pour s'assurer que son code respecte les standards du World Wide Web Consortium !<br/>
<br/>
Download : <URL url="https://github.com/cfjedimaster/brackets-w3cvalidation">https://github.com/cfjedimaster/brackets-w3cvalidation</URL><br/>
<br/>
<COLOR color="#FF8000"><s></s><SIZE size="200"><s></s>Indent Guides<e></e></SIZE><e></e></COLOR><br/>
<br/>
Vous permet de visualiser l'indentation au moyen de barres verticales.<br/>
<br/>
<URL url="http://www.hostingpics.net"><s></s><IMG src="http://img15.hostingpics.net/pics/326161Imagesanstitre.png"><s>[img]</s><LINK_TEXT text="http://img15.hostingpics.net/pics/32616 ... stitre.png">http://img15.hostingpics.net/pics/326161Imagesanstitre.png</LINK_TEXT><e>[/img]</e></IMG><e></e></URL><br/>
<br/>
Download : <URL url="https://github.com/lkcampbell/brackets-indent-guides">https://github.com/lkcampbell/brackets-indent-guides</URL><br/>
<br/>
<COLOR color="#FF8000"><s></s><SIZE size="200"><s></s>Minimap<e></e></SIZE><e></e></COLOR><br/>
<br/>
Génère un aperçu de votre code, d'où vous pouvez naviguer librement. Peu utile dans notre projet pour l'instant, mais extrêmement puissant lorsque vous allez scroll dans un CSS de 400 lignes !<br/>
<br/>
<URL url="http://www.hostingpics.net"><s></s><IMG src="http://img15.hostingpics.net/pics/526928Imagesanstitre.png"><s>[img]</s><LINK_TEXT text="http://img15.hostingpics.net/pics/52692 ... stitre.png">http://img15.hostingpics.net/pics/526928Imagesanstitre.png</LINK_TEXT><e>[/img]</e></IMG><e></e></URL><br/>
<br/>
Le zoom et l'opacité sont réglables.<br/>
<br/>
Download : <URL url="https://github.com/zorgzerg/brackets-minimap">https://github.com/zorgzerg/brackets-minimap</URL><br/>
<br/>
<COLOR color="#FF8000"><s></s><SIZE size="200"><s></s>Brackets Icons<e></e></SIZE><e></e></COLOR><br/>
<br/>
Affiche un icône en face de chaque fichier du gestionnaire de fichier de brackets en fonction de son type. Toujours utile pour se repérer un peu plus rapidement.<br/>
<br/>
<URL url="http://www.hostingpics.net"><s></s><IMG src="http://img15.hostingpics.net/pics/278112Imagesanstitre.png"><s>[img]</s><LINK_TEXT text="http://img15.hostingpics.net/pics/27811 ... stitre.png">http://img15.hostingpics.net/pics/278112Imagesanstitre.png</LINK_TEXT><e>[/img]</e></IMG><e></e></URL><br/>
<br/>
Download : <URL url="https://github.com/ivogabe/Brackets-Icons">https://github.com/ivogabe/Brackets-Icons</URL></r>