Masz już konto? Zaloguj się

Kurs Programowanie w jQuery

Poznaj jQuery, czyli najbardziej popularną bibliotekę JavaScript na Świecie! Z jQuery korzystają niemal wszystkie nowoczesne serwisy WWW, a nasz Kurs stanowi niezwykle praktyczne i wyczerpujące omówienie tej biblioteki od podstaw, aż po bardziej zaawansowane techniki. Jeśli znasz już HTML i CSS oraz przynajmniej podstawy JavaScript, jQuery to kolejna obowiązkowa pozycja na Twojej drodze do tworzenia świetnych serwisów internetowych.

71 lekcji

7h 59min

5 (8 oceny)

Programowanie w jQuery - w Praktyce

Poznaj jQuery, czyli najbardziej popularną bibliotekę JavaScript na Świecie! Z jQuery korzystają niemal wszystkie nowoczesne serwisy WWW, a nasz Kurs stanowi niezwykle praktyczne i wyczerpujące omówienie tej biblioteki od podstaw, aż po bardziej zaawansowane techniki. Jeśli znasz już HTML i CSS oraz przynajmniej podstawy JavaScript, jQuery to kolejna obowiązkowa pozycja na Twojej drodze do tworzenia świetnych serwisów internetowych.

Witaj w kursie jQuery!

Przed Tobą ośmiogodzinna przygoda z najpopularniejszą biblioteką JavaScriptową na świecie. Jeżeli tworzysz strony internetowe i zdążyłeś już poznać takie technologie jak HTML i CSS, a także masz już podstawy języka JavaScript, to kolejnym naturalnym krokiem na Twojej drodze, będzie nauka korzystania z biblioteki jQuery.

Czym jest jQuery?

Biblioteką nazywamy zbiór funkcji napisanych w danym języku, które mogą być dołączone do dowolnego projektu i w łatwy sposób wykorzystywane. Tak właśnie jest z biblioteką jQuery, która powstała w 2006 roku i odpowiedziała wówczas na ogromną potrzebę - pisanie spójnego i działającego w wielu przeglądarkach internetowych kodu. Nawet dzisiaj, pewne przeglądarki internetowe implementują nowe funkcje Obiektowego Modelu Dokumentu w różny sposób. A zatem aby mieć pewność, że pisany przez nas kod będzie działał dokładnie tak samo niezależnie od tego czy strona zostanie wyświetlona w najnowszej wersji przeglądarki Firefox czy może w leciwym Internet Explorerze 9, musimy stosować wiele trików. Przez to pisanie kodu nie jest już tak proste i przyjemne, a także znacząco wzrasta jego ilość. jQuery natomiast, pozwala za pomocą niewielkiej ilości kodu, otrzymywać taki sam rezultat we wszystkich wspieranych przeglądarkach internetowych. Zaczynając od z pozoru prostych zadań, takich jak dodawanie czy usuwanie klas CSS, a na wysyłaniu żądań AJAX kończąc. Z użyciem jQuery, zawsze napiszesz taki sam kod, a ta biblioteka zadba już o wszystkie niezbędne triki, które musi wykonać “pod spodem”, aby rezultat był w każdej przeglądarce taki sam.

Nieograniczone możliwości biblioteki

Biblioteka jQuery oprócz upraszczania możliwych do wykonania również bez niej zadań, udostępnia nam także wiele zupełnie nowych funkcji i możliwości. A do nich zaliczyć możemy np. animacje elementów HTML. W kursie tym poznasz jQuery od podstaw. Zaczniemy od wyboru wersji biblioteki i jej podpięciu do strony internetowej. Następnie poznasz potężne możliwości selektorów CSS, które pozwolą znaleźć w drzewie DOM każdy element. Zobaczysz również jak tworzyć nowe elementy dynamicznie, a także jak na wiele sposobów wstawiać je na stronę. Krok po kroku dowiesz się również jak przypisywać funkcje obsługi zdarzeń do poszczególnych elementów, np. na kliknięcie lub najechanie kursorem myszy. Zobaczysz także jak działa i czym jest delegacja zdarzeń.

Animacje, wygląd i klasy CSS

