Poznaj najlepszy edytor kodu
4 godz. 1 min · HTML i CSS · Full-stack i Programowanie
Piotr PalarzWeb DeveloperW tej sekcji kursu zobaczysz jak zainstalować edytor w 3 najpopularniejszych systemach operacyjnych. Następnie poznasz główne panele tworzące interfejs VS Code, a także nauczysz się korzystać z panelu ustawień, aby w przyszłości dostosować do własnych potrzeb niemal każdy detal.
Aby praca z jakimkolwiek edytorem kodu była przyjemna, należy dostosować jego wygląd do swoich preferencji. W przypadku VS Code jest to bardzo proste, a ogrom szablonów, ikon czy dostępnych fontów zadowoli każdego. W kursie dowiesz się jak wyszukiwać i instalować szablony, jak szybko je zmieniać czy jak skonfigurować font z ligaturami.Następnie poznasz najważniejsze skróty klawiaturowe, a także sposoby na ich modyfikację lub nawet konfigurację własnych. To właśnie dzięki nim praca staje się wydajna, gdy jak najrzadziej sięgamy po myszkę.
VS Code oferuje szereg możliwości sprawnego poruszania się zarówno po całym projekcie jak i po jednym, wybranym pliku. W tej sekcji kursu zobaczysz jak szybko wyszukiwać plików i do nich przeskakiwać, jak przeszukiwać aktywny plik, a także jak korzystać z globalnej wyszukiwarki, która z czasem staje się nieodzownym narzędziem w rękach sprawnego dewelopera.Nie zabraknie również informacji o tym jak korzystać z wielu kursorów jednocześnie, jak przenosić, kopiować czy usuwać linie kodu czy szybko tworzyć całe pliki i katalogi.
Choć VS Code jest pełnoprawnym edytorem kodu już tuż po instalacji, to jego prawdziwy potencjał poznajemy dopiero wtedy, gdy przechodzimy do panelu rozszerzeń. Znajdziemy tam tysiące dodatków do tego edytora. Część z nich to szablony zmieniające jego wygląd, część do drobne narzędzia ułatwiające np. tworzenie plików, a część do prawdziwe "kombajny", np. do pracy z Gitem czy zamiany edytora w IDE dla wybranego języka.Z kursu dowiesz się jak wyszukiwać i instalować rozszerzenia, a także poznasz wiele z nich i zobaczysz jak mogą znacznie ułatwić codzienną pracę z kodem.
W tej sekcji kursu poznasz najpopularniejsze sposoby na wydajną pracę z językami HTML, CSS, JavaScript i PHP. Zobaczysz jak działa Emmet i w jaki sposób ułatwia pisanie kodu HTML i CSS, skonfigurujesz Prettier do formatowania kodu oraz narzędzie ESLint do walidacji i pilnowania standardów JavaScript.Zobaczysz również jak zamienić VS Code w prawdziwy IDE do pracy z językiem PHP, automatycznym formatowaniem kodu czy współpracy z frameworkiem Laravel.
Choć system kontroli Git jest narzędziem niezbędnym w pracy każdego programisty, większość przyznaje, że zna tylko podstawowe komendy, a gdy zachodzi potrzeba, np. wycofania zmian, szuka rozwiązania w internecie. Wszystko to za sprawą bardzo wielu komend Gita, a także ich specyficznych opcji.W kursie zobaczysz, że z poziomu VS Code można pracować z Gitem dużo prościej, w zasadzie wszystko "wyklikując". Nauczysz się tworzyć commity, synchronizować kod ze zdalnym repozytorium, porzucać zmiany, przywracać pliki czy przeglądać historię utworzonych commitów.
Kurs ten jest dla wszystkich osób, które chcą wydajniej pracować z kodem. Niezależnie czy jest to kod HTML, CSS, JavaScript, PHP czy Python, każdy z tych języków znajdzie wsparcie w Visual Studio Code. Kurs omawia edytor od podstaw, a wiedza z zakresu wymienionych wyżej języków nie jest wymagana, choć dla części z nich prezentowane są dedykowane rozwiązania.
1.42+
Jeżeli podobnie jak ja pracujesz z frameworkiem laravel to w tej
lekcji pokażę ci jeszcze kilka przydatnych dodatków pamiętaj jednak że do każdego
innego frameworka takiego jak na przykład symphony też znajdziesz dodatki w marketplace
visual studio code jeden pierwszym z dodatków które chciałbym zainstalować jest
dodatkowy język czyli kolorowanie składni bo na przykład gdybym sobie przeszedł
do widoku blade to zauważ że on jest jakoś pokolorowany bo z punktu widzenia vs code
ma on rozszerzenie php czyli jest to plik po prostu php no i jest
okej natomiast blade ma takie swoje pewne dyrektywy i one tutaj nie
wyglądają najlepiej dlatego chciałbym żebyśmy sobie zainstalowali dodatek blade
wyszukajmy to sobie i mamy tutaj blade syntax highlighting a
tutaj mamy laravel blade snippets i w zasadzie ja korzystam z tego dodatku bo on
i syntax highlighting i jeszcze dodatkowe snippety więc zainstalujemy sobie ten dodatek
i to oznacza że nowy język o nazwie blade zostanie dodany
i teraz jeżeli tutaj sobie przejdziemy od razu nam to zamieniło na laravel blade zauważ że
te dyrektywy od razu dużo lepiej wyglądają i też mamy pewne podpowiedzi
jak zaczynamy sobie wpisywać na przykład b if coś takiego tutaj
w zasadzie należałoby w ten sposób z niej skorzystać i będziemy
mieli tutaj sporo fajnych snippetów do których jeżeli się przyzwyczaisz to
na pewno one przyspieszoną twoją pracę przede wszystkim jednak fajne jest to że mamy tutaj
gotowe kolorowanie składni innym dodatkiem który ja lubię bo na przykład w
laravel moglibyśmy tutaj zrobić coś takiego i napisać
na przykład name to chcielibyśmy tutaj wtedy taki string mówiąc
brzydko wypluć ale niewygodne jest pisanie takich nawiasów czyli
trzeba tak napisać zrobić spację i tak dalej mamy taki dodatek jak laravel
blade spacer zobaczmy
jest to ten dodatek zainstalujemy go sobie okej
i teraz jak wrócę tutaj wystarczy że nacisnę dwa razy ten nawias w jedną
stronę i od razu zostanie on domknięty i będę znajdował się na środku podobnie
będę mógł zrobić na przykład w ten sposób jeżeli chcemy tutaj wstawić
kod html żeby nie było robione escape to wystarczy właśnie napisać coś
takiego i dwa wykrzykniki reszta zostanie za nas zamknięta automatycznie innym
fajnym dodatkiem jest laravel go to
view zobaczmy jeżeli sobie
go zainstalujemy i przejdziemy na przykład do pliku web gdzie jest zdefiniowany
jakiś vue to będę mógł teraz nacisnąć command control i tutaj przeskoczyć
i automatycznie przeskoczymy do tego oto pliku innym podobnym dodatkiem
jest laravel go to controler zobaczmy
i jest to ten dodatek zainstalujemy go sobie teraz
musielibyśmy sobie jakiś kontroler tutaj skonfigurować czyli na
przykład zobaczmy jakie mamy kontrolery na przykład auth login
controller więc wpiszmy to sobie tutaj auth login controller i
na przykład do metody login i też jest to podkreślone jeżeli teraz tutaj nacisnę command
click zauważ przeskakujemy od razu do tego kontrolera oczywiście
dodatków do laravela jest jeszcze cała masa ale ja chciałam ci pokazać te
moim zdaniem najbardziej przydatne w kolejnej lekcji jeszcze pokażę ci jeden z dodatków który pozwoli
nam pracować z komendami laravel