Zacznij uczyć się JavaScript: dlaczego powinieneś i jak to zrobić za darmo

Opublikowany: 2022-04-23

Chcesz rozpocząć naukę JavaScriptu, ale nie wiesz jak i od czego zacząć? W tym poście udzielimy Ci wskazówek, których potrzebujesz, aby rozpocząć edukację w popularnym języku programowania.

Porozmawiamy o tym, dlaczego warto rozważyć naukę JavaScript zarówno pod względem trudności, jak i perspektyw zawodowych. Następnie post będzie zawierał informacje o tym, jak możesz zacząć, często za darmo. Gdy skończysz, chcemy, abyś dobrze rozumiał, jak samodzielnie rozpocząć naukę JavaScript od podstaw.

Co to jest JavaScript i dlaczego się go uczyć?

Zanim przejdziemy do tego, jak zacząć uczyć się języka JavaScript, porozmawiajmy o powodach, dla których warto to zrobić. W tym celu warto wiedzieć, do czego można używać języka programowania.

Aplikacje dla JavaScript

Porozmawiajmy najpierw o projektowaniu stron internetowych. Jeśli chodzi o tworzenie stron internetowych, JavaScript jest częścią, która czyni je interaktywnymi. Podczas gdy HTML zapewnia szkielet i treść, a CSS definiuje układ i projekt witryny, JavaScript jest po to, aby dodać funkcjonalność i zachowanie. Można go znaleźć najczęściej jako część menu rozwijanych, wyskakujących okienek i innych elementów modalnych, formularzy kontaktowych, animacji i interaktywnych map.

przykład aplikacji JavaScript: mapa interaktywna

Podobnie jak HTML i CSS, JavaScript jest również czymś, co każda przeglądarka może zrozumieć i przetworzyć.

Również w WordPress widzimy zwiększone zastosowanie JavaScript. Calypso, aplikacja komputerowa dla WordPress.com, jest całkowicie oparta na JavaScript, w szczególności React i Node.js.

Stos Calypso: jeden z powodów, dla których warto zacząć uczyć się javascript
Calypso jest zbudowany na nowoczesnym stosie JavaScript.

Edytor Gutenberga, który w 2018 roku zastąpił klasyczny edytor WordPressa jako domyślny interfejs do pisania, również wykorzystuje JavaScript jako swoją główną technologię.

edytor wordpress gutenberg: przykład dla aplikacji javascript

Choć pierwotnie był językiem po stronie klienta (co oznacza, że ​​jest interpretowany i przetwarzany w przeglądarce użytkownika), dzięki Node.js może teraz działać również po stronie serwera. Ponadto React Native i Iconic przeniosły go na urządzenia mobilne, a Electron na komputer stacjonarny.

W konsekwencji zastosowanie JavaScriptu wykracza daleko poza sieć. Możesz go używać do tworzenia aplikacji internetowych i produktów zaplecza, uruchamiania inteligentnych telewizorów, urządzeń Internetu rzeczy i natywnych aplikacji mobilnych. Ponadto, ponieważ jest kompatybilny z wieloma platformami, może zasilać aplikacje komputerowe, które działają wszędzie.

Zalety i wady JavaScript

Poza wiedzą, do czego możesz używać JavaScript, pomaga również zbadać jego zalety i wady.

Zalety JavaScriptu

Zacznijmy od zalet JavaScript jako języka programowania:

  • Wszechstronność — Wspomnieliśmy już o niezliczonych obszarach zastosowań JavaScriptu. Od witryn internetowych, aplikacji mobilnych i stacjonarnych, po urządzenia inteligentne i gry, a nawet uczenie maszynowe — niewiele rzeczy nie jest możliwe. JavaScript jest również odpowiedni zarówno dla frontendu, jak i backendu, a także dobrze współpracuje z innymi językami programowania. Krótko mówiąc, JavaScript to potęga wszechstronności.
  • Przyjazność dla początkujących — składnia JavaScript jest łatwa do nauczenia. Nie ma również potrzeby budowania środowiska programistycznego, możesz po prostu zacząć kodować w swojej przeglądarce. Ponadto język ten ma dużą społeczność internetową, która oferuje porady i wsparcie. Ponadto JavaScript jest świetny do nauki podstawowych pojęć (np. programowania obiektowego), które mają zastosowanie również w innych językach. Wreszcie istnieje wiele frameworków, które mogą Ci pomóc.
  • Szybkość — w porównaniu z innymi językami programowania, zwłaszcza tymi działającymi po stronie serwera, takimi jak PHP, JavaScript zwykle wykonuje się szybciej. Nic dziwnego, ponieważ może działać bezpośrednio w przeglądarce bez potrzeby kompilowania lub komunikowania się z serwerem (chyba że potrzebuje zasobów zewnętrznych). Powoduje to również zmniejszenie zapotrzebowania na serwer. Dlatego często jest to wybór dla aplikacji lub witryn z dużą ilością interaktywności.