W kolejnym kroku zajmiemy się pracą z właściwościami CSS elementów, które można w prosty sposób odczytywać, a także przypisywać. Dowiesz się również, jak pracować z klasami CSS. Dzięki zdobytej na tym etapie wiedzy, stworzymy praktyczny projekt “Gwiazdkowej oceny” artykułu. Dodatkowo, poznasz również metody pozwalające odczytywać charakterystyki związane z geometrią elementów, a więc ich szerokość, wysokość czy położenie w dokumencie i te z kolei, posłużą nam do stworzenia projektu menu kontekstowego, dostępnego pod prawym przyciskiem myszy. W jednym z rozdziałów poruszymy temat animacji. Dowiesz się jak pokazywać oraz ukrywać wybrane elementy, a także jak robić to w płynny sposób, np. rozwijając dany element lub animując jego dowolne właściwości CSS. Nie zabraknie również informacji na temat super- płynnych animacji z użyciem CSS3, a także praktycznego projektu “Accordion”, który połączy całą zdobytą do tej pory wiedzę.

AJAX-owa rewolucja!

Cały oddzielny rozdział poświęcimy również technologii AJAX, która niegdyś zrewolucjonizowała internet. Zobaczysz jak z użyciem jQuery wysyłać zapytania do serwera bez przeładowywania witryny, a także jak wyświetlać na stronie otrzymane dane. Z pomocą jQuery, będzie to możliwe za pomocą nawet trzech linijek kodu. Oprócz zwykłych zapytań AJAX, poznasz również możliwości jQuery w zakresie techniki JSONP czy asynchronicznego pobierania skryptów JavaScript. Na koniec tego rozdziału wykonamy praktyczny projekt, który pozwoli wczytywać kolejne strony portfolio bez przeładowywania witryny. Wyświetlimy animowany preloader, a kiedy dane zostaną zwrócone, wstawimy je na stronę. W kursie poruszymy też nieco bardziej zaawansowane zagadnienia, takie jak obiekt Deferred czy Promise. Zobaczysz jak z użyciem jQuery korzystać z tych rozwiązań, a także do czego mogą być przydatne. W tym celu wykonamy praktyczny projekt preloadera obrazów wraz z paskiem ładowania postępu.

Tworzymy własne rozszerzenia i pluginy...

Jeden z rozdziałów kursu poświęcimy na omówienie tworzenia własnych rozszerzeń do biblioteki jQuery. Zobaczysz jak stworzyć swój pierwszy plugin, a także jak umożliwić jego przyszłym użytkownikom prostą konfigurację. Aby dobrze zrozumieć koncepcję tworzenia rozszerzeń wykonamy kilka praktycznych projektów. Jednym z nich będzie powiadomienie o plikach cookies wysuwane z góry strony, które po ukryciu, nie będzie już nękać odwiedzającego. Następnie stworzymy praktyczne zakładki, które pozwolą ukryć część treści i pokazywać ją dopiero po kliknięciu w odpowiednią pozycję menu. Ostatnim z projektów będzie lightbox. To największy i najbardziej skomplikowany przykład omówiony w tym kursie, w którym wykorzystamy bardzo wiele technik jQuery. Lightbox będzie umożliwiał kliknięcie na miniaturkę zdjęcia, pokazanie preloadera w czasie, gdy duży obraz jest wczytywany, a na koniec płynną animację do wielkości wczytanego obrazu oraz jego pokazanie. Zobaczysz również, jak zamknąć takie okno na kilka sposobów, w tym z użyciem klawisza ESC.

...oraz korzystamy z gotowych rozwiązań oszczędzając czas!

