Witaj, świecie!
Poniżej znajdziesz przykład najprostszej aplikacji reactowej:
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<h1>Witaj, świecie!</h1>);Wyświetli ona na stronie nagłówek “Witaj, świecie”.
Kliknij w powyższy link, aby otworzyć edytor kodu w przeglądarce. Możesz śmiało dokonywać w nim zmian, zobaczysz też jak wpływają one na to, co jest wyświetlane na stronie. Na większości stron w tym kursie znajdziesz przykłady, które można modyfikować.
Jak używać tego przewodnika
W niniejszym kursie zapoznamy się z podstawowymi składnikami aplikacji reactowej: elementami i komponentami. Korzystając z nich, możesz tworzyć rozbudowane aplikacje w oparciu o mniejsze części, dające się wielokrotnie wykorzystywać.
Wskazówka
Kurs ten skierowany jest do osób, które wolą się uczyć nowych koncepcji krok po kroku. Jeśli jednak wolisz zdobywać wiedzę poprzez ćwiczenia, możesz skorzystać z kursu praktycznego. Obydwa kursy świetnie się uzupełniają.
Masz przed sobą pierwszy rozdział kursu teoretycznego dotyczącego głównych koncepcji Reacta. Lista dostępnych rozdziałów znajduje się w bocznym pasku nawigacji. Jeśli czytasz ten kurs na urządzeniu mobilnym, możesz przemieszczać się po stronie wciskając przycisk w prawym dolnym rogu ekranu.
Każdy rozdział w tym kursie uzupełnia wiedzę w oparciu o poprzednie rozdziały. Wielu przypadków użycia Reacta możesz się nauczyć czytając rozdziały w sekcji “Główne idee”, zapoznając się z nimi w kolejności, w jakiej pojawiają się w pasku nawigacji. Przykładowo, rozdział pt. “Wprowadzenie do JSX” jest następnym w kojeności po tym, który aktualnie czytasz.
Wymagania początkowe
React jest biblioteką javascriptową, stąd też zakładamy, że czytelnik dysponuje pewną podstawową wiedzą o tym języku. Jeśli czujesz się niezbyt pewnie, polecamy zapoznanie się z kursem “Ponowne wprowadzenie do JavaScriptu”, który pozwoli ci ocenić swoją wiedzę oraz będzie stanowić bazę do sprawnego poruszania się po kursie Reacta. Choć zapoznanie się z tamtym kursem może zająć ci około 30-60 minut, to nie będziesz mieć poczucia, że uczysz się jednocześnie JavaScriptu i Reacta.
Zauważ, że…
W naszym poradniku mogą sporadycznie pojawiać się przykłady oparte o nowszą składnię JavaScriptu. Jeśli od dłuższego czasu nie śledzisz rozwoju języka, te trzy punkty (ang.) mogą okazać się pomocne.
Zaczynajmy!
Kontynuuj przewijanie strony, aby dotrzeć do linku do następnego rozdziału. Znajduje się on tuż przed stopką strony.