DARMOWE FRAGMENTY

Ten kurs jest częścią ścieżki:

Web Designer

10705 użytkowników podnosi swoje kwalifikacje w tej ścieżce kariery.

Opinie użytkowników

Artur Gręziak

5.0

Html5 i JavaScript to dwie najciekawsze programistyczne technologie obecnego czasu.Najłatwiej na rynku o pracę w tej dziedzinie.

Mateusz Kosmalski

5.0

Super przykłady !! bardzo mi pomogły ;-)

Zobacz wszystkie

Czego się nauczysz:

definiowania bardziej złożonej struktury HTML

implementowania zaawansowanych rozwiązań JavaScript

uzupełniania layoutu strony o dodatkowe elementy

pracy z technologią Canvas

wykorzystania możliwości biblioteki jQuery

umieszczania na stronie obiektów audio i wideo

implementacji klas animujących

technik inkrementacji i dekrementacji

Chcesz rozwinąć umiejętności pracy z HTML5 i JavaScript? Zależy Ci na tym, by tworzyć bardziej atrakcyjne strony dla swoich klientów? A może chcesz po prostu wprowadzić nowoczesne rozwiązania na swojej witrynie? Dzięki temu szkoleniu zdobędziesz umiejętności, które pomogą Ci w każdym z tych zadań. W trakcie kursu tworząc aż 6 zróżnicowanych projektów, zdobędziesz praktyczną wiedzę między innymi na temat: wykorzystania biblioteki jQuery, technologii Canvas, umieszczania na stronie obiektów audio, wideo i wiele więcej. Szkolenie to będzie też doskonałą okazją, aby utrwalić wiedzę z podstaw HTML i JavaScript.

Nowoczesne projekty

Niemal 100% szkolenia, które dla Ciebie przygotowałem opiera się na pracy z projektami. Po jego ukończeniu z powodzeniem będziesz mógł wdrożyć je na dowolnej stronie lub po prostu wykorzystać zdobytą wiedzę do stworzenia podobnych rozwiązań. W trakcie kursu zbudujemy: player audio i wideo, timer odliczający czas, animowany tekst, czytelny formularz rejestracji i logowania oraz efektowną “pogodynkę” prezentującą różne warunki atmosferyczne. Każdy z tych projektów będzie dla Ciebie okazją do zdobycia innych przydatnych umiejętności.

Sprawdzone rozwiązania

W trakcie kursu poznasz szerokie zastosowanie HTML5 i JavaScript. Nauczysz się używać tych technologii w znacznie większym zakresie niż do tej pory. W pracy nad naszymi projektami wykorzystamy między innymi Canvas czy bibliotekę jQuery. Zobaczysz jak zastosować funkcje odliczające czas, dodać świetnie wyglądający gradient w playerze czy wyświetlać zmienne dane za pomocą JavaScript. Poznasz też praktyczne wykorzystanie mechanizmu localStorage w przeglądarce oraz obsługę formularza za pomocą jQuery.

Użyteczność

Tworząc stronę internetową musisz zadbać nie tylko o jej walory estetyczne, ale przede wszystkim o użyteczność dla użytkownika. Nie będziemy wprawdzie w tym kursie zajmować się tematami z zakresu UX i UI, ale na przykładach naszych projektów pokażę Ci na co warto zwrócić uwagę. Dowiesz się między innymi jak zadbać o odpowiedni layout przycisków odtwarzaczy audio i wideo. Pokażę Ci jak przygotować czytelny i intuicyjny formularz rejestracji czy odpowiednio rozmieścić dużą liczbę danych na przykładzie projektu wyświetlającego dynamiczne informacje pogodowe. Podpowiem Ci również jak zadbać o efekty animacji, tak by nie przesadzić z nimi na stronie.

Co jeszcze warto wiedzieć?

W trakcie szkolenia pracujemy głównie z technologiami HTML, JavaScript i CSS, więc podstawy pracy z nimi będą wymagane do komfortowej pracy i zrozumienia zagadnień poruszanych w kursie. Jeżeli jeszcze nie zdobyłeś takiej wiedzy, możesz to szybko nadrobić korzystając z naszych szkoleń.

ZOBACZ WIĘCEJ

Program nauczania

1 Zarys teoretyczny

Wstęp 01m 36s

Jak korzystać z materiałów? 03m 35s

JavaScript drogą do profesjonalizmu 03m 42s

Język HTML 5 narzędziem merytorycznego przekazu 03m 29s

Możliwości technologii Canvas 02m 06s

Możliwości obiektów audio i video 02m 08s

2 Projekt Playera Audio

Wirtualny serwer XAMPP 04m 01s

Szkielet HTML z własną warstwą controls 17m 27s

Szkielet HTML ze statyczną listą piosenek 11m 00s

Implementacja funkcji odtwarzania i pauzowania utworów 19m 37s

Prosta technika inkrementacji oraz dekrementacji 21m 51s

Funkcja wyciszająca oraz przywracająca dźwięk utworu 07m 09s

3 Projekt Playera Video

Szkielet HTML z wykorzystaniem gradientu 15m 23s

Odtwarzenie, pauzowanie oraz funkcja progresu 16m 13s

Funkcja bieżącego czasu trwania filmu 16m 08s

Funkcja kompletnego czasu filmu Podgląd 12m 30s

Wyciszanie dźwięku oraz funkcja tworząca animowany gradient 16m 40s

4 Projekt Odliczania Czasu "Timer"

Omówienie dokumentu HTML oraz przygotowanie zmiennych javascript 14m 38s

Wykorzystanie mechanizmu przeglądarki localStorage 14m 29s

Implementacja funkcji odliczających czas 14m 07s

Implementacja funkcji wyświetlającej obiekty canvas 14m 02s

5 Projekt Cząsteczek Tekstowych

Stworzenie obiektu canvas z wykorzystaniem javascript 14m 19s

Implementacja klasy animującej kolor na tekście 20m 05s

Definicja oraz wykorzystanie obiektów klasy animującej Podgląd 07m 31s

6 Projekt Pogoda

Implementacja HTML pierwszej kolumny 10m 17s

Implementacja pozostałej struktury dokumentu HTML 11m 11s

Defnicja javascript funkcji odliczającej czas Podgląd 06m 28s

Zmiana wyświetlania danych z wykorzystaniem javascript 17m 14s

7 Projekt Formularza

Struktura HTML w zakresie opcji rejestrowania 12m 27s

Druga część HTML w zakresie opcji logowania 05m 08s

Obsługa formularza z wykorzystaniem biblioteki jQuery 17m 57s

Zakończenie 00m 51s

Ocena uczestników

88%

Recenzje użytkowników (12)

Dominik Drybała

11 sierpnia 2020

Dokładnie opisane kroki, powoli bez problemu można nadążyć. Szkoda, że projekty są robione z gotowych klocków, a nie całkowicie od podstaw. Wolałbym 1-2 i mieć wszystko atomowo zrobione. Imo świetnie pokazuje co można zrobić dzięki JS

Dominik Gruszka

5 sierpnia 2020

Wszystko bardzo dobrze pokazane. Połączenie html i js daje niesamowity efekt do witryny, polecam

Daniel Opala 6 lipca 2020

Kurs bardzo dobry. Dobrze tłumaczony o bardzo proste przykłady. Polecam!

Mirosław Zaręba 3 czerwca 2020

HTML i JavaScript to fundament frontendu. Autor przedstawia bardziej zaawansowane aspekty tych zagadnień, dzięki temu można budować jeszcze bardziej atrakcyjne strony. Dla mnie "bomba"