Wady JavaScript

Czy JavaScript ma jakieś wady? Oczywiście niewiele rzeczy jest całkowicie pozbawionych wad. W takim przypadku oto, o czym należy pomyśleć:

  • Kwestie bezpieczeństwa — ponieważ JavaScript działa w przeglądarce użytkownika, możliwe jest wykorzystanie go do złośliwych zamiarów. Dlatego niektórzy ludzie domyślnie wyłączają to w swojej przeglądarce.
  • Obsługa wielu przeglądarek — W przeciwieństwie do skryptów po stronie serwera, czasami różne przeglądarki inaczej interpretują ten sam kod JavaScript. Może to utrudnić pisanie kodu zgodnego z różnymi przeglądarkami.
  • SEO — nie jest do końca jasne, jak dobrze wyszukiwarki mogą indeksować JavaScript, więc stanowi to potencjalny problem z SEO. W każdym razie musisz nauczyć się implementować JavaScript w sposób przyjazny dla SEO.

Perspektywy rozwoju kariery

W ostatnich latach język programowania staje się coraz bardziej popularny. W ankiecie dla programistów Stack Overflow z 2021 r. został wybrany najpopularniejszym językiem programowania wśród profesjonalnych programistów. Dziewiąty rok z rzędu!

badanie przepełnienia stosu dla programistów 2021 najpopularniejsze języki

Ponadto, 5 najlepszych frameworków internetowych to również wszystkie frameworki JavaScript.

badanie przepełnienia stosu dla programistów 2021 najpopularniejszych frameworków internetowych

W miarę jak język przenosi się do nowych obszarów, otwiera się coraz więcej możliwości zatrudnienia. Devskiller ustalił, że w 2019 roku 72% wszystkich firm szukało programistów JavaScript. Język programowania jest również najczęściej testowaną umiejętnością podczas rozmów kwalifikacyjnych.

Jeśli chcesz być front-endem pełnego programisty, znajomość języka JavaScript jest prawie na równi z kursem. Ponadto, jeśli chcesz zająć się tworzeniem gier, uczeniem maszynowym lub sztuczną inteligencją, znajomość JavaScript jest również przydatna.

Dodatkowo, ludzie biegli w JavaScript mogą mieć dobre pensje. Według Indeed.com średnia pensja podstawowa programisty JavaScript w Stanach Zjednoczonych wynosi 111.278 USD rocznie. Nawet początkujący mogą spodziewać się, że zaczniesz od 90 000 $.

Wynagrodzenie programisty javascript stany zjednoczone 2021

Dodatkowo, gdy wyszukujesz JavaScript na LinkedIn, pokazuje on ponad 400 000 ofert pracy w samych Stanach Zjednoczonych. Tak więc, mając na swoim koncie umiejętności związane z JavaScriptem, stajesz przed zarówno dobrą, jak i dobrze płatną ofertą pracy.

Czy JavaScript jest łatwy do nauczenia dla początkujących?

W dalszej części wspomnieliśmy, że jedną z zalet JavaScript jest to, że jest łatwy do nauczenia. Aby pokazać, że to prawda, omówimy teraz kilka podstawowych pojęć i kodu JavaScript. W ten sposób możesz wyrobić sobie opinię.

Uwagi

Porozmawiajmy najpierw o komentarzach. Podobnie jak większość języków programowania, JavaScript umożliwia komentowanie kodu i oznaczanie komentarzy w taki sposób, aby przeglądarka nie próbowała ich wykonać. W ten sposób możesz udokumentować swoją pracę bez powodowania błędu.

