VUE.JS W AKCJI

53.10

Na stanie

SPIS TREŚCI

Słowo wstępne 9

Przedmowa 11

Podziękowania 13

O książce 15

O autorze 19

CZĘŚĆ 1. POZNAJEMY VUE.JS 21

Rozdział 1. Wprowadzenie do Vue.js 23

  • 1.1. Na ramionach giganta 24
    • 1.1.1. Wzorzec projektowy Model-Widok-Kontroler 24
    • 1.1.2. Wzorzec Model-Widok-ModelWidoku 26
    • 1.1.3. Czym są aplikacje reaktywne? 27
    • 1.1.4. Kalkulator JavaScript 28
    • 1.1.5. Kalkulator w wersji Vue 30
    • 1.1.6. Porównanie wersji JavaScript i Vue 31
    • 1.1.7. W jaki sposób Vue ułatwia użycie wzorca MVVM oraz zapewnienie reaktywności? 32
  • 1.2. Dlaczego Vue.js? 33
  • 1.3. Dalsze przemyślenia 35
  • Podsumowanie 36

Rozdział 2. Instancja Vue 37

  • 2.1. Nasza pierwsza aplikacja 38
    • 2.1.1. Główna instancja Vue 38
    • 2.1.2. Jak się upewnić, że aplikacja działa? 40
    • 2.1.3. Wyświetlanie czegoś w widoku 43
    • 2.1.4. Sprawdzanie właściwości w przeglądarce 44
  • 2.2. Cykl życia Vue 45
    • 2.2.1. Dodawanie funkcji obsługi cyklu życia 47
    • 2.2.2. Badanie kodu demonstrującego cykl życia 48
    • 2.2.3. Czy zostawiać kod funkcji zwrotnych cyklu życia, czy nie? 49
  • 2.3. Wyświetlanie produktu 50
    • 2.3.1. Definiowanie danych produktu 50
    • 2.3.2. Przygotowywanie widoku produktu 51
  • 2.4. Stosowanie filtrów wyjścia 54
    • 2.4.1. Pisanie filtra wyjścia 55
    • 2.4.2. Dodawanie filtra do kodu i testowanie różnych wartości 56
  • Ćwiczenie 57
  • Podsumowanie 58

CZĘŚĆ 2. WIDOK I MODEL WIDOKU 59

Rozdział 3. Dodawanie interaktywności 61

  • 3.1. Początkiem danych koszyka jest dodanie tablicy 62
  • 3.2. Powiązania ze zdarzeniami DOM 63
    • 3.2.1. Podstawy dowiązywania zdarzeń 63
    • 3.2.2. Powiązanie zdarzenia z przyciskiem Dodaj do koszyka 64
  • 3.3. Dodanie przycisku koszyka i liczby produktów 65
    • 3.3.1. Kiedy stosować właściwości obliczane? 66
    • 3.3.2. Sprawdzanie zdarzeń aktualizacji w przypadku stosowania właściwości obliczanych 68
    • 3.3.3. Wyświetlanie liczby produktów w koszyku i testowanie 71
  • 3.4. Dodawanie afordancji do przycisku 74
    • 3.4.1. Śledzenie stanu magazynu 75
    • 3.4.2. Praca z właściwościami obliczanymi i stanem magazynu 76
    • 3.4.3. Podstawy dyrektywy v-show 77
    • 3.4.4. Stosowanie dyrektyw v-if oraz v-else w celu wyświetlania nieaktywnego przycisku 78
    • 3.4.5. Dodanie przycisku koszyka działającego jako przełącznik 80
    • 3.4.6. Użycie dyrektywy v-if do wyświetlania formularza zamówienia 81
    • 3.4.7. Porównanie dyrektyw v-show oraz v-if i v-else 83
  • Ćwiczenie 84
  • Podsumowanie 84

Rozdział 4. Formularze i pola 85

  • 4.1. Stosowanie powiązań v-model 86
  • 4.2. Rzut oka na powiązania wartości 94
    • 4.2.1. Powiązanie wartości z polem wyboru 94
    • 4.2.2. Stosowanie powiązań danych i przycisków opcji 96
    • 4.2.3. Przedstawienie dyrektywy v-for 97
    • 4.2.4. Dyrektywa v-for bez opcjonalnych kluczy 100
  • 4.3. Prezentacja modyfikatorów 101
    • 4.3.1. Stosowanie modyfikatora .number 101
    • 4.3.2. Usuwanie odstępów z wpisanych wartości 103
    • 4.3.3. Modyfikator .lazy dyrektywy v-model 104
  • Ćwiczenie 105
  • Podsumowanie 105

