Opanuj Bootstrapa, żeby tworzyć zindywidualizowane i responsywne aplikacje webowe!
Bootstrap jest coraz popularniejszym frameworkiem CSS i JavaScriptu, służącym do szybkiego i bezproblemowego tworzenia responsywnych interfejsów WWW. W sierpniu 2011 roku został zaprezentowany światu w jako projekt open source, a dzisiaj jest marką powszechnie znaną wśród projektantów front-endów aplikacji. Bootstrap jest prosty w użyciu, kompatybilny z różnymi przeglądarkami i umożliwia tworzenie interfejsów mobilnych. Zalety te są doceniane przez rosnące grono użytkowników na całym świecie. Mimo tej popularności dość trudno znaleźć dobry materiał do nauki zaawansowanych opcji dostępnych w najnowszej, czwartej wersji Bootstrapa.
To książka przeznaczona dla developerów, którzy chcą pisać kompletne, przyjemne w użytkowaniu i doskonałe jakościowo strony za pomocą Bootstrapa 4. Opisano tu różnorakie podejścia do tworzenia stron od podstaw. Dowiesz się, jak budować właściwy układ strony, stosować różne komponenty nawigacyjne Bootstrapa, korzystać z formularzy i stylizować różnego typu treści. Zrozumiesz budowę wtyczki w Bootstrapie, nauczysz się pisać własne komponenty i rozszerzać Bootstrapa za pomocą jQuery. W książce przedstawiono także klasy pomocnicze Bootstrapa, dzięki którym proces tworzenia strony przebiega sprawniej. Nie zabrakło również szczegółowych instrukcji dotyczących optymalizacji strony i jej integrowania z zewnętrznymi frameworkami.
W tej książce między innymi:
- wprowadzenie do Bootstrapa 4 i jego najużyteczniejszych elementów
- tworzenie od podstaw układu strony
- korzystanie z wtyczek i bibliotek oraz tworzenie własnych wtyczek
- klasy pomocnicze Bootstrapa 4, ich implementacja i możliwości wykorzystania
- tworzenie zaawansowanych interfejsów za pomocą akordeonów, rozwijanych list i grup list
Bootstrap 4 dla projektanta: responsywność, jakość, styl!
Rozdziały:
O autorach 7
O recenzencie 8
Wstęp 9
Rozdział 1. Podkręcanie Bootstrapa 13
- Wprowadzenie do projektu demo 14
- Co oferuje Bootstrap 4 16
- Układ 16
- Nadawanie treściom stylu 17
- Komponenty 18
- Wsparcie urządzeń mobilnych 21
- Klasy pomocnicze 21
- Wspierane przeglądarki 21
- Sass zamiast Less 22
- Od pikseli do root emów 22
- Mieszanie prefiksów 23
- Ikony 23
- Szablony 24
- Kosmetyka 25
- Przygotowanie projektu 25
- Podsumowanie 31
Rozdział 2. Definiowanie stylu 33
- System siatkowy 33
- Kontenery 34
- Rzędy 40
- Kolumny 40
- Obrazy 52
- Responsywne obrazy 54
- Modyfikatory obrazów 56
- Responsywne narzędzia 58
- Podsumowanie 60
Rozdział 3. Tworzenie układu 61
- Tworzenie sekcji 61
- Dodawanie komponentów Bootstrapa 64
- Jumbotron 65
- Zakładki 66
- Karuzela 72
- Karty 75
- Pasek nawigacyjny 77
- Okna modalne 84
- Podsumowanie 89
Rozdział 4. O nawigacji, stopkach, ostrzeżeniach i treści 91
- Przyklejanie paska nawigacji 92
- Więcej o stylu paska nawigacji 93
- Poprawa nawigacji za pomocą Scrollspy 93
- Dopasowanie prędkości przewijania 96
- Okruszki 99
- Ikony 99
- Wykorzystanie i dostosowanie ostrzeżeń 102
- Tworzymy stopkę 107
- Tworzymy dopasowane formularze 109
- Walidacja formularza 116
- Wskaźniki postępu 118
- Używanie obiektów medialnych 119
- Rysunki 120
- Podsumowanie 122
Rozdział 5. Projektowanie usprawnione dzięki wtyczkom 123
- Wykrywanie przeglądarki 124
- Rozszerzona paginacja dzięki wtyczce bootpag 126
- Wyświetlanie obrazów za pomocą Lightboksu 135
- Poprawiamy listę cen za pomocą DataTables 139
- Typeahead 142
- Podpowiedzi 144
- Wyskakujące okienka 144
- Podsumowanie 145
Rozdział 6. Wtyczki dopasowane do potrzeb 147
- Anatomia wtyczek 148
- Dopasowanie wtyczek do potrzeb 154
- Konfiguracja wtyczki ostrzegawczej 154
- Dostosowywanie karuzeli jQuery 161
- Pisanie własnej wtyczki jQuery 166
- Idea - wtyczka A11yHCM 166
- Plik a11yhcm.js 169
- Kod 171
- Dodawanie stylu 174
- Podsumowanie 176
Rozdział 7. Zaawansowane wtyczki 179
- Budowanie komponentu referencje za pomocą Salvattore'a 179
- Poznaj Salvattore'a 182
- Dodawanie Animate.css do Mojej Fotki 187
- Skaczące powiadomienia 188
- Animowanie siatki Salvattore'a 191
- Hover 192
- Dodawanie Hovera do Mojej Fotki 193
- Rozbudowywanie paska nawigacyjnego 193
- Ikony Awesome Hover 194
- Salvattore Hover 196
- Podsumowanie 199
Rozdział 8. Narzędzia 201
- Flexbox 201
- Właściwości display i alignment 202
- Pomoc dla właściwości display 203
- Pomoc dla właściwości alignment 203
- Obramowanie 204
- Kolory kontekstowe 206
- Marginesy i wypełnienie 207
- Opływanie (floating) 211
- Przytwierdzanie 211
- Przełączanie widoczności 212
- Wyrównanie tekstu i przekształcenia 213
- Podświetlanie tekstu 214
- Zmniejszanie rozmiaru tekstu 215
- Listy 215
- Listy bez stylu 215
- Listy inline 216
- Szerokość i wysokość 217
- Kod 218
- Sub i Sup 219
- Formatowanie danych wprowadzanych przez użytkownika 219
- Formatowanie danych wyjściowych użytkownika 220
- Clearfix 220
- Podsumowanie 220
Rozdział 9. Listy i akordeony 221
- Grupy list 221
- Wchodzenie w interakcję z elementami listy 222
- Stosowanie plakietek 223
- Stosowanie klas kontekstowych 224
- Ukrywanie treści 225
- Podsumowanie 228
Rozdział 10. Optymalizowanie strony 229
- Optymalizacja CSS-u 230
- Style inline 230
- Długie identyfikatory i nazwy klas 231
- Zasady skracania 234
- Selektory grupujące 234
- Czas renderowania 235
- Minifikacja CSS-u i JavaScriptu 236
- Przedstawiamy Grunta 236
- Minifikacja i konkatenacja z Gruntem 238
- Automatyczne uruchamianie zadań 240
- Wyrzucanie nieużywanego CSS-u ze strony 242
- Przetwarzanie HTML-a 244
- Ustawianie zasobów 247
- Pozbywanie się komentarzy CSS-u 248
- Konkatenacja plików JavaScriptu 249
- Podsumowanie 250
Rozdział 11. Integrowanie z AngularJS i Reactem 251
- Poznajemy AngularJS 252
- Przygotowanie AngularJS 252
- Poprawianie komponentu referencji 253
- Uczynienie referencji dynamicznymi 254
- Tworzenie Promise z $q 256
- Tworzenie dyrektywy AngularJS 257
- Pisanie szablonu referencji 259
- Testowanie dyrektywy testimonial 260
- Importowanie biblioteki Salvattore 261
- Poznajemy Reacta 262
- Ustawianie Reacta 262
- Galeria w bibliotece React 264
- Wykorzystanie karuzeli 267
- Podsumowanie 271