JavaScript zna dwa rodzaje komentarzy: jednowierszowe i wielowierszowe. Oto jak je napisać:

 // Nothing in this line will be executed /* Neither Will Any of This */

Osoby zaznajomione z PHP poczują się jak w domu, ponieważ oba języki oznaczają komentarze w ten sam sposób.

Wyprowadzanie danych

Jednym z najprostszych sposobów wypróbowania JavaScript jest użycie alert() . Możesz go użyć do wyświetlenia wiadomości w wyskakującym okienku w przeglądarce.

javascript start metoda alertu uczenia

Aby uzyskać powyższe, po prostu otwórz konsolę w narzędziach programistycznych przeglądarki i wklej następujący kod:

 alert("With JavaScript, it's really easy to make this box appear.");

Całkiem łatwe do zrozumienia, prawda? Kiedy teraz naciśniesz Enter, powinieneś zobaczyć ten sam komunikat, co powyżej.

alert() to metoda JavaScript służąca do wysyłania danych do użytkownika. Ciąg znaków (czyli tekst) w nawiasach jest treścią wyskakującego okienka. Potrzebujesz średnika na końcu, aby zaznaczyć, że wiersz kodu jest kompletny.

Mając tę ​​wiedzę, już teraz możesz to wypróbować. Po prostu zmień ciąg w nawiasach (upewnij się, że umieściłeś go w cudzysłowie) na dowolny, który chcesz utworzyć własne wyskakujące okienko.

przykład metody alertu javascript z konsolą

Manipulowanie DOM

W projektowaniu stron internetowych najczęściej używasz JavaScript do wprowadzania zmian w interfejsie użytkownika lub DOM. DOM oznacza „Document Object Model” i jest w zasadzie drzewem elementów HTML, które tworzą stronę internetową. Możesz to zobaczyć, sprawdzając dowolną stronę za pomocą narzędzi programistycznych.

sprawdź html w narzędziach programistycznych przeglądarki

JavaScript oferuje wiele różnych opcji wprowadzania w nim zmian. Przeanalizujmy przykład, aby pokazać, jak może to zrobić i jak to wygląda.

 <!DOCTYPE html> <html> <body> <h2>Start Learning JavaScript Demo Page</h2> <p></p> <script> document.getElementById("target").innerHTML = "With JavaScript, it's really easy to manipulate the DOM."; </script> </body> </html>

Powyżej stworzyliśmy prostą stronę HTML. Jak widać, ma nagłówek i pusty element akapitu z identyfikatorem target (jeśli nie wiesz o klasach i identyfikatorach HTML, możesz dowiedzieć się więcej tutaj).

Na dole znajduje się również skrypt JavaScript. Został opakowany w tagi <script> , aby przeglądarki go rozpoznały. Aby zrozumieć, co robi, rozłóżmy to na części:

  • document — umożliwia dostęp do obiektu dokumentu, którym jest strona internetowa.
  • getElementByID("target") — Znajduje element zgodnie z jego identyfikatorem. Nawias zawiera identyfikator, którego należy szukać w cudzysłowie.
  • innerHTML — Zmienia wewnętrzny kod HTML elementu.

Kiedy je połączysz, skrypt zasadniczo przeszukuje stronę internetową w poszukiwaniu elementu, który ma identyfikator target i dodaje go do swojego wewnętrznego kodu HTML. To, co powinien zawierać w tym miejscu, znajduje się za znakiem równości wewnątrz podwójnych cudzysłowów. W konsekwencji, gdy uzyskujesz dostęp do pliku z powyższym kodem w przeglądarce, widzisz to:

zacznij uczyć się manipulowania domem za pomocą javascript

Nie jest to trudne do zrozumienia, prawda? Mamy nadzieję, że powyższe dało ci szybkie wyobrażenie o działaniu składni JavaScript. Więcej podstawowych wskazówek znajdziesz w tej ściągawce JavaScript.

A co z ramami?