Rozdział 5. Dyrektywy warunkowe, pętle i listy 107

  • 5.1. Wyświetlanie komunikatu o stanie magazynu 108
    • 5.1.1. Wyświetlanie dostępnych egzemplarzy przy użyciu v-if 108
    • 5.1.2. Dodawanie innych komunikatów z użyciem dyrektyw v-else oraz v-else-if 110
  • 5.2. Przeglądanie listy produktów 112
    • 5.2.1. Dodawanie oceny przy użyciu zakresu dyrektywy v-for 112
    • 5.2.2. Powiązanie klasy elementu HTML z oceną produktu 114
    • 5.2.3. Dodanie produktów 117
    • 5.2.4. Importowanie produktów z pliku products.json 119
    • 5.2.5. Refaktoryzacja kodu aplikacji i dodanie dyrektywy v-for 120
  • 5.3. Sortowanie rekordów 126
  • Ćwiczenie 127
  • Podsumowanie 127

Rozdział 6. Stosowanie komponentów 129

  • 6.1. Czym są komponenty? 130
    • 6.1.1. Tworzenie komponentów 130
    • 6.1.2. Rejestracja globalna 131
    • 6.1.3. Rejestracja lokalna 132
  • 6.2. Zależności w komponentach 133
  • 6.3. Stosowanie właściwości props do przekazywania danych 135
    • 6.3.1. Właściwości literałowe 135
    • 6.3.2. Dynamiczne właściwości props 136
    • 6.3.3. Walidacja właściwości props 139
  • 6.4. Definiowanie szablonu komponentu 142
    • 6.4.1. Stosowanie wpisanych łańcuchów szablonów 142
    • 6.4.2. Element script typu text/x-template 143
    • 6.4.3. Komponenty jednoplikowe 144
  • 6.5. Stosowanie zdarzeń niestandardowych 145
    • 6.5.1. Nasłuchiwanie zdarzeń 146
    • 6.5.2. Modyfikowanie właściwości przy użyciu .sync 148
  • Ćwiczenie 149
  • Podsumowanie 149

Rozdział 7. Zaawansowane zastosowania komponentów i trasowanie 151

  • 7.1. Stosowanie gniazd 152
  • 7.2. Rzut oka na gniazda nazwane 155
  • 7.3. Gniazda z zasięgiem 157
  • 7.4. Tworzenie aplikacji z komponentami dynamicznymi 159
  • 7.5. Tworzenie komponentów asynchronicznych 162
  • 7.6. Konwersja aplikacji składu dla zwierzaków z użyciem Vue-CLI 163
    • 7.6.1. Tworzenie nowej aplikacji przy użyciu Vue-CLI 165
    • 7.6.2. Konfigurowanie tras 166
    • 7.6.3. Dodanie stylów CSS, Bootstrapa i biblioteki Axios 168
    • 7.6.4. Przygotowanie komponentów 170
    • 7.6.5. Tworzenie komponentu Form 172
    • 7.6.6. Dodanie komponentu Main 173
  • 7.7. Stosowanie tras 176
    • 7.7.1. Dodanie trasy produktu z parametrami 176
    • 7.7.2. Konfiguracja router-link z użyciem znaczników 180
    • 7.7.3. Określanie stylów z użyciem komponentu router-link 182
    • 7.7.4. Dodanie trasy podrzędnej edit 183
    • 7.7.5. Stosowanie przekierowań i znaków wieloznacznych 185
  • Ćwiczenie 187
  • Podsumowanie 187

Rozdział 8. Efekty przejść i animacje 189

  • 8.1. Podstawy efektów przejść 189
  • 8.2. Podstawy animacji 194
  • 8.3. Funkcje zwrotne animacji 196
  • 8.4. Efekty przejść dla komponentów 199
  • 8.5. Aktualizacja aplikacji składu dla zwierzaków 202
    • 8.5.1. Dodawanie efektu przejścia do aplikacji sklepu dla zwierzaków 202
    • 8.5.2. Dodawanie animacji do aplikacji składu dla zwierzaków 204
  • Ćwiczenie 206
  • Podsumowanie 206

