TypeScript – nauka

Dlaczego to ważne: TypeScript nie jest uruchamiany bezpośrednio przez przeglądarki; wymaga kompilatora (tsc), który zamieni kod na JavaScript.

Jak to zrobić:

• Pobierz i zainstaluj środowisko wykonawcze Node.js (wersja LTS).
• Otwórz terminal i wpisz npm install -g typescript, aby zainstalować kompilator globalnie.
• Sprawdź poprawność instalacji komendą tsc -v.

Warunek zakończenia: Terminal poprawnie wyświetla wersję kompilatora tsc.

Dlaczego to ważne: Plik ten definiuje zasady, według których TypeScript sprawdza Twój kod. Ustawienie 'strict: true' jest kluczowe dla pełnego bezpieczeństwa typów.

Jak to zrobić:

• W folderze projektu wykonaj komendę tsc --init.
• Otwórz plik i upewnij się, że opcje "strict": true, "target": "ES2022" oraz "module": "NodeNext" są aktywne.
• Skonfiguruj "outDir": "./dist", aby oddzielić pliki wynikowe JS od źródłowych TS.

Warunek zakończenia: Plik tsconfig.json istnieje i zawiera aktywne reguły trybu ścisłego.

Dlaczego to ważne: W JS zmienna może zmienić typ w locie, co prowadzi do błędów. TS pozwala to zablokować lub kontrolować.

Jak to zrobić:

• Zadeklaruj zmienne używając typów: string, number, boolean.
• Użyj 'Union Types' (np. let id: string | number), aby pozwolić na więcej niż jeden typ.
• Unikaj typu any – zamiast niego używaj unknown, jeśli nie znasz typu danych wejściowych.

Warunek zakończenia: Napisanie skryptu, w którym próba przypisania błędnego typu powoduje błąd kompilacji.

Dlaczego to ważne: Interfejsy pozwalają opisać kształt obiektów, co jest fundamentem pracy z API i złożonymi danymi.

HowLabel:

• Stwórz interface User z polami wymaganymi i opcjonalnymi (używając ?).
• Porównaj to z type Alias – używaj interfejsów dla obiektów (możliwość rozszerzania) i aliasów dla unii.
• Wykorzystaj readonly, aby zabezpieczyć pola przed nadpisaniem.

Warunek zakończenia: Stworzenie obiektu zgodnego z interfejsem, który zawiera co najmniej jedno pole opcjonalne.

Dlaczego to ważne: Generyki pozwalają tworzyć komponenty działające z różnymi typami przy zachowaniu pełnego bezpieczeństwa (np. funkcja parsująca odpowiedź z API).

Jak to zrobić:

• Napisz funkcję identity<T>(arg: T): T, która zwraca ten sam typ, który otrzymała.
• Stwórz interfejs generyczny dla odpowiedzi z serwera: interface Response<T> { data: T; error: string; }.
• Przetestuj funkcję przekazując różne typy danych (string, object).

Warunek zakończenia: Poprawne użycie funkcji generycznej z dwoma różnymi typami danych bez błędów TS.

Dlaczego to ważne: TypeScript oferuje wbudowane narzędzia do transformacji istniejących typów, co oszczędza czas i redukuje powtórzenia kodu.

Jak to zrobić:

• Użyj Partial<User>, aby stworzyć typ, w którym wszystkie pola interfejsu User są opcjonalne (przydatne przy update'ach).
• Użyj Pick<User, 'id' | 'email'>, aby stworzyć typ tylko z wybranymi polami.
• Użyj Omit, aby wykluczyć wrażliwe dane (np. hasło) z typu przesyłanego do frontendu.

Warunek zakończenia: Stworzenie trzech nowych typów na bazie jednego interfejsu przy użyciu Utility Types.

Dlaczego to ważne: Nauka migracji 'krok po kroku' pozwala na wprowadzanie TS do istniejących projektów bez ich blokowania.

Jak to zrobić:

• Zmień rozszerzenie pliku z .js na .ts.
• Napraw błędy zgłaszane przez kompilator, dodając typy do parametrów funkcji.
• Jeśli używasz bibliotek zewnętrznych, zainstaluj ich definicje typów komendą npm install @types/nazwa-biblioteki -D.

Warunek zakończenia: Plik .ts kompiluje się bez błędów przy włączonym trybie 'strict'.

Dlaczego to ważne: Praktyczne zastosowanie wiedzy utrwala nawyki typowania i pokazuje korzyści z autouzupełniania kodu.

Jak to zrobić:

• Stwórz klasę lub zestaw funkcji do zarządzania listą zadań (dodawanie, usuwanie, oznaczanie jako gotowe).
• Zdefiniuj typ Task z unikalnym ID (użyj crypto.randomUUID()).
• Dodaj obsługę błędów (np. próba usunięcia nieistniejącego zadania) z użyciem customowych typów błędów.

Warunek zakończenia: Działająca aplikacja konsolowa lub webowa w pełni otypowana.