Quickstarters
CRUD Samples
Construindo uma aplicação CRUD com Jetpack Compose?
29 min
visão geral neste guia, você aprenderá como desenvolver uma aplicação crud (criar, ler, atualizar, deletar) usando jetpack compose para android ilustraremos como gerenciar operações de dados de forma eficaz integrando seu aplicativo com o back4app o projeto começa configurando uma instância do back4app chamada basic crud app jetpackcompose , que servirá como uma infraestrutura de backend sólida descreveremos como projetar um esquema de banco de dados ideal definindo coleções e campos específicos—seja manualmente ou aproveitando as ferramentas impulsionadas por ia do back4app isso garante que a estrutura de dados do seu aplicativo seja robusta o suficiente para operações crud sem interrupções em seguida, você configurará o console de administração do back4app, uma interface amigável de arrastar e soltar que simplifica o gerenciamento de dados, tornando fácil realizar ações crud finalmente, você conectará seu frontend jetpack compose com o back4app, utilizando o sdk parse para android (onde aplicável) ou chamadas diretas à api rest, enquanto impõe medidas de segurança rigorosas com controles de acesso avançados ao final deste tutorial, você terá um aplicativo android que suporta funcionalidades essenciais de crud, completo com autenticação de usuário e manuseio seguro de dados o que você aprenderá como construir uma aplicação baseada em crud no android usando jetpack compose métodos para criar um backend escalável com o back4app estratégias para usar o intuitivo console de administração do back4app para manipulação de dados técnicas de integração com o sdk parse para android ou apis rest pré requisitos antes de prosseguir, certifique se de ter o seguinte pronto uma conta back4app com um projeto recém criado se você precisar de assistência, confira introdução ao back4app https //www back4app com/docs/get started/new parse app uma configuração de desenvolvimento android com android studio certifique se de ter a versão mais recente do android studio instalada junto com kotlin familiaridade com kotlin, jetpack compose e apis restful para uma rápida atualização, visite a documentação do jetpack compose https //developer android com/jetpack/compose passo 1 – iniciando seu projeto criando um projeto back4app faça login na sua conta back4app selecione a opção “novo app” no seu painel nomeie seu projeto basic crud app jetpackcompose e complete o processo de configuração criar novo projeto após a configuração, seu projeto será visível no console do back4app, estabelecendo as bases para sua configuração de backend passo 2 – elaborando seu esquema de banco de dados esboçando sua estrutura de dados para este aplicativo crud, você definirá várias coleções abaixo estão coleções de exemplo junto com os campos e tipos de dados necessários, garantindo que seu backend esteja bem preparado para lidar com dados 1\ coleção itens esta coleção é usada para armazenar detalhes sobre cada entrada campo tipo detalhes id objectid identificador único gerado automaticamente título string nome ou título do item descrição string uma breve visão geral do item criado em data timestamp de quando o item foi adicionado atualizado em data timestamp da última atualização 2\ coleta usuários esta coleção gerencia perfis de usuário e dados de autenticação campo tipo descrição id objectid chave primária gerada automaticamente nome de usuário string identificador único do usuário email string endereço de e mail único do usuário hash senha string senha criptografada para segurança criado em data timestamp de criação da conta atualizado em data última atualização da conta você pode adicionar manualmente essas coleções e campos através do painel do back4app, criando novas classes e especificando as colunas necessárias criar nova classe você pode definir cada coluna escolhendo um tipo de dado, nomeando a, atribuindo valores padrão e determinando se é obrigatória criar coluna aproveitando a ia do back4app para configuração de esquema a ferramenta de ia do back4app pode automatizar a criação do esquema do seu banco de dados interpretando um prompt que descreve suas coleções e campos desejados esse recurso acelera significativamente a configuração do projeto como usar a ferramenta de ia acesse a ferramenta de ia faça login no seu console do back4app e navegue até a seção de ia insira a descrição do seu esquema forneça um prompt detalhado descrevendo as coleções e seus campos correspondentes revise e aplique após a geração, examine o esquema proposto e integre o ao seu projeto exemplo de prompt de ia 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) usar esse método de ia garante que seu banco de dados esteja estruturado corretamente e otimizado para as necessidades do seu aplicativo passo 3 – ativando o console de administração e gerenciando funções crud introdução ao console de administração o console de administração do back4app é uma solução versátil, sem código, que permite que você supervise e manipule seus dados de backend sem esforço sua interface intuitiva suporta operações crud de arrastar e soltar, tornando o gerenciamento de dados simples ativando o console do admin vá para a seção “mais” no seu painel do back4app selecione “console do admin” e então escolha “ativar console do admin ” configure suas credenciais de admin registrando seu primeiro usuário admin, o que também estabelece os papéis e coleções de sistema necessários habilitar aplicativo admin uma vez ativado, faça login no console do admin para gerenciar suas coleções painel do aplicativo admin executando ações crud via o console dentro do console do admin, você pode adicionar registros use o recurso “adicionar registro” dentro de uma coleção (por exemplo, itens) para inserir novas entradas visualizar/editar registros clique em qualquer registro para revisar ou modificar seus campos remover registros selecione a opção de excluir para eliminar registros obsoletos esta interface simplificada aumenta a produtividade ao tornar as operações de backend acessíveis e eficientes passo 4 – conectando jetpack compose com back4app agora que seu backend está configurado, é hora de vincular seu aplicativo android construído com jetpack compose ao back4app opção a utilizando o sdk android do parse adicione a dependência do sdk parse atualize seu build gradle arquivo implementation 'com parse\ parse android\ latest version' inicialize o parse na sua classe de aplicação crie ou atualize sua classe de aplicação (por exemplo, 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() ) } } implemente crud em uma tela compose por exemplo, crie uma tela para listar itens // 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 = "itens", 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") ? "sem título") button(onclick = { / acionar ação de edição / }) { text(text = "editar") } } } } } } opção b usando rest ou graphql se você preferir não usar o parse sdk, pode interagir com o back4app diretamente usando apis restful ou graphql por exemplo, para recuperar itens via 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() } } integre essas chamadas de api em seus componentes compose conforme necessário passo 5 – protegendo seu backend implementando listas de controle de acesso (acls) aumente a segurança dos dados atribuindo acls aos seus objetos por exemplo, para criar um registro acessível apenas pelo seu proprietário 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() } } configurando permissões em nível de classe (clps) dentro do seu console back4app, ajuste os clps para cada coleção isso garante que apenas usuários autorizados ou autenticados possam acessar dados sensíveis passo 6 – gerenciando a autenticação de usuários configurando contas de usuário o back4app utiliza a classe de usuário embutida do parse para gerenciar a autenticação no seu aplicativo jetpack compose, gerencie o cadastro e o login do usuário usando o sdk do parse abaixo está um exemplo de uma tela de cadastro usando 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") } } } você pode implementar telas semelhantes para login e gerenciamento de sessão recursos adicionais como login social, verificação de email e recuperação de senha podem ser gerenciados através do console do back4app passo 7 – (não aplicável) nota a implantação via web não é aplicável neste contexto de aplicativo móvel passo 8 – considerações finais e próximos passos parabéns! você agora desenvolveu um aplicativo crud completo usando jetpack compose e back4app você configurou um projeto chamado basic crud app jetpackcompose , projetou um esquema de banco de dados eficaz para itens e usuários, e utilizou o console de administração do back4app para fácil gerenciamento de dados além disso, você integrou seu frontend android com o back4app, aplicando medidas de segurança robustas ao longo do caminho o que vem a seguir? expanda sua ui compose aprimore seu aplicativo com recursos adicionais, como visualizações detalhadas de itens, capacidades de busca e atualizações de dados em tempo real incorpore mais lógica de backend considere usar funções em nuvem, integrar apis de terceiros ou implementar controles de acesso baseados em funções aprendizado adicional explore a documentação do back4app https //www back4app com/docs e tutoriais adicionais de compose para otimizar o desempenho e explorar integrações personalizadas ao seguir este tutorial, você agora tem as ferramentas para construir um backend crud seguro e eficiente para seus aplicativos android usando jetpack compose e back4app boa codificação!