Wprowadzenie do kursu React.js od podstaw

Ten wpis jest 1 częścią z 35 w kursie React.js
wp-content/uploads/2017/10/React_logo_wordmark-300x101-1-e1508612391308.png
  1. Wprowadzenie do kursu React.js od podstaw
  2. Poznaj React.js
  3. Pierwszy komponent w React.js
  4. Props czyli atrybuty w React.js
  5. Podział na komponenty w React.js
  6. Klasy jako komponenty React.js
  7. Interakcja z komponentami React.js
  8. Stan komponentów React.js
  9. State w React.js 2
  10. Metody cyklu życia komponentu w React.js
  11. React.js w przykładach: filtrowanie statycznej listy
  12. Tworzenie aplikacji React.js dzięki create-react-app
  13. React.js na GitHub Pages dzięki create-react-app
  14. Testowanie aplikacji React.js — podstawy Enzyme
  15. Testowanie React.js w Enzyme — props, state i interakcje
  16. Poprawne bindowanie funkcji w React.js
  17. Odpowiadam na pytania: Babel, ECMAScript, destrukturyzacja, onClick, className
  18. Komunikacja pomiędzy komponentami w React.js
  19. Komunikacja z API w React.js
  20. Formularze w React.js — kontrolowane komponenty
  21. Formularze w React.js — niekontrolowane komponenty
  22. Odpowiadam na pytania: props, nawiasy klamrowe, funkcje vs klasy, import react
  23. TDD w React.js z pomocą react-testing-library
  24. Flux i Redux
  25. React + Redux — kurs: wprowadzenie i podstawy
  26. React + Redux — filtrowanie listy, proste selektory
  27. Projektowanie komponentów: Presentational & Container Components
  28. Asynchroniczność w Redux: redux-thunk
  29. Kiedy używać state, a kiedy Redux?
  30. Nowe metody cyklu życia: getDerivedStateFromProps i getSnapshotBeforeUpdate
  31. Leniwe ładowanie komponentów w React dzięki import
  32. Higher Order Reducers — Redux i powtarzanie kodu
  33. React Hooks — wprowadzenie i motywacja
  34. React Hooks: useState, czyli stan w komponentach funkcyjnych
  35. React Hooks: useState — wiele stanów, callbacki i inne niuanse

Oto kurs React.js od podstaw. Moje gratulacje za podjęcie tego tematu! To pierwszy krok w kierunku realizacji Twoich ambicji i poznania tego niezwykle przydatnego narzędzia. Ten kurs React.js sprawi, że będziesz umiał(a) tworzyć rozbudowane i profesjonalne aplikacje internetowe oraz przybliży Cię do celu jakim zapewne jest znalezienie pracy w tej technologii. Na pewno warto!

Skąd u mnie w ogóle pomysł opracowania tego tematu? Odpowiedź jest prosta: nie chcę, abyś musiał(a) po omacku przechodzić przez gąszcz dokumentacji i tutoriali React.js — jak robiłem to ja.

Kurs React.js

Jeśli zaglądałaś/eś tutaj wcześniej to pewnie drapiesz się teraz po głowie i zastanawiasz skąd w ogóle ta seria wpisów. Tak, to prawda, dawniej byłem mocno związany z AngularJS, stworzyłem w nim wiele projektów i uwielbiałem tę technologię. Pracowałem też z Angularem 2, a teraz pracuję z React. I muszę przyznać, że jednak to z Reactem pracuje mi się dotąd najlepiej. Czuję, że technologia w niczym mnie nie ogranicza, że mogę użyć Reacta w wielu miejscach, na różne sposoby i nic nie stoi na przeszkodzie, aby połączyć go z dowolnymi innymi rozwiązaniami, które sobie upodobam. Wolność i swoboda 🙂 Dlatego powstaje ten kurs React.js.

Moje własne doświadczenia tylko dowodzą od dawna powtarzanej prawdy — trzeba cały czas zachować otwarty umysł. Nawet jeśli nigdy nie próbowałeś React, to może właśnie ten moment? Na pewno warto zapoznać się przynajmniej z podstawowymi konceptami, nie tylko dlatego, że React.js jest najbardziej popularnym rozwiązaniem na front-endzie, ale także dlatego, że są to zasady i wzorce uniwersalne.

