w Praktyce
6 godz. 51 min · ReactJS · Full-stack i Programowanie
Adam RomanskiFrontend developer & YouTube CreatorNarzędzia typu ESlint, Prettier, Husky czy lint-staged niezmiernie pomagają nam w pracy. Problem jednak polega na tym, że ich konfiguracja bywa kłopotliwa. W tym kursie dowiesz się, jak poprawnie skonfigurować te narzędzia, tak, aby nie wchodziły ze sobą w konflikty i pomagały nam pisać lepszy kod.
Brzmi jak zły pomysł? Wcale nie! CSS in JS to rewolucyjne podejście, które pozwala nam tworzyć style bezpośrednio w komponentach. Dzięki bibliotece Styled Components możesz wpływać na ich stan, wygląd i wiele innych rzeczy. To niezwykłe narzędzie, wprowadzające powiew świeżości dla ludzi zmęczonych czystym CSS.
Dokumentowanie wyglądu i zachowania naszych komponentów bywa kłopotliwe. Jeśli jednak użyjemy odpowiednich narzędzi, staje się banalne! Storybook w połączeniu z podejściem atomic design pozwoli nam na stworzenie świetnie udokumentowanych komponentów.
React w Praktyce nie byłby... praktyczny, gdyby nie pokazanie tego, w jaki sposób rozwiązuje się problemy z layoutem aplikacji. Sidebary, szablony, powtarzalne komponenty – to wszystko poznasz w tym kursie.
Tworzenie store, czyli warstwy z danymi w naszej aplikacji dla wielu bywa wyzwaniem dość trudnym. Wynika to często z tego, że przykłady Reduxa bywają niepraktyczne. W tym kursie dowiesz się, w jaki sposób działa Redux – zaczniemy od podstaw, a skończymy na rozbudowanej strukturze danych. Dzięki temu zobaczysz, że nie taki Redux straszny jak go malują.
Aplikacja frontendowa bez backendu może istnieć, choć jej możliwości będą zdecydowanie ograniczone. A już na pewno będzie ona miała kiepską pamięć. Dlatego w tym kursie stworzymy lokalną wersję backendu połączoną z MongoDB na mLab. W ten sposób będziemy mogli dłużej przechowywać dane zapisane w naszych komponentach.
O testach można mówić wiele. To niezwykle rozległy temat, dlatego zanim zaczniesz je pisać na poważnie, chcę Ci pokazać jak możesz poćwiczyć podstawowe rzeczy. Poznasz narzędzie JEST, które odpowiada za uruchamianie testów, oraz wprowadzę Cię do react-testing-library, jednej z najpopularniejszych bibliotek do testowania aplikacji reactowych.
Ten kurs przeznaczony jest dla osób, które lada dzień będą aplikować na stanowiska juniorskie jako React developer. Zawarłem w nim wiele aspektów pracy z React, które zdarzają się w prawdziwej pracy. Ponadto skorzystać mogą z niego osoby, które znają inny framework JS i chcą nauczyć się Reacta, jednak kursy od podstaw są dla nich zbyt proste.
16.8.x
Cześć tu Roman, witam w moim średniozaawansowanym kursie o React'cie
o nazwie React w praktyce. Cieszę się, że to właśnie on wpadł ci w oko. Jestem
pewien, że po jego przerobieniu twoje umiejętności związane z React'em mocno
wzrosną, także wzrośnie twoja pewność siebie związana właśnie z
pracą nad tym framework'iem, ale zanim ci opowiem czego
tutaj się nauczymy w trakcie tego kursu to opowiem ci o
jednym takim zjawisku, które zauważam niemal każdego dewelopera i też nieraz
często powtarzałem to gdzieś w sieci, mianowicie chodzi o pustynie rozpaczy,
czyli o takie miejsce w którym utyka lub może dopiero utknąć
każdy początkujący deweloper i z tej pustyni rozpaczy
bardzo ciężko jest się wygrzebać. Tak naprawdę potrafimy utknąć
tych piaskach pustynnych na długo, długo, długo zanim znajdziemy drogę
wyjścia. Natomiast w tym kursie właśnie chcę ci pokazać, że jest
nieco łatwiejszy sposób. Jeśli dobrze się podejdzie do własnej nauki to
naprawdę dość szybko można wyskoczyć poza te pustynie i dlatego
teraz opowiem ci o takich pięciu podstawowych rzeczach, które poruszę w tym
kursie. One będą takie bardzo wysokopoziomowe, nie będziemy tutaj wdawać się w szczegóły. Natomiast
chcę pokazać ci po prostu, jaki miałem koncept na tworzenie
tego kursu. Przede wszystkim chciałbym, żeby ten kurs był źródłem praktycznej
wiedzy, żeby nie teoretyzować tutaj za dużo, tylko żeby bardziej
pokazać realne problemy i realne podejście do tych problemów, jak
to się rozwiązuje w pracy dewelopera, ponieważ warto zdać
sobie sprawę już teraz, że to nie jest tak, że przejdziemy jakiś kurs i później
każde zadanie będzie dla nas łatwe. Tak naprawdę praca dewelopera to jest codzienna
walka z nowymi problemami, z rzeczami których nie rozumiemy, których
nie potrafimy rozwiązać i przyzwyczajenie się do tej myśli, że czegoś nie wiemy,
ale musimy wiedzieć jak znaleźć odpowiedź na to, to jest właśnie klucz
do sukcesu. Jednym z takich kroków jest na pewno praca
z dokumentacją. Często kurs prowadzą od punktu A do
punktu B za rękę, nie pokazując tak naprawdę całej tej drogi, którą przechodzimy
w trakcie rozwiązywania jakiegoś problemu, a umiejętne czytanie
dokumentacji właśnie pozwala nam szybciej rozwiązywać problemy, ale
też szybciej się uczyć i zrozumieć jak jakieś mechanizmy albo jakieś
wzorce projektowe działają. Kolejną rzeczą, którą tutaj
poruszę tym kursie Jest korzystanie z ekosystemu React'a, React jako jeden
z niewielu framework'ów może pochwalić się naprawdę rozległym ekosystemem i
największą społecznością, która codziennie do
dokłada nowe narzędzia do tego ekosystemu i pozwala nam szybciej
pracować, bo jeśli dobrze się zorientujemy w tym ekosystemie to zauważymy,
że pewne narzędzia tylko leżą i czekają aż po nie sięgniemy. Nie
musimy zawsze wymyślać koła na nowo i jest to właśnie część tego kursu. Chcę
pokazać, że wykorzystywanie gotowego kodu nie zawsze jest złe, a wręcz
przeciwnie, pozwala nam po prostu szybciej dotrzeć do celu, a często nawet ten
kot przewiduje rzeczy na które my wpadli byśmy naprawdę po długim, długim
czasie. Opowiem też o setup'owaniu
projektu, ponieważ sam pamiętam, że jako początkujący deweloper strasznie
bałem się setup'ować nowe projekty, czyli konfigurować wszystkie narzędzia. Konfigurować
to wszystko w taki sposób, żeby działało, żeby później już nie za często do tego
wracać i po prostu żeby ten projekt służył mi, a nie żebym ja ciągle
się martwił czy coś się w tym projekcie znowu nie wysypie z powodu złej konfiguracji,
więc umiejętne stworzenie takiej konfiguracji jest też bardzo ważne,
dlatego zaczniemy sobie od samego początku i pokażę ci jak tworzyć
taką aplikację włącznie ze wszystkimi narzędziami, które pozwalają nam
na szybszy jest aktywniejszy development. I ostatnim takim
punktem, o którym chciałbym powiedzieć jest to, że w tym kursie będziemy
pracować nad taką prawdziwą, w cudzysłowie, aplikacją. Wymyśliłem
ją na potrzeby pierwszego kursu o React'cie, który może znasz. On też się znajduje
na eduweb. Jednak był to kurs dla początkujących i tam też ta aplikacja przybrała
takie rozmiary bardzo niewielkie, bardzo prostej aplikacji, ponieważ tam skupiliśmy
się bardziej na wyjaśnieniu takich podstaw React'a, natomiast tutaj stworzymy
z tej aplikacji naprawdę taki prawdziwy, niemalże komercyjny produkt
wykorzystujący mnóstwo narzędzi, także idea pozostaje ta sama, ale
aplikacja będzie wyglądać zupełnie inaczej. I to
wszystko w tej lekcji. Zapraszam do kolejnej, w której opowiem ci co
tak naprawdę będzie zawierać nasza aplikacja, a także uwaga, jak będzie wyglądać,
ponieważ zaprojektowałem to wszystko na potrzeby tego kursu. Do zobaczenia
w następnej lekcji.