Campus Party Brasil 2019

Campus Party Brasil 2019

A Tegra participou da Campus Party, representada pelo nosso comercial Polis e Márcia.

O evento está sendo realizado no Expor Center em São Paulo e tem por objetivo promover a experimentação da inovação e integração dos seus participantes.

A decoração do evento é muito diversificada: super heróis, personagens nerds, cosplay

 

Vimos muitos simuladores de jogos, realidades aumentada e virtual.

                                         

CPUs tunadas e em diferentes formatos, de “Chapolim” a “Motor de carro”, impressoras 3D e prototipação de baixo custo.

 

Muitas competições foram promovidas como concurso de música e menor tempo de circuito feito por drones.

    

Muitas palestras sobre temas relacionados a música, comunidades, robótica e principalmente inovação.

Como destaque, a palestra do Charles Schweitzer, Gerente de Inovação da Leroy Merlin, sobre estratégia de inovação, foi a de maior público do evento.

A Tegra Soluções Digitais tem como propósito conduzir a evolução de negócios e pessoas através de soluções digitais únicas, e que gera grande sinergia com a Campus uma vez que inovação e criatividade fazem parte de nosso DNA.

Valeu Campus e até Brasília.

 

UX para todos

UX para todos

Porque UX para todos? Não é só o profissional de designer que cria os layouts e o próprio profissional de UX que precisam saber sobre UX?

A resposta é: “Não”. 
Todos os profissionais envolvidos em um projeto devem saber ao menos um pouco sobre UX, pois o trabalho de cada um influencia o projeto como um todo e consequentemente influencia também a experiência do usuário.

Quem são os profissionais que precisam saber sobre UX?

Criativos digitais:

Podem ser diretores de arte, designers de interface e web designers, todas essas são funções com características semelhantes, tem a necessidade de saber sobre UX.

O criativo digital é responsável por grande parte da experiência do usuário, eu diria que é quase a metade, por isso sua criação deve proporcionar ao usuário uma boa experiência, principalmente porque a interface visual é a primeira coisa que o usuário vê, pode-se considerar que é a parte palpável de um produto digital e se for agradável aos olhos e fácil de entender, o usuário já começa a ter uma boa experiência, porém essa experiência não termina por aí:

A função do designer digital é comunicar, ou seja, transmitir a informação de forma clara.

O mapa de metrô abaixo, foi criado para transmitir as informações para os usuários de forma agradável aos olhos e fácil de entender, porque na verdade a linha do metrô não é reta como mostra a imagem e sim cheia de curvas tortas, mas isso não interessa para o usuário, pois o que ele precisa saber é apenas onde ele está e para onde ele vai. O Designer simplificou essas informações, para que o usuário pudesse ter uma boa experiência.

Mapa Representativo

Mapa Real


Planners / Planejamento Digital:

Os profissionais de planejamento, tem um papel muito importante dentro de um projeto digital, pois são responsáveis pelo objetivo do projeto e necessidade do usuário.

As primeiras coisas a se pensar ao fazer um planejamento é:

– Porque que o usuário precisa desse produto ou serviço? 
– Quais as necessidades dele que serão supridas? 
Pois esses usuários só irão ter interesse no produto, se for satisfazer alguma necessidade ou vontade dele.

Objetivo do Projeto X Lucro

O objetivo final de qualquer projeto é ter lucro, pois as empresas criam os produtos para isso, porém o objetivo do projeto em si, não pode ser somente o lucro e sim atender as necessidades dos usuários, por esse motivo ao criar um planejamento de um projeto é necessário focar na necessidade do usuário e consequentemente ele irá comprar o produto e a empresa terá lucro.

É muito importante cuidar do equilíbrio “Necessidade do Usuário” X “Objetivo da Empresa” e isso não é uma tarefa muito fácil, pois quando é colocado mais peso para a necessidade do usuário, acaba tirando peso do objetivo da empresa e vice versa, mas em tese o objetivo de um planner, é fazer com que esses dois pontos sejam alcançados de forma equilibrada.

Developers / Backends e Frontends

Quem nunca se deparou com essa situação?

