PWA com React

O que é PWA? O PWA vem da sigla “Progressive Web App”, ele é um web app que usa as modernas funcionalidades dos navegadores para entregar uma experiência de um app na web para os usuários. Ele é muito similar a um sistema web, tem só que satisfazer alguns requisitos (que serão comentados abaixo). Fora…

Continuar lendo

Reactjs no back-end

Cada dia que se passa me surpreendo com as belezas do Reactjs, essa biblioteca fantástica, que me permite trabalhar no lado do servidor 😱. Vou explicar como a mágica acontece: O Next.js que é um framework para aplicativos react que faz renderização do lado do servidor(server-rendering) por padrão, entre muitas outras otimizações de desempenho como:…

Continuar lendo

Um Ensaio sobre Arquitetura Fractal usando Webpack e React

Aplicações de menor porte são normalmente organizadas de modo a separar os arquivos por natureza; componentes, contêineres, rotas, etc. O resultado é uma aplicação com uma estrutura parecida a esta: components/ Header.js HomePage.js Footer.js Post.js PostList.js PostPage.js User.js UserProfile.js UserAvatar.js containers/ App.js Post.js User.js routes/ index.js post.js user.js router.js index.js   Essa estrutura, porém, não…

Continuar lendo

CSS Modules + React: conceitos básicos

Repositório com exemplo completo (branch react) Introdução ao CSS Modules Como reaproveitar estilos usando CSS Modules Antes de mais nada, é preciso instalar as dependências para criar um site com React. Vale lembrar que partimos do ponto onde paramos no artigo anterior. Se você não leu, dê uma olhada antes de continuar. npm i -D…

Continuar lendo

Criando content loaders confiáveis

Content loaders (também conhecidos como placeholder loaders, ou skeleton loaders) além de serem legais são muito úteis para UX, como por exemplo: O loading mostra uma prévia do que será o conteúdo. O usuário tem a percepção que o conteúdo carrega mais rápido. Cria uma expectativa no usuário e evita surpresas. Problemas Fato é que…

Continuar lendo

Como funciona o Styled-components por debaixo dos panos

O CSS-in-JS está se tornando cada vez mais comum no desenvolvimento moderno de front-end, especialmente na comunidade React. O styled-components se destaca na lista porque ele adota tagged templates e permite criar componentes React normais definindo apenas estilos. Ele também resolve problemas importantes, como modularidade CSS, fornece recursos non-CSS, como aninhamento, e todos esses recursos…

Continuar lendo

Render Props para reutilização de componentes

A sua, a minha, a nossa!   Fala minha gente, tudo certinho? Faz pouco mais de um mês que fui agraciado com o conhecimento sobre Render Props e hoje tô aqui pra passar pra vocês o que tem acontecido desde então. API Render Prop já está no React faz um bom tempo, porém sua utilização…

Continuar lendo

8 motivos para migrar para Drupal 8 agora!

O texto a seguir é inspirado em uma tradução livre e estendida do artigo  “7 Reasons Why Now is The Right Time to Move to Drupal 8”, de autoria de Dmitrii Susloparov. — É dito que o Drupal 8 é como um presente para os produtores de conteúdo, uma vez que estas são as pessoas…

Continuar lendo