Há algum tempo o Facebook criou uma forma inusitada para indicar o carregamento de suas páginas, o chamado Shimmer Effect, que nada mais é que a exibição de um esqueleto da página em forma de animação no lugar de um Spinner ou uma Barra de Progresso
O Shimmer Effect é uma alternativa muito efetiva em relação ao loading tradicional pois permite que sejam criadas Skeletons Screens, que são as páginas onde enquanto o conteúdo é carregado de modo assíncrono o Shimmer está aparecendo, e ele dá um feedback bacana para o usuário, trazendo as seguintes vantagens:
- Faz com que o usuário perceba que a página/tela carrega rápido;
- Acaba com a surpresa sobre a interface;
- Carregamento gradual da interface;
- Indicação clara de progresso;
- Mostra exatamente o que já foi carregado e o que ainda tem para carregar.
Esse projeto foi desenvolvido usando as seguintes tecnologias:
Para fazer uma cópia dessa aplicação, você precisará Git, Node.js + npm (npm é baixado com o Node.js) instalados no seu computador.
Pelo Seu Terminal:
# Clone this repository
$ git clone https://github.com/jotape02/linkedin-clone
# Go into the repository
$ cd linkedin-clone
# Install dependencies
$ yarn install
# Run
$ yarn start
# running on port 3000- Faça um fork desse repositório;
- Cria uma branch com a sua feature:
git checkout -b minha-feature; - Faça commit das suas alterações:
git commit -m 'feat: Minha nova feature'; - Faça push para a sua branch:
git push origin minha-feature.
Depois que o merge da sua pull request for feito, você pode deletar a sua branch.