Um exemplo:
O usuário precisa que seja exibido apenas cinco informações na tela, mas ao fazer essa requisição o sistema começa a carregar e demora até que aparece as informações. Esse sistema lento está tomando tempo do usuário e talvez dinheiro, tudo porque o programador criou um select que busca tudo que está no banco e depois que carrega as 7000 informações, esse código é manipulado para mostrar apenas o que o usuário pediu.

A experiência desse usuário foi totalmente afetada, devido a esse problema na programação.

A velocidade de processamento é um grande diferencial, principalmente no Brasil que as conexões sem fio são muito ruins, por isso qualquer segundo economizado do usuário, melhora muito a sua experiência. 
Existem inúmeros estudos que mostram que o tempo de carregamento da página consegue aumentar consideravelmente a taxa de conversão, cada segundo de carregamento de página que pode ser reduzido, melhora a experiência do usuário a ponto de influenciá-los ainda mais.

Outro ponto, são códigos mal estruturados, cheios de gambiarras e sem tagueamento. Isso vai influenciar na acessibilidade e no SEO desse projeto.

Esses exemplos citados acima podem prejudicar a experiência do usuário, principalmente os deficientes visuais que navegam pelas páginas com leitor de tela, (Um software que lê o código para os usuários), por esse motivo é muito importante que os códigos sejam bem escritos e com metadados bem definidos.

Gestores de Conteúdo:

São os profissionais que planejam, adequam e disponibilizam todo o conteúdo de um projeto.

Conteúdo é diferente de texto e imagem, não é simplesmente criar vários textos e imagens para o projeto, vai além disso. O conteúdo é tudo aquilo que é oferecido ao usuário de informação sobre um serviço, produto ou ferramentas que o auxiliam em problemas, porém se esse conteúdo for ruim, provavelmente não vai atrair a atenção de ninguém e o projeto está fadado ao fracasso.

É importante também pensar na acessibilidade, porém essa é um pouco diferente da acessibilidade que falamos para os desenvolvedores, por exemplo: o uso de muitos termos técnicos ou palavras difíceis de entender, provavelmente estará impedindo a acessibilidade de alguns usuários mais leigos, por isso é importante adequar todo o conteúdo para o público em geral.

B.I. Business Intelligence / Pessoal de Análise de Dados e Inteligência de Mercado.

Esse profissional é responsável por mensurar todos os resultados bons e ruins depois que a aplicação estiver no ar. Ele avalia a experiência do usuário através de números, ou seja, KPIs que são indicadores de performance. Esses indicadores são definidos no começo do projeto e tem como foco garantir que os objetivos do projeto sejam alcançados e para isso acontecer o objetivo do usuário deve ser alcançado e consequentemente o objetivo da empresa que é ter lucro, também será alcançado.

Como o comportamento e experiência do usuário afetam os números desses KPIs?

Engajamento: trata-se de algo que estimula a vontade do usuário em voltar a visitar uma aplicação continuamente e o engajamento é responsável pela medição da probabilidade dessas visitas. 
Quando o objetivo é engajar o usuário em uma campanha publicitária por exemplo, é necessário medir o tempo de permanência dele na aplicação. Outro bom indicador pode ser uma área para comentários ou avaliações dos usuários.

Interesse pelo produto/conteúdo: para saber se o usuário está interessado ou não no serviço ou produto, também podemos medir o tempo de permanência na aplicação. Se o tempo de permanência for muito baixo, talvez ele não esteja interessado no que está sendo oferecido ou se houver um volume muito alto de pessoas entrando e abandonando rapidamente, talvez seja necessário rever o que está sendo oferecido. 
A taxa de abandono é medida pelo número de pessoas que entram e saem da aplicação sem entrar em nenhuma outra página, essa é considerada como taxa de rejeição.

Taxa de vendas: essa é uma das mais importantes, pois grande parte das aplicações tem o objetivo de vender e se a taxa de vendas for baixa, pode ser que aquilo que está sendo oferecido não está sendo do interesse dos usuários ou pode ser que está havendo algum problema ou dificuldade na hora de efetuar a compra, um problema de cadastro, de pagamento, informação insuficiente sobre o produto. A deficiência que está impedindo o usuário de comprar pode estar em qualquer parte e isso envolve todos os profissionais do projeto.

