VS Code: dogłębna recenzja dla programistów WordPress

Microsoft dostaje złą reputację. Z biegiem lat zyskały reputację nieco opóźnionych w czasie i mniej niż przyjaznych dla użytkownika. Wiele lat temu mogli nawet na to zasłużyć. Ale już nie. Najnowsze przedsięwzięcia firmy Microsoft są wieloplatformowe, intuicyjne i przesuwają granice technologii. W tym miejscu pojawia się Visual Studio Code. Od czasu wydania w 2015 r. VS Code stał się de facto edytorem kodu dla wielu programistów, wypierając Sublime Text i Atom jako najlepsze opcje. A to dużo mówi. Przeanalizujmy więc, dlaczego VS Code jest tak wspaniały i jak firma Microsoft odzyskała całe nasze zaufanie.

Visual Studio Code: Open Source i kocham to

Z pozoru Visual Studio Code wygląda jak większość innych edytorów. Podświetlanie składni, ciemny motyw, rozszerzenia itp. Ale kiedy zagłębisz się nieco głębiej, zobaczysz, że w przeciwieństwie do wielu innych edytorów i środowisk IDE, doświadczenie, które otrzymujesz w VS Code, jest po prostu płynne i — wybacz kalambur — wysublimowane.

Największym pozytywem VS Code jest to, że jest to open source. Ale z drugiej strony, tak samo jest z Atom (i technicznie należy do Microsoftu, odkąd przejęli GitHub). Co więcej, Microsoft wydał go na licencji MIT, najbardziej łagodnej i otwartej z licencji open-source. Dla firmy, która w przeszłości była dość napięta w kwestii patentów i ich własności intelektualnej, jest to ogromny krok.

Z powodu tej licencji VS Code kieruje społecznością zagorzałych programistów, którzy nie tylko korzystają z oprogramowania w swoim życiu zawodowym, ale także przyczyniają się do samego edytora lub niektórych z wielu dostępnych rozszerzeń i wtyczek, aby go dostosować. Toczy się debata na temat zakresu licencji MIT dla Visual Studio Code, ale nie powinno to dotyczyć użytkowników ani większości programistów.

Wszechstronne IDE?

Oto pytanie godziny: czy VS Code jest edytorem kodu czy środowiskiem IDE? Ma wbudowaną integrację z Git, dostęp do terminala i bash, konsolę debugowania oraz specjalny rodzaj podświetlania składni i uzupełniania kodu o nazwie IntelliSense.

Wszystko to jest natychmiastowe po pobraniu, bez żadnych rozszerzeń ani dostosowywania. Zazwyczaj tego rodzaju funkcje wbudowane i aktualizowane przez oficjalny zespół programistów są dostępne w aplikacjach premium, takich jak PhpStorm. Ale z VS Code… ta linia się zaciera. Oferuje wiele funkcji podobnych do IDE.

Ale ostatecznie nie jest to pełne IDE. Nie otrzymujesz domyślnej refaktoryzacji kodu, oficjalnych aktualizacji specyficznych dla języka i zabezpieczenia na przyszłość oraz innych ciężkich rzeczy, które może przebić IDE. To powiedziawszy, istnieje środowisko IDE programu Visual Studio. Jest to osobny, premium produkt, który Microsoft tworzy od lat, a Visual Studio Code to tylko kolejny członek rodziny Visual Studio. Więc jeśli szukasz pełnego, ciężkiego IDE, możesz dostać jeden od stwardnienia rozsianego. Ale szczerze mówiąc, to bardzo blisko.

Ponadto istnieje środowisko IDE programu Visual Studio, dlatego deweloperzy odnoszą się do niego jako VS Code lub po prostu Code, a nie Visual Studio. W przeciwnym razie byłoby to zbyt mylące.

Kod VS: po wyjęciu z pudełka

Jeśli do tej pory nie zgadłeś, istnieje wiele części, które składają się na VS Code. Zacznijmy od przyjrzenia się podstawom i temu, jak całość działa od razu po wyjęciu z pudełka, przed dodaniem jakiegokolwiek rozszerzenia lub dostosowaniem czegokolwiek.

Gdy otworzysz edytor po raz pierwszy, zauważysz dwie rzeczy:

