fazt / basics_react

ejemplos y conceptos basicos en react.js

• create .babelrc
• add extensions

Recomendations

• bind

Plugins from Atom

• react
• atom-beautify

Examples

la carpeta examples contiene algunos ejemplos basicos como: una tienda

Conocimientos Previos

• SPA: single-page applications
• MVC: react es la V
• Ajax
• necesario saber configurar webpack
• necesario saber configurar babel
• necesario saber JSX
• necesario saber es6
• destructuring

Adventages

JSX:

• reduce el codigo que se tiene que escribir
• es mucho más legible
• los diseñadores UI pueden contribuir al desarrollo

Tools

• JSX:
  • visor en tiempo real de la conversion de Jsx a javascript: https://babeljs.io/repl/

Consideracioens

• los componentes en REACT deben empezar con MAYUSCULAS, para diferenciarse de ETIQUESTAS HTML
• virtual Dom
• simple flow data
• Components
  • Props
    • props cannot be modified and should be trated as immutable
• previene ataques XSS por defecto
• un componente no debe mutar us propiedades
• es mejor evitar duplicar el estado en las propiedades
• es mejor evitar los estados de los componentes en la medida de lo posible
• todas las etiquetas de ser autocerradas

props states statics methods in es6 react displayName life cycle

Ejercicios Basicos en React

Tutoriales

• React Router https://github.com/ReactTraining/react-router
• Life Cycle: http://videos.bigbinary.com/react/react-life-cycle-methods-in-depth.html .