Kurs React

Wprowadzenie

Lekcje
  • Opis
  • Recenzje
  • Autor
  • Transkrypt

16 ocen

Lubię to! 336

Wprowadzenie

Od kilku lat React niepodzielnie króluje wśród frameworków JavaScript. Ogromna swoboda jaką daje, intuicyjny sposób tworzenia komponentów i potężny ekosystem wspierający developera niemal w każdej sytuacji, to niewątpliwie największe zalety tej technologii. W tym kursie dowiesz się, w jaki sposób wycisnąć w Reacta jak najwięcej. Odkryjesz jego prawdziwy potencjał i dogłębnie poznasz zagadnienia, które stanowią trzon tego frameworka. Aby zrozumieć rzeczy zaawansowane, należy solidnie opanować podstawy – w tym własnie chcę Ci pomóc.

  1. Doglebne wyjasnienie zasad rzadzacych Reactem
  2. Stworzenie aplikacji wykorzystujacej potencjal Reacta
  3. Wykorzystanie React Router i jego komponentów w praktyce
  4. Przygotowanie do pracy w nowych projektach i z legacy code
  5. Stworzenie struktury aplikacji w oparciu o najlepsze praktyki
  6. Rozwiazania pochodzace z prawdziwej pracy nad wieloma projektami

Wszystkie tresci podzielilem na piec rozdzialów, w których bedziemy rozwijac wymyslona przeze mnie aplikacje sluzaca do kolekcjonowania najciekawszych artykulów, notatek oraz kont twitterowych znalezionych w sieci.

Twoje pierwsze kroki w React

Zaczniemy od prostych widoków, na podstawie których wyjasnie Ci, co stoi u podstaw Reacta – dowiesz sie czym jest JSX, oraz poznasz pojecie komponentu funkcyjnego. Dzieki temu oswoisz sie ze skladnia Reacta, która poczatkowo moze wydawac sie nieco obca.

Witaj w swiecie komponentów

W React niemal wszystko opiera sie o komponenty. Czym one sa? Dowiesz sie tego w drugim rozdziale. Opowiem Ci jak je tworzyc oraz jak tworzyc relacje miedzy nimi. Wyjasnie Ci bardzo szczególowo jak dzialaja propsy oraz w jakich sytuacjach nalezy je wykorzystywac. Zobaczysz tez, jak w Reactcie pracujemy z danymi, jak mozemy je przetwarzac a nastepnie stosujac kilka strategii stylowania komponentów, wszystko wyswietlic w atrakcyjny sposób.

Komponenty z klasa

W trzecim rozdziale poznasz sposób konstruowania komponentów klasowych, posiadajacych wlasny stan, dzieki któremu stworzysz miedzy innymi dynamiczny, inteligentny formularz, a takze wiele innych interaktywnych elementów. Dzieki temu szybko zrozumiesz róznice miedzy komponentami funkcyjnymi a klasowymi.

Wytyczamy nowe sciezki

Kiedy juz poczujesz sie dosc pewnie budujac komponenty, dodamy tzw. routing w rozdziale czwartym, który pozwoli nam na stworzenie wielu podstron, które urozmaica nasza aplikacje – dowiesz sie dzieki temu jak integrowac dodatkowe narzedzie w naszym projekcie, oraz jak budowac bardziej skomplikowana strukture aplikacji.

Odkryj potencjal Reacta

Na sam koniec zostaimy sobie tzw. state managment, czyli zarzadzanie informacjami wspóldzielonymi przez wiele komponentów i podstron. Nie wykorzystamy jednak ani Reduxa ani Mobxa, poniewaz chce Ci pokazac, ze w samym Reactcie kryje sie ogromny potencjal nawet przy tak kompleksowych zadaniach. W tym przypadku uzyjemy Context API, który w latwy sposób pozwala nam teleportowac dane z jednego miejsca naszej aplikacji do drugiego. Podczas rozbudowywania naszej aplikacji o Context API dopracujemy tez wszystkie inne jej elementy, aby na samym koncu kursu wydeployowac nasz gotowy produkt w serwisie Netlify – zobaczysz, ze wypuszczenie aplikacji Reactowej do sieci i udostepnienie jej innym, jest niezwykle proste.

