Ta lekcja jest w bazie eduweb

Zaloguj się kontem z dostępem albo wykup dostęp do bazy, żeby obejrzeć wideo.

Lekcja 31/ 31Zakończenie

0:00 / 0:00

Flexbox: Zakończenie

4 godz. 7 min wideo31 lekcji4 moduły

Czego się nauczysz

  • Omówienie podstaw pracy z flexboxem
  • Pojęcie osi i kierunków
  • Różne sposoby renderowania treści
  • Kurczenie i rozszerzanie się elementów
  • Wsparcie między przeglądarkami
  • Przedstawienie problemów z dostępnością
  • Dodatkowe materiały do poszerzania swojej wiedzy

Flexbox - od Podstaw

Ten kurs to omówienie najpopularniejszej i najlepiej wspieranej metody pozycjonowania elementów ostatnich lat - Flexboxa. Zrozumiesz w pełni jak działa Flexbox, dlaczego elementy układają się w określony sposób przy danych właściwościach, a także jakie problemy rozwiązuje i jakie niesie za sobą ryzyko.Realizacja materiału będzie dla Ciebie solidną dawką wiedzy, dzięki której żaden layout na flexboxie już Cię nie zaskoczy. Został on skompresowany do granic możliwości, znajdziesz tu same konkrety.

Szczegółowo opisana mechanika działania flexboxa

Flexbox nie jest trudny - pod warunkiem, że rozumiemy dlaczego elementy renderują się w konkretny sposób. Do tego potrzebna jest szczegółowa wiedza o osiach flexboxa, o tym jak ustalane są ich kierunki i jak elementy będą układać się wzdłuż nich.Dopiero wtedy dobrze można zrozumieć jak działa rozszerzanie i kurczenie elementów, jak elementy będą zachowywać się przy zmianie rozmiaru okna przeglądarki czy przy przełączaniu wyświetlania z układu wierszy na kolumnowy. To wszystko oraz kilka innych mechanizmów ukrytych we Flexboxie znajdziesz dokładnie wyjaśnione w tym kursie - podgląd przykładów czy dodatkowe quizy po zakończeniu kursu pomogą w utrwaleniu zdobytej wiedzy.

Problemy z dostępnością

Wielu developerów nie jest świadomych, że korzystanie z niektórych właściwości Flexboxa wpływa na dostępność naszych stron WWW - dostosowywanie naszych witryn pod czytniki ekranowe oraz użytkowników korzystających z witryn w sposób niestandardowy to temat który zyskuje na coraz większej popularności (zwłaszcza, jeśli planujesz kiedyś tworzyć strony rządowe - te są zobligowane do tworzenia stron dostępnych dla osób niepełnosprawnych).W tym kursie, dowiesz się jakie problemy może nieść za sobą używanie flexboxa i jak ich unikać.

Dla kogo jest ten kurs?

Kurs ten jest dla wszystkich osób, które dobrze czują się z CSS - wystarczy podstawowa umiejętność pisania selektorów. Nie ma żadnych wymagań dotyczących JavaScript, czy znajomości konkretnych frameworków. Natomiast jeśli do tej pory korzystałeś/aś z innych, starszych technologii do pozycjonowania elementów i chcesz nauczyć się prostszej, dobrze wspieranej współczesnej technologii - nie trać czasu! Flexbox to idealne wprowadzenie do kolejnych sposobów pozycjonowania jak np. CSS Grid.

Kurs Flexbox

4 rozdziały31 lekcji4h 7min

Wstęp

3min
  • Wprowadzenie2min(zablokowana)
  • Na czym będziemy pracować1min(zablokowana)

Poznajemy mechanikę flexboxa

1h 15min
  • Włączanie flexboxa6min(zablokowana)
  • Kierunek i zawijanie wierszy9min(zablokowana)
  • Wyrównywanie względem głównej osi9min(zablokowana)
  • Wyrównywanie względem osi przeciwstawnej12min(zablokowana)
  • Rozmiar bazowy5min(zablokowana)
  • Rozszerzanie się elementów9min(zablokowana)
  • Kurczenie się elementów5min(zablokowana)
  • Kolejność renderowania5min(zablokowana)
  • Notacja skrócona5min(zablokowana)
  • Porady odnośnie marginesów10min(zablokowana)

Tworzymy faktyczny layout na flexie

2h 28min
  • Wprowadzenie do tworzenia własnego YouTube4min(zablokowana)
  • Pasek nawigacyjny cz. 113min(zablokowana)
  • Pasek nawigacyjny cz. 217min(zablokowana)
  • Pasek nawigacyjny cz. 39min(zablokowana)
  • Nagłówek kanału cz. 18min(zablokowana)
  • Nagłówek kanału cz. 211min(zablokowana)
  • Nagłówek kanału cz. 314min(zablokowana)
  • Nagłówek kanału cz. 410min(zablokowana)
  • Lista wideo - wprowadzenie2min(zablokowana)
  • Lista wideo cz. 110min(zablokowana)
  • Lista wideo cz. 212min(zablokowana)
  • Lista wideo cz. 311min(zablokowana)
  • Lista wideo cz. 415min(zablokowana)
  • Lista wideo cz. 512min(zablokowana)

Dalszy rozwój z flexboxem

22min
  • Wsparcie przeglądarek3min(zablokowana)
  • Problemy z dostępnością cz. 17min(zablokowana)
  • Problemy z dostępnością cz. 29min(zablokowana)
  • Dodatkowe materiały2min(zablokowana)
  • Zakończenie1min(zablokowana)

Ten kurs jest w bazie eduweb

Dostęp do wszystkich kursów z bazy eduweb za 199 zł/mies.

Wykup dostęp do bazy

Autor kursu

Średnia ocen autora: 4,5

Bio

Cześć! Nazywam się Wojtek i moja obecna rola to Full Stack Engineer - tworzeniem stron zajmuję się już od ponad dziesięciu lat. Jeśli miałbym wskazać moją pasję, to zdecydowanie byłoby to programowanie w technologiach webowych i dalsze szerzenie się wiedzą :)

Możesz kojarzyć mnie z kanału Koduje na Youtube, gdzie stworzyłem ponad 50 darmowych poradników dotyczących różnych zagadnień z Front-Endu, czy jako głównego koordynatora cyklicznych spotkań Meet.js Warszawa. Poza tym jestem też członkiem programu Mozilla TechSpeakers - technologie open-source, ich tworzenie oraz przemowy publiczne również nie są mi obce. Od czasu do czasu prowadzę również indywidualne zajęcia dla osób poszukujących swojej pierwszej pracy jako Front-End developer.

Uwielbiam tematykę dostępności sieci - o której świadomość, zwłaszcza na polskim rynku - jest dosyć znikoma. Interesuję się również IoT oraz VR (❤️) czy Game-Developmentem, również w JavaScript!

Uważam, że nauczanie jest zdecydowanie najlepszą metodą, by poszerzać swoje horyzonty i dalej się rozwijać!

https://koduje.pl