Usamos la importación de React para parsear el JSX y ReactDOM para renderizar nuestro componente en un elemento raíz con el id de “root”. Los elementos que deben tener dos etiquetas, como div, main https://barrazacarlos.com/es/el-curso-de-desarrollo-web-que-te-ensena-todo-sobre-frontend-y-backend/ o button, deben tener su cierre, la segunda etiqueta en JSX, de lo contrario se producirá un error de sintaxis. La mejor manera de crear tu aplicación depende de lo que quieras hacer con ella.
- Aprender a crear aplicaciones web sencillas basadas en React desde cero y empieza a dominar una de las librerías más usadas creada por Facebook.
- Incluso si no estás familiarizado con JavaScript, muchos sitios web ofrecen lecciones de programación gratuitas.
- En el componente anterior, hemos creado una variable de estado llamada language con un valor de cadena «JavaScript».
- Las personas esperan que las páginas de las aplicaciones web carguen rápidamente.
- React permite diseñar interfaces más complejas a través de bloques reutilizables de mayor nivel y más abstractos, lo que se conoce como componentes.
React puede utilizarse con muchas tecnologías como Bootstrap, Tailwind CSS, Axios, Redux, Firebase, y muchas más. También podemos utilizar React con Node.js y otros lenguajes de backend para construir aplicaciones full-stack y aplicaciones web que se ejecuten a la velocidad del rayo. Una de las características fundamentales de React Native es el puente nativo, una capa que conecta el código JavaScript con los componentes nativos de la plataforma. Esto permite a los desarrolladores acceder a las capacidades nativas del dispositivo, como la cámara o el GPS, directamente desde el código JavaScript.
¿Por qué React?
Fue creada en 2011 por Jordan Walke, un ingeniero de software que trabajaba en Facebook y que quería simplificar la forma de crear interfaces de usuario complejas. Dependerás de funcionalidades de JavaScript como los bucles for y la función map() de los arreglos para renderizar listas de componentes. También es sumamente funcional para personalizar tu sitio web, gracias a su gran capacidad para integrarse con otros elementos.
JSX puede llegar a ser tan simple que parece un lenguaje de plantilla. En este blog, te ayudaremos a comprender El curso de desarrollo web que te enseña todo sobre frontend y backend JS y cómo puede ser una parte esencial de tu conjunto de herramientas como desarrollador web. Cuando llegues al final de este libro, obtendrás una aplicación desplegable totalmente funcional.
Componentes y Props
React permite isomorfismo, lo que significa que, con el mismo código, somos capaces de renderizar tanto en el cliente como el servidor. React es una biblioteca (también traducido como “librería”) de JavaScript para construir interfaces de usuario. Puedes usarla para crear interfaces de usuario que se actualizan y que se muestran de forma muy eficiente porque React solo actualiza los componentes que deben ser actualizados.
Cualquier valor que pasemos en esos atributos se mostrará en el navegador. Esto es importante para los componentes que se utilizarán en varios componentes pero que requieren sus propios datos diferentes. Uno de los React Hooks más utilizados es useState, el cual permite a los componentes funcionales tener su propio estado interno. Anteriormente, esto solo era posible con componentes de clase, lo que hacía que el manejo del estado fuera más complejo. Con useState, el manejo del estado se vuelve más sencillo y claro, ya que no es necesario crear una clase separada para gestionar el estado.