Adresaci szkolenia

Kurs przeznaczony jest zarówno dla osób pragnących zdobyć jak i uzupełnić swoją wiedzę dotyczącą technologii potrzebnych do budowy stron i aplikacji internetowych w warstwie przeglądarki.

Cel szkolenia

Celem szkolenia jest zapoznanie uczestników z szerokim zakresem zagadnień dotyczących języków HTML, CSS i JavaScript oraz z Bootstrap, najpopularniejszym frameworkiem UI, w stopniu pozwalającym na swobodne programowanie interfejsów graficznych aplikacji webowych.

Mocne strony szkolenia

Szkolenie w maksymalnym stopniu nastawione jest na aspekt praktyczny. Jego głównym założeniem jest rozwinięta część warsztatowa obejmująca zarówno budowę złożonego projektu jak i niezależne ćwiczenia pomagające zrozumieć i utrwalić omawiane zagadnienia.

Wymagania

Szkolenie przeznaczone jest dla osób o dowolnym poziomie umiejętności technicznych.

Parametry szkolenia

5*8 godzin (5*7 godzin netto) wykładów i warsztatów (z wyraźną przewagą warsztatów).

Program szkolenia

  1. Wprowadzenie

    1.1. Podział odpowiedzialności między HTML, CSS i JavaScript

    1.2. Omówienie najpopularniejszych edytorów/IDE

    1.3. Używanie przeglądarki jako środowiska programistycznego

  2. HTML

    2.1. Czym jest HTML?

    2.2. Odmiany standardu HTML

    2.3. Konstrukcja tagów

    2.4. Struktura strony HTML

    2.5. Gotowe szablony HTML - sprawne rozpoczęcie pracy z frontendem

    2.6. Podstawowe grupy tagów

    • Doctype i meta tagi

    • Elementy inline

    • Elementy blokowe

    2.7. Umieszczanie tekstu w dokumencie

    • Nagłówki i paragrafy

    • Rodzaje list

    • Inne elementy

    2.8. Osadzanie multimediów w dokumencie

    • Obrazki

    • Canvas

    • SVG

    • Audio i wideo

    2.9. Praca z formularzami

    • Podstawowe elementy i typy pól

    • Typy pól wprowadzone w HTML5

    • Walidacja

    • Dodatkowe atrybuty wpływające na użyteczność i dostępność

    2.10. Możliwości i właściwe zastosowanie tabel

    • Podstawowe tagi

    • Grupowanie kolumn i wierszy

    2.11. Inne grupy tagów

    • Meta tagi

    • Osadzanie skryptów i arkuszy stylów

    2.12. Semantyczność tagów i dlaczego to takie ważne?

    2.13. WAI-ARIA czyli zapewnienie dostępności dla niepełnosprawnych

  3. CSS

    3.1. Podstawy stylowania stron www

    • Sposoby dołączania stylów do strony

    • Selektory i pojęcie specificity

    • Stylowanie tekstu, web fonts i font stacks

    • Metody określania kolorów

    • Różne jednostki, kiedy stosować które?

    • Określanie wymiarów elementów, Box model

    • Pozycjonowanie, opływanie i związane z nimi wyzwania

    • Stylowanie strony do druku

    3.2. Zagadnienia uzupełniające

    • Flexbox

    • Transformacje i animacje

    • Zaawansowane stylowanie tła

    • Praktyczne zastosowania pseudoselektorów

    3.3. Podstawy Responsive Web Design

    • Media Queries

    • Podejście "mobile first"

    3.4. Strategie w pracy z CSS

    • Resetowanie i normalizacja stylów

    • Organizacja kodu w plikach

    • Metodologia BEM

    • Wykrywanie możliwości przeglądarek

    • Stylowanie działające na różnych przeglądarkach

    3.5. Preprocesory CSS

    • Podstawy języka SASS

    • Praktyczne zastosowanie we współczesnych frameworkach CSS

  4. JavaScript

    4.1. Wprowadzanie

    • Typy

    • Obiekty i funkcje

    • Instrukcje sterujące

    • Format JSON

    • Asynchroniczny JavaScript

    • Hoisting

    • Zasięg zmiennych

    • Domknięcia i ich praktyczne zastosowanie

    • Kontekst i obiekt this

    4.2. JavaScript w przeglądarce

    • Ładowanie skryptów

    • Obiekty globalne

    • Praca z Document Object Model

    • Zdarzenia i wywołania zwrotne

    4.3. ECMAScript2015 i nowsze

    • Moduły

    • Obiekt Promise

    • Arrow function

    • Destructuring

    • Inne nowości w języku JavaScript

    • Przykłady typowych zastosowań nowej składni

    4.4. Narzędzia i biblioteki ekosystemu JavaScript

    • Wprowadzenie do NPM

    • Podstawy Webpack

    • Transpilacja kodu z Babel

  5. Bootstrap

    5.1. Dlaczego potrzebujemy frameworków UI?

    5.2. Zestawienie najpopularniejszych rozwiązań

    5.3. Ćwiczenia z podstawowymi elementami frameworka Bootstrap

    • Czym jest Grid System?

    • Układ kolumnowy

    • Implementacja wzorców Responsive Design

    • Budowanie formularzy

    • Elementy nawigacji

    • Stylowanie tekstu i grafik

    • Efektywne użycie ikon

    • Inne przydatne struktury i klasy pomocnicze

    5.4. Komponenty JavaScript

    5.5. Dostosowywanie elementów Bootstrap do potrzeb projektu

    • Ograniczanie rozmiaru biblioteki

    • Zmiana wyglądu, własne skórki

  6. Informacje uzupełniające

    6.1. Jak efektywnie aktualizować wiedzę?

    6.2. Co dalej? Możliwe kierunki rozwoju

    6.3. Przydatne zasoby

Pytania?

* Wymagane.


Konsultant on-line
Skorzystaj z usług naszego konsultanta on-line.
Naciśnij przycisk ‘Skorzystaj’ aby przejść do okienka czatu
Kontakt
ul. Nowogrodzka 62c
02-002 Warszawa
Telefon +48 22 2035600
Fax +48 22 2035601
Email