Bootstrap. Kurs video. Tworzenie interaktywnych i responsywnych stron internetowych

Łukasz Krawczyk

Obierz kurs na... budowanie nowoczesnych stron internetowych Mimo intensywnego rozwoju mediów społecznościowych, a co za tym idzie – nowego modelu kontaktu z klientami i „followersami”, zapotrzebowanie na profesjonalne, nowoczesne strony WWW nie maleje. Firmy i osoby prywatne wciąż poszukują twórców witryn w pełni responsywnych i maksymalnie interaktywnych, po których poruszanie się będzie dla użytkownika przyjemne na tyle, by zechciał on pozostać na nich dłużej, a w przyszłości – powrócić. By tworzyć tego typu strony, programiści sięgają po rozmaite narzędzia. Wśród nich ostatnimi laty pozytywnie wyróżnia się Bootstrap, najpopularniejszy, a do tego bezpłatny framework HTML/CSS, dzięki któremu – przy odrobinie chęci i zaangażowania – można stworzyć responsywną stronę internetową na bazie predefiniowanych komponentów dostarczanych przez piątą wersję tej uznanej frontendowej technologii. Ten kurs video ma za zadanie przybliżyć Bootstrap od strony praktycznej – poprzez tworzenie responsywnej strony internetowej poświęconej tematyce gier wideo. W trakcie pracy uczestnik szkolenia skorzysta z HTML5, CSS3 i JavaScriptu, czyli trzech fundamentalnych języków webowych, a także z ekosystemu najpopularniejszego frameworka HTML/CSS, czyli Bootstrapu. To on zagwarantuje projektowi pełną responsywność, pozwoli bowiem precyzyjnie dostosować wygląd witryny do aktualnej szerokości ekranu urządzenia końcowego. Co więcej, znacząco przyspieszy i ułatwi pracę z językami interpretowanymi po stronie przeglądarki: HTML, CSS i JavaScriptem. Co Cię czeka podczas naszego profesjonalnego szkolenia Podczas nauki z naszym kursem video: Poznasz framework Bootstrap i opanujesz wiele zagadnień związanych z korzystaniem z tej technologii, takich jak front-end i back-end czy wytyczne dotyczące dostępności stron internetowych (WCAG) Będziesz operować w języku CSS – w tym przybliżysz sobie dostępne w nim modele layoutów, fleksowy pojemnik i elementy fleksowe, najważniejsze (z punktu widzenia Bootstrapa rzecz jasna) właściwości języka CSS związane z trybem wyświetlania Flexbox (Flexible Box) Przypomnisz sobie język programowania JavaScript – standard ECMAScript i jego różne wersje, najważniejsze elementy standardu ECMAScript 6 (2015), stałe/zmienne, funkcje strzałkowe, interpolację literałów łańcuchowych, wstęp do funkcji wyższego rzędu, metodę .forEach() Zrozumiesz, czym jest responsywność, a także jak działa filozofia mobile-first – w tym przyswoisz takie kwestie jak idea i ogólne założenia, charakterystyka, zasady stosowania, system 12-kolumnowej siatki, punkty przegięcia dostępne w Bootstrapie 5 a punkty przegięcia dostępne w poprzedniej wersji tego frameworka Zbudujesz od zera kompletną stronę internetową – skorzystasz przy tym z najważniejszych komponentów i funkcjonalności Bootstrapa 5.3.x, takich jak menu hamburgerowe, karuzela, grupy przycisków, karty, akordeon, pływające etykiety pól formularza, walidacja formularza domyślnie dostarczana przez Bootstrap Przekonasz się, jak funkcjonuje okno modalne – od idei działania, poprzez strukturę, otwieranie i zamykanie, statyczną odmianę okna modalnego, okno modalne z możliwością przewijania, okno modalne wyśrodkowane w pionie, rozmiary okna modalnego, po dynamiczną podmianę jego zawartości Przyjrzysz się nowemu w wersji Bootstrapa, z której będziesz korzystać, trybowi ciemnemu – określisz tryb kolorystyczny, umieścisz kontrolkę (przełącznika) do aktywacji trybu ciemnego, aktywujesz go po kliknięciu w kontrolkę (przełącznik), aktywowany przez użytkownika tryb ciemny zapamiętasz w obiekcie localStorage Bootstrap. Kurs video. Tworzenie interaktywnych i responsywnych stron internetowych jest adresowany do osób w miarę obytych z zagadnieniami związanymi z tworzeniem stron internetowych w HTML, CSS3 i JavaScripcie. Dobrze, by uczestnik szkolenia poruszał się sprawnie w dowolnym darmowym edytorze kodu źródłowego z kolorowaniem składni (najlepiej Visual Studio Code, ewentualnie Notepad++). Posiadanie bazowej wiedzy z zakresu responsywności także jest wskazane. Szkolenie kończy się na poziomie średnio zaawansowanym/zaawansowanym. Po jego odbyciu będziesz w stanie świadomie i w pełni samodzielnie tworzyć strony internetowe oparte na najbardziej popularnym frameworku HTML/CSS. Chodzi o odpowiedzialne i efektywne korzystanie z ogromu potencjału, jaki kryje w sobie ta technologia w najnowszej odsłonie, tj. w wersji 5.3.x. Dodatkową wartością może być też umiejętność wzbogacenia i uzupełnienia standardowych możliwości Bootstrapa o własne rozwiązania programistyczne, na przykład pod postacią skryptów języka JavaScript zgodnych ze specyfikacją ECMAScript 6 (2015). Webmasterem być Wiedza zdobyta podczas kursu nie tylko może się przełożyć na wzmocnienie Twojej pozycji zawodowej w aktualnej pracy, ale również skłonić Cię do poszukania nowego zajęcia, na przykład jako webmaster z prawdziwego zdarzenia lub front-end web developer. Co równie istotne, praktyczna znajomość ekosystemu Bootstrapa pozwala w sposób szybki i bezkompromisowy odnaleźć się w zupełnie innych frameworkach HTML/CSS, jak ZURB Foundation czy Skeleton, działających na podobnych zasadach. Świadomość podziału technologii webowych na front-end i back-end, wiedza o frameworku, jak również umiejętność jednoznacznego umiejscowienia w tym wszystkim Bootstrapa z pewnością przełożą się na Twoje postrzeganie Internetu. Nawet jeśli jesteś zwykłym użytkownikiem, będziesz wiedzieć, jak działa sieć, jak jest zbudowana i na czym się opiera.

