sábado, 14 de julio de 2018

Cambiar un valor del state del padre desde hijo en React

Estos días ando metido en el mundo con más estilo, mas cool o más “hispter” XD de JavaScript y es que usando librerías como React que es maravillosa, te sientes a la última moda en tecnología y hasta dan ganas de iniciar una startup al más puro estilo silicon valley (por cierto, grandiosa serie de HBO) pero en el andar de este mundillo te topas con temas como ¿Se puede afectar un valor del state de un componente principal o padre desde un componente hijo? Vamos a poner un escenario, tienes tu App.js donde montas otros componentes como por ejemplo un Boton.js que debe contener un botón cualquiera que al hacer clic en él, debe actualizar un valor del state en App.js de forma que podamos disfrutar de las bondades del state. Bueno aquí la técnica.

Para lograr este comportamiento solo debemos definir un método manejador en App.js que se encargara de actualizar el valor del state, para luego pasarlo como prop al componente Boton.js, vamos al código:

Componente App.js:

class App extends Component {
  state = {
    saludo: "Saludos"
  }

  // Usamos una función flecha, para no tener que hacer
  // el binding desde el constructor
  // Nos ahorramos unas líneas y se ve más elegante ;-)
  handler = (param) => {
    this.setState({
      saludo: param
    })
  }

En el render donde montamos el componente buscador, pasamos el método manejador:
render() {
    return(
      <div>
        <label>{this.state.saludo}</label>
        <Boton handler={this.handler} />
      </div>
    )
  }

Componente Boton.js:

class Boton extends Component {
  someMethod = () => {
    this.props.handler("Hola mundo")
  }
 
  render() {
    return(
      <div>
      <Button onClick={this.someMethod}>Clic aqui</Button>
      </div>
    )
  }

Con esta técnica, si hacemos clic en el botón “Clic aquí”, este afectara al valor saludo del state del componente App, actualizando en automatico el correspondiente texto del label en App.js.

Así de simple, espero les sea de utilidad. Saludos y felices códigos.



viernes, 29 de junio de 2018

Servidor Node persistente


Si estamos planeando poner en producción un proyecto desarrollado en NodeJS, podremos valernos de herramientas como la que les presentare a continuación que nos permiten ejecutar un proceso Node de manera continua, ya que como sabemos si el proceso encuentra un error, este se dentendra y basicamente lo que hacen estas herramientas es volver a iniciar el script, pues bien esto lo logramos con forever una herramienta CLI que nos permitirá ejecutar un script en Node de manera continua, si por algún motivo este se detiene, forever se encarga de levantarlo de nuevo, inclusive con la posibilidad de guardar logs, para su posterior consulta. Vamos al grano.


Empecemos con instalar forever:

npm i -g forever


Seguido ejecutamos el comando de la siguiente manera:

forever start app.js

Podemos especificar donde queremos los log con la opción “-l”

Forever –l mislogs.txt app.js

Podemos encontrar más información sobre sus opciones en su repositorio github 



Existen otras alternativas como pm2 y supervisord que son mas complejos. Espero que les sea de utilidad. 

Saludos y felices códigos.