Choć pisanie własnych rozszerzeń do biblioteki jQuery to świetna zabawa, to wiele z nich możemy znaleźć również w internecie. Z tego powodu wykorzystamy dwa z nich i osadzimy je na przygotowywanej stronie. Pierwszy z pluginów, który zaimplementujemy to slider obrazów, a drugi to bardzo ciekawa możliwość sortowania projektów w portfolio nad podstawie ich kategorii. Zobaczysz jak w prosty i szybki sposób podpiąć takie rozwiązania do własnej strony, a także jak je skonfigurować dla swoich potrzeb. Kurs kończy się sekcją dziesięciu lekcji z serii Tips&Tricks, gdzie w maksymalnie krótkim czasie zobaczysz wiele przydatnych technik i trików do wykorzystania w codziennej pracy z biblioteką jQuery. To jednak nie wszystko, co znajdziesz w kursie. Na przestrzeni ośmiu godzin omówimy również pracę z formularzami, pętle dostępne w jQuery czy możliwość przypisywania własnych danych do wybranych elementów HTML.

Dla kogo jest ten kurs?

Choć wszystkie zagadnienia związane z jQuery są w tym kursie niezwykle starannie tłumaczone, to fakt, iż biblioteka ta jest napisana w języku JavaScript sprawia, że należy znać podstawy tego języka już wcześniej. Jeśli zatem rozumiesz jak działa JavaScript, a także Obiektowy Model Dokumentu i potrafisz w drzewie DOM wyszukiwać elementów, tworzyć nowe czy pracować z ich treścią, to możesz bez obaw przystąpić do tego kursu. W przeciwnym wypadku, zalecamy zapoznanie się najpierw z materiałem JavaScript od Podstaw. Aby jednak wynieść z tego kursu jak najwięcej, dobrze znać również takie zagadnienia jak AJAX, format wymiany danych JSON czy podstawowe koncepcje programowania obiektowego. Taką wiedzę znajdziesz z kolei w kursie JavaScript w Praktyce. Niezależnie zatem czy chcesz dodać do swojej strony kilka interaktywnych elementów czy masz ambicje tworzyć zaawansowane aplikacje webowe - jQuery na pewno będzie Twoim sojusznikiem, a czas poświęcony na naukę jej wykorzystania, zwróci się wielokrotnie.

Czego się nauczysz?

  • Omówienie biblioteki jQuery od A do Z

  • Skuteczne techniki pracy z DOM

  • Techniki animacji elementów HTML

  • Wiedze na temat zapytan AJAX

  • Tworzenie wlasnych pluginów jQuery

  • Wlasny plugin Lightbox

  • Implementacje gotowych rozwiazan

  • Sekcje Tips&Tricks z przydatnymi poradami

Zawartość

Programowanie w jQuery