CSS i SASS. Kurs video. Praktyczny projekt nowoczesnego dashboardu

Michał Grząśko

Obierz kurs na... CSS/SASS! Kaskadowe arkusze stylów to coś, bez czego nie może się obejść żadna efektowna wizualnie witryna internetowa — tak głęboko wrosły w nasze myślenie o tworzeniu pięknej strony, że nie możemy ich zastąpić niczym innym. Co więcej, CSS są rozwijane w dynamicznym tempie, a przeglądarki implementują i wspierają coraz to nowsze, bardziej zaawansowane reguły. Pozwala to twórcom stron dopieszczać swoje projekty i komponować niepowtarzalne layouty. Wszystkie te zalety CSS z pewnością już znasz i nie trzeba Cię przekonywać do ich wykorzystania. Sęk w tym, że kaskadowe arkusze stylów mają też pewną irytującą wadę: wymagają nieustannego powtarzania fragmentów kodu. Na szczęście wizjonerzy nowego, ergonomicznego programowania znaleźli na to sposób: zaprojektowali SASS — preprocesor CSS pośredniczący między przeglądarką a Twoim kodem. Dzięki temu możesz oszczędzić mnóstwo czasu! CSS i SASS. Kurs video. Praktyczny projekt nowoczesnego dashboardu ma za zadanie pokazać Ci, jak inteligentnie i wydajnie korzystać z SASS przy nadawaniu stronie internetowej odpowiedniego wyglądu. To niezwykle elastyczne środowisko udostępnia fantastyczne narzędzia i wzorce, które możesz wykorzystać w swoich projektach. Podczas kursu nauczysz się używać najbardziej efektownych i najwygodniejszych skrótów, trików i metod działania w środowisku SASS. Sprawdź, jak wygodnie możesz realizować swoje pomysły na stronę WWW — sięgnij po SASS! Sprawdź jak wygląda finalny projekt tworzony w trakcie kursu.  Czego nauczysz się podczas naszego profesjonalnego szkolenia? Zobaczysz, jak przygotować środowisko do pracy z SASS. Nauczysz się instalować Node. Sprawdzisz, do czego służy narzędzie Gulp i jak można go używać. Zaczniesz korzystać ze zmiennych i mixin, a także z @import i media queries. Opanujesz praktyczne wykorzystywanie nowoczesnych właściwości CSS, takich jak flexbox, transition, pseudoelementy i zaawansowane selektory. Odkryjesz, jak animować elementy HTML oraz dostosowywać wygląd projektu do wszystkich urządzeń — od desktopowych po mobilne. Poznasz zasady pozwalające zachować porządek i estetykę w kodzie. Dowiesz się, jak ostylować elementy najczęściej wykorzystywane na stronach internetowych, czyli przyciski, dropdowny, nawigację, togglery, tabele. Nie musisz być biegłym użytkownikiem CSS, by poradzić sobie z opanowaniem zawartego tu materiału. W trakcie ponad stu lekcji nauczysz się obsługi podstawowych i bardziej zaawansowanych narzędzi SASS. Zorientujesz się także, jak pisać ikonki w czystym CSS oraz efektowne i przyciągające wzrok zdarzenia :hover. Twoje strony internetowe wiele zyskają dzięki wzbogaceniu interfejsu o różne nowoczesne efekty, a estetyka w pisaniu kodu znacznie się poprawi. Co więcej, poznasz kluczowe elementy sposobu myślenia, który umożliwi Ci pisanie dowolnego interfejsu w CSS. Dowiesz się między innymi, jak odpowiednio nazywać klasy (i jak ich nie nazywać) oraz jak tworzyć odpowiednią konwencję dla projektu. Jeśli zrealizujesz wszystkie zadania, jakie postawi przed Tobą autor szkolenia CSS i SASS. Kurs video. Praktyczny projekt nowoczesnego dashboardu, oraz starannie przeanalizujesz jego wskazówki, Twoje projekty staną się znacznie lepsze, a Ty zaoszczędzisz mnóstwo czasu i nerwów. Eleganckie stylowanie stron Ten kurs zawiera najróżniejsze zagadnienia: od stosunkowo prostych po zaawansowane. Jeśli radzisz sobie z podstawami CSS, z pewnością możesz go rozpocząć i stopniowo nabierać coraz większej biegłości w rozumieniu kodu, dostrzeganiu jego niuansów i stylizowaniu dowolnych elementów HTML. To z kolei poprawi Twoje umiejętności w zakresie szybkiej i trafnej oceny różnych obszarów strony, zwiększy Twoje wyczucie i pozwoli Ci zyskać nową perspektywę. Regularne używanie preprocesora SASS sprawi, że zaczniesz myśleć w kategoriach zestawów reguł potrzebnych do napisania danego elementu. Takie podejście znacznie przyspieszy Twoje standardowe projekty, a jednocześnie przygotuje Cię na większe wyzwania. Nie tylko bez problemu będziesz nadawać style standardowym przyciskom, rozwijanym menu i przełącznikom, lecz także zaczniesz w pełni wykorzystywać animację czy złożone zdarzenia. Będziesz też bez problemu dopasowywać interfejsy swoich stron do potrzeb różnych urządzeń — stacjonarnych i mobilnych. W poszukiwaniu własnego stylu Na świecie istnieje niewyobrażalnie dużo stron internetowych. Zdecydowana większość z nich nie świadczy najlepiej o ich projektantach. Nie chcesz chyba być jednym z nich? CSS i SASS. Kurs video. Praktyczny projekt nowoczesnego dashboardu pomoże Ci uniknąć wielu błędów i zrozumieć istotę tworzenia stron o dużych walorach graficznych. Jeśli myślisz o karierze programisty lub projektanta albo chcesz aplikować na dowolne stanowisko wymagające takich umiejętności, bez znajomości CSS i SASS nie masz co o tym marzyć. Znajomość SASS jest jednym z najczęstszych wymagań pojawiających się w ofertach pracy. Dzięki temu szkoleniu zdobędziesz umiejętność pożądaną na rynku pracy — nauczysz się analizować projekt pod kątem odpowiedniej konwencji i zwiększysz elastyczność własnego myślenia o graficznych aspektach strony. Tylko dla wtajemniczonych Sprawdzone wzorce, dobre praktyki, funkcjonalności SASS, nowoczesne możliwości CSS3 i sposoby ich wykorzystania na przykładzie pełnego, kompleksowego projektu — oto, co oferuje Ci CSS i SASS. Kurs video. Praktyczny projekt nowoczesnego dashboardu. Znajdziesz tu specjalistyczne narzędzia oraz jasne, precyzyjne i szerokie omówienia kolejnych elementów. Prześledzisz dokładnie, krok po kroku, jak zabrać się do projektowania i jakie kolejne czynności wykonać. Zobaczysz, jak Twój kod nabiera rozmachu i szyku, staje się dynamiczny, przejrzysty, dokładnie taki, jaki powinien być. Terminologia związana z CSS i SASS przestanie być dla Ciebie przeszkodą, a nowo poznane elementy posłużą Ci do stworzenia zachwycających projektów!

