ODBIERZ TWÓJ BONUS :: »

Ambitny Frontend: Zaawansowane techniki CSS i HTML. Kurs video. Projektuj nowoczesne layouty, które zachwycą

Podstawowe informacje:
Czas trwania: 07:59:29
Poziom: zaawansowany
Autor: Radosław Madecki
Liczba lekcji: 51
Technologia: HTML5, CSS3
Dla firm
Rozwiń umiejętności swoich pracowników dzięki kursom video
Dowiedz się więcej
  • Monitorowanie postępów pracowników. Przejrzyste raporty i imienne certyfikaty ukończenia kursów
  • Atrakcyjne rabaty dla zespołów. Im więcej pracowników liczy zespół, tym większy uzyskasz rabat
  • Doradztwo w wyborze tematyki szkoleń. Mamy setki kursów, dostosujemy program nauczania pod Twój zespół
Indywidualnie
104,30 zł 149,00 zł (-30%)
96,85 zł najniższa cena z 30 dni Dodaj do koszyka Za zakup otrzymasz 104 punktów
Korzyści:
  • Certyfikat ukończenia
  • Materiały dodatkowe do kursu
  • Test online
  • Dożywotni dostęp
  • Dostęp w aplikacji (także offline)
  • Napisy w języku polskim
Ten kurs należy do ścieżki Frontend Developer
Czas trwania: 37 godz.
DOWIEDZ SIĘ WIĘCEJ
Ten kurs należy do ścieżki Frontend Developer »

Czego się nauczysz?

  • Poznasz zaawansowane techniki pozycjonowania elementów w CSS, w tym flexbox i grid layout
  • Opanujesz komponentowe podejście do stylowania, tworząc i przenosząc style z narzędzi takich jak Figma, by móc ich wielokrotnie używać w swoich projektach
  • Nauczysz się korzystać ze zmiennych w CSS, aby Twój kod był bardziej dynamiczny i łatwiejszy w utrzymaniu
  • Zastosujesz CSS grid w kontekście zaawansowanej responsywności stron
  • Zdobędziesz wiedzę na temat optymalizacji i wydajności kodu CSS
  • Poszerzysz wiedzę o semantyce HTML i o rolach ARIA, co przyczyni się do lepszej dostępności tworzonych stron
  • Zwiększysz swoją świadomość co do roli accessibility we współczesnym web developmencie
  • Samodzielnie stworzysz system komponentów, bez użycia narzędzi takich jak Storybook

Spis lekcji

