React biblioteka js wprowadzenie

Zapiszmy pierwszy element html zbudowany przy pomocy React:

<script type="text/babel">

  ReactDOM.render(

    <h1>Hello world !</h1>,
    document.body

  );

</script>

Co zrobił React? Proste! React w document body umieścił h1.

Teraz coś nieco trudniejszego. W kodzie strony html wstawiamy kontener:

<div id="kontener"></div>
A następnie wykorzystując bibliotekę React, umieścimy w kontenerze kontener tekst <h2>biorę id kontener i umieszczam w nim ten tekst</h2>:

<script type="text/babel">

  ReactDOM.render(

    <h2>biorę id kontener i umieszczam w nim ten tekst</h2>,

    document.querySelector("#kontener")
  );

</script>

Zauważ, że wykorzystaliśmy tutaj język JSX, czyli w skrócie html umieszczone wewnątrz JavaScript. Dziwne, prawda? A jednak działa! JSX w aplikacjach React jest powszechnie używanym rozwiązaniem, dlatego musisz go poznać. Opiszę go w jednej z kolejnych lekcji.

Na dzisiaj wystarczy wiedzy z biblioteki React.js. Przećwicz to co opisałem i zapraszam do kolejnych lekcji z biblioteki React.js.

Autor bezpłatnego kursu React: Darek Gołębiowski

Szukasz wykonawcy lub podwykonawcy Twojej aplikacji portalu czy strony internetowej? Polecam moje usługi i serdecznie zapraszam do współpracy

Programuję i analizuję m.in. w: JavaScript, HTML5, CSS3, jQuery, jQuery Mobile, React.js, node.js, AJAX, JSON, Mocha.js, Babel.js

Masz pytanie? marketing ( at ) poswojsku.eu