• Układ i projekt są podobne do innych edytorów, a zatem znane większości ludzi
• Ładuje się szybciej niż większość innych edytorów kodu (Atom, patrzymy w twoim kierunku)

Kiedy skończysz być zdumiony jego responsywnością, możemy przejść do lewego paska bocznego. To tutaj będzie działać większość dodatkowych narzędzi dostarczanych z VS Code.

Domyślne ikony z boku otwierają po kliknięciu nową kolumnę, którą można zmienić i dostosować.

1. Odkrywca

Domyślnym widokiem w VS Code będzie karta Eksplorator . Zobaczysz w nim sekcję o nazwie Open Editors , która jest slangiem VS Code dla dokumentów. Każdy otwarty plik jest uważany za nowy edytor. Jeśli więc masz otwartych 8 plików .css, zobaczysz listę 8 edytorów.

Następnie masz listę otwartych programów, które mogą tworzyć pliki do edycji za pomocą VS Code. W tym przykładzie zobaczysz, że jedynym otwartym w tle jest Snagit. Poniżej znajduje się konspekt, który wyświetla szkielet bieżącego pliku. Kiedy otrzymujesz gigantyczny plik i musisz uzyskać widok z góry na całą strukturę, widok zarysu działa nieco płynniej niż nawet minimapa po prawej stronie ekranu.

2. Szukaj

Funkcja wyszukiwania w VS Code jest fenomenalna. Nie chodzi o to, że jest potężniejszy niż inne edytory (ponieważ muszę być szczery: uwielbiam Find/Replace in Sublime Text). Chodzi o to, że jest łatwiejszy i bardziej przejrzysty niż inne edytory.

Podczas wyszukiwania każde wystąpienie wyszukiwanego terminu znajduje się na dole prawej kolumny. Następnie możesz kliknąć pojedyncze wystąpienie, aby podświetlić lokalizację wyszukiwanego hasła w pliku. (Jeśli naciśniesz CTRL/CMD-Click, otworzy się drugie wystąpienie pliku, podświetlając nowo wybraną linię.)

Jeśli zdecydujesz się zastąpić termin w drugim polu, w wynikach zostanie wyświetlona czerwona, przekreślona wersja wyszukiwanego terminu oraz zielono zabarwione zamienniki w wynikach. Kiedy klikniesz na znajdź/zamień w wynikach, pojawi się porównanie porównawcze w celu podglądu zmian. Ta funkcja jest tak przydatna, że ​​będziesz się zastanawiać, jak mogłeś bez niej żyć.

3. Gita

Zacznę od stwierdzenia, że ​​prawdopodobnie jestem stronniczy w moim podejściu do Gita. Zwykle jestem użytkownikiem wiersza poleceń/basha, a graficzne klienty Git nigdy nie wydawały mi się odpowiednie. Tak więc duża część integracji Gita z innymi edytorami i środowiskami IDE nie była moją filiżanką herbaty. Jednak implementacja VS Code jest hybrydą między wierszem poleceń a graficznym interfejsem użytkownika i działa zaskakująco dobrze bez względu na preferowaną wersję Git. Rozumiesz… wersję Gita?

Część dotycząca integracji Git w VS Code polega na tym, że po prostu działa. Lewa kolumna, która pojawia się po kliknięciu ikony Git, jest wizualnym wskaźnikiem stanu repozytorium. Możesz kliknąć wielokropek (...), aby sprawdzić polecenia Git, które normalnie musiałyby być wpisane bardzo konkretnie. Możesz dodawać, zatwierdzać, wypychać, a nawet zmieniać swoje pliki w poczekalni i pracować nad różnymi gałęziami za pomocą menu kontekstowego.

Dodatkowo masz możliwość otwarcia terminala bash w samym edytorze. Na pasku nawigacyjnym znajduje się menu Terminal , a to w VS Code jest szybkie, czyste, płynne i całkiem użyteczne bez konieczności dostosowywania go. W razie potrzeby możesz podzielić się na wiele kolumn i trzymać różne katalogi otwarte w różnych terminalach, między którymi możesz przełączać się za pomocą listy rozwijanej.

Terminal również nie jest specyficzny dla Gita. Po prostu działa tak dobrze z tą funkcją, że dodanie jej tutaj wydawało się naturalne.

4. Konsola debugowania