CSS3. Kurs video. Poziom pierwszy. Nowoczesne i stylowe strony WWW

Tomasz Kowalski

Obierz kurs na... CSS3! Czy wiesz, jak zatrzymać internautów na stronach, które projektujesz? A może masz już dość witryn z małą wydajnością i ciężką grafiką? Zastanawiasz się, w jaki sposób zastąpić animacje wykonane w przestarzałej technologii Flash? Jeśli pragniesz zostać twórcą nowoczesnych stron internetowych, to znajomość języka CSS wydaje się jak najbardziej uzasadniona. Jeszcze lepiej, gdy będzie to CSS3, który otwiera nową erę w dziedzinie projektowania stron WWW.  Kaskadowe arkusze stylów (Cascading Style Sheets) to specjalny język opracowany w celu bardziej elastycznego formatowania elementów stron internetowych. Pozwolił oddzielić treść strony od jej wyglądu. Dzięki zastosowaniu zupełnie nowego myślenia o projektowaniu podbijesz sieć lekkimi, responsywnymi i eleganckimi witrynami.  Wprowadzenie nowych standardów w internecie oznacza nieograniczone możliwości — poznasz je wszystkie dzięki szkoleniu CSS3. Kurs video. Poziom pierwszy. Nowoczesne i stylowe strony WWW. Już wkrótce zrozumiesz podstawy najbardziej obiecującego języka programowania i zaczniesz je wykorzystywać w pracy nad własnymi stronami.  Co Cię czeka podczas naszego profesjonalnego szkolenia? Przygotujesz środowisko programistyczne do dalszej pracy. Poznasz składnię języka CSS i metody osadzania stylów. Przekonasz się, w jaki sposób kaskadowość zmieni jakość Twoich witryn. Wprowadzisz podział na moduły. Skorzystasz z nowych selektorów, pseudoklas i pseudoelementów. Będziesz definiować kolory w notacji słownej, szesnastkowej, RGB i RGBA oraz innych.  Dowiesz się, czym jest model kontenerowy. By z satysfakcją stwierdzić, że potrafisz... …pisać przejrzysty kod oraz wzbogacić swoją stronę o ciekawe efekty wizualne i nowe właściwości. Kaskadowe arkusze stylów są nieodzowną częścią każdej strony WWW aspirującej do miana nowoczesnej. CSS3. Kurs video. Poziom pierwszy. Nowoczesne i stylowe strony WWW pokaże Ci, jak z użyciem najnowszych trendów i od podstaw stworzyć atrakcyjne wizualnie witryny. Przybliży Ci również przydatne techniki optymalizacji. Dzięki temu praca nawet nad bardzo złożonymi projektami będzie łatwa i szybka. Twoje strony będą niezwykle efektowne, a do tego wydajne oraz przyjazne dla użytkownika. Skorzystaj z wiedzy naszego eksperta i wprowadź standard CSS3 do swojego życia! Najmodniejsze strony w sieci Dzięki wiedzy przekazanej w szkoleniu CSS3. Kurs video. Poziom pierwszy. Nowoczesne i stylowe strony WWW w swoich projektach rozdzielisz warstwę prezentacji wizualnej od warstwy danych, a Twój dokument HTML będzie bardziej przejrzysty i łatwiejszy do zarządzania. Przekonasz się też, że strony stworzone w języku CSS3 są elastyczne, lekkie i przyjazne dla użytkownika. To także witryny responsywne, czyli przeznaczone dla urządzeń mobilnych — a stąd zaledwie krok do podbicia nie tylko internetu, ale i rynku smartfonów oraz tabletów.  Przyszedł czas na nowe praktyki Ze szkoleniem CSS3. Kurs video. Poziom pierwszy. Nowoczesne i stylowe strony WWW nauczysz się w stopniu średnio zaawansowanym wykorzystywać potencjał języka CSS2 i CSS3. Poznasz ciekawe rozwiązania, które zaimplementujesz do własnych projektów. Generowanie grafiki oraz gradientów, autorskie animacje i efekty, proste zarządzanie treścią — dzięki przygotowanemu dla Ciebie kursowi poznasz nie tylko te tajniki kaskadowych arkuszy stylów.  Zostań webmasterem najnowszej generacji  CSS3. Kurs video. Poziom pierwszy. Nowoczesne i stylowe strony WWW podpowie Ci, jak pilnować zgodności tworzonych stron ze standardami, czym są nowe selektory i których właściwości fontów i tekstu najlepiej użyć w projektowanej witrynie. Dowiesz się, w jaki sposób tworzyć układy stron przy użyciu stylów CSS. Zdobędziesz rozeznanie w profilach kolorów, właściwościach obramowań i tła, możliwościach związanych z tekstem oraz gradientami, a także transformacjach, przejściach i animacjach. Te umiejętności pomogą Ci wyznaczać nowe szlaki w internecie i pozostawić konkurencję zawsze o krok w tyle. Poznaj naszego eksperta Tomasz Kowalski jest twórcą stron w standardach XHTML 1.0, CSS 2.1, HTML5, CSS3 oraz aplikacji internetowych w technologii PHP5, MySQL5, JavaScript, jQuery. Autor i właściciel portali toinfo.pl oraz informatyk.toinfo.pl. Twórca zestawów egzaminacyjnych dla okręgowych komisji egzaminacyjnych z zakresu montażu oraz eksploatacji komputerów osobistych oraz urządzeń peryferyjnych, a także tworzenia aplikacji internetowych i baz danych oraz administrowania bazami. Autor książek Urządzenia techniki komputerowej. Podręcznik do nauki zawodu technik informatyk oraz E-12. Montaż i eksploatacja komputerów osobistych oraz urządzeń peryferyjnych. Podręcznik do nauki zawodu technik informatyk, które uzyskały numery dopuszczenia MEN i zostały wydane przez Helion. Nauczyciel oraz wykładowca, wieloletni egzaminator Centralnej Komisji Egzaminacyjnej.