Entendimento do menu de navegação: a taxa de abandono também pode estar relacionado a dificuldade na navegação, o cliente pode não estar entendendo como navegar e não sai da primeira página. Uma forma de saber o que pode estar acontecendo através do log de buscas internas.

Satisfação do usuário: para medir a satisfação do usuário, podemos verificar a taxa de compartilhamento, os comentários, avaliação por estrelas e taxa de abandono.

Com esses dados o profissional de BI vai validar se o objetivo do usuário e do projeto foram alcançados e através dos números ele vai identificar onde está a deficiência do projeto para gerar uma demanda de correção.

Empreendedores digitais:

Esse é o maior interessado em lançar o produto ou serviço digital e quer ganhar dinheiro com isso.

Existem várias coisas que devem ser avaliadas e levadas em consideração para que um empreendedor possa lançar um produto no mercado, mas uma das mais importantes é o segmento de mercado, ou seja, para quem ele quer vender?

Vender para todo tipo de público no Brasil inteiro é praticamente impossível, mas é possível vender para um público, dentro de uma classe social, com uma renda, dentro de uma localização, idade, perfil social e etc, porém antes de tudo é necessário ter uma proposta de valor, ou seja, saber o que oferecer para esse segmento de mercado, algo que vá gerar valor e atender as necessidades desse público a ponto de pagarem por isso. Essa proposta de valor é na verdade a experiência completa que envolve não só o que falamos neste artigo, mas também a experiência nos serviços com a empresa e relação com o clientes.

Conclusão

Para uma boa experiência do usuário, é necessário ir além de encontrar a melhor solução do problema, é necessário considerar fatores como a acessibilidade, a usabilidade, a utilidade, a eficiência, o fácil entendimento e a satisfação do usuário ao utilizar uma aplicação e isso está atrelado a função de todos envolvidos no projeto como um todo.

“Experiência é o que torna o produto um sucesso ou fracasso.”

Núbia Araújo

Núbia Araújo

UX/UI na Tegra

Os pilares da arquitetura de software na nuvem

Os pilares da arquitetura de software na nuvem

A computação em nuvem já está consolidada a alguns anos como uma excelente opção para aplicações simples ou complexas e seus recursos e serviços não param de crescer. Vide a AWS que já conta com mais de 100 serviços disponíveis em várias regiões do mundo.

Criar novas aplicações ou migrar do on-premise para a nuvem utilizando essa gama de serviços não é nada fácil. Por isso algumas práticas e estratégias devem ser seguidas para conseguir bons resultados e tirar todo o proveito dos serviços.

Quando criamos arquiteturas de sistemas, podemos fazer uma analogia com a construção de um edifício, se a fundação não for sólida, problemas estruturais podem aparecer. Ao arquitetar, não podemos negligenciar princípios básicos como os cinco pilares propostos pela AWS: confiabilidade, performance, otimização de custo, excelência operacional e segurança.

A incorporação desses pilares ajudará você a produzir sistemas estáveis e eficientes e permitir que se concentre em outros aspectos do design, como requisitos funcionais.

Confiabilidade

O pilar da Confiabilidade pode ser explicado pela capacidade de um sistema se recuperar de falhas de infraestrutura ou serviços, subir novos recursos dinamicamente para atender a picos de demanda ou se recuperar de interrupções, como configurações incorretas ou problemas de rede temporários.

As melhores práticas que podem ser aplicadas nesse pilar são:

  • Recuperação de testes: Geralmente quando executamos testes da aplicação é para provar que está tudo funcionando corretamente em um cenário específico, o teste não valida estratégias de recuperação caso ocorra algum falha em um componente do sistema. Na nuvem é possível validar como o seu sistema irá falhar e avaliar os procedimentos de recuperação em diferentes cenários ou recriar cenários em que aconteceram falhas anteriormente. É possível entender mais um pouco sobre recuperação de teste sobre a visão da Engenharia do Caos.
  • Escalar Horizontalmente: Uma arquitetura onde um grande recurso é dividido em vários recursos menores, possibilita que a alocação dinâmica seja feita em momentos de grande demanda, garantindo sempre o atendimento das requisições e eliminando o ponto único de falhas.
  • Não adivinhe a capacidade: É muito comum que em sistemas on-premise a alocação de recursos computacionais seja saturada, por conta do atendimento de altas demandas pontuais. Na nuvem, você pode monitorar a demanda e a utilização do sistema e automatizar a adição ou remoção de recursos para manter o nível ideal sem provisionamento excessivo ou insuficiente.

