W końcu nadszedł czas na powrót serii “Jak się uczę”. Dzisiaj krótkie zestawienie materiałów do nauki podstaw Reacta, czyli tekst “Jak się uczę: React”. Wszystko przetestowane przeze mnie własnoręcznie. Uzbrójcie się w lemoniadę i do lektury! A potem do nauki
Dlaczego React? Przecież seria “Jak się uczę” w dużej mierze skupiała się na Angularze. Owszem, skupiała. Jednak teraz na co dzień pracuję w React, dlatego to kursy z niego robię najczęściej. Przebywam z nim w codziennej pracy, więc wiele też łapię podczas czytania kodu aplikacji, nad którą pracuję. Ale jak wiadomo, samo czytanie kodu i pisanie na jego podstawie nie wystarczy. Trzeba też zrobić sobie dobre podstawy teoretyczne i oczywiście poćwiczyć na własnych projektach. Ja na razie robię naprawdę mini projekty, głównie te z tutoriali kursów, które przerabiam. Ale w planach mam juz od lipca ruszyć z czymś większym, czyli napisać od zera swoją aplikację w React.
Jak interesują Was inne zestawienia materiałów, to odsyłam do przejrzenia wszystkich artykułów, które ukazywały się w tej serii. A teraz zaczynamy! Wszystkie materiały zebrane w poniższym wpisie są darmowe.
Co na sam początek? Tutaj zwykle polecałam od razu oficjalną stronę danej technologii, ale tym razem się wyłamię i na sam początek polecę Wam kurs Learn ReactJS na Codecademy. Dlaczego akurat ten kurs na start? Po pierwsze – świetnie tłumaczy same podstawy i zapoznaje Was zagadnieniami specyficznymi dla Reacta. Nie pozwoli on Wam zbudować super kompleksowej aplikacji od razu, ale pokaże, na czym React polega i jak napisać w nim pierwsze linijki kodu. Co ważne – ten kurs zapoznaje Was z podstawami Reacta, ale nie pokazuje, jak przygotować środowisko, aby móc pracować nad aplikacją lokalnie, na swoim komputerze.
Oczywiście zaraz potem odsyłam do oficjalnej strony React. jeżeli zupełnie nie mieliście do czynienia z tym frameworkiem i nie wiecie, na czym polega jego specyfika, koniecznie poczytajcie sobie informacje, które są na stronie powitalnej. Tutaj już znajdziecie także instrukcje tworzenia kodu lokalnie. Jak już wszystko zainstalujecie, wskakujcie do tutoriala i do dokumentacji. Przyznam, iż bardzo spodobał mi się tutorial z oficjalnej strony. Robiłam go choćby kilkukrotnie, żeby sobie utrwalić zupełne podstawy. A dokumentację oczywiście czytam na co dzień. Uważam, iż jest naprawdę świetnie napisana, bo jest przejrzysta i bardzo łatwo w niej znaleźć interesujące nas zagadnienia. Plusem jest też to, iż wszystkie przykłady, które pojawiają się w dokumentacji i tutorialu znajdziecie na Codepen, więc można zobaczyć od razu kod “w akcji”.
Wiem, iż nie wszyscy przepadają za dogłębnym studiowaniem dokumentacji i wolą zrobić kurs, który przedstawi im podstawy i troszkę więcej. W takim przypadku fajnym rozwiązaniem dla Was będzie kurs Start Learning React na Egghead. Zapozna od Was z konfiguracją niezbędną, by zacząć pisać aplikację lokalnie na swoim komputerze, pokaże jak zbudować prostą aplikację zupełnie od zera. Ten kurs bardzo mi się podobał, bo na zakończenie miałam działającą przykładową aplikację, którą sobie mogłam dalej wykorzystywać. Dopisywałam więc sobie do niej jakieś nowe, małe funkcjonalności, czy po prostu próbowałam zaimplementować rzeczy, które znalazłam w dokumentacji.
Materiały, które zbieram tutaj dzisiaj mają być z założenia darmowe, ale chciałam wspomnieć też o kursie React JS and Redux – Mastering Web Apps z Udemy. Kurs nie jest darmowy, natomiast na Udemy bardzo często są duże promocje i mi udało się go kupić dosłownie za 10zł. Więc polecam śledzić, czy nie ma jakichś fajnych ofert aktualnie. Dlaczego polecam ten kurs? Ponieważ tłumaczy podstawy, a potem przechodzi do bardziej zaawansowanych zagadnień, np. takich jak użycie Reduxa czy połączenie z API. Podczas kursu tworzymy kilka małych projektów, każdy skupiony na wprowadzeniu innych funkcjonalności. Mnie osobiście bardzo forma kursu oraz przykładowe aplikacje przypadły go gustu i sporo czasu spędziłam przerabiając te materiały.
A skoro już jesteśmy przy bardziej zaawansowanych zagadnieniach, czytając o React pewnie gwałtownie traficie na koncepcje Reduxa. Ja o materiałach do nauki samego Reduxa już pisałam tutaj, tam też były linki do kursów czy artykułów, które pokazują użycie Reduxa z Angularem. Mimo iż koncepcja ogólnie jest taka sama, użycie Reduxa z React różni się od tego z Angularem. Na sam początek w temacie zestawienia Redux + React polecam kurs Build A React App with Redux na Egghead. Fajnym wprowadzeniem do tematu jest również to video na YouTube.
Tak jak wspomniałam, w tej chwili na co dzień pracuję z React, także często też po prostu sobie czytam różne artykuły w temacie. Mocno polecam w tej kwestii przeglądanie medium.com, gdzie można znaleźć naprawdę świetne wpisy, które tłumaczą przeróżne zagadnienia. Od razu mogę polecić artykuł All the fundamental React.js concepts, jammed into this single Medium article, który w telegraficznym skrócie wyjaśnia, o co w tym całym frameworku chodzi. interesujący na początek jest też tekst o tym, jakie są dobre praktyki przy pisani komponentów, czyli Our Best Practices for Writing React Components.
A jak macie ochotę na poczytanie czegoś po polsku, to oczywiście niezmienne polecam tutaj stronę Type of Web, gdzie znajdziecie mnóstwo artykułów o React. Najlepiej zacząć od serii z podstaw, którą znajdziecie tutaj. Bardzo lubię czytać artykuły Michała, ponieważ są zilustrowane fragmentami kodu i od razu można sobie wszystko fajnie zobrazować i zrozumieć. A do tego całkiem niedawno ruszyła grupa na Facebooku React – Uczymy się React z Type of Web, gdzie można zadać pytanie, gdy mamy wątpliwości co do swojego kodu w React albo po prostu poczytać, co inni w temacie piszą i co polecają do nauki.
To tyle na dziś! Materiałów jest sporo, także myślę, iż dla kogoś, kto zupełnie nie miał do czynienia z tym frameworkiem, pracy jest na kilka (jeśli nie kilkanaście) wieczorów. Ja tylko chciałam jeszcze dodać, iż przeskoczyłam do Reacta z Angulara i na początku React wydawał mi się na jego tle bardzo banalny, ale jak zaczęłam się wgłębiać, to się okazało, iż aż tak prosto nie jest. I iż dużo fajnych rzeczy można z Reactem zrobić.
A może Wy macie do polecenia jakieś materiały do nauki React, które przypadły Wam do gustu? Podzielcie się
Chcesz się czymś podzielić? O coś zapytać? Napisz komentarz pod postem, maila do mnie na joanna@wakeupandcode.pl, wiadomość na fanpage Wake up and Code albo post w grupie Programuj, dziewczyno!