Frontend developer. Kurs video. HTML i CSS. Poziom podstawowy

Radosław Madecki

Obierz kurs na... frontend development Właściwie: obierz kurs na frontend development i - szerzej - na aktywne działania w internecie, oznaczające coś więcej niż pisanie komentarzy pod postami. Cokolwiek bowiem zamierza się w sieci wykreować - stworzyć reklamę graficzną, przygotować i wysłać mailing do klienta, o tworzeniu i modyfikacji stron WWW, aplikacji desktopowych oraz mobilnych nie wspominając - znajomość zasad posługiwania się językiem HTML jest kluczowa. Dla frontend developera HTML to język „pierwszego kontaktu”, bez którego nie może ruszyć dalej, ku JavaScriptowi i jego frameworkom. Akronim HTML z angielskiego oznacza: hipertekstowy język znaczników (HyperText Markup Language). Co w tłumaczeniu z programistycznego na ludzki brzmi: język oparty na hiperłączach (inaczej: odnośnikach), zbudowany ze znaczników, czyli słów kluczowych otoczonych nawiasami ostrymi. Dla kogoś, kto nigdy nie miał do czynienia z HTML-em, nie widział na przykład, jak wygląda w nim zapis kodu strony internetowej, powyższe definicje mogą brzmieć skomplikowanie. Ale zaręczamy - tak jest tylko do pierwszego kontaktu. Osoba, która kiedykolwiek stworzyła choćby prosty wpis na blogu i próbowała ustawić odpowiednią hierarchię nagłówków, dodać zdjęcie czy link do strony zewnętrznej, już pracowała z HTML-em. Teraz czas na to, by zapoznać się z nim bliżej. Co Cię czeka podczas naszego profesjonalnego szkolenia? Podczas tego kursu video: Poznasz podstawy składni HTML-a. Nauczysz się dobrych praktyk przygotowywania plików HTML. Zapoznasz się z nowymi tagami HTML5. Opanujesz zasady „semantycznego” wykorzystywania HTML-a, co wpływa między innymi na pozycjonowanie strony. Zaznajomisz się z CSS-em w najnowszej wersji. Zaczniesz tworzyć podstawowe animacje CSS. Co więcej... Opanujesz najważniejsze zasady dobrego web designu. Po ukończeniu szkolenia Frontend developer. Kurs video. HTML i CSS. Poziom podstawowy Twoją znajomość zagadnienia będzie można określić jako podstawową, co oznacza, że będziesz w pełni przygotowany do stworzenia pierwszej strony internetowej. Po co komu HTML? Zakres możliwości, jakie otwierają się przed osobą znającą HTML, jest ogromny. Dobrze znać ten język powinien oczywiście każdy programista. Frontend developer - to jasne, ponieważ bez opanowania i zrozumienia HTML-a oraz JavaScriptu nie sposób w pełni pojąć zasad funkcjonowania najważniejszych technologii frontendowych. Jednak opanowanie HTML-a przyda się także backendowcowi. Pozwoli mu wyjść poza własne poletko i lepiej zrozumieć drugą stronę programistycznej barykady, a w przyszłości - kto wie... może wręcz zmienić stronę albo odrzucić ten trochę sztuczny podział i obok backendu zająć się również frontendem? Dalej mamy twórców aplikacji mobilnych i webowych. Oni też na co dzień posługują się HTML-em. Podobnie, choć może w mniejszym zakresie, jest on potrzebny osobom zajmującym się marketingiem online. Opanowanie hipertekstowego języka znaczników ma głęboki sens również dla właścicieli niewielkich firm, którzy chcą samodzielnie wprowadzać drobne zmiany na stronach internetowych swoich przedsiębiorstw (na przykład tworzyć treści na firmowego bloga). Gdyby szef jednoosobowej firmy miał każdorazowo prosić zaprzyjaźnionego programistę o interwencję, chyba by zbankrutował... A tak, dzięki znajomości podstaw języka HTML, drobne zmiany i usprawnienia wprowadzi sam. Bezkosztowo. Lifehacki w JavaScript! Instrukcje warunkowe