1. Wstęp 00:07:41
1.1. Dlaczego ten kurs jest warty Twojego czasu?
00:03:49
1.2. Dla kogo jest ten kurs, co będziemy robić?
OGLĄDAJ » 00:03:52
2. Poznajemy projekt w Figmie 00:23:03
2.1. Przejście przez design
OGLĄDAJ » 00:11:36
2.2. Czym jest brand book?
00:05:07
2.3. Przypomnienie - jak pobierać grafiki z Figmy
00:06:20
3. Tworzymy lokalny brand book 02:46:28
3.1. Pobieranie fontów
00:14:27
3.2. Definiowanie klas fontów, remy i emy
00:15:30
3.3. Strona z podglądem brand booka
00:22:38
3.4. Szlifowanie fontów
00:22:15
3.5. Szukanie błędów
00:09:47
3.6. Natywny akordeon HTML
00:05:02
3.7. Techniki definiowania kolorów
00:18:23
3.8. Definiowanie zmiennych CSS
00:10:17
3.9. Plan na przyciski
00:05:01
3.10. Implementowanie przycisków
00:17:07
3.11. Przycisków ciąg dalszy
00:10:30
3.12. Stany przycisków
00:07:41
3.13. Ribbony
00:00:37
3.14. Podpowiedzi z kodem w brand booku
00:04:32
3.15. Linki
00:02:41
4. Start implementacji strony 00:50:45
4.1. Omówienie pierwszego kroku
00:16:58
4.2. Implementacja bannera
00:11:58
4.3. Wyzwanie w bannerze i pozycje relatywne oraz absolutne
00:11:21
4.4. Lista linków
00:10:28
5. Mini-kurs CSS Grid 01:16:15
5.1. Wprowadzenie do Grid CSS
00:03:14
5.2. Grid container
00:03:41
5.3. Kolumny, grid columns
00:16:50
5.4. Grid rows, wiersze
00:05:35
5.5. Gridowy słowniczek - kluczowe pojęcia
00:03:20
5.6. Nietypowe kształty wskazanych komórek (grid na designie)
00:07:01
5.7. Cały layout strony za pomocą grid areas
00:08:13
5.8. Układanie elementów w poziomie
00:10:24
5.9. Układanie treści komórek w pionie
00:06:30
5.10. Skrócony zapis na układanie treści w pionie i poziomie
00:00:53
5.11. Gdzie szukać więcej informacji o grid
00:10:34
6. Ciąg dalszy strony 02:29:00
6.1. Kontynuujemy pracę po przerwie
00:17:00
6.2. Czym jest reset.css?
00:12:12
6.3. Landing section - ciąg dalszy
00:14:57
6.4. Landing section - ostatnie szlify
00:13:34
6.5. Lista brandów
00:09:36
6.6. Ozdobniki
00:06:22
6.7. Koniec wspólnej pracy - skomplikowany Grid
00:02:55
6.8. Wskazówki do zadania z Gridem
00:03:41
6.9. Rozwiązania zadania z Gridem
00:15:38
6.10. Parę ciekawostek związanych z porządkowaniem kodu
00:05:32
6.11. @import vs link rel
00:03:05
6.12. Rozwiązanie drugiego zadania z Gridem
00:12:06
6.13. Sekcja Zara
00:12:49
6.14. Newsletter
00:15:08
6.15. Stopka
00:04:25
7. Co dalej, jaki jest Twój poziom? 00:06:17
7.1. Co robić dalej, jaki jest Twój poziom po tym kursie?
00:06:17

Obierz kurs na... zaawansowane techniki HTML i CSS

Bycie dobrym frontendowcem w dzisiejszych czasach to sztuka łączenia kreatywności z technologią. Nie wystarczy już tylko znać HTML i CSS – trzeba myśleć jak projektant, kodować jak inżynier i działać jak lider zespołu. Znajomość zaawansowanego HTML i CSS to oczywiście fundament, na którym opiera się nowoczesny web development. Współczesne strony internetowe muszą być nie tylko estetyczne, ale także responsywne i dostępne dla wszystkich użytkowników. Kluczem do sukcesu jest opanowanie zaawansowanych narzędzi, takich jak CSS grid, flexbox, i komponentów, które pozwalają budować nowoczesne, responsywne strony. Grid CSS, choć wprowadzony dopiero w 2017 roku, zrewolucjonizował tworzenie nowoczesnych układów, zastępując starsze metody jak float czy inline-block. Z kolei zrozumienie semantyki HTML i ról ARIA jest niezbędne, aby tworzyć strony dostępne dla użytkowników z różnymi niepełnosprawnościami – to coraz ważniejszy aspekt w web developmencie. Zaawansowane techniki pozwalają również na lepszą współpracę w zespołach – tu modularność i czytelność kodu są kluczowe (przykładowo umiejętność przenoszenia projektów z Figmy do kodu da Ci przewagę w pracy zespołowej). Przekonaj się, jak nieograniczone są możliwości web developmentu, gdy zaawansowane techniki stają się intuicyjne. To moment, w którym projektowanie stron przestaje być wyzwaniem, ponieważ zmienia się w czystą przyjemność!

