Skip to content

Repositório criado para armazenar uma API REST em laravel, que faz parte do curso "Dev de aplicações com Laravel, Angular e Ionic" da code education. Onde será criado uma aplicação similar ao whatsapp, porém com funcionalidades de vendas e relacionamento com o cliente.

Notifications You must be signed in to change notification settings

WillRy/shopping-api

Folders and files

NameName
Last commit message
Last commit date

Latest commit

ba87572 · Dec 4, 2020
Aug 10, 2019
Apr 18, 2019
Jun 23, 2019
Jul 17, 2019
Dec 4, 2020
Apr 18, 2019
Jul 8, 2019
Jul 13, 2019
Jun 14, 2019
Apr 18, 2019
Apr 18, 2019
Jul 2, 2019
Jul 14, 2019
Apr 18, 2019
Jul 14, 2019
Jun 25, 2019
Jul 17, 2019
Jul 17, 2019
Apr 18, 2019
Jul 14, 2019
Jun 24, 2019
Jun 23, 2019
Apr 28, 2019
Apr 18, 2019
Apr 18, 2019
Dec 4, 2020
Apr 18, 2019
Apr 18, 2019

Repository files navigation

Chat comercial

A Aplicação consiste em um chat para a área de vendas, onde o objetivo é que as empresas possam interagir em tempo real com os clientes ou futuros clientes, através de um chat similar ao telegram.

A solução também inclui um painel web, para que a empresa possa gerenciar/receber os pedidos vindos do aplicativo, criar seus grupos de chat, gerir usuários, produtos a venda e encomendas.

O Aplicativo mobile, é focado para os clientes, onde poderão entrar em um grupo, tendo a possibilidade de interagir em tempo real no chat, utilizando textos, imagens e audio. Também terão acesso a abas de produtos onde poderão fazer os pedidos.

1 - Estrutura da aplicação e tecnologias

Painel web:

https://github.com/WillRy/shopping-spa

Construído no modelo de SPA (SPA: Single Page Application), utilizando o angular 6.

App:

https://github.com/WillRy/shopping-mobile

Construído utilizando Ionic 3

API:

https://github.com/WillRy/shopping-api

Construída utilizando o Laravel Framework.

Banco de dados:

É utilizado o mysql para persistência dos dados e o Firebase Realtime Database para a construção do chat.

As tecnologias foram usadas nas versões:

  • Laravel@5.6
  • Angular@6.2.9
  • Ionic@3.20.0
  • Cordova@9.0.0
  • Firebase
  • MySQL

2 - Funcionamento da aplicação - Aplicativo mobile

O Aplicativo mobile construído em Ionic, contém as seguintes funcionalidades:

  • Cadastro com número de telefone
  • Troca de número de telefone
  • Área de chats
  • Área de produtos
  • Área de pedidos

2.1 - Criação de usuários

Logo ao entrar no aplicativo, o usuário se depara com as seguintes opções:

Na criação de usuários, o usuário pode criar a sua conta utilizando o número de telefone, que será validado utilizando os serviços do Firebase.

Após confirmar o número de telefone, caso já tenha registro na base de dados, será direcionado para a tela principal do aplicativo, onde terão 3 abas: Grupos, produtos e pedidos.

Caso não tenha cadastro, será enviado para a tela de cadastro.

2.2 - Grupos e chat

2.2.1 - Aba de grupos

Nesta aba, é possível visualizar os grupos do qual você faz parte, sendo possível enviar textos, gravar mensagem de áudio e enviar imagens no chat.

2.2.2 - Sala de chat

2.3 - Produtos

2.3.1 - Aba de produtos

Nesta aba, há uma lista de produtos disponíveis para serem encomendados

2.3.2 - Detalhes do produto

2.4 - Pedidos

2.4.1 - Aba de pedidos

2.4.2 - Detalhes do pedido

3 - Ingresso em grupos

Os vendedores, através do painel administrativo, podem adicionar uma pessoa em um grupo de chat ou podem gerar links de convite, onde ao acessar o link, o aplicativo será aberto e será feito a solicitação de entrada no grupo.

4 - Notificações

A Aplicação conta com uma integração ao Firebase Cloud Messaging, que permite direcionar push notifications para os usuários, toda nova mensagem ou aprovação na solicitação de entrada em grupo, o usuário irá receber a notificações para alertar das mudanças.

5 - Funcionamento da aplicação - Painel Administrativo

O Painel foi construído utilizando o Angular, devido a seu ótimo ambiente para construções de SPAs, com lazy loading, code splitting e entre outros recursos.

Este painel só é acessível para os vendedores e administradores do sistema, pois possui funcionalidades administrativas, como:

  • Categoria
  • Produto
  • Usuário
  • Entradas
  • Saidas
  • Chats
  • Pedidos

5.1 - Categorias

Listagem de categorias de produtos, podendo editar e remover

5.2 - Produtos

Listagem de produtos, onde é possível criar/editar e remover. Também é possível adicionar categorias a um produto ou fotos.

5.3 - Entrada/Saida

Módulo onde é possível registrar a entrada e saída de produtos contidos no estoque

5.4 - Chats

Módulo onde é possível administrar os chats do sistema, sendo possível criar novas salas, administrar membros e criar links de convites

6 - Como executar?

Para executar a aplicação, é necessário:

6.1 - Firebase

É necessário criar um projeto no firebase, registrando uma versão para:

web e mobile

Após registrar o projeto, é necessário, criar um arquivo de config do firebase para a SPA(web), um para a API e outro arquivo para o mobile

Para a API:

  • Gerar uma chave admin-sdk (service account)
  • Inserir o arquivo .json gerado, na raiz da API

O arquivo de admin-sdk, assemelha-se a este formato:

{
    "type": "service_account",
    "project_id": "",
    "private_key_id": "",
    "private_key": "",
    "client_email": "",
    "client_id": "",
    "auth_uri": "",
    "token_uri": "",
    "auth_provider_x509_cert_url": "",
    "client_x509_cert_url": ""
  }

6.2 - Web

  • Gerar o arquivo de autenticação
  • Criar um arquivo chamado firebase-config.ts na raiz do projeto, no seguinte modelo:
export default {
  apiKey: '',
  authDomain: '',
  databaseURL: '',
  projectId: '',
  storageBucket: '',
  messagingSenderId: '',
  appId: ''
};

Preencher os dados, com os valores presentes, na config gerada no firebase

6.3 - Mobile

O Aplicativo requrer a instalação das dependências comuns para a execução do Ionic3

  • Gerar o arquivo google-services.json
  • Inserir este arquivo na pasta /platforms/android/app

6.3.1 - Primeiramente, clone o painel web

git clone https://github.com/WillRy/shopping-spa

6.3.2 - Baixe as dependências

npm install

6.3.3 - Execute o servidor

ng serve

6.3.4 - Acesse o painel

http://localhost:4200

6.4 - API

Os endpoints disponíveis da API estão no arquivo: Insomnia-endpoints.json

6.4.1 - Primeiramente, clone a API:

git clone https://github.com/WillRy/shopping-api

6.4.2 - Baixe as dependências

composer install

6.4.3 - Rode as migrations e seed

php artisan migrate 

php artisan db:seed

6.4.4 - Execute o servidor

php artisan serve

About

Repositório criado para armazenar uma API REST em laravel, que faz parte do curso "Dev de aplicações com Laravel, Angular e Ionic" da code education. Onde será criado uma aplicação similar ao whatsapp, porém com funcionalidades de vendas e relacionamento com o cliente.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages