Archives mensuelles : mars 2013

Astuces Visual Studio

Visual Studio est un IDE puissant notamment grâce à ses nombreux raccourcis et fonctionnalités. En voici quelques uns qui peuvent vous faire gagner en productivité.

Poster

Microsoft met à disposition des « Posters » (cheatsheets), une feuille regroupant l’ensemble des raccourcis claviers pour Visual Studio. (Attention, les raccourcis peuvent être différents suivant le langage). Voici le lien pour Visual Studio 2010. (Je n’ai pas trouvé celui pour VS2012, donc si vous savez où le trouver …)

Coller avec l’historique

Vous avez surement déjà connu cette situation : Vous avez fait un copier et et plus tard lors de votre coller, vous vous rendez compte que vous avez copié autre chose entre-temps. La plupart des gens l’ignorent mais Visual Studio garde un historique des « copier » (Ctrl + C). Ainsi il est possible d’accéder à vos derniers copier lors d’un coller. Pour cela, il suffit de faire Ctrl + Maj + V au lieu de faire Ctrl + V. Lors de l’appui sur V vous accéderez à l’historique des copier.

Édition en mode colonne

Tout le monde connait la sélection par ligne mais il peut s’avérer pratique de faire une sélection en colonne pour une modification rapide. La sélection en mode colonne est possible dans Visual Studio et se fait via Alt + Maj + Fléche ou Alt + Souris. A noter que l’édition s’effectue sur toutes les lignes sélectionnées.

Sélection en mode colonne dans VIsual Studio

Visualisation d’un fichier en double

ll est possible de visualiser 2 parties d’un même fichier. Pour cela, il faut cliquer sur l’encoche en haut de la scroll bar du fichier et la déplacer vers le bas.

Activer la comparaison du même fichierEt voila le résultat.

Demo de comparaison de même fichierPoints d’arrêts

Une des taches du développeur consiste à debugger son code et savoir bien utiliser les points d’arrêts est quelque chose qui peut vous faire gagner du temps. Visual Studio possède pas mal d’options pratiques comme l’arrêt conditionnel. On va ainsi pouvoir définir quand le debuggeur doit s’arrêter (et non pas à chaque accès au code). Pour cela , il faut faire un clic droit sur le point d’arrêt et cliquer sur Conditions …

Accès à la configuration d'un points d'arrêts conditionnelConfiguration

Une pop up s’affiche et permet de définir une condition ou une expression qui engendrera l’arrêt au point d’arrêt. Cela est très pratique dans une boucle par exemple.

Points d'arrêts conditionnelOn peut également filtrer suivant le processus ou la machine via Filtrer … sur le clic droit du point d’arrêt.

Filtrage d'un point d'arrêt

ScrollBar Améliorée

Cette astuce nécessite l’extension Productivity Power Tools (VS 2010, VS2012) et apportant diverse amélioration sur la scrollbar d’édition d’un fichier.

Sans configuration cette extension apporte déjà quelques améliorations comme la coloration de la scrollbar (configurable dans les options) :

  • en vert : les modifications effectuées sur le fichier
  • en bleu : la position actuelle du curseur
  • en rouge : les points d’arrêts définis dans votre fichier
  • en violet : les occurrences de la variable sélectionnée
  • en jaune : les parties de code matchant une recherche
  • en gris foncé : le code réduit (avec le petit + / -)

Configuration de Enhanced Scroll bar

Mais il est également possible de modifier l’apparence de la scrollbar. Il a 3 états disponibles :

  • Scroll Bar Mode : le mode normal
  • Map Mode : La scroll bar avec un aperçu du code au sruvol de la barre
  • Full Mode : Le full mode est le Map Mode dont le contenu de la scrollbar représente votre code.

La configuration se fait via :

  • Tools Options > Productivity Power Tools > Source Map
  • un clic droit sur la scroll bar

EnhancedScrollbar_Mode

Un aperçu de la scrollbar en Full Mode :
Demo de la EnhancedScrollbar

Et vous, quelles sont les astuces VS qui vous font gagner du temps ?

Astuce pour bien débuger du Javascript sous Chrome

De nos jours, les navigateurs modernes possèdent des outils très puissant de débogage comme Chrome Developer Tools sous Chrome ou Firebug/Outils de développement Web  sous Firefox par exemple.

Pour les 3, les consoles web offre de la complétion sur le JavaScript mais sous Firebug la complétion est plus puissante. En effet, si j’utilise le sélecteur JQuery, j’obtiens les fonctions accessibles via auto complétion comme le montre l’exemple ci dessous.

Firebug avec l'autoCompletionSous Chrome, cela ne fonctionne pas mais j’ai une astuce afin d’obtenir cette auto complétion qui vous permettra de gagner du temps. L’astuce consiste à passer par une variable intermédiaire et la complétion marchera.

sans Variable -> pas d’auto complétion 🙁
Chrome sans autocompletionavec Variable -> Auto complétion 🙂
Chrome avec l'auto-completion

Bon débogage !!!