Performance

O pilar da Performance inclui a capacidade de utilizar os recursos de maneira eficiente e otimizada para atender os requisitos do sistema e manter essa capacidade mesmo com alteração da demanda.

As melhores práticas que podem ser aplicadas nesse pilar são:

  • Democratizar novas tecnologias: Algumas tecnologias podem ser difíceis de implementar ou pouco acessíveis devido a falta de conhecimento e complexidade de instalação. Ao invés de aprender como manter uma tecnologia, o mais fácil é apenas consumi-la como um serviço, por exemplo: bancos NoSQL e serviços de Inteligência Artificial.
  • Serviços Globais: Implemente facilmente o sistema em várias regiões em todo o mundo com apenas alguns cliques. Isso permite que você forneça menor latência e uma melhor experiência para seus clientes a um custo mínimo.
  • Serverless: Com arquiteturas Serverless não se faz necessário configurar e manter servidores para a sua aplicação e escalar recursos para altas demandas. Isso remove os problemas operacionais, reduz o custo da aplicação e atende globalmente os usuários.

Otimização de Custo

O pilar da Otimização de Custo pode ser resumido pela capacidade de executar aplicações pelo preço mais baixo comercialmente.

As melhores práticas que podem ser aplicadas nesse pilar são:

  • Adote um modelo de consumo: Pague apenas pelo tempo necessário dos recursos e aumente ou diminua o uso dependendo dos requisitos do negócio, sem precisar fazer previsões muito elaboradas de custo. Um exemplo são ambientes de desenvolvimento e testes que acabam sendo utilizados apenas 8 horas ao dia durante a semana. É possível pará-los quando não estão em uso e economizar até 75% do custo.
  • Não gaste dinheiro com operações: Elimine os gastos de manutenção de servidores, equipamentos de rede, resfriamento do datacenter e fornecimento de energia. Sem esses gastos e preocupações é possível focar nos clientes e projetos e não em infraestrutura de TI.
  • Análise da distribuição de custos: É possível identificar o uso e o custo de cada sistema que está rodando na nuvem de forma transparente. Isso ajuda a medir o retorno do investimento (ROI) e oferece uma oportunidade de otimizar seus recursos e reduzir custos.

Excelência Operacional

O pilar da Excelência Operacional é a capacidade de executar e monitorar sistemas para diminuir custos e melhorar continuamente os processos de otimização e suporte.

As melhores práticas que podem ser aplicadas nesse pilar são:

  • Infraestrutura como código: Da mesma forma que o código é utilizado para construir uma aplicação, por ser utilizado também para construir e manter a infraestrutura de todo o seu ambiente na nuvem. Você pode utilizar scripts para automatizar procedimentos operacionais que podem ser disparados automaticamente, limitando erros humanos.
  • Alterações frequentes, pequenas e reversíveis: Projete a utilização dos recursos para permitir que os componentes sejam atualizados frequentemente. Faça pequenas alterações incrementais que possam ser revertidas em caso de falha.
  • Antecipe falhas: Realize testes para identificar potenciais falhas e monitore para aprender e melhorar o processo. Crie cenários onde os procedimentos de respostas sejam acionados para garantir que sejam eficazes e que as equipes conheçam a sua execução.

Segurança

O pilar Segurança se resume pela capacidade de proteger informações e sistemas, ao mesmo tempo em que agrega valor aos negócios por meio de avaliações de risco e estratégias de mitigação.

As melhores práticas que podem ser aplicadas nesse pilar são:

  • Rastreabilidade: Monitore, alerte e analise as transações do seu ambiente em tempo real. Utilize logs e métricas de integração com sistemas para responder e agir automaticamente.
  • Proteja os dados: Utilize mecanismos, como criptografia ponta a ponta, tokens e controle de acesso, quando apropriado.
  • Afaste as pessoas dos dados: Crie mecanismos e análise ou elimine a necessidade de acesso direto ou processamento manual de dados. Isso reduz o risco de perda ou modificação e erros humanos ao manusear dados confidenciais.

