Glasser Study é uma plataforma web de estudo colaborativo desenvolvida com Next.js 15 e React 19. O sistema visa ajudar estudantes a se conectarem, compartilharem materiais de estudo e colaborarem em suas jornadas acadêmicas.
- Autenticação e Perfil: Sistema completo de login, registro, recuperação de senha e gerenciamento de perfil
- Fórum Colaborativo: Crie e compartilhe publicações com materiais de estudo, comentários e likes
- Chat e Grupos: Sistema de chats privados para discussões em grupo com gerenciamento de membros
- Metas de Estudo: Defina e acompanhe suas metas de estudo com tarefas personalizadas
- Sistema de Notificações: Notificações em tempo real via WebSocket para novas mensagens, comentários e interações
- Internacionalização: Suporte completo para português e inglês
- Busca Avançada: Sistema de busca e filtros para posts por disciplina e tipo de material
- Framework: Next.js 15 com App Router
- React: 19.0.0
- TypeScript: 5.x
- GraphQL: Apollo Client para comunicação com a API
- Estilização: Tailwind CSS 4
- Notificações: react-hot-toast
- WebSocket: graphql-ws para subscriptions
- Fontes: Google Fonts (Comfortaa, Montserrat)
- Ícones: lucide-react
- Node.js 20.x ou superior
- Yarn ou npm
- Conta com acesso ao backend GraphQL
- Clone o repositório:
git clone <repository-url>
cd glasser-study-client- Instale as dependências:
yarn install
# ou
npm install- Configure as variáveis de ambiente:
Crie um arquivo
.env.localna raiz do projeto com as seguintes variáveis:
NEXT_PUBLIC_GRAPHQL_ENDPOINT=http://localhost:4000/graphql
NEXT_PUBLIC_NOTIFICATION_ENDPOINT=ws://localhost:4000/graphql- Execute o servidor de desenvolvimento:
yarn dev
# ou
npm run dev- Acesse a aplicação: Abra http://localhost:3000 no navegador.
src/
├── app/ # App Router do Next.js
│ └── [lang]/ # Rotas com i18n
│ ├── chat/ # Página de chats
│ ├── goals/ # Página de metas
│ ├── posts/ # Página de posts/forum
│ ├── profile/ # Página de perfil
│ ├── login/ # Página de login
│ ├── signup/ # Página de registro
│ └── reset-password/ # Página de recuperação
├── components/ # Componentes reutilizáveis
│ ├── Header.tsx # Header com navegação
│ ├── Home.tsx # Página inicial
│ ├── LoginForm.tsx # Formulário de login
│ ├── SignUpForm.tsx # Formulário de registro
│ ├── PostModal.tsx # Modal de posts
│ ├── NotificationModal.tsx # Modal de notificações
│ └── ...
├── dictionaries/ # Arquivos de i18n
│ └── languages/ # Traduções (pt.json, en.json)
├── hooks/ # Custom hooks
│ ├── useCurrentUser.ts # Hook para usuário atual
│ └── useLocalStorage.ts # Hook para localStorage
├── lib/ # Bibliotecas e configurações
│ ├── apollo-client.ts # Configuração do Apollo
│ └── notification-apollo-client.ts # Cliente de notificações
└── middleware.ts # Middleware de i18n
- Login com email e senha
- Registro de novos usuários
- Recuperação de senha via email
- Gerenciamento de perfil com upload de foto
- Criação de publicações com título, descrição e tags
- Upload de materiais com links
- Sistema de categorização por disciplina (Matemática, Física, Química, etc.)
- Comentários e curtidas em posts
- Busca e filtros avançados
- Criação de grupos de estudo privados
- Convite de membros por email
- Mensagens em tempo real via WebSocket
- Sistema de moderadores e membros
- Histórico de conversas
- Criação de metas personalizadas
- Adicionar tarefas com links para materiais
- Acompanhamento de progresso
- Atualização e exclusão de metas
- Notificações em tempo real para:
- Novas mensagens
- Novos chats
- Novos comentários
- Novos likes
- Marcar notificações como lidas
- Badge de contador de notificações
O projeto suporta dois idiomas:
- Português (pt): Idioma padrão
- English (en): Idioma alternativo
As traduções estão localizadas em src/dictionaries/languages/.
# Desenvolvimento com Turbopack
yarn dev
# Build de produção
yarn build
# Iniciar servidor de produção
yarn start
# Verificar lint
yarn lintPara gerar uma build de produção:
yarn build
yarn start| Variável | Descrição | Exemplo |
|---|---|---|
NEXT_PUBLIC_GRAPHQL_ENDPOINT |
URL do endpoint GraphQL | http://localhost:4000/graphql |
NEXT_PUBLIC_NOTIFICATION_ENDPOINT |
URL do WebSocket | ws://localhost:4000/graphql |
/- Página inicial com apresentação do projeto/login- Página de login/signup- Página de registro/profile- Perfil do usuário/posts- Fórum com publicações/chat- Chats e grupos de estudo/goals- Metas de estudo
- Armazenamento seguro de tokens em localStorage
- Autenticação baseada em JWT
- Proteção de rotas via middleware
- Validação de inputs no cliente
- Faça um fork do projeto
- Crie uma branch para sua feature (
git checkout -b feature/AmazingFeature) - Commit suas mudanças (
git commit -m 'Add some AmazingFeature') - Push para a branch (
git push origin feature/AmazingFeature) - Abra um Pull Request
Este projeto é privado e proprietário.
Para questões e suporte, entre em contato com a equipe de desenvolvimento.
Versão: 0.1.0
Última atualização: 2024