Coś, o czym zaczniesz dużo słyszeć, kiedy zaczniesz uczyć się JavaScript, to frameworki. Jeśli nie znasz tego terminu, frameworki to w zasadzie kolekcje bibliotek kodu. Zawierają wspólne cechy i elementy stron internetowych, aplikacji lub czegokolwiek innego, do czego są przeznaczone. Umożliwia to tworzenie i używanie tych elementów i funkcji bez konieczności pisania ich od zera.

Skoro więc frameworki JavaScript znacznie ułatwiają życie, czy nie powinieneś od razu zacząć ich używać?

To właściwie część gorącej debaty wśród programistów. Niektórzy twierdzą, że powinieneś nauczyć się waniliowego (czyli zwykłego) JavaScriptu przed frameworkami. Inni są zdania, że ​​powinieneś od razu zacząć z frameworkami, aby zacząć działać.

Nie możemy udzielić ci tutaj ostatecznych odpowiedzi na to pytanie, ale prawdopodobnie zawsze dobrym pomysłem jest zapoznanie się przynajmniej z podstawami JavaScript przed rozgałęzieniem. Takie postępowanie da ci lepsze i głębsze zrozumienie tego, co robisz, i sprawi, że będziesz lepszym programistą.

Jak rozpocząć naukę JavaScript za darmo?

Pozostaje tylko pytanie, gdzie dokładnie możesz zacząć uczyć się JavaScript, najlepiej bez płacenia za to? Oto kilka bezpłatnych zasobów, z których możesz rozpocząć swoją podróż:

  • MDN Web Docs — Sieć programistów Mozilla jest uważana za jedno z głównych zasobów wiedzy o projektowaniu stron internetowych. Zawiera mnóstwo samouczków na najwyższym poziomie, od HTML przez CSS po formularze internetowe, ułatwienia dostępu i nie tylko. Mają też obszerny przewodnik do nauki JavaScript, który możesz przejść za darmo.
  • W3Schools — Podobnie jak MDN, W3Schools zawiera pełne wprowadzenie do JavaScript. Jest dostępny w krótkich lekcjach z mnóstwem przykładów do samodzielnego wypróbowania. Witryna jest również świetna jako źródło wyszukiwania. Ponadto, jeśli chcesz nieco bardziej ustrukturyzowanego podejścia i chcesz za to zapłacić, możesz wypróbować ich płatne kursy.
  • JavaScript.info — Kompletny internetowy kurs JavaScript, na który możesz przejść samodzielnie. Mnóstwo informacji, wizualizacji i wskazówek (w tym na przykład, jakich edytorów kodu użyć). Posiada również funkcję komentowania, dzięki której czytelnicy mogą zadawać pytania, dyskutować lub udostępniać fragmenty kodu.
  • Eloquent JavaScript — Pierwotnie drukowana książka, Eloquent JavaScript jest dostępna w całości za darmo online i jako e-book. Jest dość gęsty, więc może bardziej odpowiedni dla średniozaawansowanych programistów.

Mamy również artykuł z materiałami edukacyjnymi, jeśli szukasz jeszcze więcej. Ponadto dostępne są płatne kursy, takie jak Team Treehouse, Udemy i Skillshare.

Czy więc powinieneś zacząć uczyć się JavaScript w 2022 roku?

JavaScript jest integralną częścią nowoczesnej sieci. Wiele funkcji stron internetowych i aplikacji jest nie do pomyślenia bez tego dynamicznego języka programowania. Ponadto rozszerzył się na wiele innych obszarów, takich jak gry i uczenie maszynowe.

W tym poście staraliśmy się odpowiedzieć na pytanie, czy powinieneś i jak możesz zacząć uczyć się JavaScript. Kiedy spojrzysz na rolę języka, co może zrobić, a także na możliwości pracy i wynagrodzenia, łatwo zauważyć, że zagłębienie się w JavaScript jest rozsądną ścieżką. Nawet lub zwłaszcza jako ktoś w sferze WordPressa, ma to również sens, ponieważ również tutaj robi postępy.

Jeśli chcesz zanurzyć palec u stopy, istnieje wiele bezpłatnych zasobów online, dzięki którym możesz rozpocząć naukę JavaScript. Możesz zacząć od razu, więc dlaczego nie?

Czy masz jakieś inne początkowe zasoby do nauki języka JavaScript , którymi możesz się podzielić? Jeśli tak, zrób to w komentarzach poniżej!