Conclusão

Seguir as práticas dos cinco pilares da arquitetura em nuvem para projetar e operar suas aplicações, fará com que elas sejam seguras, confiáveis e eficientes economicamente. Você estará aproveitando todas as vantagens que a nuvem tem a oferecer e poderá focar seus esforços nos clientes e requisitos funcionais.

Samuel Pisa

Samuel Pisa

Desenvolvedor de Software na Tegra Soluções Digitais

E-mail: samuel.pisa@tegra.com.br

Bem estar no ambiente de trabalho

Bem estar no ambiente de trabalho

Vivemos uma mudança importante na forma de enxergar o ambiente de trabalho.  Os colaboradores hoje valorizam além de remuneração e benefícios, o local e cultura das Organizações, afinal, passamos grande parte do nosso dia na empresa.

“A qualidade de vida no trabalho está relacionada ao conjunto de ações que uma organização aplica para oferecer condições plenas de trabalho, desenvolvimento humano, bons relacionamentos interpessoais e bem-estar dentro e fora da empresa.” Sociedade Brasileira de Coaching, 2017.

Existem várias formas de promover o bem estar aos colaboradores, dentre elas podemos citar, a cultura. Empresas que favorecem interação, relações respeitosas e líderes colaborativos ganham em muito na qualidade de vida de seus colaboradores.

Empresas como GE, Vale, Unimed e Delloite organizam campeonatos esportivos para incentivarem a prática do esporte, da saúde e dos relacionamentos interpessoais.

O estímulo do espírito de equipe faz toda a diferença para Organizações e aos líderes engajados, pois os resultados são mensurados através de objetivos coletivos e não individuais, o que aumenta a produtividade de forma exponencial.

Empresas que oferecem oportunidades claras de futuro têm colaboradores mais motivados, já que estes veem as chances de evoluir em sua carreira de uma forma palpável, e por isso, se dedicam ainda mais.

A flexibilidade é outro fator importante, tanto para o cumprimento da carga horária, como forma de execução do trabalho. O aumento do “Home Office” é significativo nos últimos anos, principalmente em grandes metrópoles, e a tendência é que continue neste crescimento.

Muitas Organizações contam com ambientes descontraídos, chamados entre tantos nomes, de “ descompressão”, para que os colaboradores descansem entre as atividades e interajam com a equipe, alguns contam com videogame, mesas para jogos, espaços para leitura, levando em consideração cultura e maior interesse dos colaboradores.

É essencial portanto que itens como ergonomia, segurança, iluminação, temperatura, sonoridade e higiene sejam itens indispensáveis para todas as Organizações, da menor a maior.

Segundo a “Revista Forbs”, de 2018, o bem-estar dos funcionários têm impactos mais profundos. A revista “Harvard Business Review” publicou que, em média, empregadores que investem em saúde e bem-estar viram US$ 6 em economias de saúde para cada dólar aplicado nesse tipo de iniciativa. A instituição de pesquisas e análises Rand Corporation estima que o ROI (retorno sobre investimento) para negócios em geral é de US$ 1,50 para cada dólar gasto, enquanto a média para a prevenção de doenças é de US$ 3,80 para cada dólar investido.

Esse tipo de postura aproxima a Corporação do colaborador, o que melhora o clima organizacional e contribui para que o funcionário se sinta valorizado.

“A verdade é que ninguém é feliz por ser bem-sucedido, a pessoa é bem-sucedida porque é feliz!” Sociedade Brasileira de Coaching, 2017.

É importante compreender que a qualidade de vida no trabalho não está atrelada somente  à área profissional ou é apenas de importância das empresas, sendo um item importante para saúde física e mental do bem mais precioso das Organizações: as pessoas!

 

 

Manipulando estado com Observables e Subjects usando RxJs

Manipulando estado com Observables e Subjects usando RxJs

Qualquer um que já começou a organizar uma aplicação que foi crescendo em tamanho se deparou com esse problema: Ou cada componente seu guarda seu estado e você se encontra em um mar de duplicações de valores, ou você passa prop do pai até o tataraneto só para poder acessar uma ação ou informação nos miolos dos seus componentes.