Co dalej?

Jednocześnie ta seria wpisów jest początkiem czegoś zupełnie nowego! Nowa formuła. Od teraz, w małych odstępach czasu, będę publikował kolejne części serii, w której poznasz React. Wpisy będą krótkie, lekkie i przystępne, i będą się pojawiały częściej niż zwykle. W kolejnych wpisach m.in. stworzysz pierwszy kompletny komponent, poznasz JSX, nauczysz się składać komponenty niczym klocki i zapoznasz się z cyklem życia komponentów. Postaram się też wyjaśnić jak wygląda podejście React do przepływu danych, gdzie używać stanu komponentów, jak można przechowywać stan całej aplikacji i wiele innych rzeczy… Konkretnie, bez owijania w bawełnę 🙂 Mam nadzieję, że ta forma Ci się spodoba.

Idealnie byłoby, gdyby udało Ci się przeznaczyć pewien określony czas regularnie na naukę nowych rzeczy. Codziennie kilka linii kodu. Co dwa dni stronę w dokumentacji. Co tydzień dokładnie przerób jeden odcinek kursu. Albo nawet tylko jeden akapit. Mały krok przybliżający Cię do celu każdego dnia — oto klucz do sukcesu! Cokolwiek co pozwoli Ci systematycznie osiągnąć cel jakim jest poznanie React.js. Nie musisz tego robić codziennie, ale nie czekaj ze startem za długo. Chcesz poznać React.js? Zacznij teraz! Zaufaj mi, to jest aż tak proste.

Jeśli chcesz być na bieżąco z kolejnymi wpisami to zapisz się na newsletter poniżej i śledź mnie na Facebooku.

Ćwiczenie

Po każdym wpisie w serii będzie się pojawiało krótkie ćwiczenie, które musisz wykonać 🙂 Będzie to podsumowanie wszystkiego czego miałaś/eś się nauczyć w danej części kursu. Tak również jest i w tym wpisie!

Ćwiczenie: Napisz w komentarzu czego chciałabyś/chciałbyś się nauczyć, jakie są Twoje oczekiwania oraz jakie masz cele. Chcesz się rozwijać? Szukasz pracy? A może jeszcze coś innego?

Nawigacja po kursie:
  1. Wprowadzenie do kursu React.js od podstaw
  2. Poznaj React.js
  3. Pierwszy komponent w React.js
  4. Props czyli atrybuty w React.js
  5. Podział na komponenty w React.js
  6. Klasy jako komponenty React.js
  7. Interakcja z komponentami React.js
  8. Stan komponentów React.js
  9. State w React.js 2
  10. Metody cyklu życia komponentu w React.js
  11. React.js w przykładach: filtrowanie statycznej listy
  12. Tworzenie aplikacji React.js dzięki create-react-app
  13. React.js na GitHub Pages dzięki create-react-app
  14. Testowanie aplikacji React.js — podstawy Enzyme
  15. Testowanie React.js w Enzyme — props, state i interakcje
  16. Poprawne bindowanie funkcji w React.js
  17. Odpowiadam na pytania: Babel, ECMAScript, destrukturyzacja, onClick, className
  18. Komunikacja pomiędzy komponentami w React.js
  19. Komunikacja z API w React.js
  20. Formularze w React.js — kontrolowane komponenty
  21. Formularze w React.js — niekontrolowane komponenty
  22. Odpowiadam na pytania: props, nawiasy klamrowe, funkcje vs klasy, import react
  23. TDD w React.js z pomocą react-testing-library
  24. Flux i Redux
  25. React + Redux — kurs: wprowadzenie i podstawy
  26. React + Redux — filtrowanie listy, proste selektory
  27. Projektowanie komponentów: Presentational & Container Components
  28. Asynchroniczność w Redux: redux-thunk
  29. Kiedy używać state, a kiedy Redux?
  30. Nowe metody cyklu życia: getDerivedStateFromProps i getSnapshotBeforeUpdate
  31. Leniwe ładowanie komponentów w React dzięki import
  32. Higher Order Reducers — Redux i powtarzanie kodu
  33. React Hooks — wprowadzenie i motywacja
  34. React Hooks: useState, czyli stan w komponentach funkcyjnych
  35. React Hooks: useState — wiele stanów, callbacki i inne niuanse