As 5 melhores libs de UI para React ja usei
Hoje em dia o css já consegue nos entregar coisas magnificas, por isso gosto muito de usar o styled-components que combina muito bem com react, e é uma lib que consegue entregar tudo que preciso, porém em alguns projetos precisamos de um pouco mais de velocidade, por isso muitas vezes acabamos escolhendo alguma lib de UI que nos ajude entregar componentes de forma mais rápida sem investir muito tempo em css, por isso vou listar aqui as 5 melhores libs de UI que eu já usei e gostei bastante da experiência.
React Bootstrap
Para quem está acostumado com o Bootstrap, ele é bem parecido. A diferença é que você tem componentes React usando o Bootstrap como core.
Ela possui uma gama bem grande de componentes, ela tem um sistema de grid bem fácil de ser usado e um ponto bem positivo o tamanho da lib que minificada é de 114.5kb, ou seja, ela é bem pequena e entrega muito valor, vale a pena ser testada.
Ant Design
Apesar de já ter usado ela para alguns testes, nunca trabalhei em um projeto profissional usando essa lib, mas achei ela bem legal e bem simples de ser usado.
Um ponto bem forte nessa lib é a questão da documentação que é muito bem escrita e tem muitos exemplos de como poder usar cada componente, eles possuem também um sistema de grid muito bom, o sistema de cores deles é fantástico, possuem uma paleta legal e um sistema baseado em level para tonalidade de cor, ou seja, a cor vermelha pode ser declarada dessa maneira:
red-1
red-2
red....
red-10Uma mesma cor tem dez leveis de tonalidade e isso é muito bacana. Além de possuir ícones que podem facilitar seu trabalho para montar tabelas e menus visualmente mais bonitos.
O tamanho dela é de 174b e se for usar o ant-design-icons ela vai ocupar mais 772kb, no seu projeto.
Chakra UI
Essa é uma lib um pouco mais nova, vem ganhando bastante espaço, curti muito usar está lib em alguns projetos pessoais, ela é bem flexível, ou seja, na documentação dela você vai ver como implementar ela se, estiver usando, nextjs, gatsby ou react puro.
Os componentes criados por essa lib seguem os padrões da WAI-ARIA de o que os componentes precisam para terem/serem fácil acessíveis para uso.
Você também tem a disponibilidade de instalar os ícones que a biblioteca oferece e até mesmo uma lib de temas. O tamanho é de 421.5kb, se for usar os ícones juntos, sua aplicação vai ficar 2.3kb mais pesada.
Semantic UI React
Já usei em alguns projetos profissionais e atendeu muito bem aquilo que precisa ser resolvido que era, layout uniforme e velocidade que o projeto precisava ser entregue. Os motivos pelos quais ela foi escolhida eu não sei, pois quando entrei no projeto ele já estava em andamento, talvez por ser um projeto pequeno esse tenha sido o grande ponto pela decisão.
Quando falamos em componentes eu sinto que essa biblioteca não tem uma grande variedade, mas dentre os componentes que ela disponibiliza, existe uma grande variedade de formas e cores para serem utilizados. Também gostei da maneira que podemos controlar o state de cada componente.
Mas um ponto que achei negativo dessa lib é a documentação que sinceramente achei mal escrita e muito confusa.
Ela não é tão grande 263.2kb, então para projetos pequenos talvez possa atender muito bem.
Material UI
Talvez uma das bibliotecas de UI mais utilizadas em conjunto com React hoje em dia. Ela foi criada em 2014 e é um projeto open-source, desenvolvida e mantida pela google.
Ela possui uma documentação muito boa, possui muitos componentes para React e também muitos exemplos de como usar cada um deles de várias formas. Possui um sistema de layout muito bom e tranquilo para usar tanto em desktop quando em mobile, então se você precisa de um sistema responsivo, essa lib consegue fornecer isso. Ele possui os seus próprios ícones, isso pode nos ajudar muito em tempo de desenvolvimento.
Um dos pontos fracos que “eu acho” é a questão de ela colocar muitas classes css em seus elementos, na hora de debuggar alguma coisa pelo browser fica um pouco complicado e quando você precisa estilizar algum componente, não é tão simples assim, isso pode lhe atrasar um pouco.
O tamanho dessa brincadeira é de 335.8kb, mas se você for precisar dos ícones pode tomar um susto, pois ele tem o tamanho de 2.2mb, isso mesmo, é bem grande, o que talvez faça você escolher outra lib de ícones.
Galera lembrando que fiz essa lista baseado em projetos que já trabalhei e em projetos pessoais, pensando em praticidade de usar, manipular e peso dessa lib.
Bom por hoje é isso espero que tenham gostado, qualquer, dúvida, sugestão ou crítica, será muito bem recebido. E isso aí abraços quentinhos para vocês, eu fui…..