Konsola debugowania jest również jedną z domyślnych funkcji programu VS Code, która wyróżnia ją spośród innych edytorów kodu. W chwili pisania tego tekstu w programie VS Code można zainstalować 171 środowisk debugowania . Nie podają liczby, ale chciałem wiedzieć i doszedłem do wniosku, że ty też tak, więc policzyłem ręcznie.

W wynikach można znaleźć debugery do wszystkiego, co można sobie wyobrazić. JavaScript, CoffeeScript, Kawa, Java… tak naprawdę wszystkie skrypty z kofeiną. Dostajesz środowiska LUA oraz Python i Ruby, Docker, PHP, SASS, LESS i… wszystko. Ze wszystkich niejasnych i/lub martwych języków programowania, dla których próbowałem znaleźć debugger, QBasic był jedynym, który nie dał żadnych rezultatów. I od bardzo dawna nikt go nie używał. Naprawdę myślę, że trudno byłoby znaleźć coś, co jest nowoczesne i nie jest dostępne na Rynku Rozszerzeń.

5. Rynek rozszerzeń

Wszystko to powiedziawszy, głębsze spojrzenie na Rynek rozszerzeń daje wyobrażenie o rodzajach narzędzi, których możesz oczekiwać od społeczności programistów redaktora. Na powyższym zrzucie ekranu możesz zobaczyć miliony instalacji niektórych rozszerzeń, a jeśli nie masz pewności, od czego zacząć, najlepszym rozwiązaniem może być sortowanie według instalacji lub według popularności .

Możesz sortować i wyszukiwać według słów kluczowych za pomocą parametru @sort . Ale możesz również kliknąć wielokropek (2), aby wyświetlić listę rozwijaną ze wszystkimi opcjami. Dostępne są również opcje zarządzania własnymi zainstalowanymi rozszerzeniami.

Gdy znajdziesz coś, co chcesz zainstalować, jest to bardzo proste. Kliknij zielony przycisk Instaluj ,

Będziesz wtedy musiał Odśwież edytorze kodu VS, aby zakończyć instalację.

Otóż ​​to. Po zakończeniu Twoje rozszerzenie jest gotowe do użycia. Jednak od czasu do czasu możesz chcieć wrócić do karty Szczegóły , ponieważ omawiane są tam różne problemy, często za pomocą zaktualizowanych i oznaczonych kolorami tagów.

Możliwość sprawdzenia stanu zależności i podatności jest świetna i można zobaczyć wszystkie otwarte problemy z rozszerzeniami oraz czas potrzebny na ich rozwiązanie. Nie każde rozszerzenie wyświetla wszystkie informacje, ale gdy już to zrobią, jest to niezwykle przydatne.

Skróty klawiaturowe i mapy klawiszy

Być może najważniejszą częścią edytora kodu jest skróty klawiaturowe i keymaps. Wszystkie rzeczy, o których już mówiliśmy, są świetne i stanowią integralną część sukcesu edytora i projektu. Ale kiedy przyzwyczaisz się do mapy klawiszy i twoje palce używają jej za pomocą pamięci mięśniowej, zamiana na nową jest prawie niemożliwa.

W najlepszym przypadku zamiana spowolni harmonogram projektu i zmniejszy wydajność, a w najgorszym, twoje nieudolne palce doprowadzą do katastrofalnego wstrzyknięcia do bazy kodu.

Bez względu na to, skąd pochodzisz, gdy migrujesz do VS Code, społeczność Cię obejmuje. Niezależnie od tego, czy pochodzi z VIM, Emacs, Sublime Text, czy nawet Notepad ++, możesz zachować skróty i mapy klawiszy, do których jesteś przyzwyczajony. Możesz przeszukać Rynek rozszerzeń za pomocą @recommended:keymaps lub przejść do Plik – Preferencje – Mapy klawiszy, aby wyświetlić listę dostępnych rozszerzeń.

A jeśli nie lubisz skrótów, to też w porządku. Jeśli czujesz potrzebę dostosowania czegokolwiek (lub po prostu chcesz podsumować, jakie skróty klawiaturowe są domyślnie dostępne w VS Code), możesz przejść do Plik – Preferencje – Skróty klawiaturowe .

Różne Funkcje, o których powinieneś wiedzieć

Jako ogólny przegląd powinieneś być w stanie zobaczyć w tym momencie większość tego, co VS Code może zaoferować jako edytor tekstu i kodu. To powiedziawszy, jest kilka przydatnych rzeczy, o których powinieneś wiedzieć.