16 rozdziały 71 lekcji 7h 59min

  • Wstęp

    33min

    Wprowadzenie

    Podgląd lekcji

    5min

    Czym jest jQuery

    Podgląd lekcji

    3min

    Co powinieneś już wiedzieć

    Podgląd lekcji

    2min

    Jak korzystać z plików źródłowych

    18min

    Instalacja jQuery

    5min

  • Wyszukiwanie elementów na stronie

    33min

    Podstawy selektorów

    10min

    Zaawansowane selektory

    6min

    Niestandardowe selektory

    4min

    Filtrowanie

    8min

    Filtrowanie hierarchiczne

    5min

  • Zdarzenia

    30min

    Zdarzenie ‘load’

    Podgląd lekcji

    3min

    Przypisywanie funkcji dla zdarzeń

    7min

    Usuwanie funkcji zdarzeń

    3min

    Delegacja zdarzeń

    5min

    Obiekt zdarzenia

    6min

    Wywoływanie zdarzeń

    5min

  • Praca ze stylami CSS

    27min

    Przypisywanie i odczytywanie styli

    8min

    Praca z klasami CSS

    6min

    Praktyczny projekt Gwiazdkowa ocena

    13min

  • Manipulowanie treścią strony

    40min

    Tworzenie elementów

    7min

    Wstawianie elementów

    4min

    Praca z treścią elementów

    10min

    Praca z atrybutami elementów

    6min

    Manipulacja kolejnością elementów

    9min

    Usuwanie elementów

    6min

  • Geometria elementów HTML

    28min

    Odczytywanie i ustawianie wymiarów

    5min

    Położenie elementów w dokumencie

    7min

    Praktyczny projekt Menu kontekstowe

    16min

  • Animacje i efekty

    44min

    Pokazywanie i ukrywanie elementów

    9min

    Animacja właściwości CSS

    4min

    Funkcje zwrotne

    4min

    Kolejkowanie animacji

    11min

    Easing animacji

    4min

    Animacje z CSS3

    Podgląd lekcji

    4min

    Praktyczny projekt Accordion

    9min

  • Pętle w jQuery

    17min

    Pętla ‘each’ dla zbiorów

    4min

    Ogólna pętla ‘each’

    5min

    Metoda ‘map’

    5min

    Metoda ‘grep’

    3min

  • Praca z formularzami

    23min

    Odczytywanie i przypisywanie wartości

    9min

    Serializacja formularza

    3min

    Praktyczny projekt Placeholder

    11min

  • data

    12min

    ‘data’ w jQuery

    5min

    ‘data’ w atrybutach HTML5

    6min

  • AJAX

    44min

    Wysyłanie zapytań

    16min

    Skrótowe metody

    5min

    JSONP

    6min

    Globalna konfiguracja

    5min

    Praktyczny projekt AJAXowa paginacja

    12min

  • Deffereds

    31min

    Zasada działania Deferred

    11min

    Praktyczny przyklad Preloader obrazów

    20min

  • Własne pluginy

    1h 12min

    Podstawy tworzenia pluginów

    10min

    Konfiguracja pluginu

    8min

    Praktyczny projekt Powiadomienie o cookies

    14min

    Praktyczny projekt Zakladki

    9min

    Praktyczny projekt Lightbox

    29min

  • Gotowe skrypty

    20min

    Slider obrazów

    8min

    Sortowanie w portfolio

    6min

    jQueryUI

    4min

    Gdzie szukać pluginów?

    2min

  • Tips & Tricks

    21min

    Sprawdzanie wersji jQuery

    1min

    Wykrywanie przeglądarki

    2min

    Skrót ‘document.ready’

    2min

    Ustawianie kontekstu dla funkcji

    3min

    Przestrzenie nazw dla zdarzeń

    1min

    Korzystanie z własnych zdarzeń w pluginach

    5min

    Wczytywanie jQuery w WordPressie

    1min

    Rozwiązywanie konfliktów

    3min

    Wysyłanie wielu zapytań AJAX

    2min

    Korzystanie z funkcji pomocniczych

    2min

  • Zakończenie

    5min

    Podsumowanie

    5min

Autor kursu

Piotr Palarz

Web Developer

Średnia ocen autora: 5

Bio
Web Developer. Na co dzień tworzy strony i aplikacje internetowe. Pasjonat technologii webowych, miłośnik JavaScriptu oraz grafik hobbysta. W wolnych chwilach stale poszerza swoją wiedzę, czyta, publikuje w Internecie, a także stara się aktywnie spędzać czas z dala od ekranu monitora.
Inne kursy tego autora
JavaScript Narzędzia Deweloperskie w Przeglądarce Visual Studio Code Laravel Vue.js

Dołącz do ponad 10 tys. zadowolonych z naszych kursów

Fajnie wytłumaczone

Mateusz Szydłowski

4 stycznia 2021

Mega!

Przemyslaw Chudziński

13 lutego 2021

Bardzo dobrze poprowadzony kurs. Polecam przerobić go po dwóch poprzednich kursach z JavaScript (od Podstaw i w Praktyce), a wtedy wszystko stanie się o wiele łatwiejsze do zrozumienia.

Przemysław Pazera

7 sierpnia 2021

Super kurs

Karol Znojkiewicz

24 kwietnia 2021

Kasia Sabat

16 maja 2021

Paweł Baranowski

1 stycznia 2022

Mikołaj Martyna

5 kwietnia 2022

Bartłomiej

11 maja 2022

Kurs Programowanie w jQuery

  • 71 lekcji wideo

  • 7h 59min materiału

  • Certyfikat w ramach ścieżek

  • Dostęp z urządzeń mobilnych

Dlaczego wybrać właśnie ten kurs?

Efektywna nauka

Kurs wideo to najbardziej efektywna a zarazem najprzyjemniejsza forma nauki. Jest on tak prowadzony, byś cały czas mógł go śledzić z zainteresowaniem i zaangażowaniem, a także czerpać satysfakcję ze zdobytej wiedzy!

