Sergio Xalambrí
February 26, 2019

# Hola Mundo con React

En este tutorial vamos a ver como crear un Hola Mundo en React sin usar JSX

En otro artículo vimos como cargar React y ReactDOM con una etiqueta
`<script >`. Hoy vamos a ver como usar React para renderizar nuestro primer elemento de React.

Lo primero que tenemos que hacer es crear un elemento, eso lo hacemos ejecutando una función.

    React.createElement(type, [props], [...children]);

El primero argumento es un string con la etiqueta HTML que queremos crear.

El segundo es un objeto con los atributos de la etiqueta o `null` en caso de no pasar ninguna.

Desde acá cualquier argumento que pasemos van a ser elementos hijos de nuestra etiqueta o textos, no hay límites para la cantidad de elementos hijos.

Veamos como usarlo creando `<h1>Hola Mundo!</h1>`.

    React.createElement("h1", null, "Hola Mundo!");

Ahora vamos a renderizar nuestro elemento. Para eso necesitamos ReactDOM, este posee un método llamado `render` que nos sirve para justamente hacer render de los elementos.

    ReactDOM.render(element, node);

El primer argumento es el elemento creado con `React.createElement`.

El segundo es un elemento del DOM, normalmente obtenido con `document.getElementById` pero puede ser obtenido con `document.queryElement` o cualquier otro método.

Veamos como usarlos juntos, primero necesitamos un HTML con una etiqueta.

    <main id="app"></main>

Ahora necesitamos obtenerlo y hacer render.

    const element = React.createElement("h1", null, "Hola Mundo!");
    const node = document.getElementById("app");

    ReactDOM.render(element, node);

¡Felicidades! Acabas de renderizar tu primer Hola Mundo! usando React.js

###### Read next: Componentes con React

Los componentes de React son la unidad básica de cualquier aplicación hecha con esta librería, aprende como crear y usar componentes de React.