Download twitter ui practise - twitter ui practise Download do código -fonte

twitter ui practise

Código-Fonte de IA

1.0.0

Baixar

Clone de prática da interface do usuário do Twitter

O objetivo deste projeto é aprender sobre o próximo JS. Minha formação é um web designer com experiência no HTML e CAILWIND CSS com algum conhecimento básico de JavaScript. Acabei tentando recriar a interface do usuário da página inicial do aplicativo do Twitter. Está longe do original e tenho certeza de que existem muitas falhas. Quaisquer sugestões ou melhorias, por favor me avise. O principal é se divertir e aprender algo novo, espero que você também possa.

Twitter-Demo.mp4.mp4

Começando

Quando você clone o repositório

npm install
npm run dev

Livro de histórias de checkout para ver componentes isoladamente

npm run storybook

Problemas

O painel lateral direito não segue o mesmo comportamento que o Twitter. Enquanto você rola, ele permanece, mas você deve ver os links do rodapé.

Pilha

Next.js
Tailwind CSS
Radix
Livro de histórias
Vercel

Recursos

Pessoas que segui e verifiquei seus repositórios e vídeos para construir o clone.

Tru Narla
Colby Fayock
Steven Tey
Lee Rob
Florentin

O que é aquilo?

Se você conferir o package.json, deixe -me tentar explicar alguns

Autora de variação de classe: permite criar variantes para itens como botões. Se você é um designer, é como as variantes de componentes da figma.
Nomes de classe: se você estilizar um componente como os componentes da interface do usuário do Radix, poderá ter uma longa linha de classes de utilitário CSS quando usa o CSS do Tailwind. Você pode ter pairar, animação, responsivo, layout e outras classes. Agora você pode agrupá -los em linhas separadas.