Frontend developer. Kurs video. HTML i CSS. Poziom średnio zaawansowany

Radosław Madecki

Obierz kurs na... wyższy stopień wtajemniczenia frontend developmentu Początkujący programisto, stażysto lub praktykancie w agencji reklamowej, człowieku, który właśnie zmieniasz swoje zawodowe życie, przekwalifikowując się na projektanta stron internetowych - w Twoim przypadku, podobnie jak każdego innego frontend developera w kraju i na świecie, dogłębna znajomość HTML-a i CSS-a jest obowiązkowa. Nie wystarczy Ci jednak ogólna wiedza o tych dwóch językach programowania. Musisz dobrze je poznać i nauczyć się nimi swobodnie posługiwać. Oczywiście o ile zależy Ci na zdobyciu dobrze płatnej pracy w zawodzie albo rozpoczęciu pełnej sukcesów kariery programisty frontendu. Proponowane przez nas szkolenie wprowadzi Cię w tajniki posługiwania się językami HTML oraz CSS na poziomie średnio zaawansowanym. Dzięki kursowi poznasz wiele zagadnień często pomijanych podczas nauki tych technologii. Pozwoli Ci to zdobyć przewagę w walce o stanowisko, na które będziesz aplikować. Znajomość zagadnień związanych z dostępnością czy animacją CSS - na których temat trudno znaleźć w sieci materiały szkoleniowe - zmieni Cię z amatora w prawdziwego web developera. Wiedza dotycząca technik RWD, najlepszych praktyk pracy z HTML i nowoczesnych metod stylowania przyda Ci się zarówno w czasie poszukiwania ciekawej pracy, jak i później - podczas jej wykonywania. Co Cię czeka w trakcie naszego profesjonalnego szkolenia? Podczas pracy z tym kursem video: Nauczysz się pisać wysokiej jakości kod HTML oraz CSS. Poznasz zasady WCAG, automatycznej analizy i refaktorowania kodu. Dowiesz się, czym są ARIA, Flexbox i Grid. Opanujesz techniki RWD oraz przestawisz się na wykorzystywanie @media i myślenie mobile-first. Będziesz korzystać ze zmiennych w CSS oraz z funkcji CSS. Popracujesz z narzędziami graficznymi UI (Figma). Skorzystasz z techniki prototypowania rozwiązań. Co więcej... Poćwiczysz kreatywne myślenie, tworząc różnego rodzaju zoptymalizowane, nowoczesne animacje CSS. Frontend Developer. Kurs video. HTML i CSS. Poziom średnio zaawansowany pozwoli Ci opanować taki zakres wiedzy i osiągnąć taką biegłość w posługiwaniu się HTML i CSS, że będziesz mógł bez problemu zdobyć i utrzymać swoją pierwszą pracę jako programista frontendu. Informacje zawarte w szkoleniu przydadzą Ci się także do tego, by zabłysnąć przed przełożonymi, ponieważ obok zagadnień na poziomie podstawowym i średnio zaawansowanym porusza ono tematy, które zwykle wprowadza się dopiero na kursach zaawansowanych. Znając HTML i CSS... ...otworzysz przed sobą wiele zawodowych dróg. Przede wszystkim, jako developer ze znajomością HTML-a i CSS-a, będziesz w stanie sprawnie budować strony responsywne, czyli takie, które poprawnie uruchomią się na większości urządzeń. Znajomość zasad WCAG 2.1 oraz ARIA, które opanujesz w trakcie kursu, pozwolą Ci tworzyć strony dla urzędów i innych instytucji państwowych. Będziesz w stanie oceniać kod, dokonywać jego walidacji i refaktoryzacji projektów - co jest przydatne w pracy konsultanta freelancera, na stanowisku w software house czy w agencji reklamowej. Dobre opanowanie HTML-a oraz CSS-a jest niezbędne także do tego, by przygotowywać strony zgodne z najlepszymi praktykami SEO, to jest takie, które będą pojawiać się wysoko w wynikach wyszukiwania. Połączywszy znajomość HTML-a i CSS-a ze znajomością JS, będziesz gotów do tego, by kreować nowoczesne, profesjonalne aplikacje webowe oraz mobilne. Jak widzisz, bliższa znajomość z tymi dwoma bazowymi we frontend developmencie językami programowania da Ci wiele możliwości wyboru - od pracy w software house przy pisaniu rozmaitych aplikacji, przez stanowisko w agencji reklamowej z implementacją ciekawych, kreatywnych layoutów, aż po działanie freelancerskie, w ramach którego będziesz realizować projekty samodzielnie od A do Z. Lifehacki w JavaScript! Instrukcje warunkowe