Szkolenie Ambitny frontend: zaawansowane techniki CSS i HTML. Kurs video. Projektuj nowoczesne layouty, które zachwycą ukończysz na poziomie średnio zaawansowanym – z elementami z poziomu zaawansowanego. Doświadczysz kompleksowej pracy nad realnym projektem, z jakim możesz się spotkać w pracy web developera. Zrozumiesz, jak przekształcać design z Figmy na gotowe strony, pobierać grafiki i pracować z brand bookiem. Nauczysz się definiować fonty przy użyciu jednostek rem i em, a także tworzyć stronę z podglądem brand booka, aby się upewnić, że wszystko działa perfekcyjnie. Opanujesz sztukę zarządzania kolorami i zmiennymi w CSS, co pozwoli Ci na dynamiczne i efektywne stylowanie. Poznasz zaawansowane techniki CSS, takie jak flexbox i grid, i w praktyce nauczysz się tworzyć elastyczne, responsywne layouty, które świetnie wyglądają na każdym urządzeniu. Zrozumiesz, jak dynamicznie zarządzać stylami dzięki CSS variables, co znacznie ułatwi utrzymanie większych projektów. Będziesz sprawnie zarządzać wieloma plikami CSS, co pozwoli Ci na lepszą organizację pracy w dużych zespołach. Dogłębnie zrozumiesz semantykę HTML, co sprawi, że Twoje strony będą bardziej przyjazne i dostępne dla wszystkich użytkowników, w tym tych korzystających z technologii wspomagających. Przyswoisz zasady accessibility i roli ARIA, co pozwoli Ci tworzyć strony zgodne z najnowszymi standardami. Nauczysz się także optymalizować kod CSS, co zwiększy wydajność Twoich stron. Dzięki temu staniesz się frontend developerem, gotowym na większe wyzwania. Poznając tajniki CSS grid, dowiesz się, jak perfekcyjnie układać elementy w gridzie i rozwiązywać złożone wyzwania layoutowe. W efekcie Twoje strony będą responsywne, elastyczne i zaprojektowane zgodnie z najwyższymi standardami. Zakończysz kurs z umiejętnością tworzenia profesjonalnych, nowoczesnych stron internetowych z dbałością o każdy szczegół.

Wybrane bestsellery

O autorze kursu video

Radek Madecki – frontend developer, product owner i pasjonat budowania społeczności. Twórca cyklu Ambitny Frontend, autor kursów dla programistów, które uczą technologii, kariery i rozsądnego podejścia do pracy w IT. Po godzinach rozwija bloga, gotuje, ćwiczy i szuka balansu między kodem a życiem.

Najtrudniejszy jest pierwszy krok, ale za rok podziękujesz sobie, że teraz go wykonałeś.

Radosław Madecki - pozostałe kursy

Oceny i opinie klientów: Ambitny Frontend: Zaawansowane techniki CSS i HTML. Kurs video. Projektuj nowoczesne layouty, które zachwycą Radosław Madecki (3)

Informacja o opiniach
Weryfikacja opinii następuje na podstawie historii zamowień na koncie Użytkownika umiejszczającego opinię. Użytkownik mógł otrzymać punkty za opublikowanie opinii uprawniającej do uzyskania rabatu w ramach Programu Kadr.
3.0
  • 6 (1)
  • 5 (0)
  • 4 (0)
  • 3 (0)
  • 2 (1)
  • 1 (1)
  • Moj ulubiony z całej ścieżki. Masa wiedzy, ciekawych przykładow, ładne designy wykorzystane w projekcie i coś ciekawszego niż oklepane już wszędzie projekty.

    Opinia: Kacper M Opinia dodana: 2025-05-23 Ocena: 6   
    Opinia niepotwierdzona zakupem
    Opinia dotyczy produktu: kurs video
    Czy opinia była pomocna:
  • Może być. Czasami ok, a czasem nie.

    Opinia: anonimowa Opinia dodana: 2025-08-28 Ocena: 2   
    Opinia niepotwierdzona zakupem
    Opinia dotyczy produktu: kurs video
    Czy opinia była pomocna:
  • Kurs przebiega w bardzo powolnym tempie. Nie polecam go osobom ktore chcą rozwinąć swoje umiejętności w zakresie HTML i CSS. Cena wygorowana jak wszystkie kursy radosława madeckiego.

    Opinia: anonimowa Opinia dodana: 2025-08-28 Ocena: 1   
    Opinia niepotwierdzona zakupem
    Opinia dotyczy produktu: kurs video
    Czy opinia była pomocna:
więcej opinii »

Szczegóły kursu

Dane producenta » Dane producenta:

Helion SA
ul. Kościuszki 1C
41-100 Gliwice
e-mail: gpsr@helion.pl
Format: Online
Data aktualizacji: 2024-11-26
ISBN: 978-83-289-1653-1, 9788328916531
Numer z katalogu: 237731

Videopoint - inne kursy

Kurs video
104,30 zł
Dodaj do koszyka
Sposób płatności