TextMate est de loin l’éditeur de texte préféré de la plupart des développeurs Web sur Mac. Dans le screencast d'aujourd'hui, nous allons examiner certaines des fonctionnalités que la plupart des développeurs n'utilisent tout simplement pas, ce qui peut considérablement augmenter votre productivité en vous permettant de taper moins!
Pas un Mac? Jeffrey propose un screencast intitulé "Comment coder deux fois plus vite que vous" pour montrer comment effectuer des actions similaires à l'aide d'une application "expandeur de texte" sous Windows.
Vous pouvez afficher tous les raccourcis et fonctions de TextMate dans le menu "Ensembles". Voici quelques-uns de ceux que j'utilise régulièrement:
⇥ | Languette |
⇧ | Décalage |
^ | Contrôle |
⌥ | Option (Alt) |
⌘ | Commander |
⎋ | Échapper (esc) |
↩ | Revenir |
↓ ← ↑ → | Touches fléchées du clavier |
Raccourci | action |
⇧ , | Nouvelle paire de balises HTML |
⎋ | Complétion automatique des balises / attributs |
⌘ ⇧ 7 | Convertir la sélection en entités HTML |
! ⇥ | Conditions d'Internet Explorer |
↩ | Saut de ligne |
⇧ ⇧ V | Valider HTML / CSS |
lien | Étiquette de lien de feuille de style |
style | Bloc de style en ligne |
scriptsrc ⇥ | Balise JavaScript externe |
script | Bloc JavaScript en ligne |
Raccourci | action |
php | |
écho ⇥ | |
si | |
ifelse | |
pour ⇥ pour chaque ⇥ alors que tableau commutateur cas | Comme vous vous en doutez. |
req ⇥ req1 ⇥ incl incl1 | nécessite 'file'; require_once 'fichier'; inclure 'fichier'; include_once 'fichier'; |
$ _ | Sélectionnez $ _ ['POST'], $ _ ['GET'] etc. etc. (tableaux globaux) |
⇧ ⇧ V | Valider la syntaxe |
⇧ R | Exécuter un fichier PHP |
Raccourci | action |
si si ⇥ (si, elsif) à moins que alors que | Comme vous vous en doutez. |
req ⇥ | exiger "" |
reqg ⇥ | nécessite des "rubygems" exiger "" |
Hash | Hash.new | hash, clé | hash [clé] = |
: ⇥ | : clé => "valeur", |
Fichier | Sélectionnez pour différentes méthodes d'objet 'Fichier' (lecture, écriture, etc.) |
⌘ R | Exécuter le fichier Ruby |
Raccourci | action |
cla | Créer un contrôleur de rails |
flash | flash [: notice] = " |
ra ⇥ | render: action => " |
vp | validates_presence_of: input |
vl | validates_length_of: input,: inside => 1… 12 |
⌃ P | params [: objet] |
⌃ J | session [: objet] |
⇧ . | <%= %> |
ff ⇥ | <% form_for @model do |f| -%> <% end -%> |
F. ⇥ | Sélectionner pour l’assistant de formulaire de Rails - libellé, champ, mot de passe, zone de texte, case à cocher, etc.. |
slt | <%= stylesheet_link_tag"%> |
jit | <%= javascript_include_tag"%> |
⌥ ⌘ ↓ | Aller au contrôleur, modèle, vue, etc. approprié pour le fichier actuel |
mcol | Utilisez dans les migrations. Sélectionnez pour ajouter, modifier, renommer, supprimer des colonnes, etc.. |
Nous allons créer un raccourci (accessible avec ⌘⇧A) pour envelopper le texte actuellement sélectionné dans un lien et vous rendre directement à l'attribut pour entrer l'URL.
Dans TextMate, allez dans "Bundles> Bundle Editor> Show Bundle Editor" (ou appuyez sur ⌃⌥⌘B). Voici à quoi ressemble mon éditeur. Le vôtre peut sembler différent car j'ai ajouté des ensembles personnalisés et en ai supprimé certains pour les langues que je n'utilise pas:
Cliquez sur le menu déroulant HTML (ensemble), cliquez sur le signe + en bas à gauche de la fenêtre et sélectionnez "Nouveau fragment". Nommez cet extrait 'Wrap Link' puis pour 'Activation', sélectionnez 'Equivalent clé' et dans la case, entrez la combinaison de touches que vous souhaitez utiliser (p ex. A).
Dans la zone de texte, entrez:
$ TM_SELECTED_TEXT
$ TM_SELECTED_TEXT
est une variable contenant le texte sélectionné. Fermez la fenêtre et essayez-le. Ouvrez un document dans TextMate, mettez du texte en surbrillance et appuyez sur votre combinaison de touches. La sélection sera encapsulée dans des balises d'ancrage.
Cependant, dans l’état actuel des choses, vous devez toujours déplacer votre curseur dans href = ""
attribut pour entrer le lien réel. Ne serait-ce pas plus facile si notre curseur s'y déplaçait automatiquement?
Changez la commande 'Wrap Link' comme suit:
$ TM_SELECTED_TEXT
le $ 1
indique à TextMate où placer le curseur après avoir exécuté la tâche. Vous pouvez placer $ 2
, $ 3
etc., puis déplacez-vous à travers eux en utilisant la touche de tabulation.
Enfin, modifiez la commande pour:
$ 2: $ TM_SELECTED_TEXT
Vous pouvez ajouter du texte par défaut à un emplacement à l’aide de $ 2: Texte par défaut. Le texte par défaut s'affiche et est automatiquement mis en surbrillance lorsque vous y accédez..
Dans notre cas, nous avons défini le texte sélectionné comme emplacement d'onglet pour les circonstances dans lesquelles vous souhaitez modifier le texte d'origine..
Vous pouvez également «refléter» le texte saisi aux points de tabulation, comme suit:
Texte: $ 1
Un autre texte: $ 2: bla de blah de blah
Miroir de 1: $ 1
Tout ce que vous entrez ensuite dans le premier onglet, sera automatiquement entré dans les autres positions qui ont la même valeur.
Personnellement, j'ai créé mes propres bundles pour inclure les bibliothèques jQuery, entrer du texte «Lorem Ipsum» et aussi pour écrire des articles sur Nettuts. Par exemple:
Vous trouvez-vous en train de saisir des balises jQuery sans y penser? Essayez ces:
'jQuery CDN' accessible avec inc-jquery
tab-trigger:
'jQuery UI CDN' accessible avec inc-ui
tab-trigger:
'Script en ligne jQuery' accessible avec inline-jquery
tab-trigger:
'jQuery Document Ready' accessible avec jquery
tab-trigger:
\ $ (function () $ 0);
Remarque: Les barres obliques au début de $ (fonction ()
est d'échapper à la $
caractère - sinon TextMate pensera que c'est une variable pour essayer de rendre!
Vous pouvez aussi simplement assigner tout cela à un jquery
onglet-trigger, puis, lorsque vous l'exécutez, vous aurez un menu déroulant à choisir. Ceci est utile si vous préférez ne pas mémoriser d'énormes groupes de noms d'extraits.!
J'ai aussi un paquet pour les différentes balises sur lesquelles dépendent les articles Nettuts, telles que:
'Pre Code Block' accessible via nt-pre tab-trigger:
$ 2
Accès 'Tuts Image' en utilisant nt-img tab-trigger:
Lors de la rédaction d'articles, j'utilise un petit modèle pour faciliter la lecture lors de la relecture. Cet extrait contient un exemple de "mise en miroir" sur les balises Title et H1. J'accède à cela en utilisant le déclencheur tab nt-template:
$ 1: TITLE $ 1
$ 2: Résumé du texte
$ 4: en-tête
$ 5: Commencez à taper! Utilisez H3 pour les en-têtes et H4 pour les sous-en-têtes
$ 0