user menu
avatar

Warsztaty tworzenia stron - nowe podejście

Otwieramy od nowa temat tworzenia stron. Jeśli znasz podstawy HTML oraz CSS i chcesz nabrać praktyki to zacznij od tego właśnie kursu.

poster_image
dotZapłać nawet za 30 dnitooltip info icon
dot30 dni gwarancji zwrotu pieniędzy
dotWsparcie na każdym etapie nauki
dotRegularne aktualizacje
Bezterminowy dostępBezterminowy dostęp
zadań102 zadań
Wsparcie zespołuWsparcie zespołu
Dostęp z urządzeń mobilnychDostęp z urządzeń mobilnych
Natychmiastowa weryfikacja zadańNatychmiastowa weryfikacja zadań
Imienny certyfikat ukończeniaImienny certyfikat ukończenia
guardian photo
Pomocy w tym kursie udziela Ci:
Jakub – opiekun kursów HTML i CSS
Opis produktu
Co zyskujesz?
Program nauczania
Recenzje
FAQ

Więcej samodzielnej pracy

Dzięki waszym uwagom oraz opiniom mogliśmy stworzyć zupełnie nowy kurs tworzenia stron. Koniec z przepisywaniem gotowego kodu, koniec z restrykcyjnym sprawdzaniem spacji czy numerów linii znanym z poprzednich warsztatów. Tym razem musisz naprawdę się wysilić i wykorzystać całą dotychczasową wiedzę. Efektem twojej pracy będzie nowoczesna, responsywna strona typu Landing Page.

Trudniejsze zadania i samodzielne pisanie kodu

Ten kurs to praktyka opakowana w sprawdzone zadania typu LiveCode. Dzięki temu masz pewną dowolność oraz samodzielność podczas pisania kodu HTML oraz CSS. My zapewnimy Ci niezbędne wskazówki oraz podpowiedzi, ale kluczową pracę musisz wykonać sam. Zadania w kursie może nie są łatwe ale przecież chodzi o to, żeby nauczyć się wartościowych rzeczy i rozwijać swoje umiejętności.

description_image1

Czego się nauczysz?

Z kursem zdobędziesz szeroką wiedzę na temat nowoczesnych technik tworzenia stron.

  • point

    Nauczysz się zamieniać projekt wizualny na działający kod HTML/CSS

  • point

    Poznasz dobre sposoby organizowania stylów oraz nazywania klas.

  • point

    Opanujesz niezwykle przydatną technikę kompozycji klas, która pozwoli Ci łatwo budować komponenty oraz ich warianty.

  • point

    Nauczysz się tworzyć responsywne layouty oparte na flexbox.

  • point

    Poznasz przydatne sposoby tworzenia mobilnego menu.

  • point

    Zdobędziesz niezwykle wartościową praktykę, niezbędną podczas pracy z nowoczesnym front-endem.

description_image2

Jeszcze więcej treści

To najbardziej rozbudowany z dotychczasowych kursów dotyczących HTML i CSS. I jednocześnie najbardziej praktyczny.

  • point

    Dziesiątki zadań LiveCode, podczas których będziesz budować krok po kroku strukturę oraz style strony.

  • point

    Liczne testy weryfikujące nowo zdobyte umiejętności

  • point

    Dodatkowe prezentacje wyjaśniające bardziej złożone zagadnienia na jakie napotkasz tworząc projekt.

  • point

    Wskazówki na temat samodzielnego rozwijania i dalszej rozbudowy projektu.

  • point

    Możliwość pobrania plików z gotowym kodem na końcu kursu.

Co jeszcze musisz wiedzieć

Aby skorzystać z kursu potrzebna ci będzie znajomość podstaw HTML i CSS. Jeśli znasz kluczowe znaczniki, umiesz pisać podstawowe style i wiesz jak działają klasy to z kursem sobie na pewno poradzisz. Ze względu na złożoność projektu budowanego w kursie, największy komfort pracy uzyskasz na laptopie lub komputerze stacjonarnym.

description_image2

To co oferują Ci kursy Codenga

Harmonogram
Masz możliwość ustalenia własnego harmonogramu nauki po zakupie kursu. Możesz zdobywać wiedzę w takim tempie jakie ci najbardziej odpowiada.
Społeczność
Wymieniaj się doświadczeniami z innymi. Zadawaj pytania i rozwijaj swoją znajomość tematu.
Profil
W twoim profilu widoczne są wszystkie zdobyte certyfikaty oraz osiągnięcia. Profil możesz łatwo publikować za pomocą prostego odnośnika.
Ranking
Porównaj swoje wyniki z innymi i zostań najlepszym uczestnikiem kursów Codenga.
Możliwość kontynuowania nauki
Po ukończeniu kursu podstawowego możesz kontynuować naukę z kolejnymi kursami.
Opiekun kursu
Każdy kurs ma opiekuna, do którego możesz się zwrócić o pomoc i wyjaśnić wątpliwości dotyczące treści kursu.

Poznaj swój program, zobacz czego Cię nauczymy

