Share
TextMate is veruit de teksteditor die de meeste webontwikkelaars op de Mac gebruiken. In de screencast van vandaag zullen we enkele van de functies bekijken die de meeste ontwikkelaars simpelweg niet gebruiken, waardoor uw productiviteit enorm kan toenemen doordat u minder kunt typen!
Geen Mac-persoon? Jeffrey heeft een screencast getiteld "How I Can Twice As Fast As You", laat zien hoe vergelijkbare acties moeten worden uitgevoerd met behulp van een "text expander" -toepassing in Windows.
U kunt alle sneltoetsen en functies van TextMate bekijken in het menu 'Bundels'. Hier zijn enkele van degenen die ik regelmatig gebruik:
| ⇥ | tab |
| ⇧ | Verschuiving |
| ^ | Controle |
| ⌥ | Optie (Alt) |
| ⌘ | Commando |
| ⎋ | Escape (esc) |
| ↩ | terugkeer |
| ↓ ← ↑ → | Toetsenbord pijltoetsen |
| kortere weg | Actie |
| ^ ⇧ , | Nieuw HTML-tagpaar |
| ⌥ ⎋ | Tag / kenmerk automatische aanvulling |
| ⌘ ⇧ 7 | Selectie converteren naar HTML-entiteiten |
| ! ⇥ | Internet Explorer-voorwaarden |
| ⇧ ↩ | Kabelbreuk |
| ^ ⇧ V | Valideer HTML / CSS |
| link ⇥ | Stijlblad Link Tag |
| stijl ⇥ | Inline stijlblok |
| scriptsrc ⇥ | Externe JavaScript-tag |
| script ⇥ | Inline JavaScript-blok |
| kortere weg | Actie |
| php ⇥ | |
| echo ⇥ | |
| als ⇥ | |
| ifelse ⇥ | |
| voor ⇥ voor elke ⇥ terwijl ⇥ matrix ⇥ schakelen ⇥ geval ⇥ | Zoals je zou verwachten. |
| vereist ⇥ req1 ⇥ incl ⇥ incl1 ⇥ | vereisen 'bestand'; require_once 'bestand'; include 'file'; include_once 'bestand'; |
| $ _ ⇥ | Selecteer $ _ ['POST'], $ _ ['GET'] etc. (Global Arrays) |
| ^ ⇧ V | Valideer de syntaxis |
| ⌘ ⇧ R | PHP-bestand uitvoeren |
| kortere weg | Actie |
| als ⇥ ife ⇥ (if, elsif) tenzij ⇥ terwijl ⇥ | Zoals je zou verwachten. |
| vereist ⇥ | vereisen "" |
| reqg ⇥ | vereisen "rubygems" vereisen "" |
| Hash ⇥ | Hash.new | hash, key | hash [key] = |
| : ⇥ | : toets => "waarde", |
| Bestand ⇥ | Selecteer voor verschillende 'Bestand' objectmethoden (lees, schrijf etc.) |
| ⌘ R | Run Ruby-bestand |
| kortere weg | Actie |
| cla ⇥ | Creëer Rails Controller |
| flits ⇥ | flash [: notice] = " |
| ra ⇥ | render: action => " |
| vp ⇥ | validates_presence_of: input |
| vl ⇥ | validates_length_of: input,: within => 1 ... 12 |
| ^ P | params [: doel] |
| ^ J | bijeenkomst [: doel] |
| ^ ⇧ . | <%= %> |
| ff ⇥ | <% form_for @model do |f| -%> <% end -%> |
| f. ⇥ | Selecteer voor Rails 'formulier helper - label, veld, wachtwoord, tekstveld, selectievakje enz. |
| slt ⇥ | <%= stylesheet_link_tag"%> |
| jit | <%= javascript_include_tag"%> |
| ⇧ ⌥ ⌘ ↓ | Ga naar de juiste controller, model, weergave enz. Voor het huidige bestand |
| mcol ⇥ | Gebruik bij migraties. Selecteer om kolommen toe te voegen, te bewerken, te hernoemen, te verwijderen enz. |
We gaan een snelkoppeling maken (toegankelijk via ⌘⇧A) om de momenteel geselecteerde tekst in een koppeling in te pakken en direct naar het kenmerk gaan om de URL in te voeren.
Ga in TextMate naar "Bundels> Bundeleditor> Showbundle-editor" (of druk op ^⌥⌘B). Dit is hoe mijn editor eruit ziet. De jouwe kan er anders uitzien omdat ik een aantal aangepaste bundels heb toegevoegd en sommige heb verwijderd voor talen die ik niet gebruik:
Klik op de HTML-vervolgkeuzelijst (bundel), klik op de + in de linkerbenedenhoek van het venster en selecteer 'New Snippet'. Noem dit fragment 'Wrap Link' en vervolgens 'Activering', selecteer 'Key Equivalent' en voer in het vak de toetscombinatie in die u wilt gebruiken (bijv. ⌘⇧A).
Voer in het tekstgebied het volgende in:
$ TM_SELECTED_TEXT
$ TM_SELECTED_TEXT is een variabele die de geselecteerde tekst bevat. Sluit het venster en probeer het uit. Open een document in TextMate, markeer wat tekst en druk op de toetscombinatie. De selectie wordt ingepakt in ankertags.
Echter, zoals het nu is, moet je nog steeds je cursor verplaatsen naar de href = "" attribuut om de daadwerkelijke link in te voeren. Zou het niet eenvoudiger zijn als onze cursor zich daar automatisch bewoog?
Wijzig de opdracht 'Wrap Link' naar het volgende:
$ TM_SELECTED_TEXT
De $ 1 vertelt TextMate waar de cursor moet worden geplaatst na het uitvoeren van de taak. Je kunt plaatsen $ 2, $ 3 enz. en dan door hen heen gaan met behulp van de tab-toets.
Wijzig tot slot de opdracht in:
$ 2: $ TM_SELECTED_TEXT
U kunt standaardtekst op een locatie toevoegen met $ 2: standaardtekst. 'Standaardtekst' wordt weergegeven en automatisch gemarkeerd wanneer u erop tabelt.
In ons geval hebben we de geselecteerde tekst ingesteld als tabbladlocatie voor omstandigheden waarin u de oorspronkelijke tekst wellicht wilt wijzigen.
Je kunt ook tekst die is ingevoerd op tabpunten 'spiegelen', zoals:
Tekst: $ 1
Een andere tekst: $ 2: blah de blah de blah
Spiegel van 1: $ 1
Wat u vervolgens op het eerste tabblad invoert, wordt automatisch ingevoerd in andere posities met dezelfde waarde.
Persoonlijk heb ik mijn eigen bundels gemaakt voor het opnemen van de jQuery-bibliotheken, het invoeren van 'Lorem Ipsum'-tekst en ook voor het schrijven van Nettuts-artikelen. Bijvoorbeeld:
Vindt u het gebruik van gedachtenloos invoeren van jQuery-tags? Probeer deze:
'jQuery CDN' geopend met inc-jquery tab-trekker:
'jQuery UI CDN' geopend met inc-ui tab-trekker:
'jQuery Inline Script' toegankelijk met inline-jquery tab-trekker:
'jQuery Document Ready' geopend met jQuery tab-trekker:
\ $ (function () $ 0);
Notitie: De back-slashes aan het begin van $ (function () is om te ontsnappen aan de $ karakter - anders denkt TextMate dat het een variabele is om te proberen en te renderen!
U kunt deze allemaal ook gewoon toewijzen aan een jQuery tab-trigger, en als je het uitvoert, krijg je een vervolgkeuzelijst om uit te kiezen. Dit is handig als u liever geen grote groepen snippetnamen onthoudt!
Ik heb ook een bundel voor de verschillende tags waar Nettuts artikelen van afhankelijk zijn, zoals:
'Pre-codeblok' geopend met behulp van nt-pre tab-trigger:
$ 2
'Tuts Image' toegang met behulp van nt-img tab-trigger:
Bij het schrijven van artikelen gebruik ik een kleine sjabloon om het lezen te vergemakkelijken tijdens het proeflezen. Dit fragment heeft een voorbeeld van 'spiegelen' op de titel- en H1-tags. Ik benader dit met behulp van de tab-trigger van de nt-template:
$ 1: TITLE 
$ 1
$ 2: Samenvatting tekst
$ 4: Koptekst
$ 5: begin met typen! Gebruik H3 voor koppen en H4 voor subtitels
$ 0
Accentsconagua
