Aplicação Cardus - aplicação de gestão de inventário pessoal de código aberto

O que eu construí

Cardus é um aplicativo web que permite aos usuários criar e gerenciar seu próprio depósito de itens. Os usuários podem adicionar itens ao seu depósito e identificar rapidamente qual caixa está armazenando cada item. Os usuários também podem compartilhar seu depósito ou caixa com outros usuários, permitindo a colaboração.

Link do App

Web: https://cardus-app.vercel.app/

Play Store: A definir

Descrição

O aplicativo Cardus é um projeto de aplicativo web para desafiar os limites do desenvolvimento web para um usuário móvel. O aplicativo é construído com Next.js, um framework React, e implantado no Vercel. O aplicativo também é um PWA, que podemos instalar em dispositivos móveis. O aplicativo também utiliza Trusted Web Activity, que permite que o aplicativo seja instalado em dispositivos Android. O aplicativo também utiliza o Google Cloud Platform para armazenar imagens e executar modelos TensorFlow.js para detecção automática de objetos em imagens de itens.

Eu quero que o aplicativo seja perfeito, como um aplicativo nativo. Há telas de integração, transições bonitas e animações suaves. O aplicativo também possui um modo escuro, essencial para qualquer aplicativo moderno.

Link para o Código-Fonte

Cardus App: Repositório GitHub

Licença Permissiva

Licença Apache-2.0

Antecedentes

⚡ Problema

Difícil de rotular a caixa de armazenamento
Difícil de saber onde está a caixa de armazenamento
Difícil de saber quais itens estão em qual armazenamento

É desafiador gerenciar o depósito/armazenamento pessoal.

💡 Solução

Criar um aplicativo web que permite aos usuários criar e gerenciar seu próprio depósito de itens
Os usuários podem adicionar itens ao seu depósito e identificar rapidamente qual caixa está armazenando qual item
Os usuários também podem compartilhar seu depósito ou caixa com outros usuários, permitindo a colaboração

Como eu construí

📚 Pilha de Tecnologia

Next.js
React
MongoDB
Google Cloud Platform
TensorFlow.js
PWA
Trusted Web Activity

📖 O Processo

Começamos criando um aplicativo Next.js e, em seguida, criamos um cluster MongoDB Atlas. Queríamos nos comunicar facilmente com o MongoDB, então usamos ORM com Prisma. Nosso foco é um aplicativo web móvel, então só nos preocupamos com o desktop depois de um tempo. Nós o transformamos em um PWA, uma barra de navegação inferior, uma barra superior e um modo escuro. Também estamos planejando torná-lo um Trusted Web Activity para que possamos instalá-lo em dispositivos Android.

Há muitos problemas que enfrentamos ao longo do caminho. Usar a API do Google Cloud Storage com uma função sem servidor exige trabalho. Apenas usando isso, já estamos enfrentando vários obstáculos. Alguns podem ser resolvidos lendo um fórum; alguns precisam de uma solução alternativa. Os usuários adoram algo inteligente, então também queremos tornar o aplicativo inteligente. Queremos tornar o aplicativo capaz de detectar o objeto na imagem, então usamos TensorFlow.js para fazer isso. Também queremos tornar o aplicativo capaz de escanear o código QR, então usamos ZXing para fazer isso.

📝 O que eu aprendi

Como usar Next.js para construir um aplicativo web
Como usar o MongoDB Atlas para armazenar dados
Como usar o Google Cloud Platform para armazenar imagens
Como usar TensorFlow.js para executar modelos no navegador
Como usar o PWA para tornar o aplicativo instalável
Como usar o Trusted Web Activity para tornar o aplicativo instalável em dispositivos Android