Bootstrap tutorial logo

Krótki przewodnik po Sublime Text

autor: Robert

24 czerwca 2013

Jak wspomniałem w poprzednim poście, używam Sublime Text 2 i postaram się pokazać kilka jego opcji które znacząco usprawniają pisanie kodu.

  1. Tworzenie nowego pliku
    Nowy plik tworzymy poprzez skrót klawiszowy CTRL + N lub wybieramy zakładkę File -> New File
  2. Zapisywanie pliku
    Plik zapisujemy poprzez kombinację klawiszy CTRL + S lub wybieramy zakładkę File -> Save
  3. Otwieranie pliku
    Plik otwieramy poprzez kombinację klawiszy CTRL + O lub wybieramy zakładkę File -> Open File.
    Możliwe jest także otwieranie pliku poprzez przeciągnięcie go z eksploratora windows na pasek „kart” w Sublime
  4. Otwieranie folderu
    Gdy nasz projekt posiada więcej plików możemy otworzyć cały folder, robimy to poprzez zakładkę File -> Open Folder
  5. Otwieranie panelu bocznego
    Aby zobaczyć nasz przed chwilą dodany folder należy otworzyć boczny panel. Robimy to kombinacją klawiszy ‚CTRL + K’ + ‚CTRL + B’ lub wybieramy zakładkę View -> Sidebar -> Show Sidebar
  6. Dodawanie folderu do panelu bocznego
    Czasami może się zdarzyć tak, że chcemy mieć dostęp do plików znajdujących się w  kilku folderach a nie uśmiecha się nam zapełniać pasek kart albo otwierać je ciągle jak opisałem w pkt 3. Gdy wybierzemy opcję File -> Open Folder to otworzy się nam nowe okno edytora a przecież nie o to chodzi. Rozwiązaniem jest wybranie opcji Project -> Add Folder To Project

Sublime Text posiada także wiele skrótów klawiszowych które są niesamowicie przydatne:

  • CTRL + D – Znajduje kolejne wystąpienia zaznaczonego tekstu (np. wszystkie span8 w danym rzędzie chcemy zamienić na span4. Zaznaczamy pierwsze wystąpienie span8, klikamy CTRL + D aż dojdziemy do końca rzędu a następnie wpisujemy span4. Funkcja ta umożliwia także dopisanie czegoś przed lub za przykładowym span8)
  • ALT + SHIFT + W – Umożliwia otoczenie jednego znacznika HTML innym (np. posiadamy obrazek <img src=”…” /> chcemy z niego zrobić linka <a href =”#”><img src=”…” /></a>. Zamiast przesuwać kursor do początku znacznika a następnie do końca tylko go zaznaczamy i wciskamy w/w kombinację klawiszy. Pojawi się nam nowy znacznik otaczający zaznaczony.
  • ‚znacznik HTML’ + TAB – Otwiera i zamyka wybrany znacznik HTML (np. p + TAB = <p></p>, img + TAB = <img src=””>, div + TAB = <div></div> itd.)
  • ‚znacznik HTML’ . ‚klasa’ + TAB – Podobnie jak powyżej ale w znaczniku jest dodatkowo zawarta klasa (np. div.span8 + TAB = <div class=”span8″</div>, a.btn + TAB = <a class=”btn”></a>)
  • CTRL + / – Otacza zaznaczony tekst komentarzem (bardzo często chcemy otoczyć jakiś blok kodu komentarzem, wystarczy go zaznaczyć i wcisnąć opisaną kombinację klawiszy, edytor sam zadba o zastosowanie odpowiedniego rodzaju komentarza)
  • lorem + TAB – wyświetla tekst Lorem Ipsum… zwykle przydatny gdy chcemy wypełniać paragrafy tekstem

Sublime Text mimo, że jest „tylko” edytorem to posiada bardzo wiele pluginów, które rozszerzają jego funkcjonalności. Absolutnie niezbędnym jest Emmet, który niesamowicie przyspiesza pisanie kodu. Na stronie https://emmet.io/ możecie zobaczyć go w akcji. Aby zainstalować go w Sublime Text wchodzimy w „Preferences -> Package Control -> Install Package”, tam wpisujemy Emmet i zatwierdzamy wybór. Po wykonaniu tej prostej czynności możemy już korzystać z dobrodziejstw Emmeta.

Poradników z różnymi trikami oraz instrukcjami do Sublime znajdziecie w sieci bardzo wiele. Natomiast jeśli chcecie skorzystać z gotowego kursu video to na Strefakursów.pl taki znajdziecie:)

