Jak wydajnie i wygodnie pracować z dużymi projektami w Webstorm

Witajcie w nowym cyklu, który postanowiłam nazwać “Produktywny programista”. W jego ramach będę Wam podsuwać sposoby na przyspieszenie pracy – głównie w kontekście różnego rodzaju narzędzi, ale nie tylko:)

Jeśli zdarzyło Wam się pracować w Webstorm z jakąś dużą aplikacją, to być może wyglądała ona podobnie jak na zrzucie ekranu poniżej:

Czyli dużo zagnieżdżonych folderów pomiędzy którymi ciągle się przełączacie, przewijacie widok projektu w górę, w dół i czasami się nawet gubicie.

Tymczasem prawda jest taka, że pracujemy w jednym momencie najczęściej nad jakąś jedną funkcjonalnością.

Funkcjonalność ta czasem nawet bywa zlokalizowana w jakimś jednym konkretnym miejscu w drzewie, więc nie potrzebujemy przez cały czas mieć całego drzewa na widoku.

Pewnie teraz myślicie sobie, że poradą na dziś jest schowanie okienka z projektem. Ale nie!

Porada na dziś – scopes

Scopes to opcja, która pozwala nam skonfigurować widok okienka projektu – czyli zamiast drzewka możemy wybrać sobie konkretne foldery i przełączać się na ten widok w ramach potrzeby.

Jak to zrobić?

Konfiguracja dostępne jest w menu, które znajduje się w prawym górnym rogu okienka z projektem:

Po jego kliknięciu pojawi się menu:

I po wybraniu opcji “Edit Scopes…” będziecie mogli skonfigurować sobie różne konfiguracje widocznych w okienku projektu folderów. Pojawi się okno:

Po kliknięciu plusika zostaniecie zapytani czy ta konfiguracja ma być lokalna czy współdzielona.

Jeśli wybierzecie tą drugą, odpowiednie pliki zostaną wygenerowane w folderze projektu.

Następnie pozostaje wybrać nazwę naszej konfiguracji oraz foldery, które chcemy w niej widzieć.

Kiedy klikniemy na nazwie folderu a następnie na przycisk Include (lub Include Recursively) w polu Pattern pojawi się ścieżka do wybranego przez nas folderu. Możemy wybrać kilka różnych folderów nawet jeśli znajdują się w różnych częściach drzewa projektu.

Ja wybrałam cały folder Module2 rekursywnie oraz folder Component 1b z folderu Module1 również rekursywnie. Odpowiednie ścieżki pojawiły się w w polu Pattern a dodatkowo na liście folderów wybrane przeze mnie zostały podświetlone:

Kiedy teraz zapiszemy naszą konfigurację będziemy mogli ją odnaleźć klikając na menu w lewym górnym rogu okienka z projektem. Kiedy je rozwiniemy pokaże się taka oto lista:

A na jej końcu znajdzie się nazwa naszego widoku i gdy na nią klikniemy nasze wcześniej skomplikowane drzewo będzie zawierał tylko te foldery, które wybraliśmy:

W każdej chwili możemy też przełączyć się do klasycznego widoku projektu za pomocą tego samego menu.

Takich widoków możemy tworzyć sobie całe mnóstwo – na przykład pod konkretne funkcjonalności a jeśli dodatkowo nazwiemy je tak, by mówiły o tym jakiej funkcjonalności dotyczą będzie nam się pracowało bardzo wygodnie.

Miłego używania Scopes!

You might also like