React – co to jest?

Hej, zajrzałeś/aś tu prawdopodobnie dlatego, że chcesz dowiedzieć się co to React.js i do czego może Ci się przydać jako programiście. Zanim zacznę się wymądrzać na ten temat, zajrzyjmy na oficjalną stronę Reacta i zobaczmy, czego możemy dowiedzieć się stamtąd:

javascriptowa biblioteka służąca do tworzenia interfejsów użytkownika”

Wszystko jasne? Super, koniec artykułu. Albo dobra, spróbujmy przetłumaczyć sobie to zdanie na jeszcze bardziej zrozumiałe. Najlepiej zrobić to na przykładzie.

Przypomnij sobie swoje ostatnie doświadczenia korzystanie z Facebooka, Instagrama Twittera, Netfliksa czy tym podobnych platform 'przerabiających’ ogromne ilości danych w danej chwili, a jednocześnie oferujące szybkie i stabilne interfejsy, które wydają się niemal natychmiast reagować na nasze poczynania. Każde nasze kliknięcie powoduje jakąś 'reakcję’ interfejsu, pomimo braku wrażenia przeładowywania strony. Jako użytkownicy wykonujemy na stronach napisanych w technologii React jakieś czynności, które niejednokrotnie powodują całkowitą zmianę elementów na ekranie. Różnica polega na tym, że w tradycyjnym modelu strony internetowej, po załadowaniu jednego interfejsu / ekranu jako pliku html, zmiana go na inny powodowałaby zapytanie do serwera o inny(adekwatny) plik html, pobranie go i wyświetlenie w przeglądarce użytkownika. React.js pozwala pominąć ten krok, przez co mamy wrażenie, że strona natychmiast „reaguje” na nasze działania. Reaguje -> react.

React jako Single Page Application

Zatem przerywając ten cykl zapytania i odpowiedzi ze strony serwera, jesteśmy w stanie znacząco przyspieszyć ładowanie poszczególnych elementów aplikacji w miarę jak użytkownik z niej korzysta. To jest według mnie podstawowa zaleta jaką daje nam React. Takie frontendowe aplikacje, które nie odpytują serwera na backendzie a mimo to dają 'złudzenie’ przeładowania strony nazywa się SPA = Single Page Applications. Ta funkcja często przypisywana jest Reactowi, a także innym frontendowym frameworkom jak Angular czy Vue. Warto jednak pamiętać, że do napisania aplikacji SPA wystarczy czysty Javascript. To właśnie Javascript – skrypt odpalany i działający w przeglądarce pozwala manipulować wyświetlanymi tam elementami, zmieniając je, dodając nowe usuwając, całkowicie renderując od nowa i tak dalej, bez konieczności przeładowywania strony i odpytywania o nowy interfejs serwera na backendzie.

React jest po prostu javascriptową biblioteką – czyli zestawem narzędzi proponujących określony sposób skryptowania tych interfejsów w przeglądarce, która znacząco ułatwiają i przyspieszają tworzenie aplikacji SPA, niż miałoby to miejsce gdybyśmy chcieli korzystać z czystego Javascript.

React – jak zacząć

Reasumując, aby nauczyć się React, warto wcześniej zaznajomić się z czystym Javascript. React jest tylko 'nakładką’ na javascript, a zrozumienie zasad działania tego fundamentu na którym stoi React pozwoli Ci lepiej, skuteczniej wykorzystywać tę bibliotekę w swojej pracy.