W tym kursie skupiamy sie wylacznie na Reactcie z uzyciem jedynie niezbednych narzedzi. Wierze, ze doskonale opanowanie fundamentów, na których opiera sie ta technologia pozwoli Ci pózniej latwiej wkroczyc w swiat setek pluginów i paczek dostepnych w jego ekoystemie.

Dla kogo jest ten kurs?

Ten kurs powstal z mysla o osobach chcacych zaczac swoja przygode z frameworkami JavaSript. Zaklada on wiedze na temat podstaw JavaScript (w tym ES6), jednak przy bardziej skomplikowanych rozwiazaniach zawsze pojawia sie slowo wyjasnienia. \n\nPoziom kursu zostal dopasowany do osób, które maja za soba juz kilka projektów w czystym JavaScript i chca wejsc na wyzszy poziom, przygotowujac sie tym samym do pracy z ta technologia.

Dlaczego wybrac wlasnie ten kurs?

  1. Kurs wideo to najbardziej efektywna a zarazem najprzyjemniejsza forma nauki. Jest on tak prowadzony, bys caly czas mógl go sledzic z zainteresowaniem i zaangazowaniem, a takze czerpac satysfakcje ze zdobytej wiedzy!
  2. Wiedza, która otrzymujesz w tym kursie, to nie tylko sucha teoria, ale równiez wskazówki od praktyka z wieloletnim doswiadczeniem, dzieki którym duzo latwiej bedzie Ci opanowac material.
  3. Uczysz sie na praktycznych przykladach. Kurs, który masz przed soba to esencja praktycznej wiedzy i doswiadczenia a takze wzorów, które oszczedza Ci godziny pracy i poszukiwan.
6 godzin

Kurs React
Techniki Zaawansowane

Higher Order Components, Render Props, Compound Components... React pełen jest wzorców i narzędzi, których nazwy potrafią przyprawić o ból głowy. Właśnie po to, by uniknąć tego przytłoczenia, został przygotowany ten kurs. Skupimy się w nim praktycznie wyłącznie na React'cie, który mimo że jest niepozorną biblioteką, to kryje w sobie ogromny potencjał i jeszcze większą swobodę działania dla developera. W dużych, komercyjnych aplikacjach wzorce, o których wspominamy, pojawiają się niesłychanie często, a ich poprawne zrozumienie to jedyna droga do tego, abyśmy nie czuli się nieswojo patrząc na nieco bardziej skomplikowany kod.

Adam Romanski

7 godzin

Kurs React
w Praktyce

Wiele materiałów dostępnych w sieci zawiera wskazówki jak używać Reacta, jednak brakuje im praktycznego wymiaru. Stosowanie tej technologii w prawdziwym projekcie nieco różni się od prostych przykładów, które na ogół możemy znaleźć. Tak powstał pomysł na kurs React w Praktyce, w którym dowiesz się, z jakich technologii React developerzy korzystają na co dzień, jak konfigurują projekty, jak radzą sobie z problemami zarówno wynikającymi ze skomplikowania interfejsu, jak i logiki biznesowej zawartej w aplikacji.

Adam Romanski

5 godzin

Kurs React
od Podstaw

Od kilku lat React niepodzielnie króluje wśród frameworków JavaScript. Ogromna swoboda jaką daje, intuicyjny sposób tworzenia komponentów i potężny ekosystem wspierający developera niemal w każdej sytuacji, to niewątpliwie największe zalety tej technologii. W tym kursie dowiesz się, w jaki sposób wycisnąć w Reacta jak najwięcej. Odkryjesz jego prawdziwy potencjał i dogłębnie poznasz zagadnienia, które stanowią trzon tego frameworka. Aby zrozumieć rzeczy zaawansowane, należy solidnie opanować podstawy – w tym własnie chcę Ci pomóc.

Adam Romanski

Autor: Adam Romanski

Frontend developer & YouTube Creator

