Quickstarters
CRUD Samples
Building a CRUD App with Jetpack Compose?
29 min
panoramica in questa guida, imparerai come sviluppare un'applicazione crud (crea, leggi, aggiorna, elimina) utilizzando jetpack compose per android illustreremo come gestire efficacemente le operazioni sui dati integrando la tua app con back4app il progetto inizia configurando un'istanza di back4app chiamata basic crud app jetpackcompose , che servirà come una solida infrastruttura backend delineremo come progettare uno schema di database ottimale definendo collezioni e campi specifici, sia manualmente che sfruttando gli strumenti basati su ai di back4app questo assicura che la struttura dei dati della tua app sia abbastanza robusta per operazioni crud senza soluzione di continuità successivamente, configurerai la console di amministrazione di back4app, un'interfaccia intuitiva e drag and drop che semplifica la gestione dei dati, rendendo facile eseguire azioni crud infine, collegherai il tuo frontend jetpack compose con back4app, utilizzando sia il parse android sdk (dove applicabile) che chiamate dirette all'api rest, mentre imposti misure di sicurezza rigorose con controlli di accesso avanzati alla fine di questo tutorial, avrai un'applicazione android che supporta le funzionalità crud essenziali, completa di autenticazione utente e gestione sicura dei dati cosa imparerai come costruire un'applicazione basata su crud su android utilizzando jetpack compose metodi per creare un backend scalabile con back4app strategie per utilizzare la console di amministrazione intuitiva di back4app per la manipolazione dei dati tecniche di integrazione con il parse android sdk o le api rest requisiti prima di procedere, assicurati di avere quanto segue pronto un account back4app con un progetto appena creato se hai bisogno di assistenza, dai un'occhiata a iniziare con back4app https //www back4app com/docs/get started/new parse app un ambiente di sviluppo android con android studio assicurati di avere installata l'ultima versione di android studio insieme a kotlin familiarità con kotlin, jetpack compose e api restful per un rapido ripasso, visita la documentazione di jetpack compose https //developer android com/jetpack/compose passo 1 – iniziare il tuo progetto creare un progetto back4app accedi al tuo account back4app seleziona l'opzione “nuova app” dalla tua dashboard nomina il tuo progetto basic crud app jetpackcompose e completa il processo di configurazione crea nuovo progetto dopo aver configurato, il tuo progetto sarà visibile nella console di back4app, ponendo le basi per la configurazione del tuo backend passo 2 – creare il tuo schema di database definire la tua struttura dati per questa app crud, definirai diverse collezioni di seguito sono riportate collezioni di esempio insieme ai campi e ai tipi di dati necessari, assicurando che il tuo backend sia ben preparato per gestire i dati 1\ collezione articoli questa collezione è utilizzata per memorizzare i dettagli di ogni voce campo tipo dettagli id objectid identificatore unico generato automaticamente titolo stringa nome o titolo dell'elemento descrizione stringa una breve panoramica dell'oggetto creato il data timestamp di quando l'elemento è stato aggiunto aggiornato il data timestamp per l'ultimo aggiornamento 2\ raccolta utenti questa collezione gestisce i profili utente e i dati di autenticazione campo tipo descrizione id objectid chiave primaria generata automaticamente nome utente stringa identificatore univoco dell'utente email stringa indirizzo email unico dell'utente hash password stringa password crittografata per la sicurezza creato il data timestamp di creazione dell'account aggiornato a data ultimo aggiornamento dell'account puoi aggiungere manualmente queste collezioni e campi tramite il dashboard di back4app creando nuove classi e specificando le colonne necessarie crea nuova classe puoi impostare ogni colonna scegliendo un tipo di dato, assegnandole un nome, impostando valori predefiniti e determinando se è obbligatoria crea colonna sfruttare l'ai di back4app per la configurazione dello schema lo strumento ai di back4app può automatizzare la creazione del tuo schema di database interpretando un prompt che delinea le collezioni e i campi desiderati questa funzionalità accelera significativamente la configurazione del progetto come utilizzare lo strumento ai accedi allo strumento ai accedi alla tua console back4app e naviga nella sezione ai inserisci la descrizione del tuo schema fornisci un prompt dettagliato che delinea le collezioni e i loro campi corrispondenti esamina e applica dopo la generazione, esamina lo schema proposto e integralo nel tuo progetto esempio di prompt ai create the following collections in my back4app project collection items \ fields \ id objectid (auto generated) \ title string \ description string \ created at date (auto assigned) \ updated at date (auto updated) collection users \ fields \ id objectid (auto generated) \ username string (unique) \ email string (unique) \ password hash string \ created at date (auto assigned) \ updated at date (auto updated) utilizzare questo metodo ai garantisce che il tuo database sia strutturato correttamente e ottimizzato per le esigenze della tua app passo 3 – attivazione della console amministrativa e gestione delle funzioni crud introduzione alla console amministrativa la console amministrativa di back4app è una soluzione versatile senza codice che ti consente di supervisionare e manipolare i tuoi dati di backend senza sforzo la sua interfaccia intuitiva supporta operazioni crud drag and drop, rendendo la gestione dei dati semplice attivazione della console di amministrazione vai alla sezione “altro” nel tuo dashboard di back4app seleziona “console di amministrazione” e poi scegli “attiva console di amministrazione ” imposta le tue credenziali di amministratore registrando il tuo primo utente amministratore, il che stabilisce anche i ruoli e le collezioni di sistema necessari abilita l'app di amministrazione una volta attivata, accedi alla console di amministrazione per gestire le tue collezioni dashboard dell'app di amministrazione esecuzione di azioni crud tramite la console all'interno della console di amministrazione, puoi aggiungere record usa la funzione “aggiungi record” all'interno di una collezione (ad esempio, articoli) per inserire nuove voci visualizzare/modificare record clicca su qualsiasi record per rivedere o modificare i suoi campi rimuovere record seleziona l'opzione di eliminazione per eliminare record obsoleti questa interfaccia semplificata aumenta la produttività rendendo le operazioni di backend sia accessibili che efficienti passo 4 – collegare jetpack compose con back4app ora che il tuo backend è configurato, è tempo di collegare la tua app android costruita con jetpack compose a back4app opzione a utilizzare il parse android sdk aggiungi la dipendenza del parse sdk aggiorna il tuo build gradle file implementation 'com parse\ parse android\ latest version' inizializza parse nella tua classe application crea o aggiorna la tua classe application (ad esempio, myapplication kt ) // myapplication kt package com example basiccrud import android app application import com parse parse class myapplication application() { override fun oncreate() { super oncreate() parse initialize( parse configuration builder(this) applicationid("your application id") clientkey("your client key") server("https //parseapi back4app com") build() ) } } implementa crud in una schermata compose ad esempio, crea una schermata per elencare gli elementi // itemsscreen kt package com example basiccrud import androidx compose foundation layout import androidx compose foundation lazy lazycolumn import androidx compose foundation lazy items import androidx compose material button import androidx compose material text import androidx compose runtime import androidx compose ui modifier import androidx compose ui unit dp import com parse parseobject import com parse parsequery import kotlinx coroutines dispatchers import kotlinx coroutines withcontext @composable fun itemsscreen() { var items by remember { mutablestateof(listof\<parseobject>()) } launchedeffect(unit) { withcontext(dispatchers io) { val query = parsequery getquery\<parseobject>("items") try { val result = query find() items = result } catch (e exception) { e printstacktrace() } } } column(modifier = modifier padding(16 dp)) { text(text = "items", modifier = modifier padding(bottom = 8 dp)) lazycolumn { items(items) { item > row( modifier = modifier fillmaxwidth() padding(8 dp), horizontalarrangement = arrangement spacebetween ) { text(text = item getstring("title") ? "nessun titolo") button(onclick = { / attiva azione di modifica / }) { text(text = "modifica") } } } } } } opzione b utilizzo di rest o graphql se preferisci non utilizzare il parse sdk, puoi interagire direttamente con back4app utilizzando api restful o graphql ad esempio, per recuperare elementi tramite rest suspend fun fetchitems() { try { val response = khttp get( url = "https //parseapi back4app com/classes/items", headers = mapof( "x parse application id" to "your application id", "x parse rest api key" to "your rest api key" ) ) // process json response accordingly } catch (e exception) { e printstacktrace() } } integra queste chiamate api nei tuoi componenti compose come richiesto passo 5 – sicurezza del tuo backend implementazione delle liste di controllo degli accessi (acl) migliora la sicurezza dei dati assegnando acl ai tuoi oggetti ad esempio, per creare un record accessibile solo dal suo proprietario suspend fun createsecureitem(itemdata map\<string, string>, owneruser parseobject) { val item = parseobject("items") item put("title", itemdata\["title"]) item put("description", itemdata\["description"]) // define acl so that only the owner has read/write privileges val acl = parseacl(owneruser) acl publicreadaccess = false acl publicwriteaccess = false item acl = acl try { item save() println("secure item saved successfully") } catch (e exception) { e printstacktrace() } } configurazione delle autorizzazioni a livello di classe (clp) all'interno della console di back4app, regola le clp per ogni collezione questo garantisce che solo gli utenti autorizzati o autenticati possano accedere ai dati sensibili passo 6 – gestione dell'autenticazione degli utenti impostazione degli account utente back4app utilizza la classe user integrata di parse per gestire l'autenticazione nella tua app jetpack compose, gestisci la registrazione e il login degli utenti utilizzando il parse sdk di seguito è riportato un esempio di una schermata di registrazione utilizzando compose // signupscreen kt package com example basiccrud import androidx compose foundation layout import androidx compose material button import androidx compose material outlinedtextfield import androidx compose material text import androidx compose runtime import androidx compose ui modifier import androidx compose ui unit dp import com parse parseuser @composable fun signupscreen() { var username by remember { mutablestateof("") } var email by remember { mutablestateof("") } var password by remember { mutablestateof("") } column(modifier = modifier padding(16 dp)) { outlinedtextfield( value = username, onvaluechange = { username = it }, label = { text("username") }, modifier = modifier fillmaxwidth() ) spacer(modifier = modifier height(8 dp)) outlinedtextfield( value = email, onvaluechange = { email = it }, label = { text("email") }, modifier = modifier fillmaxwidth() ) spacer(modifier = modifier height(8 dp)) outlinedtextfield( value = password, onvaluechange = { password = it }, label = { text("password") }, modifier = modifier fillmaxwidth() ) spacer(modifier = modifier height(16 dp)) button(onclick = { val user = parseuser() user username = username user email = email user setpassword(password) user signupinbackground { e > if (e == null) { println("user registered successfully!") } else { println("registration error ${'$'}{e message}") } } }) { text(text = "sign up") } } } puoi implementare schermate simili per il login e la gestione delle sessioni funzionalità aggiuntive come il login sociale, la verifica dell'email e il recupero della password possono essere gestite tramite la console di back4app passo 7 – (non applicabile) nota il deployment via web non è applicabile in questo contesto dell'app mobile passo 8 – riflessioni finali e prossimi passi congratulazioni! hai ora sviluppato un'applicazione crud completa utilizzando jetpack compose e back4app hai impostato un progetto chiamato basic crud app jetpackcompose , progettato uno schema di database efficace per articoli e utenti, e utilizzato la console di amministrazione di back4app per una gestione dei dati semplice inoltre, hai integrato il tuo frontend android con back4app, applicando misure di sicurezza robuste lungo il percorso cosa c'è dopo? espandi la tua ui compose migliora la tua applicazione con funzionalità aggiuntive come visualizzazioni dettagliate degli articoli, capacità di ricerca e aggiornamenti di dati in tempo reale incorpora più logica di backend considera di utilizzare cloud functions, integrare api di terze parti o implementare controlli di accesso basati sui ruoli ulteriore apprendimento esplora la documentazione di back4app https //www back4app com/docs e ulteriori tutorial su compose per ottimizzare le prestazioni ed esplorare integrazioni personalizzate seguendo questo tutorial, ora hai gli strumenti per costruire un backend crud sicuro ed efficiente per le tue applicazioni android utilizzando jetpack compose e back4app buon coding!