Курс React, Redux - практический интерфейс 12 часов

Tytuł - Kurs React, Redux - praktyczny frontend

Dowiedz się jak stworzyć aplikację przy użyciu Reacta i Reduxa. Nadaj jej wygląd z material-ui oraz zintegruj ją z firebase.

• Czas trwania - 12 godziny 8 minut
• Poziom: średnio zaawansowany
• Data wydania: 07.04.2020
• Wersja programu: React, Redux 2020r

Czego się nauczysz ?

Kurs frontendowy, na którym będziesz realizować praktyczny projekt aplikacji, wykorzystującej najpopularniejsze technologie frontendowe. Podstawą aplikacji będzie użycie Reduxa oraz Reacta wraz z material-ui. Do zapytań http wykorzystana zostanie biblioteka Axios, a baza danych zostanie obsłużona przez Firebase. W kursie zaprojektujesz książkę kucharską, gdzie można będzie przeglądać i dodawać przepisy. Tworzona aplikacja opiera się o system logowania i autoryzacji, możliwość dodawania i edycję własnych przepisów, tworzenia list przepisów oraz walidację danych.

• utworzysz aplikację w React i Redux

• dowiesz się co to są snipety

• jak nadać wygląd dzięki material-ui

• wykorzystasz midlleware w Reduxie

• wdrożysz komponenty

• poznasz hooki w React

• wykorzystasz firebase

• obsłużysz stany aplikacji

• utworzysz zapytania http w axios i fetch

• wykryjesz błędy

• utworzysz logikę logowania

• dodasz uwierzytelniane użytkownika

Szybki wstęp

Celem kursu jest pokazanie jak wykorzystać teoretyczną wiedzę i przełożyć ją na praktykę. Podczas 12 godzin szkolenia zobaczysz jak programista pracuje nad aplikacją tworząc ją od zera. Zaczniesz od instalacji wszystkich paczek i utworzenia struktury folderów. Następnie przejdziesz przez szybkie przypomnienie jak wdrażać elementy material-ui. Autor kursu przypomni Ci również jak wdrożyć bibliotekę axios, czym jest middleware w Reduxie i jak obsłużyć Firebase.  Musisz jednak pamiętać, że do obsługi kursu powinieneś znać podstawy Reduxa oraz Reacta.

Różne typy projektów

W kursie stworzysz kilka, różnych projektów, dzięki czemu poznasz wszystkie narzędzia i możliwości pracy z programem. Utworzysz scenę w stylu low polly, statyczny model mockupu, wizualizację pokoju oraz animację z użyciem symulacji i efektów cząsteczkowych. Projekty są bardzo użyteczne i pozwolą Ci poznać większość najważniejszych technik pracy. Do kursu dołączone są wszystkie niezbędne pliki z projektami.

Komponenty aplikacji

W kursie nauczysz się dodawać przeróżne komponenty jak snackbary, scroll to top, circural progress, sidebar, filtracje, system rejestracji i logowania. Utworzysz formularz, który opiera się o różnego rodzaju pola, reagujące na błędy i wprowadzone dane. Zdefiniujesz jak mają zachowywać się pola formularza w zależności od wprowadzonych danych. Po drodze poradzisz sobie z popularnymi błędami oraz zadbasz o wizualną stronę formularza. Przy wdrażaniu komponentów funkcyjnych pomogą Ci hooki Reacta.

Baza danych

Dzięki bazie danych Twoja aplikacja będzie mogła obsłużyć dodawanie i edycję przepisów. Do obsługi aplikacji niezbędna jest baza danych, która w kursie oparta jest o firebase. Dzięki temu Twoja aplikacja będzie mogła obsłużyć system logowania i rejestracji użytkowników. Dodasz również autoryzację, co pozwoli Ci wyświetlić elementy aplikacji dla poszczególnych użytkowników. Dowiesz się jak tworzyć zapytania http z poziomu kodu, w czym pomoże Ci znajomość axios oraz fetch.

1. Wstęp

2. Instalowanie paczek i struktura folderów

3. Dodatek Material-UI

4. Zmiana podstawowych kolorów w MUI

5. Full screen circural progress

6. Dodatek redux-thunk

7. Snackbary

8. Scroll to top button

9. Dodatek_ hooki

10. Nawigacja – Drawer

11. Nawigacja – routing

12. Dodawanie przepisu wstęp i pierwszy input

13. Dodawanie przepisu pozostałe inputy

14. Dodawanie przepisu składniki cz. 1

15. Dodawanie przepisu składniki cz.2

16. Dodawanie przepisu generowanie formularza

17. Firebase – stworzenie bazy

18. Dodatek zapytania fetch i axios

19. Dodawanie przepisu zapis w bazie

20. Wyświetlanie przepisów pobieranie z bazy

21. Wyświetlanie przepisów lista

22. Dodawanie przepisów pojedynczy przepis cz.1

23. Wyświetlanie przepisów pojedynczy przepis cz.2

24. Usuwanie przepisu

25. Edycja przepisu cz.1

26. Edycja przepisu cz.2

27. Filtrowanie przepisów cz.1

28. Filtrowanie przepisów cz.2

29. Filtrowanie przepisów cz.3

30 Logowanie formularz logowania

31. Logowanie formularz do przypomnienia hasła

32. Logowanie formularz rejestracji

33. Logowanie konfiguracja firebase

34. Logowanie rejestracja

35. Logowanie logika logowania

36. Logowanie reset hasła

37. Logowanie auto logowanie

38. Autoryzowane requesty

39. Przypisywanie przepisów do danego użytkownika

Sposób wyboru wersji kursu:

Kurs wideo dostępny jest w dwóch formach, w zależności jaką wysyłkę wybierzesz:

1. elektronicznej - jako link do pobrania spakowanego archiwum. Otrzymasz po zakupie link na maila. W tym wypadku wybierz z opcji wysyłki - elektroniczna 0 zł.

2. pudełkowej na DVD - zamiast linku do pobrania otrzymasz pod wskazany adres płytę DVD. W tym wypadku wybierz opcję wysyłki paczkomaty lub kuriera.

Czy kurs będzie pasował do programu, który posiadam ?

Kursy tworzone są na różnych wersjach programu. Jednak w większości przypadków pasują do każdej wersji. Kursy tworzone są w taki sposób, by pasowały i były neutralne na starszych wersjach oprogramowania. Czyli jeśli posiadasz np. Photoshopa z roku 2019, a kurs jest tworzony na wersji Photoshopa 2020, będzie on pasował w 100%.

Czy z kursem otrzymam program?

Kursy to filmiki wideo pokazujące pracę w danym programie. Do żadnego z kursów nie jest dołączony program, w który należy zaopatrzyć się we własnym zakresie.