Início Suporte

InícioSuporteLinks

Formação em Vibe Coding
Bubble - Aplicativos completos
Criando Histórias com IA - Bubble AI Story Maker

Criando as Histórias

Criar tabela de páginas da História

Acesso Restrito

Faça login para acessar o conteúdo desta aula.

Fazer login Voltar para o curso

Anterior Próxima

Copyright ©2026 - Todos os direitos reservados
Feito com ☕ e alguns bilhões de tokens de IA

Criando Histórias com IA - Bubble AI Story Maker

Progresso do Módulo

0 de 87 aulas concluídas

Como funcionará esse módulo

O que iremos criar

Como clonar o template que utilizaremos com o Bubble Essential Kit

Como criar uma conta e um projeto novo no Supabase

Criar conta na OpenAI e gerar chave API (+saldo)

Criar conta gratuita no N8N

Configurações iniciais de autenticação

Cadastro de usuário via API

Login de usuário via API

Criar workflow de cadastro no Frontend

Criar workflow de Login no Frontend

Como salvar os dados de sessão no 'Current User' (usuário fantasma)

Lógica para aplicar refresh token utilizando usuário fantasma do Bubble

Fazer logoff do usuário do Supabase

Permitir somente o acesso de usuários logados

Criar tabela espelho de usuários no schema Public

Enriquecendo dados de cadastro através de raw_user_metadata

Como automatizar a criação de um perfil na tabela espelho via Trigger

Debugando erros no Supabase

Criar tabela de Histórias

Criar tabela de páginas da História

Endpoint para criar uma nova história na tabela

Criar chamada API (nova história)

Conectando o endpoint ao workflow

Configurando webhook no N8N para criar páginas da história

Criando API Páginas da História

Prompt para gerar histórias

Workflow AI Agent N8N

Inserção das Páginas da História no banco de dados

Ajustando Workflow do botão Criar história

Criar chamada API que vai listar as histórias do usuário autenticado

Configurando o Repeating Group de Histórias

Condicionais de visibilidade no elementos da página index

Criar chamada API de 'Obter detalhes da história'

Criar chamada API Obter Páginas da história

Como configurar uma página dinâmica com dados do Supabase (Parte A)

Como configurar uma página dinâmica com dados do Supabase (Parte B)

Configurando a visualização paginada

Option Sets - Moral da história

Configurando Repeating Group - Moral da história

Option Sets - Estilo da imagem

Configurando Repeating Group - Estilo da imagem

Reajustando workflow botão criar história

Criando bucket no Supabase

Criando imagem de capa da história

Enviando imagem para o Supabase

Relacionando imagem de capa com a história

Ajustando workflow do n8n e testando geração de imagem (Parte A)

Ajustando workflow do n8n e testando geração de imagem (Parte B)

Workflow n8n para gerar imagens da páginas da história (Parte A)

Workflow n8n para gerar imagens da páginas da história (Parte B)

Testando a geração de imagens da capa e páginas da história

Ajustando o Repeating Group para apresentar as imagens da história

Endpoint para deletar uma história

Conectando o endpoint deletar história ao workflow

Criando o remix da história (Parte A)

Criando o remix da história (Parte B)

Criar tabela para gravar histórico de pagamentos

Criando conta de desenvolvedor no ASAAS

Conhecendo documentação API Asaas

Chamada criar cliente no ASAAS

Ajustando API e fluxo de cadastro do usuário (inserindo CPF)

Chamada criar cobrança (Parte A)

Chamada criar cobrança (Parte B)

Criando um webhook para aguardar confirmação do pagamento no N8N

Quando confirmado, dar créditos ao usuário

Atualizar créditos do usuário no Bubble (Parte A)

Atualizar créditos do usuário no Bubble (Parte B)

Permitir a criação de história apenas se houver créditos suficientes

Configurações iniciais quanto ao reset de senha

Endpoint para ação de esqueci minha senha

Atualizar senha dentro da plataforma

Configurar RLS nas tabelas

Endpoint obter todas as histórias (com paginação)

Configurar Repeating Group todas as histórias

Paginação de histórias

Configurações do usuário

Deleção da conta de usuário (Parte A)

Deleção da conta de usuário (Parte B)

Página Descobrir

Página História

Página Nova História

Considerações finais

Avaliação do Módulo