💻 Osten Moove Fullstack 💻

📃 Sobre

Esse projeto tem como objetivo construir uma aplicação CRUD Fullstack para cadastro de empresas.

Além de poder instalar e rodar o projeto localmente, você pode também acessar a versão online em um deploy realizado no Vercel.

🔧 Stacks e bibliotecas utilizadas

JavaScript
React.js
Tailwind.css
Vite
Sweet Alert
Material UI
Node.js
Express.js
MySQL

🛠️ Instalação e execução

Rodando a aplicação localmente

Para rodar está aplicação localmente é necessário ter Git, Node e o MySQL instalados e atualizados em seu computador.

Também é necessário que o seu sistema operacional tenha um terminal Bash instalado. Caso você esteja utilizando Linux ou macOS, o Bash já vem instalado por padrão. Porém, se o seu sistema for Windows, talvez você precise fazer a instalação a parte.

🔨 Configurando o Back-end

1. Clone o repositório

Use o comando: git clone git@github.com:edson-mac/ostenfullstack.git.
Entre na pasta do repositório que você acabou de clonar:
- cd ostenfullstack

Entre na pasta do Backend

cd ostenbackend

Instale as dependências

npm install

Configurando o banco de dados e .env

O projeto vem configurado para rodar em um banco de dados MySQL, então é nessário instalar MySQL em seu computador ou utilizar um servidor na nuvem, o arquivo para a criação da tabela está localizado na pasta DATABASE do backend. Após ter configurado seu banco, é necessário configurar as variáveis de ambiente:

1. Em um arquivo .env na raíz do repositório, adicione as configurações de seu banco MySQL:

MYSQL_HOST=
MYSQL_USER=
MYSQL_PASSWORD=
MYSQL_DATABASE=
MYSQL_PORT=

2. Nesse mesmo arquivo .env, a porta do Express desejada para rodar o servidor

PORT=

3. Por fim, após ter efetuado todas as configurações, rode o servidor utilizando este comando no diretório ostenbackend:

npm start

🌅 Configurando o Front-end

1. Acesse o repositório

Entre na pasta do repositório:
- cd ostenfullstack

Entre na pasta do Frontend

cd ostenfrontend

Instale as dependências

npm install

Configurando variáveis de ambiente

O projeto Frontend vem configurado para fazer diversas requisições para uma API, o endereço vai mudar dependendo de como você rodar o projeto, por isso é necessário configurar as variáveis de ambiente:

1. Em um arquivo .env na raíz do repositório, adicione as configurações de seu endereço no API como no exemplo abaixo:

VITE_API_URL="https://ostenfullstack.vercel.app/companies"

3. Por fim, após ter efetuado todas as configurações, rode o servidor utilizando este comando no diretório ostenfrontend:

npm start

💻 Documentação e rotas da API:

Obtendo lista das empresas - GET /companies

Excluindo uma empresa - DELETE /companies/ID

Obtendo empresa por ID - GET /companies/ID

Cadastrando uma empressa - POST /companies

body = {
    "name": "Empresa Exemplo",
    "rua": "Rua B",
    "numero": "456",
    "bairro": "Bairro W",
    "cidade": "Cidade X",
    "estado": "Estado Z"
  }

Editando uma empressa por ID - PUT /companies/ID

body = {
    "name": "Empresa Exemplo",
    "rua": "Rua B",
    "numero": "456",
    "bairro": "Bairro W",
    "cidade": "Cidade X",
    "estado": "Estado Z"
  }

edson-mac/ostenfullstack