Ten kurs uczy React od pierwszego uruchomienia do tworzenia praktycznych funkcji w aplikacji. Zaczynasz od przygotowania środowiska i instalacji startowego projektu przez npx. Następnie przechodzisz przez wyświetlanie danych, komponenty funkcyjne i propsy, obsługę zdarzeń oraz formularzy. Poznasz stan z Hookiem useState, skrócony zapis warunku, stylowanie w CSS, Bootstrap i Material UI, a także nawigację, parametry i pracę z API. Całość domykają projekty.

Start: środowisko i pierwsza aplikacja

Na początku przygotujesz środowisko pracy. Krok po kroku zobaczysz, jak zainstalować startową aplikację przy pomocy npx. Następnie zajmiesz się danymi: nauczysz się wyświetlać wartości przechowywane w zmiennych i stałych, a także elementy z tablic oraz pola obiektów. Dzięki tym ćwiczeniom poznasz sposób, w jaki React pokazuje informacje w interfejsie i jak budować prosty widok oparty o dostępne dane. To solidny fundament do kolejnych tematów kursu.

Komponenty i propsy w praktyce

Kolejny etap to tworzenie komponentów funkcyjnych, z których zbudujesz czytelne części interfejsu. Poznasz propsy i zobaczysz, jak za ich pomocą przekazywać informacje między komponentami, w tym przekazywać dane z komponentu dziecka do komponentu rodzica. Będziesz także obsługiwać zdarzenia, na przykład kliknięcia, tak aby elementy reagowały na działania użytkownika. Dzięki temu zrozumiesz, jak porządkować strukturę aplikacji i łączyć komponenty w spójny układ.

Formularze, stan i warunkowe widoki

W kursie zbierzesz dane z pól tekstowych oraz całych formularzy. Nauczysz się poprawnie odczytywać wprowadzone wartości i dalej je wykorzystywać w logice aplikacji. Do przechowywania informacji posłuży Hook useState, dzięki któremu ustawisz i zaktualizujesz stan komponentu. Zobaczysz też skrócony zapis warunku logicznego, który upraszcza renderowanie elementów tylko wtedy, gdy spełnione są określone warunki. Te techniki pozwolą przygotować interfejs reagujący na dane użytkownika.

Wygląd aplikacji: CSS, Bootstrap i Material UI

Zmiana wyglądu aplikacji to ważny element pracy z React. W trakcie zajęć zmodyfikujesz styl za pomocą stylów CSS, a także skorzystasz z gotowych rozwiązań dostępnych w bibliotece Bootstrap oraz Material UI. Zobaczysz, jak szybko nadawać elementom spójny wygląd i budować estetyczne układy, wykorzystując klasy i komponenty dostarczane przez te narzędzia. Materiał pokazuje, jak łączyć te podejścia, aby w prosty sposób dopasować kolorystykę, odstępy i typografię do potrzeb ekranu. Dzięki temu widoki zyskają przejrzystość.

Nawigacja i praca z API

Poznasz nawigację w aplikacji z użyciem React Router Dom. Nauczysz się przygotowywać ścieżki, realizować przekierowania z pomocą Link oraz useNavigate i przekazywać parametry w adresie URL dzięki useParams. Następnie połączysz interfejs z zewnętrznym źródłem danych: zobaczysz, jak komunikować się z API przy pomocy axios. Przećwiczysz wysyłanie zapytań i obsługę błędów, aby reagować na różne odpowiedzi serwera. Zdobytą wiedzę wykorzystasz w praktycznych projektach kończących kurs, które spinają razem nawigację, formularze, stan i pracę z danymi.