Rozdział 9. Rozszerzanie Vue 207

  • 9.1. Wielokrotne stosowanie możliwości funkcjonalnych dzięki wstawkom 208
    • 9.1.1. Wstawki globalne 212
  • 9.2. Poznawanie dyrektyw niestandardowych na przykładach 213
    • 9.2.1. Globalne dyrektywy niestandardowe z modyfikatorami, wartościami i argumentami 216
  • 9.3. Funkcje renderujące i JSX 219
    • 9.3.1. Przykład funkcji renderującej 220
    • 9.3.2. Przykład JSX 223
  • Ćwiczenie 227
  • Podsumowanie 228

CZĘŚĆ 3. MODELOWANIE DANYCH, KORZYSTANIE Z API I TESTOWANIE 229

Rozdział 10. Vuex 231

  • 10.1. Biblioteka Vuex – do czego może się przydać? 232
  • 10.2. Stan i modyfikacje w bibliotece Vuex 233
  • 10.3. Akcesory get i akcje 237
  • 10.4. Dodawanie Vuex do aplikacji Vue-CLI na przykładzie składu dla zwierzaków 240
    • 10.4.1. Instalacja Vuex w aplikacji Vue-CLI 240
  • 10.5. Metody pomocnicze Vuex 244
  • 10.6. Krótka prezentacja modułów 247
  • Ćwiczenie 249
  • Podsumowanie 249

Rozdział 11. Komunikacja z serwerem 251

  • 11.1. Renderowanie po stronie serwera 252
  • 11.2. Wprowadzenie do Nuxt.js 253
    • 11.2.1. Tworzenie aplikacji do wyszukiwania muzyki 254
    • 11.2.2. Tworzenie projektu i zainstalowanie zależności 257
    • 11.2.3. Tworzenie elementów aplikacji i komponentów 260
    • 11.2.4. Aktualizacja domyślnego układu 263
    • 11.2.5. Dodanie magazynu Vuex 264
    • 11.2.6. Stosowanie oprogramowania warstwy pośredniej 264
    • 11.2.7. Generowanie tras w Nuxt.js 266
  • 11.3. Komunikacja z serwerem na przykładzie Firebase i VuexFire 270
    • 11.3.1. Konfiguracja Firebase 271
    • 11.3.2. Konfigurowanie aplikacji składu dla zwierzaków do korzystania z Firebase 274
    • 11.3.3. Przechowywanie stanu uwierzytelniania w magazynie Vuex 277
    • 11.3.4. Uzupełnienie komponentu nagłówka o informacje uwierzytelniające 278
    • 11.3.5. Modyfikacja Main.vue i zastosowanie w nim bazy danych Firebase 282
  • Ćwiczenie 283
  • Podsumowanie 283

Rozdział 12. Testowanie 285

  • 12.1. Tworzenie przypadków testowych 286
  • 12.2. Ciągła integracja, dostarczanie i wdrażanie 287
    • 12.2.1. Integracja ciągła 287
    • 12.2.2. Dostarczanie ciągłe 288
    • 12.2.3. Wdrażanie ciągłe 289
  • 12.3. Rodzaje testów 289
  • 12.4. Przygotowywanie środowiska 290
  • 12.5. Pisanie pierwszego przypadku testowego z użyciem vue-test-utils 292
  • 12.6. Testowanie komponentów 296
    • 12.6.1. Testowanie właściwości props 296
    • 12.6.2. Testowanie tekstów 297
    • 12.6.3. Testowanie klas CSS 298
    • 12.6.4. Testowanie z użyciem atrapy Vuex 299
  • 12.7. Konfiguracja debuggera Chrome 301
  • Ćwiczenie 303
  • Podsumowanie 304

Dodatek A. Przygotowywanie środowiska 305

Dodatek B. Rozwiązania ćwiczeń 313

Autor

ISBN

978-83-283-5734-1

Liczba stron

Rok wydania

Wydawca

Opinie

Na razie nie ma opinii o produkcie.

Napisz pierwszą opinię o „VUE.JS W AKCJI”

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *