OFS Feeds

📋 Menu

• 🖼️ Imagem do Projeto
• 📖 Sobre
• 🛠️ Tecnologias
• ⚙️ Funcionalidades
• 🗂️ Arquitetura de Dados
• 📁 Estrutura do Projeto
• 🚀 Configuração
• 🗺️ Rotas
• 👥 Contributors
• 🤝 Contribuir
• 📬 Contact
• 📄 License

Imagem do Projeto

Sobre

OFS Feeds é um projeto frontend desenvolvido em React + TypeScript, utilizando Vite para o ambiente de desenvolvimento moderno e rápido. O objetivo é simular um feed de publicações, semelhante a redes sociais, com foco em boas práticas de componentes, estilização com CSS Modules e manipulação de dados em memória.

Item	Detalhe
Tipo de repositório	Monolito
Estrutura	Vite SPA standalone

Desenvolvido por Emmanuel Oliveira.

Tecnologias

Tecnologia	Versão	Descrição
React	^19.2.6	Biblioteca principal de UI
TypeScript	~6.0.2	Tipagem estática
Vite	^8.0.12	Bundler e ambiente de desenvolvimento
@phosphor-icons/react	^2.1.10	Ícones para interface
date-fns	^4.4.0	Manipulação de datas
@biomejs/biome	2.4.16	Linter e formatter

Funcionalidades

• Visualização de posts simulados
• Componente de comentários
• Sidebar com informações do usuário
• Estilização com CSS Modules

Arquitetura de Dados

Estrutura dos posts:

type PostType = {
  id: number;
  author: {
    avatarUrl: string;
    name: string;
    role: string;
  };
  content: Array<{
    type: 'paragraph' | 'link';
    content: string;
    href?: string;
  }>;
  publishedAt: Date;
};

Estrutura do Projeto

src/
  app.tsx
  main.tsx
  assets/
    svg/
  components/
    avatar/
    comment/
    core/
      container/
    header/
    post/
    sidebar/
  styles/
    index.css
  utils/
    posts.ts
public/
  thumb.png (adicione uma imagem de capa do projeto aqui)

Configuração

1. Instale as dependências:

   pnpm install

2. Rode o projeto em modo desenvolvimento:

   pnpm dev

3. Acesse em http://localhost:5173

Rotas

SPA — apenas rota principal /.

Contributors

Pull requests são bem-vindos! Siga o padrão de código e abra uma issue para discutir mudanças.

Emmanuel Oliveira

developed by 💖Emmanuel Oliveira

© Todos os Direitos Reservados

Contribute to the projects or Owner

Clique na seta abaixo e veja como você pode contribuir para o projeto

Como fazer uma contribuição ao Projeto ?

Familiarize-se com a documentação do projeto, que geralmente inclui guias de instalação.

Explore o código do projeto para entender sua estrutura e funcionamento.

Faça um Fork

Crie uma cópia (fork) do repositório original em sua conta do GitHub.

Clone o Repositório

Isso criará uma cópia local do projeto, onde você poderá fazer suas modificações.

Crie uma Nova Branch:

Crie uma nova branch para isolar suas alterações.

Isso facilita a organização do seu trabalho e a criação de pull requests.

Faça as Alterações:

Crie funcionalidades, mude estilos ou resolva bugs que iram contribuir para a melhoria do Projeto.

Crie um Pull Request:

Inclua uma descrição clara das suas alterações e explique como elas resolvem o problema ou melhoram o projeto.

Solicitação: Envie um pull request para o repositório original, solicitando que suas alterações sejam incorporadas ao projeto.

Revise e Responda a Feedback:

Colabore: Os mantenedores do projeto podem solicitar alterações ou fornecer feedback sobre o seu código.

Contact

_{😁Obrigado por chegar até aqui!}

License

Released in 2026 This project is under the MIT license

⭐ Se este projeto foi útil para você, considere dar uma estrela!

Caso julge importante acrescentar algo que faça uma pergunta