HTML5 i CSS3. Kurs video. Fundamenty frontendu

Marcin Pałka

Obierz kurs na... fundamenty frontendu W świecie frontendu mnogość nowoczesnych narzędzi, pluginów i frameworków niejednego przyprawi o zawrót głowy. Zmieniają się standardy języków programowania i można rzec – wszystko płynie. Jednak i w tym świecie bez zawahania da się wymienić dwóch największych graczy – są nimi HTML i CSS. Sięgnijmy do niezbędnej teorii i sprawdźmy, dlaczego. Język znaczników HTML odpowiada za strukturę strony internetowej i określa hierarchię znajdujących się w niej komponentów. Każdy element strony jest zdefiniowany przez kod źródłowy HTML, który następnie zostaje zinterpretowany przez przeglądarkę internetową. Bez właściwej struktury HTML przeglądarka nie odczyta i nie wyrenderuje oczekiwanej zawartości. Stąd wniosek: bez znaczników HTML nie da się stworzyć strony internetowej. No dobrze, a do czego potrzebny jest CSS? Kaskadowych arkuszy stylów CSS używa się do określenia wyglądu dokumentów HTML. Prócz nadawania stylu umożliwiają separację struktury HTML od jej wizualnej prezentacji, co zwiększa przejrzystość kodu. Dzięki znajomości CSS można dostosować rozmiar dokumentu do każdej szerokości ekranu i tworzyć w pełni responsywne, skalowalne projekty. HTML i CSS tworzą duet o ogromnym potencjale i stanowią fundamenty frontendu. W trakcie naszego profesjonalnego szkolenia: Poznasz możliwości narzędzi developerskich dostępnych w nowoczesnych przeglądarkach internetowych Nauczysz się składni HTML5 i CSS3 na przykładach Poznasz znaczniki HTML5 Nauczysz się pisać poprawny semantycznie i reużywalny kod Dowiesz się, jak stworzyć responsywną stronę internetową, zgodną z aktualnymi standardami Poznasz dobre praktyki pracy z kodem HTML i stylami CSS Zrozumiesz, jak działa kaskadowość, dziedziczenie i specyficzność w CSS Nauczysz się pracować z modelem flexbox Poznasz pseudoklasy i pseudoelementy CSS Dowiesz się, jak zastosować zdobytą wiedzę do tworzenia profesjonalnych stron internetowych Opanujesz zasady kompozycji stron WWW, używając CSS box model Nauczysz się budować komponenty i z nimi pracować Dowiesz się, czym jest podejście mobile first w projektowaniu i jak je zastosować Od podstaw stworzysz projekt strony social media HTML5 i CSS3. Kurs video. Fundamenty frontendu został stworzony z myślą o wszystkich chcących poznać technologie webowe od podstaw. Kurs jest podzielony tematycznie na trzy części: pierwsza obejmuje teorię i przykłady z HTML5, druga analogicznie dotyczy CSS3, a trzecia to projekt końcowy strony internetowej. Na początek zaznajomisz się z budową strony WWW i jej składowymi. Poznasz znaczniki HTML i nowe znaczniki HTML5 jak: <header>, <main>, <section>, <footer>. Nauczysz się tworzyć tabele i rozbudowane formularze. Gdy kod HTML5 nie będzie mieć już przed Tobą tajemnic, dowiesz się, jak dodać do niego trochę kolorytu. Nauczysz się umieszczać style CSS w dokumencie, a także je resetować i standaryzować dla wszystkich wersji przeglądarek. Poznasz selektory, jednostki, pseudoklasy i pseudoelementy. Dowiesz się, jak pracować z tekstem i jak używać fontów Google Fonts. Zrozumiesz zasadę działania modelu pudełkowego w CSS i poznasz jego najważniejsze elementy (padding, margin, border, container). Znajomość box-model umożliwi Ci pełną kontrolę nad położeniem elementów na stronie. Następnie przećwiczysz właściwości potrzebne do pozycjonowania i wyświetlania elementów (display, position, float, z-index). Aby jeszcze sprawniej tworzyć elastyczne i responsywne strony internetowe, poznasz model flexbox. Za jego pomocą precyzyjnie określisz rozmieszczenie komponentów w pionie i poziomie. W trakcie rozważań o responsywności dowiesz się także, jak projektować strony WWW w podejściu mobile-first, czyli z myślą o urządzeniach mobilnych. Na zakończenie wszystkie nabyte w trakcie kursu umiejętności wykorzystasz w praktyce, tworząc projekt strony zainspirowanej Instagramem. Poznasz podejście stosowane przy prawdziwych projektach informatycznych i nauczysz się budować strony komponent po komponencie. Nigdy nie mów nigdy – wszystko może się zdarzyć. Kończyłem studia informatyczne z przekonaniem, że zostanę grafikiem komputerowym, dziś jestem w 100% frontend developerem i czerpię z tego ogromną radość każdego dnia.

