Aplikasi Cardus - aplikasi pengelolaan inventaris pribadi sumber terbuka

Apa yang Saya Bangun

Cardus adalah aplikasi web yang memungkinkan pengguna untuk membuat dan mengelola gudang item mereka. Pengguna dapat menambahkan item ke gudang mereka dan dengan cepat mengidentifikasi kotak mana yang menyimpan barang apa. Pengguna juga dapat membagikan gudang atau kontainer mereka dengan pengguna lain, memungkinkan mereka untuk berkolaborasi.

Link Aplikasi

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

Play Store: TBD

Deskripsi

Cardus App adalah proyek aplikasi web untuk menantang batas pengembangan web untuk pengguna seluler. Aplikasi ini dibangun dengan Next.js, kerangka kerja React, dan dikerahkan di Vercel. Aplikasi ini juga merupakan PWA, yang dapat kita instal pada perangkat seluler. Aplikasi ini juga menggunakan Trusted Web Activity, yang memungkinkan aplikasi untuk diinstal pada perangkat Android. Aplikasi ini juga menggunakan Google Cloud Platform untuk menyimpan gambar dan untuk menjalankan model TensorFlow.js untuk mendeteksi objek secara otomatis dalam gambar item.

Saya ingin aplikasi ini menjadi mulus, seperti aplikasi asli. Ada layar onboarding, transisi yang indah, dan animasi yang halus. Aplikasi ini juga memiliki mode gelap, yang merupakan kebutuhan untuk setiap aplikasi modern.

Link ke Kode Sumber

Cardus App: Repositori GitHub

Lisensi Permissive

Lisensi Apache-2.0

Latar Belakang

⚡ Masalah

Sulit untuk memberi label pada kotak penyimpanan
Sulit untuk mengetahui di mana kotak penyimpanan berada
Sulit untuk mengetahui item mana yang ada di penyimpanan mana

Sulit untuk mengelola gudang/penyimpanan pribadi.

💡 Solusi

Buat aplikasi web yang memungkinkan pengguna untuk membuat dan mengelola gudang item mereka sendiri
Pengguna dapat menambahkan item ke gudang mereka dan dengan cepat mengidentifikasi kotak mana yang menyimpan item apa
Pengguna juga dapat membagikan gudang atau kotak mereka dengan pengguna lain, memungkinkan mereka untuk berkolaborasi

Bagaimana Saya Membangunnya

📚 Tumpukan Teknologi

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

📖 Prosesnya

Kami mulai dengan membuat aplikasi Next.js, dan kemudian kami membuat cluster MongoDB Atlas. Kami ingin berkomunikasi dengan mudah dengan MongoDB, jadi kami menggunakan ORM dengan Prisma. Fokus kami adalah aplikasi web seluler, jadi kami hanya peduli dengan desktop setelah beberapa saat. Kami menjadikannya PWA, bilah navigasi bawah, bilah atas, dan mode gelap. Kami juga berencana untuk menjadikannya Trusted Web Activity agar dapat diinstal pada perangkat Android.

Ada banyak masalah yang kami hadapi di sepanjang jalan. Menggunakan Google Cloud Storage API dengan fungsi serverless membutuhkan kerja. Hanya dengan menggunakan ini, kami sudah menghadapi banyak rintangan. Beberapa dapat diatasi dengan membaca forum; beberapa memerlukan solusi alternatif. Pengguna menyukai sesuatu yang cerdas, jadi kami juga ingin membuat aplikasi ini cerdas. Kami ingin membuat aplikasi ini dapat mendeteksi objek dalam gambar, jadi kami menggunakan TensorFlow.js untuk melakukannya. Kami juga ingin membuat aplikasi ini dapat memindai kode QR, jadi kami menggunakan ZXing untuk melakukannya.

📝 Apa yang Saya Pelajari

Cara menggunakan Next.js untuk membangun aplikasi web
Cara menggunakan MongoDB Atlas untuk menyimpan data
Cara menggunakan Google Cloud Platform untuk menyimpan gambar
Cara menggunakan TensorFlow.js untuk menjalankan model di browser
Cara menggunakan PWA untuk membuat aplikasi dapat diinstal
Cara menggunakan Trusted Web Activity untuk membuat aplikasi dapat diinstal pada perangkat Android