Content
Escolha da biblioteca de interface
Este relatório descreve de forma resumida a decisão de utilizar shadcn/ui como biblioteca de componentes de interface no desenvolvimento do frontend do sistema CaronaShow, projeto de Trabalho de Conclusão de Curso em Engenharia da Computação.
O frontend da aplicação é desenvolvido utilizando React com Vite. Durante o planejamento da interface, foram consideradas diferentes bibliotecas de componentes amplamente utilizadas no ecossistema React, especialmente Material UI e shadcn/ui. Após análise das características técnicas dessas soluções, optou-se pela adoção do shadcn/ui.
A principal motivação para essa escolha foi a granularidade e controle sobre os componentes. Diferentemente de bibliotecas tradicionais, que fornecem componentes prontos encapsulados em um pacote grande, o shadcn/ui disponibiliza os componentes diretamente como código dentro do projeto. Isso permite modificar estrutura, estilos e comportamento dos componentes sem depender das abstrações internas da biblioteca.
Outro fator relevante foi a facilidade de customização da interface. O shadcn/ui é construído sobre Tailwind CSS, o que permite estilização mais direta e flexível. Essa abordagem facilita a adaptação da interface à identidade visual do projeto e torna mais simples evoluir o design da aplicação ao longo do desenvolvimento.
Também foi considerado o impacto da biblioteca no tamanho do bundle da aplicação. Bibliotecas completas de UI podem adicionar uma quantidade significativa de código JavaScript ao projeto. Como o shadcn/ui utiliza apenas os componentes efetivamente incluídos no código do sistema, tende a resultar em bundles menores e potencialmente melhor desempenho de carregamento.
A decisão também foi influenciada por reflexões apresentadas por Theo Browne, nesse vídeo, que discute diferentes abordagens de estilização e bibliotecas de UI no ecossistema React.
Com base nas ideias apresentadas no vídeo, concluiu-se que abordagens que dão maior controle direto sobre os componentes da interface — como o shadcn/ui — tendem a favorecer manutenção, escalabilidade e personalização da aplicação. Essa característica foi considerada particularmente relevante para o desenvolvimento do CaronaShow.