É por isso que precisamos conversar sobre “Centralização do Estado”, um dos modos de utilizar o conceito do SSOF (Single Source of Truth), e é por isso que existem bibliotecas fantásticas que realizam este tipo de trabalho, como o Flux, Redux, MobX, etc. Todas elas são ótimas libs mas dependem de você aprender uma outra arquitetura.

Se o seu caso é como o meu e do pessoal da Tegra que já trabalha com RxJs, saiba que é possível fazer a sua própria solução simples para armazenar e centralizar o estado da sua aplicação utilizando essa mesma lib.

Quando o React atualiza a interface?

É importante deixarmos bem claro que o React atualiza a interface na tela no navegador (aka Render) em duas situações:

  1. Se as Props do componente mudam.
  2. Se o Estado interno do componente muda.

Teoricamente, se você tem uma Stream de dados e, quando estes dados forem modificados, você pegar esta informação e passar como as Props do seu componente, o seu componente seria atualizado.

Para fazer esse tipo de magia, utilizamos um amigo nosso do RxJs muito útil, chamado de BehaviourSubject.

O que é o BehaviorSubject?

É meio complicado explicar o que é um Subject, mas um jeito muito prático é se você imaginar uma roda de conversa.

  1. Imagine uma roda de conversa entre amigos.
  2. Todos que estão na roda estão “inscritos” no Subject, portanto, recebem as informações que este Subject tem.
  3. Quando alguém fala: “Subject, o próximo assunto é Comida”, o Subject recebe a alteração e envia para todo mundo qual é o próximo assunto.
  4. Agora, todos sabem que o conteúdo do Subject é “Comida”
  5. Quando alguém novo chega e se inscreve no Subject, ele automaticamente recebe o valor “Comida”
  6. Alguém novamente diz: “Subject, o próximo assunto é Protecionismo Florestal”.
  7. Agora, todos, inclusive o recém chegado, recebem que o novo conteúdo do Subject é “Protecionismo Florestal”.

Traduzindo isso em código, seria mais ou menos assim (código do JsBin):

const roda$ = new BehaviorSubject('Animais');
const pessoa1 = roda.asObservable().subscribe(...);
const pessoa2 = roda.asObservable().subscribe(...);
const pessoa3 = roda.asObservable().subscribe(...);
roda$.next('Comida');
const pessoa4 = roda.asObservable().subscribe(...);
roda$.next('Protecionismo Florestal');

O BehaviorSubject faz a vez da Store

Deste modo, podemos utilizar o poder do Subject para realizar tudo o que nossa Store precisa fazer.

  • Nosso componente se inscreve (Subscribe) na Store e mapeia os dados dela para as props.
  • Quando a Store envia um novo valor (o novo estado), o componente é atualizado automaticamente
  • Quando o componente é destruido, ele faz o Unsubscribe na Store.

Criando sua Store com BehaviorSubject

Para criar uma Store que irá armazenar o estado da sua aplicação ou do seu módulo, é preciso que ela tenha alguns métodos básicos, como:

  • Criar a Store com dados iniciais.
  • Atualizar o estado
  • Pegar o estado atual

Portanto, criaremos uma Factory para que sempre que seja preciso criar uma nova Store, seja fácil como encher um copo de água na cozinha da sua empresa.

Algumas informações sobre o código acima:

  • Ele está escrito em Typescript, mas pode ser facilmente reconvertido para Javascript.
  • A const UpdateState aceita tanto um objeto literal ou uma função, assim como o setState do React faz.

Criando sua Store

Agora que temos nossa Factory, podemos criar nossa Store de uma maneira bem simples, e para isso, utilizaremos o exemplo de sempre: Um Contador.

  • Definimos uma Interface e criamos um objeto que representa os dados inicias da Store.
  • Após isso, inicializamos nossa Store e fazemos um destruct do objeto que ela nos retorna, tendo acesso ao Subject e aos handlers para atualizar e ler os dados.
  • Criamos nossas 3 ações: Incrementar, Decrementar e Resetar, todas elas atualizando o estado.
  • Definimos uma constante que contém todas estas ações
  • Exportamos nosso estado como Observable e nossas ações.

