Programowanie w języku JavaScript (ES6+)

Wprowadzenie do tematyki szkolenia

• Rola JavaScript w aktualnym Frontend Developer RoadMap
• Środowisko programowania Visual Studio Code
  • Instalacja
  • Konfiguracja
  • Instalacja niezbędnych rozszerzeń
  • Skróty klawiaturowe
• Konfiguracja struktury projektu witryny www

Podstawy JavaScript

• Osadzanie kodu w dokumencie HTML
• Zmienne i stałe – deklaracja i konwersja
• Komentarze
• Okna dialogowe
• Typy danych
• Operatory
• Instrukcje warunkowe
• Instrukcje typu pętle
• Debugowanie kodu z poziomu przeglądarki

Programowanie z użyciem typów i obiektów

• Funkcje (Function)
• Tablice (Array)
• Daty (Date)
• Wyrażenia regularne (RegEx)
• Math
• Teksty (String, Template strings)
• Liczby
• NaN, Undefined, Null
• Map, Set
• Symbol
• Object
• Iteratory
• Generatory

Programowanie Document Object Model (DOM)

• Metody wyszukujące tagi w dokumencie HTML
• Atrybuty tagów HTML
• Dodawanie i usuwanie tagów z dokumentu HTML
• Praca z zdarzeniami tagów HTML
• Praca z stylami przypisywanymi do tagów HTML

Praca z obiektami Browser Object Model (BOM)

• Windows,
• Location,
• Navigator,
• Screen,
• History

Praca z formularzami HTML

• Budowa formularza
• Walidacja danych po stronie HTML
• Walidacja danych po stronie JavaScript
• Rola tokena CSRF w zabezpieczaniu formularza

Programowanie w technologii AJAX

• Wprowadzenie do technologii asynchronicznych
• Funkcje typu zwrotnego (Callback)
• Formaty transferu danych: JSON, XML, BLOB, i inne
• Użycie obiektu klasy XMLHttpRequest
• Zastosowanie obietnic (Promise)
• Zastosowanie Fetch API
• Składnia async / await

Programowanie z użyciem biblioteki jQuery

• Instalacja biblioteki i dołączenie do strony
• Obsługa zdarzeń tagów HTML z użyciem jQuery
• Użycie animacji wbudowanych w jQuery (opcjonalnie)
• Użycie technologii AJAX w jQuery

Programowanie obiektowe

• Projektowanie klas
• Deklaracja właściwości i akcesoriów
• Deklaracja konstruktora
• Deklaracja metod i metod statycznych
• Destrukturyzacja obiektów
• Rola wskazania this w pracy z obiektami
• Implementacja dziedziczenia

Praca z plikami oraz magazynami danych

• Użycie technologii AJAX
• Użycie FileReader
• Użycie local i session storage
• Użycie cookies
• Użycie IndexedDB
• Użycie WebSQL (opcjonalnie)

Praca z modułami

• Deklaracja skryptu jako modułu
• Oznaczanie klas i metod w module do eksportu
• Import modułu
• Domyślna klasa modułu
• Alias nazwy
• Warunkowe importowanie

Środowisko Node.js

• Wprowadzenie do środowiska
• Instalacja środowiska
• Instalacja wybranych pakietów
• Konfiguracja package.json
• Użycie narzędzia npx
• Użycie narzędzie do konwersji (transpilacji), np. sass do css
• Reakcja na zdarzenia zmian w zawartości plików js, css, i innych

Użycie narzędzi automatyzujących (Bundlerów)

• Wprowadzenie do webpack, parcel, rollupjs
• Instalacja webpack
• Konfiguracja webpack
• Użycie konwerterów
• Użycie optymalizatorów
• Budowa przykładowego projektu z użyciem webpack

Projekty przykładowych aplikacji (opcjonalnie)

• Projekt Angular
• Projekt React
• Projekt Vue