Program Kardas - program za upravljanje ličnom štednjom otvorenog koda

Šta sam izgradio

Cardus je web aplikacija koja korisnicima omogućava da kreiraju i upravljaju svojim skladištem predmeta. Korisnici mogu dodavati predmete u svoje skladište i brzo identificirati u kojoj kutiji se nalazi određeni predmet. Korisnici također mogu dijeliti svoje skladište ili kontejner s drugim korisnicima, omogućavajući im suradnju.

Veza do aplikacije

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

Play Store: TBD

Opis

Cardus App je web aplikacija koja izaziva granice web razvoja za mobilne korisnike. Aplikacija je izgrađena s Next.js, React frameworkom, i postavljena je na Vercel. Aplikacija je također PWA, što znači da se može instalirati na mobilne uređaje. Aplikacija koristi i Trusted Web Activity, što joj omogućava da se instalira na Android uređaje. Aplikacija također koristi Google Cloud Platform za pohranu slika i izvođenje TensorFlow.js modela za automatsko prepoznavanje objekata na slikama predmeta.

Želim da aplikacija bude besprijekorna, poput native aplikacije. Postoje ekrani za uvod, prekrasni prijelazi i glatke animacije. Aplikacija također ima tamni način rada, što je nezaobilazno za svaku modernu aplikaciju.

Veza do izvornog koda

Cardus App: GitHub Repozitorij

Dozvola

Apache-2.0 dozvola

Pozadina

⚡ Problem

Teško je označiti kutije za skladištenje
Teško je znati gdje se nalazi kutija za skladištenje
Teško je znati koji se predmeti nalaze u kojoj kutiji

Upravljanje osobnim skladištem/skladištem je izazovno.

💡 Rješenje

Kreiranje web aplikacije koja korisnicima omogućava da kreiraju i upravljaju vlastitim skladištem predmeta
Korisnici mogu dodavati predmete u svoje skladište i brzo identificirati u kojoj kutiji se nalazi određeni predmet
Korisnici također mogu dijeliti svoje skladište ili kutiju s drugim korisnicima, omogućavajući im suradnju

Kako sam to izgradio

📚 Tehnološki sklop

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

📖 Proces

Počeli smo s kreiranjem Next.js aplikacije, a zatim smo napravili MongoDB Atlas klaster. Željeli smo jednostavno komunicirati s MongoDB-om, pa smo koristili ORM s Prismom. Naš fokus je mobilna web aplikacija, pa nas stolno računalo nakon nekog vremena više nije zanimalo. Pretvorili smo je u PWA, s donjom navigacijskom trakom, gornjom trakom i tamnim načinom rada. Također planiramo pretvoriti je u Trusted Web Activity kako bismo je mogli instalirati na Android uređaje.

Na putu smo naišli na mnoge probleme. Korištenje Google Cloud Storage API-ja sa serverless funkcijom zahtijeva trud. Samo korištenjem ovoga već smo se suočili s mnoštvom prepreka. Neke se mogu riješiti čitanjem foruma, a za neke je potrebno pronaći rješenje. Korisnici vole nešto pametno, pa želimo učiniti aplikaciju inteligentnom. Želimo da aplikacija bude u stanju prepoznati objekt na slici, pa koristimo TensorFlow.js za to. Želimo da aplikacija bude u stanju skenirati QR kod, pa koristimo ZXing za to.

📝 Šta sam naučio

Kako koristiti Next.js za izgradnju web aplikacije
Kako koristiti MongoDB Atlas za pohranu podataka
Kako koristiti Google Cloud Platform za pohranu slika
Kako koristiti TensorFlow.js za pokretanje modela u pregledniku
Kako koristiti PWA da bi aplikacija bila instalabilna
Kako koristiti Trusted Web Activity da bi aplikacija bila instalabilna na Android uređajima