Cześć! Nazywam się Adam Romański i sam siebie nazywam kreatywnym front-endowcem, ponieważ zanim dołączyłem do branży IT, wiele lat spędziłem pracując jako copywriter. Na co dzień pracuję w jednym z największych software house'ów w Polsce, realizując ambitne projekty dla zagranicznych klientów. Dzięki tej pracy zdobyłem sporo doświadczenia, którym chętnie się z Tobą dzielę. W moim przypadku pasja do uczenia innych przejawia się także w inny sposób. „Po godzinach” zajmuję się vlogiem Hello Roman na YouTube, który w kilka miesięcy zdobył prawdziwą rzeszę fanów. Możesz go odwiedzić klikając w ten link: https://youtube.com/helloroman Do tej pory zrealizowałem wiele projektów zarówno w React, Vue, Gatsby jak i innych technologiach, co pozwoliło mi nabrać pewności siebie a także poszerzyć nieco moje perspektywy. Liczę, że moje kursy dadzą Ci to samo! To dla mnie ogromne wyróżnienie, lecz także ogromna odpowiedzialność. Za pośrednictwem vloga opowiadam o moich przemyśleniach dotyczących programowania, branży IT, a także tworzę materiały z praktycznymi, technicznymi poradami. Do tej pory zrealizowałem wiele projektów zarówno w React, Vue, Gatsby jak i innych technologiach, co pozwoliło mi nabrać pewności siebie a także poszerzyć nieco moje perspektywy. Liczę, że moje kursy dadzą Ci to samo!

https://youtube.com/helloroman

Recenzje Kurs React

5

16 dodanych ocen

2019-02-06

Jeszcze nie kupiłem, ale jak zabrał się za to Adam Romański to musi być petarda :D

Anatol Orzęcki

2019-02-06

Naprawdę udostępniacie do podglądu "Czym jest JSX" a nie "Czym jest React". W każdym kursie właśnie taka lekcja powinna być do bezpłatnego obejrzenia.

Mariusz Jarosz

2019-02-06

Czy jest gdzieś możliwość podejrzenia finalnej aplikacji?

Przemysław Lewtak

2019-02-06

Adam klasa sama w sobie :) Kawał dobrego materiału.

Paweł Turkot

2019-02-07

Kurs godny uwagi, lecz naprawdę przydało by się wyciąć niektóre fragmenty, typu instruktor coś mówił i dosłownie zaraz znowu powtarza od nowa w całym kursie około 5 takich fragmentów, dla słuchającego trochę denerwujące przynajmniej dla Mnie.

Marcin Hatko

2019-02-07

@Marcin Hatko, kursy sprawdzamy i przechodzą przez recenzentów ale wszyscy jesteśmy ludźmi i czasem takie drobiazgi trudno wyłapać nawet mimo oglądania parę razy. Już znaleźliśmy część i wrzucimy poprawione lekcje, ale jeśli mógłbyś nam na maila biuro@eduweb.pl napisać orientacyjnie gdzie - poprawimy :)

Grzegorz Róg

2019-02-11

Kurs wydaje się być dobrym żeby zacząć pisanie w React, fajnie byłoby też doczekać się pełnego kursu z Redux plus jak samemu napisać API, pozdrawiam Team Eduweb!

Przemysław Lewtak

2019-02-23

Może jestem trochę stronnicza, bo bardzo lubię kanał Adama na youtube, ale uważam że kurs jest naprawdę dobry. Jest to świetne wprowadzenie w świat Reacta i zachęca do dalszej pracy. Największy plus daję za projekt, który tworzony jest w trakcie kursu - nie jest to coś oklepanego, wygląda super ładnie i chce się to rozbudowywać i z tego korzystać! Adam dobrze tłumaczy przerabiane zagadnienia i z całą pewnością wykupię jego kolejne kursy. Jedyny minus? Za szybko się kończy!

Kaja Ciesliczka

2019-02-23

Kurs bardzo dobry i sporo się nauczyłem, tylko szkoda, że Hello Roman nie sprawdzał swoje nagrane materiały (albo mało dokładnie sprawdzał). Wiele momentów było widać jak na dłoni, żeby po prostu wyciąć (np. powtarzanie tekstu), żeby widzowi nie marnować cennych sekund i nie wybijać z flow oglądania.

Mikołaj Lewandowski

2019-03-05

Kurs bardzo dobry.

MagdaLena Wierzbicka

2019-03-29

Super kurs!

Paweł Jaguś

2019-05-05

Warto kupić, świetnie wytłumaczone podstawy.

Damian Osuch

2019-07-12

Merytorycznie na duży plus, spory zastrzyk wiedzy! Odejmuję dwie gwiazdki za zbyt dużą liczbę powtórzeń oraz niepotrzebnych przerw, które spokojnie można było usunąć podczas montażu.