Kurs Efektywna praca w Sublime Text


Post się przydał? Oceń go proszę.
1 Gwiazdka2 Gwiazdki3 Gwiazdki4 Gwiazdki5 Gwiazdek (11 głosów, średnia: 3,36 na 5)
Loading...

Komentarze: 13 komentarzy

Artur 11 czerwca 2014 o 11:09

Nawiązując do komentarza z poprzedniego artykułu, powiem, że odkąd przesiadłem się na ST (aktualnie v3) w zasadzie już nic innego nie używam, no może poza kED’em, bo w ST akurat do kodowania html nie wszystko jest wygodne nawet po zainstalowaniu pluginu Emmet.

Do listy skrótów, których często używam dodałbym jeszcze:

Ctrl+P lub Ctrl+G – wyświetla okno wyszukiwania nazwy pliku we wszystkich otwartych folderach i plikach
Ctrl+Shift+Strzałka góra/dół – zamienia miejscami 2 linie (świetna jak dla mnie sprawa!)
Ctrl + ` – otwiera nam się okno konsoli
Ctrl+Shift+P – otwiera nam się okienko Command Palette z listą komend i gdzie można uruchomić instalator pluginów
Ctrl + LPM – klikając w różnych miejscach, wstawiamy kursor i możemy teraz pisać w kilku miejscach jednocześnie

http://tmtheme-editor.herokuapp.com/#/theme/Monokai – na koniec polecam Theme edytor, gdzie można sobie dostosować kolorystykę pod własny gust. Niestety, działa na razie tylko i wyłącznie pod Chrome, ale raczej nie jest to przeszkodą.

Odpowiedz
Łukasz 7 lipca 2014 o 17:06

Ja polecam aptan studio 3, jest darmowy. Można zainstalować pod Windows , Linux i Mac.

Odpowiedz
    Robert 8 lipca 2014 o 07:44

    Jest wiele edytorów, każdy musi znaleźć taki, który mu najbardziej odpowiada:)

    Odpowiedz
Andrzej 15 lipca 2014 o 13:17

Mam pytanie, jaki jest skrót klawiszowy do posprzątania kodu? Tzn. do zrobienia odpowiednich wycięć, poprawienia czytelności.

Odpowiedz
    Robert 21 sierpnia 2014 o 15:59

    Można to zrobić tak:
    CTRL + a
    A następnie Edit -> Line -> Reindent

    Odpowiedz
Jacek 5 września 2014 o 18:21

A co z FTP?

Odpowiedz
    Robert 8 września 2014 o 10:37

    Czy możesz rozwinąć pytanie?

    Odpowiedz
      Konrad 25 listopada 2014 o 23:51

      czy można w SublimeText jak np w notepad++ łączyć się bezpośrednio z serwerem i zapisywać już na serwerze?

      Odpowiedz
        Robert 26 listopada 2014 o 09:02

        Sublime Text jest potężnym edytorem, do którego istnieje wiele pluginów rozszerzających jego funkcjonalności. Co do łączenia z FTP istnieje wtyczka -> http://wbond.net/sublime_packages/sftp wersja darmowa w zupełności wystarcza:)

        Odpowiedz
Łukasz 9 stycznia 2016 o 23:14

Witam,

mam pytanie. Czy trzeba wykupić licencje żeby korzystać z Sublime Text 3, Jaki jest koszt na zł ?

Pozdrawiam

Odpowiedz
    Robert 11 stycznia 2016 o 07:57

    Z Sublime Text można korzystać bez limitów. Ale gdy dojdziesz do wniosku, że dzięki temu edytorowi zarabiasz już pieniądze to dobrze było by zapłacić twórcom za ich pracę:)
    Koszt to 70$ czyli jakieś 280zł i jest to licencja na użytkownika więc możesz wtedy instalować ST na wszystkich twoich komputerach.

    Odpowiedz
jaco 7 stycznia 2018 o 20:48

A jak uporządkować kod ?

Odpowiedz