Max Chat

Projeto desenvolvido para praticar e aperfeiçoar habilidades adquiridas ao longo dos cursos da Alura, atualmente em andamento. O objeto do projeto: Um site de chat online.

Vitrine.Dev
Nome	Max-Chat
Tecnologias	React, TypeScript, HTML, CSS, Firebase.
URL	Max-Chat

Detalhes do projeto

O projeto "Max-Chat" é uma aplicação web desenvolvida com React, TypeScript e Firebase. Oferece uma interface de usuário amigável para chat, registro, login e gerenciamento de contatos. O desenvolvimento é orientado pelo método Kanban com auxílio do site Trello e o design se baseia em um modelo previamente criado no site Figma.

O projeto está atualmente em desenvolvimento.

Progresso:

Funcionalidades Principais

1. Login e Registro de Usuário:

   • Os usuários podem fazer login com seu e-mail e senha.
   • Os usuários podem se registrar com um novo e-mail, nome e senha.
   • Validação de entrada é implementada para garantir a precisão dos dados.

2. Conversas e Mensagens:

   • Os usuários podem visualizar todas as conversas disponíveis.
   • Os usuários podem iniciar novas conversas.
   • Os usuários podem enviar mensagens em tempo real nas conversas.
   • As mensagens exibem o remetente, a hora e o conteúdo.

3. Gerenciamento de Contatos:

   • Os usuários podem visualizar e gerenciar sua lista de contatos.
   • Os usuários podem adicionar novos contatos.
   • Os usuários podem editar ou excluir contatos.

4. Tecnologias Utilizadas:

   • Front-End: React, TypeScript, HTML5, CSS3
   • Back-End: Firebase (anteriormente json-server)

Estrutura de Pastas

O projeto segue uma estrutura de pastas organizada:

• /src contém os arquivos do código React, incluindo páginas, componentes e funcionalidades.
• /public contém os recursos estáticos, como imagens, HTML e manifestos.
• /Common inclui arquivos de estilo compartilhados.
• /Components contém componentes reutilizáveis.
• /Pages contém as páginas da aplicação.
• /Interface contém arquivos de interface (como tipos e estruturas de dados) para melhorar a tipagem e clareza do código.
• /Services inclui arquivos relacionados a serviços, como conexões com API ou funções de utilidade.

Abordagem de Desenvolvimento

• Desenvolvimento orientado pelo método Kanban, com acompanhamento no site Trello.

Design e UX/UI

• O design da aplicação é baseado em um modelo previamente desenvolvido no site Figma para garantir a melhor experiência do usuário (UX/UI).

Foco Responsivo

• O projeto é desenvolvido com foco no design responsivo e otimizado para dispositivos móveis. Possui breakpoints para telas de 375px (Mobile), 768px (Tablet) e 1440px (Desktop).