Las cookies nos permiten ofrecer nuestros servicios. Al utilizar nuestros servicios, aceptas el uso que hacemos de las cookies. Más Información. Aceptar

Fundamentos de React

Álvaro Yuste Torregrosa
  • Escrito por Álvaro Yuste Torregrosa el 05 de Noviembre de 2019
  • 2 min de lectura Desarrollo Web
Fundamentos de React

Te detallamos qué fundamentos necesitas conocer para poder comenzar a desarrollar tus aplicaciones utilizando React y sacarle todo el partido a este estupendo framework frontend.

Los conocimientos previos necesarios para poder utilizar React los vamos a dividir en diferentes apartados.

Sistemas de diseño

Es interesante conocer los sistemas de diseño básicos, quizás empezando con algunos más tradicionales y acabando en con concreto los que se utilizan para el desarrollo de React.

Aquí vamos a ver una clara evolución desde unos sistemas de diseño más basados en páginas, que es al final como la web se comportaba y se estructuraba en el pasado, hasta el concepto de componentes.

Estos componentes acaban siendo en las aplicaciones actuales y basadas en casi cualquier framework que existe actualmente, la pieza fundamental que forma las interfaces.

Los componentes los vamos a encontrar siempre con una parte estructural, una parte de estilos y una parte de comportamiento, y al final van a ser cápsulas que se comportarán como una unidad independiente y se comunicarán con las otras cápsulas o componentes que tienen a su alrededor.

Referente a estos sistemas de diseño, encontramos un caso concreto de estudio algo más detallado, cómo es el Atomic Design, que es capaz de diferenciar en categorías estos componentes según como se agrupan entre ellos y la entidad que forma. Así acabamos teniendo átomos, moléculas, etcétera, para acabar conformando las páginas finales.

Un conocimiento básico de estos sistemas de diseño siempre nos va a ayudar a entender cómo funcionan estos frameworks modernos de desarrollo frontend.

JavaScript moderno

Como segundo apartado de estos fundamentos para comenzar a desarrollar con React, nos encontramos con que hay funcionalidades de JavaScript moderno que realmente nos van a ayudar de una manera muy importante cuando nos encontremos en situaciones concretas en el desarrollo.

Entre estas características podemos encontrar:

  • Nuevas formas de sintaxis, cómo pueden ser las Arrow Functions.
  • Estructuras como las clases, que se han introducido en React recientemente.
  • Nuevas notaciones para las variables y las funciones como constantes.

Tenemos una serie de características que, aunque no pertenecen al JavaScript moderno, gracias a ellas el desarrollo en React es más viable y no se convierte en algo tan tedioso como podría llegar a ser.

Anatomía de React

Una vez tenemos estas bases más generales, podemos entrar a conocer la anatomía de React, para saber cómo se comporta por dentro y entender, a la hora de desarrollar, qué sucesos ocurren en el flujo y que nos sorprendan comportamientos extraños.

Al final el conocimiento de la anatomía y de qué partes componen React nos permiten saber cómo acaba pintando lo que vemos por pantalla y cómo actualiza esa información para que los cambios sean rápidos.

React tiene unas funcionalidades bastante interesantes, que son las que le han dado la principal popularidad, y conocerlas nos va a ayudar mucho a empezar a desarrollar de una manera más sencilla.

Ecosistema de React

Para acabar con estos fundamentos, nunca está de más, sobre todo en el caso de React, conocer el ecosistema que engloba a la propia librería.

React es una librería bastante concreta, bastante pequeña y muy focalizada en su objetivo principal, que es, el renderizado en pantalla. Por este motivo necesita la ayuda o el complemento de otras muchas librerías que ofrecen funcionalidades también necesarias para cualquier aplicación, como por ejemplo el enrutado o la gestión del estado de la aplicación.

Conociendo este ecosistema vamos a ser capaces de entregar una aplicación completa, robusta y con todas las capacidades cubiertas, aprovechando esta variedad de librerías que nos ofrece el ecosistema de React.

Relacionado

Te dejamos una selección de cursos, carreras y artículos

Frontend Developer Profesional

Frontend Developer Profesional

carrera

Incluye 17 cursos:

  • Curso de Polymer
  • Curso de React JS
  • Optimización Web en el Navegador

y 14 cursos más!

Duración: 63 horas y 1 minuto

Por que elegir React

Por que elegir React

Desarrollo Web

05 de Noviembre de 2019

Si estás pensando comenzar a utilizar un framework frontend y no sabes por cuál de ellos decidirte, te detallamos los motivos por los que deberías seriamente pensar en decantarte por React.

Curso de React Native intermedio

Curso de React Native intermedio

curso

Con este curso aprenderás:

  • Aprenderás a estructurar tus proyectos en ReactNative para que sean reutilizables.
  • Configurar y ejecutar una aplicación sin usar Expo.
  • Integrar diferentes librerías con dependencias nativas en iOS y Android.

Duración: 6 horas y 37 minutos

Más de 300 empresas confían en nosotros

Oesia
Vass
Everis
Ayesa
Altran
Ibermatica
Atmira
GFI
Accenture
GMV
Concatel
Telefonica
Caser
Banco de España
kpmg
Mapfre
Randstad