Sass od podstaw. Kurs video. Budowa kompleksowej strony w oparciu o metodologię BEM

Maksymilian Olszewski

Obierz kurs na usprawnienie CSS Zapotrzebowanie na specjalistów frontendowców rośnie z roku na rok, stale rozwijają się także technologie, z którymi pracują frontend developerzy. Wraz ze wzrostem popularności aplikacji internetowych, które stają się też coraz bardziej skomplikowane i wyrafinowane, wzrasta znaczenie posiadanych przez specjalistów umiejętności i wiedzy. Aktualnie frontend developer, który pracuje w CSS, a nie zna jego preprocesorów, nie będzie w stanie stworzyć schludnego, optymalnego i przede wszystkim funkcjonalnego kodu. Sass, jako jeden z preprocesorów CSS, wnosi ze sobą szereg nowych zagadnień, ułatwień i nawiązań do klasycznych języków programowania. Wśród nich należy wymienić zmienne, rozdzielanie kodu na mniejsze fragmenty, sprecyzowane komponenty, funkcje i logikę. Dlaczego trzeba je poznać? Z przyczyn praktycznych — ze względu na łatwość tworzenia i utrzymania kodu z zastosowaniem środowiska Sass; prawie każdy projekt komercyjny oparty jest na technologiach tego preprocesora. Co Cię czeka podczas naszego profesjonalnego szkolenia? W trakcie pracy z niniejszym kursem video: Opanujesz teorię i praktykę rozdziału kodu na małe, schludne komponenty. Zrozumiesz, na czym polega metoda zagnieżdżania. Nauczysz się właściwego zapisywania zmiennych, mixinów oraz funkcji. Poznasz logikę środowiska Sass, jego możliwości w zakresie rozszerzania klas o te już istniejące oraz działania matematyczne. Dowiesz się, jak w praktyce stosować metodologię BEM — jedną z najczęściej stosowanych komercyjnie konwencji nazewnictwa klas. Co więcej... Zobaczysz na własne oczy, czym jest node.js oraz NPM, i przekonasz się, jak w prosty sposób można samodzielnie stworzyć środowisko Sass pod nowy projekt. Sass od podstaw. Kurs video. Budowa kompleksowej strony w oparciu o metodologię BEM kończy się na poziomie średnio zaawansowanym. By wziąć udział w kursie, należy znać HTML i CSS w stopniu podstawowym. Dla lepszego skorzystania z wiedzy dostępnej w ramach szkolenia dobrze jest rozumieć również podstawy języka JavaScript. CSS z turbodoładowaniem Preprocesory, do których — poza Sassem — zaliczają się między innymi Less i Stylus, mają za zadanie wzbogacić CSS o pewne mechanizmy znane z tradycyjnych języków programowania, których język CSS w swoim standardzie nie posiada. Innymi słowy, preprocesor przetwarza nową składnię i kompiluje napisany kod do formatu zgodnego ze standardem CSS. Dzięki temu produkt końcowy (aplikacja) będzie pracować pod wszystkimi przeglądarkami. Z dostępnych preprocesorów autor tego kursu zdecydował się wybrać Sass, jako najbardziej dojrzały (jego początki sięgają 2006 roku), dobry do pracy w metodologii BEM. Akronim ten pochodzi od angielskiego Block Element Modifier — kryje się za nim bardzo proste podejście do tworzenia modularnego kodu HTML. Opiera się on na podziale składowych strony na bloki (na przykład formularz lub menu), elementy (guzik formularza, link w menu) oraz modyfikatory (warianty elementów). Trzymanie się zasad metodologii i konsekwentnego nazewnictwa pozwala uzyskać funkcjonalny, przejrzysty kod. Trzy godziny z Sassem Kurs, dzięki któremu poznasz i opanujesz preprocesor Sass, trwa około trzech godzin; został podzielony na 20 lekcji. Jako że jest to szkolenie na poziomie podstawowym, tytułem wstępu zaczniemy od krótkiej lekcji teoretycznej, by szybko przejść do praktyki: zainstalujemy mianowicie środowisko pracy. Następnie przyjrzymy się metodyce BEM, w której będziemy działać dalej. Po tym, jak napiszemy pierwsze zmienne, zajmiemy się zagnieżdżaniem w Sassie, następnie poznamy mixiny i sposób funkcjonowania interpolacji. W ramach kolejnego bloku tematycznego skupimy się na działaniach matematycznych, logice, listach i mapach. Wreszcie, na sam koniec, przyjdzie czas na omówienie budowy footera z użyciem metod extend i funkcji.

