CSS -- Refaktoryzacja kodu

Table of contents

1. Przedmowa
   1. Dla kogo jest ta książka
   2. Cele tej książki
   3. Czego nie ma w tej książce
   4. Terminologia
   5. Korzystanie z przykładów kodu
   6. Konwencje zastosowane w tej książce
   7. Podziękowania
2. Rozdział 1. Refaktoryzacja a architektura
   1. Czym jest refaktoryzacja?
   2. Co to jest architektura oprogramowania?
      1. Dobre architektury są przewidywalne
      2. Dobre architektury promują ponowne wykorzystanie kodu
      3. Dobre architektury są rozszerzalne
      4. Dobre architektury są łatwe w utrzymywaniu
      5. Architektura oprogramowania a refaktoryzacja
   3. Braki, które prowadzą do refaktoryzacji
      1. Zmieniające się wymagania
      2. Źle zaprojektowana architektura
      3. Niedoszacowanie poziomu trudności
      4. Ignorowanie najlepszych praktyk
   4. Kiedy należy refaktoryzować kod?
   5. Kiedy NIE należy refaktoryzować kodu?
   6. Czy mogę refaktoryzować swój kod?
   7. Przykłady refaktoryzacji
      1. Refaktoryzacja. Przykład 1. Obliczanie całkowitej wartości zamówienia e-commerce
         1. Testy jednostkowe
         2. Refaktoryzacja funkcji getOrderTotal
      2. Refaktoryzacja. Przykład 2. Prosty przykład refaktoryzacji kodu CSS
         1. Refaktoryzacja nagłówka strony internetowej
   8. Podsumowanie rozdziału
3. Rozdział 2. Kaskada
   1. Czym jest kaskada?
   2. Szczegółowość selektorów
   3. Kolejność zestawów reguł
   4. Lokalny CSS a szczegółowość
   5. Nadpisywanie kaskady za pomocą deklaracji !important
   6. Podsumowanie rozdziału
4. Rozdział 3. Pisanie lepszego CSS
   1. Używaj komentarzy
   2. Konsekwentnie organizuj zestawy reguł
      1. Organizuj właściwości według prefiksu dostawcy
   3. Zachowuj prostotę selektorów
      1. Wydajne selektory
         1. Dopasowywanie selektorów od prawej do lewej
         2. Selektor główny
   4. Rozdzielanie kodu CSS i JavaScript
      1. Poprzedzaj prefiksem klasy i identyfikatory, które są używane w JavaScripcie
      2. Modyfikuj style elementów za pomocą klas
   5. Używaj klas
   6. Przypisuj klasom znaczące nazwy
      1. Unikaj zbytniego modularyzowania klas
   7. Buduj lepsze pola
      1. box-sizing: content-box
      2. box-sizing: border-box
      3. content-box czy border-box?
   8. Podsumowanie rozdziału
5. Rozdział 4. Klasyfikowanie różnych rodzajów stylów
   1. Znaczenie klasyfikowania stylów
   2. Style standaryzujące
   3. Style podstawowe
      1. Definiowanie stylów podstawowych
      2. Metadane dokumentu
      3. Elementy sekcji
      4. Nagłówki i elementy tekstowe
      5. Znaczniki kotwicy
      6. Semantyka tekstu
      7. Listy
      8. Elementy grupowania
      9. Tabele
      10. Formularze
      11. Obrazy
   4. Style komponentów
      1. Definiowanie zachowania, które trzeba zbudować
      2. Zachowywanie ziarnistości stylów komponentu
      3. Nadpisywanie w razie potrzeby stylów wizualnych przez kontener komponentu
      4. Delegowanie przypisywania wymiarów do kontenerów strukturalnych
   5. Style strukturalne
   6. Style narzędziowe
   7. Style charakterystyczne dla przeglądarek
   8. Podsumowanie rozdziału
6. Rozdział 5. Testowanie
   1. Dlaczego testowanie jest trudne?
   2. Które przeglądarki należy testować?
   3. Udział przeglądarek w rynku
      1. Uzyskiwanie dostępu do statystyk przeglądarek i rozdzielczości ekranu w Google Analytics
         1. Informacje na temat przeglądarek
         2. Rozdzielczości ekranu
   4. Testowanie z wieloma przeglądarkami
      1. Safari dla iOS
      2. Android
   5. Testowanie ze starszymi wersjami przeglądarek
      1. Internet Explorer i Microsoft Edge
      2. Firefox
      3. Safari oraz Safari dla iOS
      4. Chrome
   6. Testowanie najnowszych technologii
   7. Zewnętrzne usługi testowania
   8. Testowanie za pomocą narzędzi dla programistów
      1. Emulacja rozmiarów urządzenia
      2. Obiektowy model dokumentu (DOM) a style CSS
   9. Wizualne testy regresji
      1. Wskazówki dotyczące przeprowadzania wizualnych testów regresji
      2. Wizualne testy regresji z Gemini
         1. Konfiguracja
         2. Testy
         3. Gromadzenie obrazów bazowych
         4. Testowanie regresji
   10. Utrzymywanie kodu
       1. Standardy kodowania
          1. Przykładowe standardy kodowania
       2. Biblioteki wzorców
          1. Korzyści
          2. Budowanie biblioteki wzorców
   11. Podsumowanie rozdziału
7. Rozdział 6. Umieszczanie kodu i strategie refaktoryzacji
   1. Organizowanie kodu CSS od najmniej do najbardziej szczegółowych stylów
      1. Style standaryzujące
      2. Style podstawowe
      3. Style dla komponentów i ich kontenerów
      4. Style strukturalne
      5. Style narzędziowe
      6. Style charakterystyczne dla przeglądarek
   2. Wiele plików czy jeden duży plik?
      1. Serwowanie kodu CSS
      2. Programowanie w pojedynczym pliku
      3. Programowanie w wielu plikach
   3. Badanie kodu CSS przed refaktoryzacją
   4. Strategie refaktoryzacji
      1. Konsekwentnie organizuj zestawy reguł
      2. Usuwaj martwy kod
      3. Oddzielaj kod CSS i JavaScript
      4. Oddzielaj style podstawowe
      5. Usuwaj niepotrzebne identyfikatory
      6. Konwertuj identyfikatory na klasy
      7. Oddzielaj style narzędziowe
      8. Definiuj komponenty wielokrotnego użytku
      9. Usuwaj lokalny kod CSS i nadmiernie zmodularyzowane klasy
      10. Segreguj sztuczki CSS charakterystyczne dla przeglądarek
   5. Mierzenie sukcesu
      1. Czy Twoja strona internetowa jest uszkodzona?
         1. Niska zależność oprogramowania
         2. Niskie szczegółowości
         3. Mniejsza liczba plików i mniejsze rozmiary plików
      2. Liczba błędów interfejsu użytkownika
      3. Skrócony czas rozwoju oprogramowania oraz testowania
   6. Podsumowanie rozdziału
8. Dodatek A Plik normalize.css
   1. O autorze
   2. Kolofon