Narzędzia JavaScript Full-Stack Web Developera: Techniki pracy z terminalem

0:00W temacie obsługi samego terminala istnieje wiele różnych technik, które

0:04możesz stosować i które mogą Ci się sprawdzić w różnych przypadkach.

0:07Ja teraz skupię się na kilku z nich, które

0:09stosuję i które sprawdzają mi się doskonale w codziennej pracy.

0:13Tutaj od razu zaznaczę, że jeżeli terminal nie stanowi dla Ciebie żadnej tajemnicy,

0:17to prawdopodobnie większość z nich okaże Ci się banalna

0:20natomiast i tak polecam zostać na chwilę,

0:22ponieważ pokaże kilka elementów, które mogą okazać się dla Ciebie przydatne.

0:26Przykładowo w tym przypadku jednym skrótem

0:28uruchomiłem iTerm i jednym skrótem mogę go też wyłączyć.

0:32Podobnie też działa to na przykładzie Warpa, gdzie mogę po prostu szybko wywołać to

0:36okno, a następnie je schować, a potem znowu włączyć tylko po to, aby kontynuować

0:40pracę lub też odwołać się do jakichś wyników, które tutaj osiągnę.

0:44Jeżeli chodzi o konfigurację takiej opcji, to w jednym i drugim przypadku chodzi po

0:48prostu o ustawienie globalnego skrótu klawiszowego, który w przypadku iTerma

0:52możesz ustawić dokładnie tutaj i ja akurat nie będę teraz napisała swojego profilu,

0:58natomiast w przypadku Warpa sytuacja wygląda tak, że ten skrót również dostępny

1:02jest jako Hotkey Window, w przypadku którego ten skrót trzeba zdefiniować i w

1:06moim przypadku jest to Caps Lock oraz litera W.

1:09Jeżeli zastanawiasz się dlaczego u mnie Caps Lock

1:11wygląda w ten sposób, to po prostu z pomocą aplikacji Karabiner-Elements

1:15mam tutaj zdefiniowaną prostą regułę, która zamienia mi zachowanie klawisza Caps

1:19Lock na wciśnięcia klawiszy takich jak Command, Control, Option i Shift.

1:23Jest to świetna opcja do tego, aby właśnie zyskać nową paletę skrótów klawiszowych,

1:27które można wykorzystywać na potrzeby developmentu.

1:30Kolejnym elementem, na który warto zwrócić uwagę są własne skrypty.

1:34Przykładowo w tym miejscu mam dość prosty skrypt, który kiedyś skopiowałem z

1:38internetu tylko po to, aby wysyłać proste zapytania http

1:41w tym przypadku na webhooki. Takich skryptów mam przynajmniej kilkanaście jak nie

1:45kilkadziesiąt, które wykonują dla mnie różnego rodzaju małe akcje.

1:49Czasem jest to przesłanie pliku, czasem wywołanie właśnie jakiegoś webhooka, a innym

1:53razem pobranie jakiejś informacji i schowanie jej do schowka.

1:57W większości przypadków z takich skryptów

1:59korzystam w połączeniu z aplikacją Keyboard Maestro bądź też aplikacją Shortcuts.

2:04W jednym i drugim przypadku jesteśmy w stanie utworzyć sobie tutaj proste makro, które

2:08następnie umożliwi nam dodanie akcji w postaci wykonania skryptu Shell.

2:13Taki skrypt może być zapisany bezpośrednio

2:15tutaj lub też możemy wskazać plik, w którym zapisaliśmy jego treść.

2:19Jest to w tym przypadku o tyle istotne, że w przypadku Keyboard Maestro możemy

2:23przypisać sobie tutaj różnego rodzaju triggery, czyli wyzwalacze tej akcji,

2:27które będą uruchamiać ten wspomniany skrypt.

2:30Zatem mogę wywołać np.

2:31skrót klawiszowy tylko po to, aby utworzyć

2:34sobie serię katalogów, które rozpoczyną mój nowy projekt.

2:37Jeżeli chodzi o takie akcje oczywiście nie musisz tego robić,

2:40natomiast ja zwracam uwagę na to, że przygotowanie skryptów, które realizują

2:44dla Ciebie różne zadania po prostu niesamowicie ułatwia pracę

2:48szczególnie w przypadku, gdy mamy szereg różnych powtarzalnych czynności, w

2:52przypadku których zwykłe alias po prostu nie wystarczy.

2:54I przy okazji, jak już jesteśmy w tym

2:56skrypcie, to jego ostatnia linia wyświetla zawartość zwróconą przez ten Webhook.

3:01Tą zawartość w przypadku Keyboard Maestro

3:03mogę po prostu przechwycić, a następnie przekazać do innej akcji, takie jak np.

3:07wyświetlenie powiadomienia, utworzenie nowego katalogu czy otworzenie konkretnego

3:11adresu czy też nawet konkretnej aplikacji desktopowej.

3:14Zatem druga wskazówka w pracy z terminalem

3:17polega na tym, aby przygotować sobie skrypty, które ułatwią nam pracę.

3:20Swoją drogą, jak już jesteśmy przy

3:22tworzeniu skryptów, to akurat ich tworzenie znacząco wybiega poza zakres

3:26tego programu, ale jednocześnie chciałbym zwrócić Twoją uwagę na fakt, że faktycznie

3:30warto w stopniu przynajmniej podstawowym umieć czytać oraz tworzyć proste skrypty.

3:34Poza tym, tak jak w tym przypadku, podobnie jak ja, możesz skopiować skrypt

3:38znajdujący się w internecie i tylko zalecam, aby upewnić się co dokładnie

3:42oznaczają flagi, które zapisujemy tutaj, aby nie narobić sobie ewentualnych szkód.

3:46Jednocześnie może Ci teraz przyjść do

3:48głowy, że aplikacja Keyboard Maestro jak i Shortcuts nie będą Cię interesować, więc tak

3:53naprawdę nie ma potrzeby, aby tworzyć takie skrypty.

3:56Otóż jesteś w błędzie ze względu na to, że mogą zdarzyć się aplikacje, przy których

4:00rozwoju będzie konieczność odwołania się do jakiegoś serwerowego skryptu.

4:05Przykładem takiej aplikacji w moim przypadku jest współtworzony przeze mnie

4:08Easy Timer, w przypadku którego potrzebuję generować takie oto zegary.

4:12W tym akurat przypadku wyświetla się on w

4:14przeglądarce, więc obsłużony jest JavaScriptem,

4:17natomiast w tym narzędziu można pobrać też wersję do emaila, który wymaga tego, aby

4:22taki zegar został wygenerowany do formatu GIF.

4:25Dla mnie oznaczało to mniej więcej tyle, że mogłem skorzystać z jakiejś dostępnej

4:28paczki, która byłaby w stanie zamienić mi np.

4:31canvas na gif,

4:32natomiast w praktyce okazało się, że gif-encoder jest po prostu niewystarczający.

4:37Tzn.

4:37do wygenerowania prostego gifa jest jak najbardziej w porządku, ale w moim

4:41przypadku chodziło o dość dużą skalę i z tego powodu bardzo szybko zasoby mojego

4:45serwera zostały po prostu zapełnione i tym samym aplikacja przestawała działać.

4:50Co więcej, tutaj ta kwestia wydajności była naprawdę krytyczna ze względu na to,

4:54że wchodziliśmy na Product Hunt , gdzie swoją drogą zdobyliśmy pierwsze miejsce,

4:58ale oczywiście jak można sobie wyobrazić

5:00mieliśmy tego dnia kilka tysięcy osób,

5:02które niemal jednocześnie chciały wygenerować sobie timer.

5:06Z tego powodu musiałem być nieco bardziej

5:07kreatywny, jeżeli chodzi o generowanie gifów i w tym przypadku sięgnąłem po to

5:11narzędzie, które posiada swoją wersję CLI

5:14czyli dokładnie mamy tutaj sytuacje, o

5:15której mówiłem w jednej z poprzedniej lekcji.

5:18Jednocześnie nie interesowało mnie do

5:19końca to, aby wykonywać ręcznie polecenia, które w tym przypadku konwertują pliki,

5:24ale interesowało mnie to, aby z poziomu mojej aplikacji i w tym przypadku

5:28aplikacji ExpressJS odwołać się do tej konkretnej komendy.

5:32Okazuje się, że istnieje kolejna paczka, o

5:34której słyszałem między innymi od Marcina Czarkowskiego z przeprogramowani.pl

5:38Jednocześnie ta sama paczka polecana jest

5:41również przez twórców Reicasta do tworzenia rozszerzeń do tego launchera, co też

5:45zresztą niejednokrotnie zdarzało mi się robić.

5:48W każdym razie, jeżeli zobaczysz co tutaj

5:50się dzieje, to tak naprawdę jesteśmy w stanie sięgać po polecenia, które

5:53normalnie wykonujemy w terminalu z poziomu aplikacji Node.js

5:57Niesamowicie przydatna sprawa,

5:59szczególnie w przypadku, gdy potrzebujemy w jakiś sposób bezpośredni odwołać się do

6:03jakiegoś interfejsu dostępnego właśnie w formie poleceń.

6:06Zanim przejdziemy dalej, chciałbym zwrócić uwagę na jeszcze jeden szczegół, a

6:10mianowicie słowo kluczowe await oraz zasadniczo wykorzystanie Promise API.

6:15Zobacz, w jaki sposób łączą się ze sobą te wszystkie technologie, w przypadku których

6:19znowu JavaScript odgrywa główną rolę i jednocześnie też daje ogromne możliwości.

6:24A przy okazji spójrz proszę jeszcze tutaj,

6:26gdzie mamy jasny sygnał tego, że oprócz JavaScriptu warto nauczyć się TypeScript.

6:32Do tego jeszcze będziemy wracać, więc przejdźmy do kolejnego tematu.

6:36Mianowicie sam terminal możemy

6:37wykorzystywać również wewnątrz naszego edytora kodu, czy też bardziej IDE.

6:42W moim przypadku zwykle pokazuję, że mój

6:44edytor kodu zwykle wygląda dokładnie tak jak widać, czyli nie ma tutaj praktycznie

6:49żadnych elementów interfejsu poza zakładkami oraz samym kodem.

6:53Czyli w zasadzie jest to niezbędne

6:55minimum, a jednocześnie nie ma tutaj elementów, które mnie rozpraszają.

6:58Jednocześnie, jak być może się domyślasz,

7:00niekoniecznie wygląda to dokładnie tak samo

7:02przez cały czas, gdy pracuję z kodem.

7:05Przede wszystkim jednym skrótem, często zdarza mi się uruchamiać sidebar, gdzie po

7:08prostu muszę przejść przez konkretne pliki.

7:11Naturalnie w przypadku, gdy potrzebuję

7:12szybko przejść do innego pliku projektu, uruchamiam sobie paletę poleceń i

7:17konkretnie w kategorii Files przeszukuję wybrane pliki.

7:20Czasem bywają sytuacje, że niekoniecznie wiem, do którego pliku konkretnie chcę się

7:25odwołać, a jednocześnie uruchamianie Sidebara w tym celu mija się po prostu z celem.

7:30Wtedy sięgam po Navigation Bar, który

7:32umożliwia mi jeszcze szybsze nawigowanie po plikach projektu w przypadku, gdy

7:36faktycznie nie wiem do końca gdzie konkretnie chcę dojść.

7:39No i teraz już dochodząc do sedna jednym z

7:42elementów, po które sięgam regularnie jest oczywiście wbudowane w IDE terminal.

7:47Mam tutaj dostępne dokładnie ten sam

7:48terminal oferujący dokładnie takie same możliwości jak w przypadku iTerm2.

7:53Pojawia się więc tutaj pytanie, które otrzymałem podczas spotkań indywidualnych

7:57z osobą, której pomagam w nauce programowania.

8:00Chodziło o to, dlaczego w ogóle sięgać po

8:03narzędzia takie jak iTerm czy Warp, skoro zarówno Visual Studio Code, jak i

8:07IntelliJ czy też inne IDE zazwyczaj mamy dostępne wbudowane terminale.

8:12Odpowiedź na to pytanie brzmi Oczywiście nie ma potrzeby, aby korzystać równolegle

8:17z tych różnych narzędzi, ale jednocześnie w momencie, gdy nauczysz się obsługi

8:21terminala w stopniu naprawdę podstawowym, który jednocześnie umożliwi Ci

8:25wykorzystanie tych wszystkich wskazówek, przez które przeszliśmy w tym filmie, to

8:29nagle okaże się, że posiadanie zewnętrznego terminala lub też możliwość

8:33wywoływania go w formie szybkiego okna, które umożliwi nam natychmiastowe

8:37wykonanie jakiegoś polecenia, okazuje się niezwykle przydatne.

8:41No i teraz jeżeli nadal nie widzisz w tym

8:43wartości, to myślę, że i tak do tego miejsca w pewnym momencie dojdziemy.

8:47Jeżeli jednak widzisz w tym wartość, ale jednocześnie nie posiadasz wystarczającej

8:52wiedzy na temat pisania własnych skryptów oraz poleceń, no to w takiej sytuacji nie

8:56pozostaje mi nic innego jak zaprosić Cię do kolejnej lekcji.