JavaScript / TypeScript

Kurs jest przeznaczony dla osób, które mają podstawową wiedzę z HTML, CSS i chcą pójść krok dalej, ucząc się JavaScript oraz TypeScript – od podstaw po zaawansowane, komercyjne rozwiązania. Od początku stawiam na praktykę. Tworzysz realne aplikacje z wykorzystaniem HTML, CSS, JavaScript, TypeScript i Vite. Jeszcze przed wprowadzeniem React-a przygotujesz kilkanaście przykładowych interfejsów graficznych, które w dalszych etapach rozwiniesz, dodając kolejne funkcjonalności i potem dodasz kolejne aplikacje do swojego portfolio. Jeśli wcześniej uczyłeś się ze mną backend-u i tworzenia REST API, w tym kursie możesz kontynuować swoją ścieżkę i rozwijać się jako fullstack developer.

W tej sekcji poznasz zestaw narzędzi, z których będziemy korzystać do tworzenia nowoczesnych aplikacji w JavaScript i TypeScript. Dowiesz się, jak przebiegają kolejne etapy budowania programów w tych językach, oraz wybierzesz wygodne, nowoczesne środowisko IDE dopasowane do Twojej pracy. Zobacz pierwsze minuty naszej wspólnej nauki

• V8, Node
• Alternatywy Node (Deno, Bun)
• Etapy budowania programu napisanego w JavaScript (JIT, parsing, AST)
• Wersje JavaScript
• Porównanie JavaScript oraz TypeScript
• Przegląd IDE
• Przygotowanie środowiska programistycznego

W tej sekcji poznasz podstawy JavaScript – fundament, bez którego trudno rozpocząć tworzenie praktycznych aplikacji do swojego portfolio. To wprowadzenie przygotuje Cię do dalszej nauki, a omawiane tu zagadnienia będziemy pogłębiać w kolejnych modułach.

• Zmienne, stałe, literały, let, const
• Konwencje nazewnicze
• Typowanie dynamiczne
• Przegląd typów danych prostych i złożonych
• Liczby, Number
• Napisy
• Różnica między null oraz undefined
• Falsy, truthy
• Sprawdzanie rodzaju typu
• Operatory (arytmetyczne, logiczne, relacji, nullish coalescing, podwójna negacja, chaining, spread i inne)
• Math
• Instrukcje warunkowe, pętle, break, continue
• Wprowadzenie do obiektów (w tym do tablic)
• Konwersje pomiędzy obiektami różnych typów
• Kopiowanie płytki oraz głębokie
• Organizacja pamięci w aplikacji JavaScript
• Rzucanie i obsługa wyjątków

W tej sekcji poznasz narzędzia, które pozwolą Ci sprawnie budować i zarządzać strukturą projektu. Nauczysz się korzystać z npm, npx i Vite, aby usprawnić pracę i przyspieszyć proces tworzenia aplikacji. Jeśli zajdzie taka potrzeba, omówimy również Webpack. To właśnie tutaj przygotujesz szablon projektu, który posłuży jako baza dla Twoich pierwszych aplikacji w portfolio.

• npm, npx
• Vite
• Webpack (opcjonalnie)
• CommonJS, ESM
• Omówienie struktury projektu utworzonego za pomocą Vite
• Zarządzanie projektem utworzonym za pomocą Vite
• Instalacja i zarządzanie dependencies

W tej sekcji stworzysz swoje pierwsze projekty do portfolio. W pełni wykorzystamy dotychczas zdobytą wiedzę i rozpoczniemy pracę nad programami w konfiguracji JavaScript + HTML + CSS + Vite. Od samego początku pracujemy z DOM. Przykładowe aplikacje, które tutaj zrealizujemy, to: Kalkulator cen VAT   Panel rejestracji i logowania  Na bazie tych projektów, z moją pomocą, będziesz mógł tworzyć kolejne aplikacje. Od początku zadbam o to, aby Twoje portfolio było atrakcyjne i przyciągało uwagę potencjalnych pracodawców.

Najwyższa pora wprowadzić funkcje. Nasze programy stają się coraz bardziej rozbudowane, a funkcje pozwolą uporządkować kod i podzielić go na mniejsze, logiczne fragmenty. To podstawa każdej aplikacji – dzięki nim kod staje się czytelniejszy, łatwiejszy w utrzymaniu i możliwy do ponownego wykorzystania w innych częściach projektu.

• Function declaration
• Parametry / argumenty funkcji
• Function expression
• Anonymous function
• Arrow function
• IIFE

W tej sekcji stworzysz kolejne projekty do portfolio, w których wykorzystasz funkcje. Dodasz je również do wcześniej napisanych programów, aby uczynić kod jeszcze bardziej profesjonalnym. Przykładowa aplikacja, którą tutaj zrealizujemy, to: Walidacja formularza Na bazie tych projektów, z moją pomocą, będziesz mógł tworzyć kolejne aplikacje i rozwijać swoje portfolio.

Znasz już podstawy JavaScript i potrafisz wykorzystywać go w swoich projektach. To idealny moment, aby wprowadzić TypeScript i równolegle z zagadnieniami JavaScript pokazywać jego możliwości. Od tej chwili będziesz używać TypeScript także w swoich projektach, co sprawi, że Twoje portfolio stanie się jeszcze bardziej wartościowe i profesjonalne.

• Dlaczego używamy TypeScript?
• Konfiguracja projektu Vite + TypeScript
• Plik tsconfig.json
• Etapy kompilacji TypeScript
• Typowanie statyczne
• Wykaz podstawowych typów
• Określanie typu obiektów
• Typ any
• Tuple
• Unie
• Określanie typu parametrów i typu zwracanego funkcji
• Budowanie typów złożonych za pomocą type
• Utility types
• Enum, as const, enum as const
• Typy unknown, never
• Typy intersekcyjne
• Type guards
• Function overloads

W tej sekcji stworzysz kolejne projekty do portfolio, w których wykorzystasz TypeScript. Przykładowe aplikacje, które tutaj zrealizujemy, to: Quiz  Konwerter jednostek Na bazie tych projektów, z moją pomocą, będziesz mógł tworzyć kolejne aplikacje i rozwijać swoje portfolio.

W tej sekcji kontynuujemy temat funkcji, poznając wzorce, które wykorzystują ich możliwości do tworzenia czytelniejszego i lepiej zorganizowanego kodu. 

• Factory function
• Closures
• Constructor function

W tej sekcji stworzysz kolejne projekty do portfolio, w których wykorzystasz TypeScript i funkcje. Przykładowa aplikacja, którą tutaj zrealizujemy, to: Generator haseł Na bazie tych projektów, z moją pomocą, będziesz mógł tworzyć kolejne aplikacje i rozwijać swoje portfolio.

W tej sekcji szczegółowo omówimy tablice. Poznałeś je i używałeś już wcześniej, jednak teraz sięgniemy po pełen zakres możliwości, jakie JavaScript oferuje w pracy z tablicami.

• Klasa Array
• Sposoby tworzenia tablic
• Dostęp do elementów tablic
• Filtrowanie
• Mapowanie
• Sortowanie
• Grupowanie
• Redukcja
• Przegląd pozostałych operacji na tablicach
• Tablice wielowymiarowe
• Klasa String
• Właściwości napisów
• Różne rodzaje napisów – wielowierszowe, raw strings
• Sposoby tworzenia napisów
• Kodowanie napisów
• Zarządzanie napisem jako tablicą znaków
• Porównywanie napisów
• Parsowanie
• Wyrażenia regularne
• Wykorzystanie wyrażeń regularnych podczas pracy z napisami