A aplicação web RepiMe busca centralizar, gerenciar e organizar as informações sobre as vagas em Repúblicas e Kitnets disponíveis na cidade e universidades suportadas.
Tendo em vista a forte tradição de repúblicas na cidade de Itajubá, muitos ingressantes nas universidades da cidade buscam acomodações durante o ciclo acadêmico. Nesse cenário, a fraca centralização das informações acerca das vagas gera um estresse que pode ser evitado.
Conforme as atividades da disciplina de Gerência de Projetos de Software e Desenvolvimento de Sistemas na Web da Universidade Federal de Itajubá, a equipe de desenvolvedores deste projeto propôs uma aplicação que busca auxiliar os universitário no processo para encontrar uma moradia para que ele se sinta acolhido durante essa grande mudança em sua vida. A aplicação web RepiMe foi construída com React, utilizando o framework Next.js e mais tecnologias descritas abaixo.
As orientações estão divididas nos seguintes tópicos:
- CRUD e login do usuário;
- CRUD de Kitnets;
- CRUD de República;
- CRUD de Vagas;
- Visualizar detalhes das vagas;
- Função de contato com proprietário;
- Maps na tela de vaga;
- Modal de remoção de vaga;
- Filtros de vagas;
- Dashboard.
A aplicação utiliza um banco relacional presente no modelo entidade relacionamento abaixo. A modelagem visa permitir o registro dos cadastros de usuários, vagas, residências, locadores, vagas e cidades. A hospedagem foi feita no Heroku com o add-on Heroku Postgres e a aplicação conversa com o banco através de uma API. O pgAdmin4 facilitou o processo de criação e vizualização das tabelas/relacionamentos.
Todos os comandos SQL utilizados para criar tabelas, tipos e funções estão presentes nesta path desse repositório.
Para realizar a conexão e manipulação do banco utilizou-se:
PostgreSQL - 15.2
PGadmin4 - 7.2
Prisma - 4.14.1
No geral, para executar a aplicação localmente é recomendado que o sistema já possua:
> Node.js
> NPM
A aplicação utiliza tokens de serviços de terceiros:
Social Login: Github/Google
Maps API: Google API Key
DB Credentials: Heroku
Cloundinary
Para executar essa versão é necessário:
# Clone este repositório com
$ git clone https://github.com/MatMB115/repime_web.git
# OU
$ git clone [email protected]:MatMB115/repime_web.git
# Navegue até o diretório clonado com terminal
$ cd repime-web
$ cd repime_web
# Instale as dependências
$ npm install
# Navegue até a pasta do prisma
$ cd prisma
# Recupere o schema do banco com ORM Prisma
# Mude no .env com as credencias do banco criado
$ npx prisma db pull
$ npx prisma generate
# Inicar a aplicação como desenvolvedor
$ npm run dev
# Inicar a aplicação
$ npm run start
Para executar a aplicação como desenvolvedor:
npm run dev
Design base do figma - RepiME
O ponto de início deste projeto foi uma aplicação NextJS, as dependências utilizadas estão presentes no package.json.
Aplicação:
-> Next.js 13
-> Prisma 4.14.1
- @next-auth/prisma-adapter: 1.0.6
- @prisma/client": 4.14.1
- @types/node: 20.2.1
- @types/react: 18.2.6
- @types/react-dom: 18.2.4
- axios: 1.4.0
- bcrypt: 5.1.0
- bcryptjs: 2.4.3
- class-validator: 0.14.0
- eslint: 8.40.0
- eslint-config-next: 13.4.2
- next: 13.4.2
- next-auth: 4.22.1
- next-cloudinary: 4.12.0
- next.js: 1.0.3
- query-string: 8.1.0
- react: 18.2.0
- react-dom: 18.2.0
- react-hook-form: 7.43.9
- react-hot-toast: 2.4.1
- react-icons: 4.8.0
- react-select: 5.7.3
- typescript: 5.0.4
- validator: 13.9.0
- zustand: 4.3.8
-> DevDepencies
- @types/bcrypt: 5.0.0
- autoprefixer: 10.4.14
- postcss: 8.4.23
- tailwindcss: 3.3.2
Banco de Dados:
-> PostgreSQL 15
- pgAdmin4 7.2
- Heroku Postgres Mini
- BRmodelo
Utilitários:
-> Dev
- Visual Studio Code 1.79.1
- npm 8.19.2
- Figma
Carlos Eduardo 🧑💻 |
Matheus Martins 🧑💻 |
João Marcos 🧑💻 |
Adriano Lucas 🧑💻 |
Breno Dias 🧑💻 |
Alexsandra 🎨 |