Webpack 5. Kurs video. Kompletny przewodnik dla początkujących

Bartosz Szmit

Obierz kurs na... przyspieszenie w programowaniu Dziś słowem kluczem, gdy mowa o programowaniu, jest szybkość. Żaden praktyk kodowania, żaden informatyk zatrudniony w biznesie nie może sobie pozwolić na opóźnienia w dostarczaniu i modyfikacjach stron WWW lub aplikacji. Stąd wszystkie działania muszą przebiegać w tempie ekspresowym, co nie zmienia faktu, że kod nadal powinien być tworzony czy nadpisywany bezpiecznie. Dlatego tym cenniejsze stają się narzędzia zwiększające wydajność i ułatwiające pracę. Jednym z nich jest Webpack. Webpack to bundler, czyli inaczej transpilator JavaScriptu, który pozwala tworzyć pakiety uwzględniające zależności między modułami i klasami i poprawiające wydajność. Potrafi na przykład spakować wiele różnych formatów do jednego pliku JavaScript. Stworzony do pracy z językiem JS, dozbrojony w odpowiednie narzędzia Webpack może także przetwarzać HTML, CSS i obrazki. Warto go więc poznać i nauczyć się z niego korzystać, szczególnie jeśli jest się początkującym frontendowcem pracującym na co dzień ze stronami internetowymi lub z aplikacjami. Co Cię czeka podczas naszego profesjonalnego szkolenia W trakcie proponowanego przez nas kursu: Nauczysz się instalować Webpack lokalnie Poznasz zasady instalacji pluginów Opanujesz podstawy technologii Sass Skonfigurujesz serwer webpack-dev-server Będziesz pisać komponenty Co więcej... W programie kursu zawiera się nauka importowania komponentów i stylów Webpack 5. Kurs video. Kompletny przewodnik dla początkujących pozwoli Ci opanować podstawy pracy z tym bundlerem. Aby przystąpić do kursu, trzeba posiadać już pewne umiejętności w zakresie języka JavaScript, rozumieć takie pojęcia jak frontend czy serwer i mieć opanowane podstawy CSS. Komu potrzebny jest bundler Webpack Dzięki transpilatorowi Webpack można w łatwy i szybki sposób wdrażać aplikacje internetowe i rozwiązywać problemy, jakie pojawiają się w trakcie tego procesu. Szczególnie ułatwia on pracę nad projektami, których frontend jest bardzo rozbudowany, skomplikowany, z wieloma obrazami, fontami i elementami CSS. Pakując wiele różnych formatów do pliku JavaScriptu, Webpack nadaje mu rozszerzenie .js, co dzieje się dzięki przekształceniom i minifikacji zbędnego kodu. Jeśli zatem pracujesz i zamierzasz pracować na małych aplikacjach z pojedynczymi plikami JavaScriptu, Webpack może Ci się nie przydać. Jeżeli jednak zamierzasz wejść na wyższy poziom frontendu, koniecznie zapoznaj się z tym transpilatorem, a Twoja praca zdecydowanie przyspieszy!