myAcad - Gerencie sua Vida Acadêmica

O myAcad é uma aplicação web desenvolvida para centralizar e organizar informações acadêmicas, oferecendo um ambiente estruturado para gerenciamento de disciplinas, atividades e prazos. O sistema conta com um editor avançado e notificações para garantir que nenhum compromisso seja esquecido.

A aplicação foi desenvolvida utilizando tecnologias modernas para garantir desempenho, escalabilidade e uma experiência fluida ao usuário.

🔗 Acesse: https://my-acad.web.app

Funcionalidades

• Gerenciamento de Disciplinas → Registro de frequência, ausências e atividades associadas.

• Editor de Conteúdo Notion Like → Suporte a formatação enriquecida, listas de tarefas, tabelas, marcação de código e upload de arquivos.

• Lembretes e Notificações → Alertas para tarefas, provas e trabalhos dispostos em calendários semanais e quinzenais.

Frontend

• React 18 + Vite → Estrutura leve e otimizada para carregamento rápido.

• Styled-components → Estilização dinâmica baseada em componentes.

• React Router DOM → Gerenciamento de rotas SPA.

• Axios → Comunicação eficiente com a API.

• Day.js → Manipulação de datas com baixo consumo de memória.

TipTap

O editor de conteúdo é baseado no TipTap e conta com diversas extensões para uma experiência rica de formatação:

@tiptap-pro/extension-details → Seções expansíveis para melhor organização de conteúdos longos.

@tiptap-pro/extension-emoji → Inserção de emojis diretamente no editor.

@tiptap-pro/extension-table-of-contents → Geração automática de sumário para navegação estruturada.

@tiptap/extension-task-list → Criação e gerenciamento de listas de tarefas.

@tiptap/extension-table → Suporte para tabelas editáveis.

Além disso, foi integrado o @joaohouto/editor, aprimorando a interface e a experiência do usuário no ambiente de edição.

Interação e UX

Radix UI (Dropdown, Popover) → Componentes acessíveis para menus interativos.

React-hot-toast → Notificações rápidas e não intrusivas.

React-draggable-list & React-moveable → Suporte a reordenação de itens via drag-and-drop.

React-rewards → Animações visuais para reforçar interações positivas no sistema.

Outros Recursos

File-saver & html2canvas → Exportação de conteúdos para PDF e imagem.

Jwt-decode → Gerenciamento seguro de tokens JWT.

Yup & Unform → Validação de formulários com regras dinâmicas.

Backend - API REST

A API do myAcad foi desenvolvida utilizando Node.js e Express, oferecendo uma estrutura eficiente e escalável para gerenciamento de usuários, autenticação, pagamentos e armazenamento de arquivos.

Principais Tecnologias

• Express.js → Framework minimalista para criação da API REST.
• Mongoose → Modelagem de dados e integração com MongoDB.
• JSON Web Token (JWT) → Autenticação segura baseada em tokens.
• bcrypt → Hashing de senhas para armazenamento seguro.
• dotenv → Gerenciamento de variáveis de ambiente.
• CORS → Controle de acesso entre domínios para comunicação segura.

Armazenamento e Uploads

• AWS S3 → Armazenamento de arquivos utilizando o SDK da AWS.
• Multer & Multer-S3 → Manipulação e upload eficiente de arquivos para o S3.
• Emails e Notificações
• AWS SES & Nodemailer → Envio de emails transacionais.
• Nodemailer-SendGrid-Transport → Integração com SendGrid para melhor entrega de emails.
• Nodemailer-Express-Handlebars → Template engine para formatação de emails personalizados.

Gerenciamento de Pagamentos

• Stripe → Processamento de pagamentos e gerenciamento de assinaturas.

Manipulação de Datas

• Day.js → Trabalha com datas e horários de forma eficiente.

Execução e Desenvolvimento

Nodemon → Atualização automática da API durante o desenvolvimento.

A API foi projetada para garantir segurança, escalabilidade e facilidade de integração com o frontend, utilizando autenticação baseada em JWT, gerenciamento eficiente de arquivos e integração com serviços externos como AWS e Stripe.

Considerações finais

O myAcad foi projetado para ser uma solução eficiente no gerenciamento acadêmico, combinando uma interface responsiva com funcionalidades avançadas de organização e controle de atividades. A aplicação se destaca pelo uso de um editor altamente customizável e uma arquitetura otimizada para melhor desempenho.