Moduł 1
Wstęp - omówienie projektu oraz globalne style.
(10 zadań)
Na początku musimy przeanalizować nasz projekt i wspólnie zastanowić się nad tym, co nam będzie potrzebne podczas pracy.
Jaki projekt stworzymy
Klasa dla elementu BODY
Jak korzystać z podglądu
Reset stylów domyślnych
Reset domyślnych marginesów oraz paddingów
Jak powinny działać responsywne obrazki
Zastanówmy się nad kolejnymi krokami.
Font, kolory oraz style odnośników
Moduł 2
Bazowe style tekstu i komponenty
(14 zadań)
Będziemy teraz pracowali nad stylami dla elementów, które są wiele razy używane w całym projekcie. Chodzi tu głównie o takie elementy jak nagłówki, etykiety czy przyciski.
Mobile first - jak to działa
Stwórzmy style dla nagłówków
Kolejne elementy - p, h3 oraz etykiety
Uzupełnijmy style dla wspomnianych elementów.
Klasa dla dużego tekstu.
Sprawdź się - czy dobrze interpretujesz kod?
Przyciski - jak do tego podejść
Uzupełnijmy style przycisków.
Kompozycja z klas
Zbudujmy nasze przyciski.
Moduł 3
Budujemy responsywny layout
(13 zadań)
Zbudujemy teraz bardzo fajną rzeczy. Będzie to siatka kolumn, dzięki której będziemy mogli dowolnie układać zawartość dla urządzeń o różnych szerokościach.
box-sizing - dlaczego jest tak ważny
Kontener - jak to działa
Dodajmy klasę kontenera
Wiersz - koncepcja
Wiersz - implementacja
Jak działają kolumny
Dodajmy pierwszą kolumnę
Kolejne kolumny - co będzie potrzebne
Czas na zbudowanie wszystkich kolumn
Test na koniec - czy dobrze rozumiesz zasadę działania kolumn?
Moduł 4
Klasy pomocnicze oraz standardowe odstępy
(7 zadań)
Teraz przygotujemy kolejny zestaw przydatnych klas. Za ich pomocą będziemy mogli łatwo wyrównywać zawartość na stronie oraz dodawać odstępy w pionie.
Czym jest klasa pomocniczna?
Dodajmy kilka prostych klas
Standardowe paddingi
Implementacja klas paddingów
Standardowe odstępy - test na koniec

Masz dalsze pytania?

minusplus
Czym jest kurs Codenga?
To interaktywny kurs, który został podzielony na kilkanaście etapów - każdy z nich składa się z niewielkich dawek wiedzy teoretycznej, którą następnie musisz wykorzystać w zadaniach praktycznych. Abyś się szybko nie zniechęcał, zadbaliśmy o urozmaicenie tych zadań. Testy, quizy i przede wszystkim - dużo kodowania! Pamiętaj - praktyka czyni mistrza :)
minusplus
Ile będę mieć czasu na zaliczenie kursu?
Dokładnie tyle, ile potrzebujesz. Możesz zaplanować naukę z harmonogramem, jeśli jednak z jakiejś przyczyny nie możesz tego zrobić, nie obawiaj się. Kurs będzie dostępny na Twoim koncie bezterminowo.
minusplus
Czy po ukończeniu kursu nadal mogę z niego korzystać?
Oczywiście, kupując kurs otrzymujesz bezterminowy dostęp do kursu. Możesz więc z niego korzystać tak długo i tak często, jak tylko chcesz.
minusplus
Czy żeby przystąpić do kursów Codenga muszę mieć jakąś specjalistyczną wiedzę w danym zakresie?
Absolutnie nie! Kursy Codenga zostały tak przygotowane, aby KAŻDY, niezależnie od wieku, umiejętności czy wiedzy w tym temacie, mógł spróbować swoich sił w programowaniu. Pamiętaj, aby rozpocząć naukę od kursu “Absolutne podstawy” jeśli jesteś zupełnie początkującą osobą.
minusplus
Czy potrzebuję specjalnego oprogramowania do nauki z kursami?
Spokojnie, zadbaliśmy również o to ;) Do nauki z kursami potrzebujesz jedynie… urządzenia z internetem i kilkunastu minut dziennie! Testy, zadania i ćwiczenia z kodowaniem odbywają się wyłącznie na platformie Codenga. Dlatego nie musisz się martwić o dodatkowe, płatne oprogramowanie, albo o to, czy masz odpowiednią wersję. Po prostu logujesz się i działasz.
19
99
dotZapłać nawet za 30 dnitooltip info icon
dot30 dni gwarancji zwrotu pieniędzy
dotWsparcie na każdym etapie nauki
dotRegularne aktualizacje
Bezterminowy dostępBezterminowy dostęp
zadań102 zadań
Wsparcie zespołuWsparcie zespołu
Dostęp z urządzeń mobilnychDostęp z urządzeń mobilnych
Natychmiastowa weryfikacja zadańNatychmiastowa weryfikacja zadań
Imienny certyfikat ukończeniaImienny certyfikat ukończenia
guardian photo
Pomocy w tym kursie udziela Ci:
Jakub – opiekun kursów HTML i CSS
19
99