1. Menu wyboru

Jest to przydatne bez względu na to, na jakim poziomie jesteś programistą, ale jest szczególnie przydatne, jeśli jesteś początkującym edytorem. Menu Wybór zawiera szereg funkcji, które są dla Ciebie bezcenne.

W szczególności możliwość korzystania z opcji Dodaj kursory do końców linii jednym kliknięciem jest przyjemna, a możliwość przejścia do menu i zaznaczenia wszystkich wystąpień podświetlonego słowa, frazy lub fragmentu w bieżącym pliku. Większość edytorów ma je jako skróty, ale nie wszyscy mają je tak łatwo etykietowane lub dostępne, jak VS Code. To było odświeżające widzieć je tak z góry, ponieważ są to jedne z najcenniejszych i najbardziej znanych poleceń, których będziesz używać.

2. Menu terminala

To, że pracujesz w edytorze kodu, nie oznacza, że ​​jesteś czarodziejem wiersza poleceń. W rzeczywistości mogłeś spojrzeć na powyższą sekcję wiersza poleceń i terminala i pomyśleć, że nigdy ich nie użyjesz.

Ale spójrz na menu Terminal . Nawet jeśli nie robisz z tym dużo, zobaczysz kilka podstawowych poleceń, które możesz wykonać z menu, które mogą znacznie pomóc w twoim rozwoju.

Wystarczy mieć do nich dostęp za pomocą menu, zamiast znać polecenia powłoki, aby otworzyć terminal, bash i wiersz poleceń w sposób, którego wiele aplikacji po prostu nie zauważa. To właśnie takie drobne drobiazgi sprawiają, że VS Code naprawdę przemawia do każdego, nie tylko do doświadczonych programistów, którzy wywodzą się z VIM czy Emacsa.

3. Tryb Zen

W menu Widok znajdziesz podmenu o nazwie Wygląd, które zawiera opcję Przełącz tryb Zen . Inne opcje w widoku są warte sprawdzenia i eksperymentowania, ale chcę zwrócić twoją uwagę na tryb Zen, ponieważ spodziewam się, że wiele osób nigdy go nie próbowało.

Różni redaktorzy mogą nazywać go różnymi nazwami, ale ogólna idea jest taka, że ​​cały ekran wypełniasz tylko dokumentem, który aktualnie edytujesz. Różni się od trybu pełnoekranowego tym, że nie maksymalizujesz aplikacji, ale dokument.

Trudno jest pokazać tryb za pomocą zrzutu ekranu, ponieważ tak naprawdę nie może on pokazać, że cały ekran jest objęty edytorem VS Code. Nawet pasek zadań Windows i stacja dokująca MacOS. Każdy piksel powierzchni ekranu jest zajęty przez Twój obecny projekt, abyś mógł się na nim skupić i nic więcej.

A jeśli to nie dla ciebie, po prostu naciśnij ESC i wrócisz do swojego starego widoku.

Może się wydawać, że to niewiele, a byłem sceptykiem. Ale po użyciu podobnej funkcji w Scrivener do pisania fikcji, jestem konwertytą. Możesz łatwiej wejść w stan przepływu i naprawdę załatwić sprawy. Tak wiele pochwał dla VS Code za wdrożenie trybu Zen, abyśmy mogli podłączyć nasze słuchawki douszne i pracować bez rozpraszania uwagi, kiedy tylko chcemy (lub ile możemy).

Zawijanie

Biorąc wszystko pod uwagę, nie powinieneś pobierać kodu programu Visual Studio i spróbować. Microsoft wydał najbardziej stabilny, najbardziej obsługiwany, najszybszy i proporcjonalnie lekki / bogaty w funkcje edytor. Nowi programiści, doświadczeni programiści lub hobbyści, którzy chcą znaleźć odpowiednie narzędzia… VS Code został stworzony z myślą o Tobie. Nie jest to łatwe do osiągnięcia, ale ponieważ tak się stało, VS Code jest wart bitów i bajtów na dysku twardym. A może jeszcze raz spojrzeć na Microsoft, jeśli wcześniej je skreśliłeś.

Jakie są twoje ulubione aspekty VS Code? Czy dokonałeś zmiany?