Szkolenia
  • Ścieżki kariery
strefakursów.pl Programowanie
DARMOWE FRAGMENTY
Tomasz Kubisztal

Projektant elementów reklamowych i programista
4.9

Kurs Bootstrap 3 - responsywne strony

Twórz nowoczesne responsywne strony z frameworkiem Bootstrap
  • Poziom: Podstawowy
    • Dodaj do listy życzeń
    60 zł
    +600 punktów premium
    Zacznij naukę teraz, zapłać w ciągu 21 dni!
    Tworzenie stron internetowych CSS Bootstrap HTML JavaScript
    Płatności twisto

    • Chcesz tworzyć nowoczesne responsywne witryny?

    • Potrzebujesz narzędzi, które pozwolą ci skupić się na projekcie i uwolnią cię konieczności tworzenia każdego fragmentu kodu CSS i HTML od podstaw?

    • Chcesz dowiedzieć się jak za pomocą Bootstrapa stworzyć od podstaw kompletną witrynę?

    • Potrzebujesz praktycznej wiedzy na temat aktualnych trendów i rozwiązań w web designie?
    Sprawdź co mamy Ci do zaoferowania

    Czego się nauczysz z kursem?

    Responsywny layout strony

    Z tym szkoleniem poznasz tajniki tworzenia nowoczesnych stron opartych na frameworku Bootstrap. Co ważne w kursie omawiamy nie tylko podstawy Bootstrapa, ale również pokazujemy jak wykonać krok po kroku kompletny projekt responsywnej strony. To nie wszystko: dowiesz się także jak korzystać z niezwykle popularnej i przydatnej technologii LESS, która bardzo ułatwia pracę z rozbudowanymi arkuszami stylów.

    Jak to działa?

    Responsywny layout strony

    Kurs zawiera ponad 60 filmów instruktażowych prowadzonych przez lektora – doświadczonego programistę i webdesignera. Oglądając filmy błyskawicznie opanujesz wszystkie zagadnienia i będziesz w stanie zastosować zdobytą wiedzę w praktyce. Wszystkie niezbędne pliki zostały dołączone do kursu – zarówno pliki z ćwiczeniami jak i gotowe projekty. Po obejrzeniu filmów możesz więc od razu przystąpić do pracy. Do plików możesz się także odwołać w razie wystąpienia jakichkolwiek problemów.

    • w pełni responsywny układ, który działa poprawnie na każdym urządzeniu,

    • karuzela na stronie frontowej z automatyczną zmianą zdjęć,

    • responsywne obrazki,

    • nowoczesny design w stylu Flat,

    • przejrzysta struktura kodu umożliwiająca łatwą rozbudowę strony,

    • nowoczesna i przejrzysta nawigacja w oparciu o komponenty frameworku Bootstrap,

    • efekty i animacje z użyciem CSS,

    • nowoczesne i przyjazne dla użytkownika formularze.
    Tworzenie stron w Bootstrap
    JavaScript w Bootstrapie

    JavaScript w Bootstrapie

    Bootstrap posiada ciekawy zestaw pluginów, za pomocą których możesz łatwo dodać do strony przydatne funkcjonalności. Pokażemy ci kilka bardzo ciekawych i jednocześnie praktycznych przykładów użycia tej technologii. Dowiesz się jak stworzyć menu harmonijkowe, panel z zakładkami, oraz okienka podpowiedzi (tzw. „tooltipsy”). Po za tym opanujesz tworzenie karuzeli zdjęć oraz okien modalnych.

    LESS w Bootstrapie

    Technologia LESS

    LESS to tzw. preprocesor CSS – czyli takie rozszerzenie dla kaskadowych arkuszy stylów umożliwiające użycie zmiennych, funkcji itp. W praktyce pozwala to na wygodniejsza pracę, zwłaszcza podczas tworzenia bardziej rozbudowanych witryn. LESS jest bardzo powszechnie używany i jego znajomość może być bardzo przydatna. Dlatego w ostatnim rozdziale rightu poznasz najważniejsze zagadnienia dotyczące użycia tej niezwykle ciekawej technologii.

    Responsywny layout strony
    Elementy Bootstrap

    Duża liczba predefiniowanych stylów dla każdego elementu strony pozwoli ci to nie tylko przyspieszyć twoją pracę ale również zapewni spójny wygląd dla całej witryny. Dlatego w tym rozdziale opowiemy ci m.in. o wstawianiu przycisków, ikonek, tabel, galerii itp. Dowiesz się również jak przygotować responsywne obrazy.

    Nawigacja na stronie

    Duża ilość przejrzystych i łatwych w użyciu elementów nawigacyjnych jest kolejną istotną zaletą Bootstrapa. Oglądając filmy w tej części szkolenia szybko dowiesz się jak dodać na swojej witrynie menu w różnych wariantach oraz pasek typu „breadcrumb”.

    Formularze

    Formularze to kolejny element, który można bardzo łatwo przygotować oraz ostylować dzięki Bootstrapowi. Ten rozdział pozwoli ci szybko opanować najważniejsze zagadnienia związane z tworzeniem formularzy, użyciem pól tekstowych oraz dodawaniem ciekawych efektów.

    Rozbudowany projekt

    Responsywny layout strony

    Ten rozdział obejmuje aż 28 filmów, które pokażą ci jak wykonać krok po kroku komplety projekt nowoczesnej witryny. To doskonała okazja do podsumowania dotychczasowej wiedzy oraz do zdobycia nowych przydatnych umiejętności.

    Co jeszcze znajduje się w kursie?

    Wstęp

    Pierwszy rozdział to doskonała okazja aby zapoznać się lektorem, dowiedzieć się jak korzystać z plików dołączonych do kursu oraz poznać edytor używany w dalszych rozdziałach.

    Konfiguracja środowiska

    Na tym etapie rozpoczniemy pracę z frameworkiem Bootstrap. Dowiesz się skąd pobrać niezbędne komponenty, jak przygotować je do dalszej pracy oraz jak podłączyć pliki CSS oraz JavaScript.

    Podstawowe funkcje

    Ten rozdział pozwoli ci szybko zapoznać się z kluczowym elementem frameworku czyli z tzw. siatką która pełni rolę szkieletu strony. W kilku filmach pokażemy ci m.in. jak zdefiniować układ kolumn, jak te kolumny przesuwać, jak dynamicznie zmieniać ich kolejność i jak zagnieżdżać elementy siatki. To bardzo ważna wiedza bez której ciężko przejść do kolejnych etapów.

    Co jeszcze warto wiedzieć?

    HTML5, CSS3, Bootstrap

    Kurs kompatybilny z wersjami 3.X. Do komfortowej pracy przydatna będzie podstawowa znajomość HTML oraz CSS. Do tworzenia kodu użyty został edytor Sublime Text 2 ale nic nie stoi na przeszkodzie, aby go zastąpić dowolnym innym programem edycyjnym.

    ZOBACZ WIĘCEJ
    Program nauczania
    1 Wprowadzenie
    Wstęp 0m 23s
    Instalacja Sublime Text 4m 19s
    Jak korzystać z plików? 2m 35s
    2 Konfiguracja środowiska
    Bootstrap - co to jest? 5m 20s
    Instalacja frameworku Bootstrap 5m 01s
    Dołączenie plików CSS 4m 40s
    Dołączenie plików JS 6m 01s
    3 Podstawowe funkcje
    Układ siatki 14m 28s
    Korzystanie z układu siatki 11m 49s
    Offset - zmiana kolumn 10m 03s
    Push-Pull - dynamiczna zmiana kolejności kolumn Podgląd 4m 55s
    Zagnieżdżanie siatki 7m 31s
    Jumbotron 3m 35s
    4 Elementy frameworku Bootstrap
    Znaczniki blockquote i small 5m 58s
    Responsywne ukrywanie elementów na stronie 4m 50s
    Przyciski 6m 16s
    Zdjęcia responsywne 7m 01s
    Ikony glyphicon 3m 36s
    Galeria zdjęć 12m 54s
    Tabele 7m 31s
    Własny plik CSS 6m 02s
    5 Nawigacja na stronie
    Nawigacja i informacja 5m 14s
    Proste menu 5m 24s
    Rozbudowane menu 11m 59s
    Rozwijane menu Podgląd 4m 29s
    6 Javascript w frameworku Bootstrap
    Javascript - zakładki 13m 23s
    Menu harmonijkowe 11m 28s
    Javascript - podpowiedzi 6m 15s
    Efekt karuzeli zdjęć 11m 03s
    Okna modalne 10m 54s
    7 Formularze
    Pola tekstowe w formularzach 7m 51s
    Elementy formularza 9m 27s
    Dodatkowe efekty w formularzach 7m 40s
    8 Rozbudowany projekt
    Wstęp 3m 36s
    Projekt menu górnego 17m 53s
    Dodanie efektu karuzeli 8m 51s
    Użycie menu harmonijkowego 15m 11s
    Miniaturki zdjęć 13m 29s
    Informacja w zakładkach 15m 53s
    Szybka stylizacja zdjęć Podgląd 7m 37s
    Formatowanie okien modalnych 11m 03s
    Ikony z przezroczystym tłem 5m 27s
    Rozmieszczenie elementów na siatce 5m 29s
    Własne kafelki 6m 06s
    Użycie formularza 12m 09s
    Formatowanie stopki strony 3m 31s
    Walidacja i poprawa błędów 12m 31s
    Własny plik CSS 4m 26s
    Typografia w CSS 6m 50s
    Zmiana wyglądu menu górnego 14m 06s
    Pełnoekranowy efekt karuzeli 8m 17s
    CSS w menu harmonijkowym 11m 09s
    Stylizacja miniaturek 4m 54s
    Ciekawe efekty CSS 6m 38s
    Przebudowa zakładek 9m 38s
    Stylizacja okien modalnych 11m 07s
    Dwukolorowe kafelki 12m 31s
    Ulepszenie formularzy 4m 44s
    Animacje na stronie 11m 22s
    Dopasowywanie strony do rozdzielczości 12m 54s
    Javascript - animacja menu górnego 5m 02s
    9 LESS
    LESS, czyli zmienne w CSS 4m 59s
    Instalacja niezbędnych narzędzi 3m 28s
    Praca z LESS 3m 32s
    Własny plik LESS 6m 33s
    Domieszki - mixins 3m 04s
    Ocena uczestników
    5 4.9 232
    4.9
    95%
    5%
    0%
    0%
    0%
    Recenzje użytkowników (232)
    5
    Dzięki temu kursowi nauczyłem się podstaw responsywności i pozyskałem nowych klientów!
    5
    Świetny kurs.
    5
    Kurs bardzo ciekawy zarówno dla początkujących jak i zaawansowanych osób. Kurs jest prowadzony bardzo merytorycznie pokazując wszystko na praktycznych przykładach Gorąco polecam
    5
    Duża dawka podstawowej wiedzy przekazana w prosty i przejrzysty sposób. Polecam!
    5
    Bootstrap funkcjonuje na wieku witrynach internetowych. Kurs polecam front-end developerom którzy opanowali język znaczników HTML oraz arkusze styki CSS. Bootstrap pozwala szybko stylowac stronę i tworzyć responsywne układy.
    WIĘCEJ RECENZJI
    Informacje o szkoleniu
      232 recenzji
      9 godzin
      66 wykładów
    • Możliwość pobrania pliku
    • Nielimitowany dostęp
    • Dostęp z urządzeń mobilnych
    60 zł
    +600 punktów premium
    Zacznij naukę teraz, zapłać w ciągu 21 dni!

    Newsletter

    Prawa autorskie © 2019 strefakursów.pl
    Polityka prywatności Regulamin zakupów
    Tylko teraz możesz odebrać rabat na pierwsze zamówienie
    Dlaczego warto?
    Będziesz regularnie otrzymywał atrakcyjne rabaty
    Nie przegapisz żadnej z naszych promocji
    Będziesz informowany o aktualnych konkursach
    Nie wysyłamy spamu
    Nie, dziękuję, kupię bez zniżki
    strefakursów.pl korzysta z plików cookie, aby dostosować usługi do Twoich preferencji. Niektóre pliki cookie są zaś niezbędne do prawidłowego działania witryny. Dzięki nim możemy wyświetlać Ci spersonalizowane oferty i informacje o promocjach, zarówno w witrynach strefakursów.pl, jak i na innych stronach. Oczywiście to Ty decydujesz. Możesz w każdej chwili określić warunki przechowywania lub dostępu do plików cookies w Twojej przeglądarce.
    AKCEPTUJĘ PLIKI COOKIE