Conectando o Container Component na Store

Agora o Container Component só irá conectar as pontas de tudo:

  • Ele, ao montar, irá se inscrever na Store e colocar os dados dela no estado interno dele.
  • Os botões da interface irão chamar ações da const Actions que se encontra na store.
  • Quando as ações executarem, o componente será renderizado novamente.
  • Quando o componente for destruído, cancelamos nossa inscrição da Store.

Criando uma HOC

É possível ver que isso funcionou bem, porém, fica bem cansativo a cada Container, escrever toda essa lógica do Mount, Unmount e Subscribe, correto? Por isso que podemos fazer uma HOC (Higher Order Component) que recebe a lógica para processar mapear a Store e o Componente base, e nos retorna o mesmo componente já conectado com a Store (semelhante ao que o Connect do Redux faz)

O que fazemos aqui é o mesmo que foi feito antes, porém de uma maneira mais genérica:

  • Temos uma função que recebe dois parâmetros: O Componente e a Stream
  • O retorno dessa função é um PureComponent que, no seu DidMount, se inscreve na Stream, e ao ser destruído, cancela a inscrição da mesma.
  • Ele tem dois dados no estado dele: Se a Stream já carregou pela primeira vez e os dados que ele recebe da Stream
  • Ao receber os dados (no Subscribe), ele atualiza o seu estado interno.
  • No seu Render, ele renderiza o componente passado como parâmetro, passando os dados da Stream como Props.

E com isso, podemos simplificar ainda mais no nosso Container Component feito alí em cima:

Demo

Você pode conferir o Demo funcional com o código final em Javascript neste link no CodeSandbox.

Até o próximo,

Sobre deixar seu melhor por onde passar — O caso da cozinha

Sobre deixar seu melhor por onde passar — O caso da cozinha

Em minha rotina de trabalho, costumo almoçar quase todos os dias na cozinha da empresa. Além de ganhar tempo, me distraio e converso com meus colegas de trabalho.

Em uma dessas conversas, papo vai e papo vem, levantei da mesa para lavar minha louça. Nesse momento, um dos meus colegas pediu para lavar os talheres dele. E pronto! Foi o início da brincadeira, onde todos foram deixando seus talheres para eu lavar. Em meio as risadas, não hesitei em falar: “Eu não vou lavar, não! Cada um leva o seu.” A brincadeira continuou enquanto lavava os talheres de todos.

Poderia ter sido mais uma brincadeira típica do nosso cotidiano extrovertido, se não fosse uma história contada por outro colega, pertinente ao ocorrido da louça e que muito me chamou a atenção. Guardei a “história do escoteiro” como costumo chamá-la, como nota mental e venho digerindo-a ao longo dos dias.


História do escoteiro

Resumidamente, a história conta que uma das regras de escoteiro é deixar o lugar melhor que encontrou, no caso da cozinha, deixá-la mais limpa. Ou seja, sempre buscar fazer um pouco melhor em todos os lugares que passar, coisas que fazer.

A partir de então, comecei a observar nos grupos que convivo e lugares que frequento o comportamento das pessoas, inclusive o meu. A conclusão que cheguei é que realmente, na maioria das vezes, a história do escoteiro é apenas história.

Em pequenas coisas, como guardar a bandeja no shopping após comer aquele lanche, limpar a mesa após almoçar, pegar papel caído no chão mesmo que outra pessoa tenha jogado. Foram nesses detalhes que percebi que as pessoas não se preocupam tanto (claro que isso não é regra) em fazer o melhor por onde passam.

A história contada pelo meu colega me fez refletir como posso fazer meu melhor todos os dias, seja em projetos do trabalho, relacionamento, amizades. Procurando sempre pensar que são os detalhes que, no final, fazem a diferença, embora muitas vezes imperceptíveis.

Moral do caso da cozinha é que sempre devemos nos colocar no lugar do próximo. Essa frase, embora soe tão bonita, é difícil de se praticar e acredito que a melhor maneira é começar pelas coisas simples. Então por que não deixarmos a cozinha mais limpa do que encontramos?