Actualización del inventario de Shopify desde una aplicación móvil
Una de las ventajas de utilizar Shopify como plataforma de comercio electrónico es que ofrece funciones robustas de gestión de inventario. Sin embargo, mantener registros de inventario precisos en tiempo real puede ser un desafío, especialmente para los comerciantes que dependen de la introducción manual de datos durante las auditorías de inventario o al reponer existencias.
Los lectores de códigos de barras portátiles son una excelente solución para aumentar la velocidad y la precisión durante las revisiones de inventario, pero a menudo, los propietarios de tiendas carecen de una forma sencilla de conectar directamente los datos del escáner al sistema de Shopify. Sin una integración adecuada, el personal aún puede necesitar transferir manualmente los datos escaneados a Shopify, lo que anula parte de las mejoras de eficiencia que se supone que ofrecen los lectores de códigos de barras.
Analicemos un caso práctico para desarrollar una aplicación móvil con funcionalidad de escaneo de códigos de barras que se integra directamente con Shopify para la gestión de inventario en tiempo 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.
Una forma eficaz de mantener la precisión del inventario es mediante auditorías periódicas o conteos cíclicos. Una aplicación móvil que le permita actualizar rápidamente la cantidad disponible de cada variante de producto directamente en su tienda de Shopify puede agilizar este proceso, ayudando a aumentar la velocidad y reducir el costo de las verificaciones manuales del inventario.
Utilizando los productos de la plataforma Altova Data Platform, podemos crear un flujo de trabajo para recopilar datos de códigos de barras con un escáner portátil y mapearlos a Shopify en tiempo real.
Shopify y GraphQL
Shopify ha adoptado la API de GraphQL como estándar para interactuar con datos externos, ya sea para extraer datos para análisis o, en nuestro caso, para importar datos para la gestión de inventario. Para obtener más información sobre cómo funcionan las API de GraphQL de Shopify y cómo conectarse a ellas, consulte nuestro artículo anterior sobre la exportación de datos desde Shopify.
Requisitos y diseño de una aplicación para la gestión de inventario en Shopify
Nuestro flujo de trabajo utilizará varios productos de Altova que trabajarán en conjunto:
- MobileTogether Designer: para crear una aplicación de escáner de códigos de barras
- MobileTogether Server: para alojar la aplicación en dispositivos móviles
- MapForce: para mapear los datos de la aplicación con Shopify
- MapForce Server: para ejecutar la transformación de datos en un servidor
- FlowForce Server: para la orquestación de flujos de trabajo y para poner a disposición las configuraciones como servicios web
El proceso de diseño comienza en MobileTogether, el entorno de desarrollo de aplicaciones de bajo código de Altova, diseñado para crear aplicaciones centradas en datos. Este entorno incluye un amplio soporte para la creación de aplicaciones que almacenan y procesan datos provenientes de escáneres de códigos de barras portátiles.
En Shopify, puede haber muchos productos, y cada producto puede tener una o varias variantes. Internamente, cada variante de producto tiene exactamente un elemento de inventario. Un elemento de inventario puede tener múltiples niveles de inventario: un nivel de inventario por cada ubicación. Y las ubicaciones representan una localización geográfica donde un comerciante realiza sus actividades, como una tienda minorista o un almacén. Puede encontrar más información sobre la relación entre estos elementos aquí.
Para actualizar las cantidades de una variante de producto, necesitamos modificar (término utilizado en GraphQL para referirse a la actualización) los niveles de inventario de un artículo específico en una ubicación determinada. Teniendo esto en cuenta, podemos comenzar el flujo de trabajo de nuestra aplicación en MobileTogether Designer pidiendo primero al usuario que seleccione la ubicación donde se están contando los artículos del inventario
Para completar la tabla de ubicaciones de una tienda de Shopify, utilizaremos una herramienta de mapeo llamada MapForce para consultar todas las ubicaciones.
Aquí está la consulta GraphQL que utilizaremos en el componente de solicitud web de Shopify/GraphQL que se muestra a la izquierda:
{
locations(first: 100) {
nodes {
id
name
}
}
}
A continuación, implementaremos esta configuración en el servidor MapForce y utilizaremos FlowForce Server para ponerla a disposición como un servicio web:
No olvide exponer esta funcionalidad como un servicio web a través de http(s):
A continuación, agregue un nuevo trabajo de FlowForce como una nueva fuente de página para la primera página de la aplicación en MobileTogether Designer.
Tenga en cuenta que la URL debe apuntar al nombre de host del servidor FlowForce, a menos que el servidor FlowForce y el servidor MobileTogether se ejecuten en la misma máquina, en cuyo caso "localhost" funcionará. Además, aunque para nuestro ejemplo, que se ejecuta en una máquina local, utilizaremos "http:", definitivamente debe utilizar "https:" en cualquier entorno de producción por motivos de seguridad.
Ahora, si probamos nuestra aplicación en el simulador de aplicaciones MobileTogether App Simulator, veremos algo similar a esto:
Una vez que se define la ubicación, configuraremos la siguiente página de la aplicación para solicitar un código de barras y una cantidad, que se enviarán a la siguiente etapa de mapeo en MapForce. Esto actualizará la cantidad disponible del artículo correspondiente al código de barras.
Aquí, se utiliza la primera llamada a un servicio web de Shopify a través de GraphQL para buscar el ID del artículo correspondiente al código de barras proporcionado
query ($query: String = null) {
productVariants(first: 1, query: $query) {
nodes {
id
barcode
inventoryItem {
id
}
}
}
}
Y la segunda llamada al servicio web de Shopify envía entonces la modificación para actualizar la cantidad disponible
mutación InventorySet(input: InventorySetQuantitiesInput!) {
inventorySetQuantities(input: $input) {
inventoryAdjustmentGroup {
createdAt
reason
referenceDocumentUri
changes {
name
delta
}
}
userErrors {
field
message
}
}
}
El esquema de mapeo implementado puede luego utilizarse en un segundo trabajo de FlowForce:
Esto, a su vez, puede ser expuesto como un servicio web a través de HTTP
Utilicemos esta configuración, que ahora se ofrece como un servicio HTTP, en la segunda página de la aplicación móvil dentro de MobileTogether Designer:
Aquí se muestra la ubicación previamente seleccionada y se solicita ingresar el código de barras y la cantidad. Al hacer clic en el botón "Actualizar cantidad", se llamará al servicio HTTP de FlowForce Server:
Por favor, tenga en cuenta que la URL debe apuntar al nombre de host del servidor FlowForce, a menos que el servidor FlowForce y el servidor MobileTogether se ejecuten en la misma máquina.
El resultado de la mutación lo mostraremos en la tercera página de la aplicación móvil..
...donde el botón "Continuar" nos devolvería a la segunda página para ingresar un nuevo código de barras y la cantidad correspondiente al siguiente artículo que se va a verificar en el inventario.
El flujo de trabajo completo podría ser el siguiente.
Seleccione la ubicación:
Introduzca el código de barras y la cantidad (mediante el escáner):
Actualizar y confirmar:
¿Y ahora?
Ahora que nuestra aplicación de escaneo de códigos de barras está lista, se implementará en el servidor MobileTogether para que pueda ejecutarse en dispositivos móviles. La aplicación funcionará en dispositivos móviles que tengan un lector de códigos de barras integrado que pueda escanear e introducir códigos de barras con solo pulsar un botón. MobileTogether también es compatible con lectores de códigos de barras inalámbricos externos (como los de Zebra o Datalogic) que pueden integrarse en el flujo de trabajo de la aplicación móvil.
La función de mapeo de MapForce para Shopify está disponible en el proyecto de ejemplos de MapForce que se incluye con el software (Shopify_UpdateInventory.mfd), y puede ingresar el nombre de su propia tienda de Shopify y el token de acceso para probarla.
Todos los productos de Altova utilizados en este ejemplo están disponibles para una.. prueba gratuita, Y MobileTogether Designer es un producto gratuito.