Piotr Skóra

2019-10-02

Kurs ciemny jak tabaka w rogu nie polecam na sam początek, spodziewałem się czegoś więcej ponieważ materiały na youtube są super. Polecam kupić ten kurs dopiero po przerobieniu gdzie indziej jakiś podstaw dogłębnie omówionych

Marcin Kubacki

2019-10-15

Świetny kurs, zwłaszcza dla osób, które już gdzieś liznęły Reacta i potrzebują usystematyzować wiedzę podstawową. Dzięki Adam :) Kawał dobrej roboty! Twój kurs sprawił, że lepiej rozumiem podstawy tej technologii.

Mariusz Przybylski

2019-10-24

Bardzo dobry kurs, otworzył mi oczy na wiele rzeczy, gorąco polecam :)

Marcin Koszykowski

Ten kurs nie posiada jeszcze transkryptu. Choć bardzo się staramy, wygenerowanie transkryptów do wszystkich kursów jest bardzo czasochłonne. W wielu przypadkach wymaga zaangażowania drogiego oprogramowania i godzin pracy przy poprawianiu transkryptu tak, aby był on możliwie jak najlepszy.

Zależy nam na tym, aby przygotować transkrypty do wszystkich naszych treści. To jedyny sposób dla osób niedosłyszących, aby mogły wygodnie uczyć się technologii. Poza tym, transkrypty ułatwiają skanowanie kursu w poszukiwaniu informacji i jego indeksowanie.

Szukamy osób, które mogłyby nam pomóc w poprawianiu transkryptów. Jeśli masz chwilę wolnego czasu i interesuje Cię dany kurs, w zamian za taką pomoc chętnie udostępnimy Ci wybrany materiał. Wyślij swoje zgłoszenie tutaj, jeśli możesz pomóc nam rozwijać platformę.

  • Informacje
  • Lekcje
Wykup w abonamencie od 79zł
Przetestuj za darmo przez 7 dni!

Autor: Adam Romanski

Czas: 5 godzin

Wersja:

  • Pliki źródłowe
  • Certyfikat Ukończenia
  • Dostęp z urządzeń przenośnych
  • Licencje dla firm i szkół

Wstęp do kursu

  • Wprowadzenie

  • Czym jest React

  • Jakie problemy rozwiązuje React

  • Czego dowiesz się w tym kursie

Pierwsze kroki

  • Render po raz pierwszy

  • Czym jest JSX

  • Tworzenie komponentu funkcyjnego

  • Przygotowanie struktury aplikacji

Podstawy komponentów

  • Omówienie struktury projektu

  • Przygotowanie pierwszych komponentów

  • Stylowanie komponentu ListItem

  • Dodawanie propsów

  • Mapowanie tablicy

  • Refactoring komponentu

  • Czym są PropTypes

Komponenty klasowe i stan

  • Nowe funkcje aplikacji

  • Pierwszy komponent klasowy

  • Modyfikowanie stanu komponentu

  • Stary zapis komponentów klasowych

  • Stworzenie rodzica ze stanem aplikacji

  • Pobieranie danych od komponentów dzieci

  • Dodawanie nowego elementu listy

  • Dodawanie CSS Modules i SCSS

  • CSS Modules w praktyce

  • Refactoring formularza

  • Ekstrakcja komponentu

  • Renderowanie warunkowe

Podstawy routingu

  • Nowe funkcje aplikacji - routing

  • Czym jest React Router

  • Rozbudowa struktury aplikacji

  • React Router - pierwsze kroki

  • Czym jest Switch

  • Tworzenie menu z komponentem NavLink

  • Stylowanie headera

  • Tworzenie modala

  • Otwieranie i zamykanie modala

  • Tworzenie dynamicznego formularza

  • Renderowanie warunkowe pól formularza

Stan aplikacji z Context API

  • Czym jest Context API

  • Context API w praktyce

  • Tworzenie inteligentnego formularza

  • Instalujemy React Dev Tools

  • Dynamiczne przypisywanie notatek do kategorii

  • Wyświetlanie notatek w kategoriach

  • Ostatnie poprawki

Podsumowanie

  • Deployment aplikacji na Netlify

  • Podsumowanie kursu

  • Zakończenie