Wiedza ekspertów

Wiedza, którą otrzymujesz w tym kursie, to nie tylko sucha teoria, ale również wskazówki od praktyka z wieloletnim doświadczeniem, dzięki którym dużo łatwiej będzie Ci opanować materiał i pracować efektywniej.

Praktyczne przykłady

Uczysz się na praktycznych przykładach. Kurs, który masz przed sobą to esencja praktycznej wiedzy i doświadczenia a także wzorów, które oszczędzą Ci godziny pracy i poszukiwań.

Pytania i odpowiedzi

Przeczytaj najczęściej zadawane pytania

Masz więcej pytań?

Porozmawiaj z nami na na czacie

Wyślij nam e-mail

Zadzwoń +48 880880606

Czy każdy kurs ma pliki źródłowe?

Nie każdy. Jeśli pliki są dostępne dla danego kursu, znajdziesz je w zakładce źródła. Niektóre kursy nie posiadają źródeł ponieważ nie są potrzebne, inne nie mogły być zamieszczone np. ze względu na prawa autorskie do wykorzystania komercyjnych prac naszych autorów. Staramy się aby kursy były maksymalnie praktyczne i chętnie pokazujemy zaplecze zawodowe naszych autorów, ale niekiedy nie możemy dołączyć go w postaci źródeł.

Jak jest skonstruowany kurs?

Kurs składa się z rozdziałów oraz lekcji. Staramy się, aby optymalnie kursy miały 5-7 rozdziałów po około 5-10 lekcji w każdym. W ten sposób nauka jest optymalna a podtrzymanie uwagi staje się łatwiejsze. Rekomendujemy przerabianie nie więcej niż jednego rozdziału naraz a po jego przerobieniu powtórzenie materiału we własnym zakresie.

Jak najlepiej wykorzystać kurs?

Potraktuj kurs jako inspirację do własnej pracy. Tam, gdzie się da staraj się powtarzać czynności, które wykonuje autor. Nie powtarzaj ich jednak bezmyślnie - spróbuj zmodyfikować przykłady i dostosować je do swoich potrzeb. W ten sposób przyswoisz materiał jeszcze lepiej!

Jak mogę uzyskać dostęp do kursu?

Możesz albo wykupić ten konkretny kurs przez koszyk, uzyskując do niego (i jego rewizji) bezterminowy dostęp, albo wykupić wariant abonamentu, który obejmuje dany kurs i w ten sposób oglądać go oraz inne materiały na platformie tak długo, jak Twój abonament jest aktywny.

Czy kurs jest aktualny?

Staramy się aby wszystkie materiały na stronie były aktualne. Nie znaczy to, że kurs powstał bardzo niedawno. Często na stronie znajdziesz trochę starsze kursy, jednak regularnie wykonujemy ich rewizję i zmieniamy lekcje - czy to przez dodanie stosownych komentarzy z aktualizacją, czy poprzez nagranie danej lekcji jeszcze raz. Datę ostatniej rewizji znajdziesz w informacjach o kursie.

Czym się różni kurs od warsztatu i ścieżki?

Kursy to kilku godzinne, kompleksowe opracowanie danego zagadnienia, podzielone na lekcje i rozdziały. Często uzupełniają je Warsztaty, które mają formę jednej dłuższej, praktycznej lekcji (30min-1h), natomiast ścieżki stanowią zbiór jednych i drugich materiałów - ułożoną z kursów i warsztatów playlistę, która pozwala Ci kompleksowo opanować dane zagadnienie.

We frontendzie nie można stać w miejscu, niezależnie od tego, czy jest się początkującym, czy zaawansowanym. Narzędzia i techniki się zmieniają, więc trzeba cały czas trzymać rękę na pulsie. Jako twórca kursów i programista mogę spokojnie polecić eduweb.pl jako aktualne i dobre źródło wiedzy.

Adam Romański

helloroman.com

Zacznij naukę w Programowanie w jQuery

  • 71 lekcji wideo

  • 7h 59min materiału

  • Certyfikat w ramach ścieżek

  • Dostęp z urządzeń mobilnych