Atualização do inventário da Shopify a partir de uma aplicação móvel
Uma das vantagens de usar o Shopify como plataforma de comércio eletrónico é que ele oferece funcionalidades robustas de gestão de stock. No entanto, manter registos de stock precisos em tempo real pode ser um desafio, especialmente para os comerciantes que dependem da introdução manual de dados durante as auditorias de stock ou quando reabastecem os produtos.
Os leitores de código de barras portáteis são uma excelente solução para aumentar a velocidade e a precisão durante as verificações de inventário, mas muitas vezes os proprietários de lojas não dispõem de uma forma eficaz de conectar diretamente os dados do leitor ao sistema Shopify. Sem uma integração adequada, os funcionários podem ainda ter de transferir manualmente os dados digitalizados para o Shopify, o que anula parte das vantagens de eficiência que os leitores de código de barras deveriam proporcionar.
Vamos analisar um cenário real para a criação de uma aplicação móvel com funcionalidade de leitura de códigos de barras, que se integra diretamente com o Shopify para uma gestão de stock em tempo real.
Shopify tracks key inventory metrics, including the quantity on hand at each location, the number of items committed to existing orders, and the availability for new orders. Keeping these numbers accurate is important to prevent overselling or accumulating inactive, non-moving stock.
Uma forma eficaz de manter a precisão do inventário é através de auditorias regulares ou contagens cíclicas. Uma aplicação móvel que permite atualizar rapidamente a quantidade disponível de cada variante de produto diretamente na sua loja Shopify pode otimizar este processo, ajudando a aumentar a rapidez e a reduzir o custo das verificações manuais de inventário.
Utilizando os produtos da plataforma Altova Data Platform, podemos criar um fluxo de trabalho para recolher dados de códigos de barras com um leitor portátil e associá-los à plataforma Shopify em tempo real.
Shopify e GraphQL
A Shopify adotou a API GraphQL como padrão para interagir com dados externos, seja para extrair dados para análise ou, no nosso caso, para importar dados para a gestão de stock. Para mais informações sobre como funcionam as APIs GraphQL da Shopify e como se conectar a elas, consulte o nosso artigo anterior sobre a exportação de dados da Shopify.
Requisitos e design de uma aplicação para gestão de stock no Shopify
O nosso fluxo de trabalho utilizará vários produtos da Altova, que funcionarão em conjunto:
- MobileTogether Designer – para criar uma aplicação de leitura de códigos de barras
- MobileTogether Server – para alojar a aplicação para dispositivos móveis
- MapForce – para Mapeamento de dados da aplicação para a plataforma Shopify
- MapForce Server – para executar a transformação de dados num servidor
- FlowForce Server – para a orquestração de fluxos de trabalho e para disponibilizar mapeamentos como serviços web
O processo de desenvolvimento começa no MobileTogether, a plataforma de desenvolvimento de aplicações de baixo código da Altova, utilizada para criar aplicações focadas em dados. Esta plataforma oferece suporte abrangente para a criação de aplicações que armazenam e processam dados provenientes de leitores de código de barras portáteis.
No Shopify, pode haver muitas.. Produtos, e cada produto pode ter um ou vários códigos de produto Variantes. Internamente, cada variante de produto possui exatamente um Item de inventário. Um item de inventário pode ter múltiplas Níveis de stock: Um nível de stock para cada um Localização. E os locais representam uma localização geográfica onde um comerciante exerce a sua atividade, como uma loja de retalho ou um armazém. Pode encontrar mais informações sobre a relação entre estes elementos aqui.
Assim, para atualizar as quantidades de uma variante de produto, precisamos modificar (na linguagem do GraphQL, "mutar" significa atualizar) os níveis de stock de um determinado artigo de stock num local específico. Tendo isso em mente, podemos iniciar o fluxo de trabalho da nossa aplicação no MobileTogether Designer, pedindo primeiro ao utilizador para selecionar o local onde estamos a contabilizar os artigos de stock:
Para preencher a tabela de localizações de uma loja Shopify, utilizaremos um mapeamento no MapForce para consultar todas as localizações.
Aqui está a consulta GraphQL que utilizaremos no componente de requisição web GraphQL do Shopify, que se encontra no lado esquerdo:
{
locations(first: 100) {
nodes {
id
name
}
}
}
Em seguida, vamos implementar esta transformação no servidor MapForce e utilizaremos o FlowForce Server para disponibilizá-la como um serviço web:
Não se esqueça de disponibilizar esta funcionalidade como um serviço web através de http(s):
Em seguida, adicione uma nova tarefa FlowForce como fonte de página para a primeira página da aplicação no MobileTogether Designer.
Por favor, note que a URL deve apontar para o nome de domínio do servidor FlowForce, a menos que o servidor FlowForce e o servidor MobileTogether estejam a ser executados na mesma máquina, caso em que poderá usar "localhost". Além disso, embora, para o nosso exemplo que será executado numa máquina local, vamos usar "http:", deve definitivamente usar "https:" em qualquer ambiente de produção, por razões de segurança.
Agora, se testarmos a nossa aplicação no simulador de aplicações MobileTogether App Simulator, veremos algo como isto:
Depois de definir a localização, configuraremos a página seguinte da aplicação para solicitar um código de barras e uma quantidade, que serão enviados para o próximo mapeamento no MapForce. Isto atualiza a quantidade disponível do item correspondente ao código de barras.
Neste caso, a primeira chamada a um serviço web da Shopify, utilizando GraphQL, é usada para procurar o ID do produto correspondente ao código de barras fornecido
query ($query: String = null) {
productVariants(first: 1, query: $query) {
nodes {
id
barcode
inventoryItem {
id
}
}
}
}
E, em seguida, a segunda chamada ao serviço web da Shopify envia a alteração para atualizar a quantidade disponível
mutation InventorySet($input: InventorySetQuantitiesInput!) {
inventorySetQuantities(input: $input) {
inventoryAdjustmentGroup {
createdAt
reason
referenceDocumentUri
changes {
name
delta
}
}
userErrors {
field
message
}
}
}
O mapeamento configurado pode então ser utilizado num segundo processo FlowForce:
Isso pode então ser disponibilizado como um serviço web através do protocolo HTTP
Vamos utilizar este mapeamento, que agora está disponível como um serviço HTTP, na segunda página da aplicação móvel no MobileTogether Designer:
Aqui, mostramos a localização previamente selecionada e solicitamos que seja introduzido o código de barras e a quantidade. O evento de clique no botão "Atualizar Quantidade" irá chamar o serviço HTTP do servidor FlowForce:
Mais uma vez, por favor, note que a URL deve apontar para o nome de domínio do servidor FlowForce, a menos que o servidor FlowForce e o servidor MobileTogether estejam a funcionar na mesma máquina.
O resultado da mutação será apresentado na terceira página da aplicação móvel..
...onde o botão "Continuar" nos levaria de volta à segunda página para introduzir um novo código de barras e a quantidade correspondente para o próximo item a ser verificado no inventário.
O fluxo de trabalho completo poderá ser o seguinte.
Escolha a localização:
Introduza o código de barras e a quantidade (através do scanner):
Atualizar e obter confirmação:
O que vem a seguir?
Agora que a nossa aplicação de leitura de códigos de barras está pronta, ela será.. implementado no servidor MobileTogether para que possa ser executado em dispositivos móveis. A aplicação funcionará em dispositivos móveis que possuam um leitor de códigos de barras integrado, permitindo a leitura e introdução de códigos de barras com o simples toque de um botão. O MobileTogether também suporta.. leitores de código de barras sem fios externos (como os da Zebra ou da Datalogic) que podem ser integrados no fluxo de trabalho da aplicação móvel.
A funcionalidade de mapeamento do MapForce para o Shopify está disponível no projeto de exemplos do MapForce, que é fornecido com o software (Shopify_UpdateInventory.mfd). Pode introduzir o nome da sua loja Shopify e o token de acesso para experimentar esta funcionalidade.
Todos os produtos Altova utilizados neste exemplo estão disponíveis para uma.. período de teste gratuito, E o MobileTogether Designer é um produto gratuito.