rafaeldiehl / malba-beta

Projeto interdisciplinar

Um website para ensino de Matemática básica

Tabela de Contéudos

• Introdução
• Documentação
  • UML
  • Banco de dados
  • Design e Protótipo
  • Tecnologias
• Instalação
  • Pré-requisitos
  • Frontend
  • Backend
    • Configurações do Banco
    • Rotas da API
• Status do Projeto
• Licença
• Autor

Introdução

Malba é um website voltado para o ensino de Matemática básica, com um sistema de séries de lições, progressão de nível e recompensas, fortemente inspirado na plataforma Duolingo.

Foi desenvolvido como Projeto Interdisciplinar do terceiro semestre do Curso Superior de Tecnologia em Análise e Desenvolvimento de Sistemas do Instituto Federal de São Paulo — Campus Boituva, contemplando as disciplinas: Análise Orientada a Objetos, Banco de Dados II e Programação Web.

Documentação

Clique aqui para acessar o diretório com a documentação completa.

UML

O projeto contém os seguintes diagramas UML na sua documentação:

• Diagrama de Casos de Uso;
• Diagrama de Classes;
• Diagrama de Componentes;
• Diagrama de Implantação.

Banco de Dados

Os principais modelos do banco de dados também estão disponíveis no repositório:

• Modelo conceitual;
• Modelo lógico;
• Modelo físico.

Design e Protótipo

O design e protótipo interativo do sistema pode ser acessados pelo Figma.

Tecnologias

As tecnologias usados no projeto foram:

Frontend

• HTML;
• JavaScript;
• Vue;
• Vuex;
• Tailwind;
• Sass;
• PostCSS;
• Axios.

Backend

• PHP;
• Laravel.

Banco de Dados

• MySQL.

Manutenção do Código

• Git;
• Github;
• Visual Studio Code.

Gerenciamento de Pacotes

• NPM;
• Composer.

Prototipação e Modelagem

• Figma;
• Diagrams.net.

Instalação

Siga os passos abaixo para rodar o projeto localmente.

Pré-requisitos

Antes de começar, você vai precisar ter instalado em sua máquina as seguintes ferramentas:

• Git;
• NPM;
• PHP;
• Composer.

Caso esteja usando Windows, você pode facilmente instalar PHP usando a ferramenta Xampp. Além disto é bom ter um editor para trabalhar com o código como Visual Studio Code ou Sublime Text 3.

Com as ferramentas adequadamente instaladas, clone o repositório com o seguinte comando e acesse o diretório raiz:

# Clone o repositório
$ git clone https://github.com/rafaeldiehl/malba.git

# Acesse o diretório raiz
$ cd malba/

Frontend

Para rodar o frontend, execute os seguintes comandos (certifique-se de estar no diretório raiz do projeto):

# Acesse o diretório frontend
$ cd frontend/

# Instale as dependências necessárias
$ npm i

# Rode o servidor local
$ npm run serve

Backend

Para rodar o backend, edite o arquivo com as variáveis de ambiente, configurando seu banco de dados adequadamente. Exemplo:

# Acesse o diretório backend
$ cd backend/

# Copie o arquivo .env.example para um arquivo .env
$ cp .env.example .env

# Edite o arquivo
$ nano .env

Exemplo de configuração no arquivo .env:

...

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=laravel
DB_USERNAME=root
DB_PASSWORD=123456

...

Com a configuração pronta, execute os seguintes comandos (certifique-se de estar no diretório backend/ do projeto):

# Instale as dependências necessárias
$ composer install

# Execute as migrações e propagadores
$ php artisan migrate
$ php artisan db:seed

# Execute o servidor
$ php artisan serve

As seguintes rotas da API estão disponíveis, caso queira testar requisições HTTP:

• POST /api/register (cadastra um usuário)
• POST /api/login (autentica um usuário e retorna um token)
• POST /api/logout (encerra sessão no lado do servidor)
• GET /api/users (retorna os usuários clientes)
• GET /api/users/:id (retorna o usuário especificado)
• GET /api/users/admin (retorna os administradores)
• GET /api/users/hits/asc (retorna os usuários pelos acertos em ordem crescente)
• GET /api/users/hits/desc (retorna os usuários pelos acertos em ordem descrescente)
• PUT /api/users/:id (atualiza preferências de um usuário)
• DELETE /api/users/:id (remove um usuário)
• GET /api/avatars (retorna os avatares)
• GET /api/avatars/:id (retorna avatar especificado)
• GET /api/types (retorna os tipos de questões)
• GET /api/types/:id (retorna tipo de questão especificado)
• GET /api/topics (retorna lista de tópicos)
• POST /api/topics (cria um novo tópico)
• PUT /api/topics (atualiza o tópico especificado)
• DELETE /api/topics/:id (remove o tópico especificado)
• GET /api/subtopics (retorna lista de subtópicos)
• POST /api/subtopics (cria um novo subtópico)
• PUT /api/subtopics (atualiza o subtópico especificado)
• DELETE /api/subtopics/:id (remove o subtópico especificado)

Licença

Este projeto está sob a licença MIT.

Status do Projeto

Em andamento.

Autor

_{Rafael Diehl (SP - Brasil, 🇧🇷)}

Entre em contato! 👋🏽