Curso WeWeb Gratuito para Iniciantes - Aprenda do ZERO em 1 aula

se você tá aqui Provavelmente você já ouviu falar sobre Wi web uma ferramenta de desenvolvimento de aplicativos que tá ganhando muito mercado muito rápido e nada disso à toa É porque ela realmente é muito boa então no vídeo de hoje você vai aprender primeiro o que é o iweb afinal de contas a gente vai criar na prática galera um aplicativo Real um aplicativo funcional juntos e eu te garanto você vai conseguir criar sem gastar um centavo porque a gente vai fazer tudo no plano grátis deles então fica comigo que a gente vai criar um aplicativo

aqui ao vivo junto comigo eu vou falar sobre Quanto tempo você demora para aprender o e-web para criar aplicativos mais avançados aplicativos completos vamos falar sobre o que é possível criar com eweb o que não é possível criar com o eweb quanto custa o eweb Como funciona o plano grátis deles como ganhar dinheiro com o eweb ou seja como pegar esse conhecimento que você vai criar e transformar isso em oportunidades de trabalho de negócio Enfim fazer dinheiro e por fim Qual a melhor forma de aprender o e-web forma mais otimizada forma mais rápida Então vamos

S começar galera afinal de contas O que é o iweb galera o iweb nada mais é do que uma plataforma low code para desenvolvimento visual de aplicativos web e mobile Ou seja que funcionam tanto no teu navegador do computador quanto no teu tablet quanto no teu celular então assim eu sei que geralmente quando vocês começam esses vídeos vocês já ficam loucos para botar a mão na massa Então vamos lá galera vamos direto pra ferramenta E aí a gente vai criar juntos um aplicativo aqui do zero aí depois eu volto aqui para contextualizar um pouco melhor

pode ser vamos lá então mão na massa Então galera galera vamos lá primeira coisa Quais são os prérequisitos para você conseguir fazer o que a gente vai fazer aqui hoje você precisa de um computador com internet Ah Renato pode ser celular pô galera eu te sugiro assistir o vídeo pelo celular mas fazer no teu computador porque assim ó desenvolver aplicativos com o teu celular Putz não tem como assim as ferramentas não são para isso elas são para arrastar componentes com o mouse sabe precisa de mais espaço de tela Então realmente ah Renato mas eu não

tô no computador agora tranquilo dá uma pausada vai paraa tua casa pega teu computador põe o celular assistindo o vídeo aqui do lado Ou se tiver um segundo monitor melhor ainda põe o vídeo aqui e centra aqui no teu computador e cara cria no computador tá segundo você precisa de uma conta gratuita no Wi web não precisa pagar nada vai em link.sem codar.me pessoal que um dia se vocês quiserem ir pro plano pago do Wi web Depois eu falo mais sobre plano grátis plano pago você vai ter 10% de desconto Então já aproveita para se

cadastrar aqui e você vai precisar de uma conta gratuita no supabase que é o banco de dados que nós vamos utilizar para armazenar as informações do nosso aplicativo lista de mercado aqui e aí você vai em sup base.com para criar tua conta grátis no supabase e por fim você precisa de 30 minutos disponíveis pela frente para poder entender praticar fazer junto comigo que a gente vai construir aqui ah mas Renato eu já conheço um pouco de ferramenta por que que eu preciso de duas ferramentas Wi web e sup base pessoal aqui é importante explicar o

seguinte o Wi web é uma ferramenta de front end ou seja ele te permite criar a parte toda de interface ou design toda a parte lógica fazer as conexões api só que ele não tem um servidor ele não tem um banco de dados Então precisamos necessariamente integrar a um banco de dados externo ou um backend externo a gente chama isso aqui pensa mais ou menos assim tá imagina como se o front end fosse a carroceria do seu carro todas as conexões tudo exceto pelo motor e o backend é o motor Por que que o iweb

e muitas ferramentas hoje em dia são construídas dessa forma e até linguagens de programação né Tem linguagens que são só para criar o Fronte você vai para uma outra linguagem para criar o backend porque pessoal é interessante que isso seja desacoplado em muitos casos especialmente com aplicativos pô de porte muito grande muito escaláveis porque você consegue escolher o backend que você precisa então por exemplo eu vou criar um aplicativo Renato que já tem 10 milhões de usuários eu já preciso de um backend extremamente robusto de um motor extremamente robusto Você concorda comigo que no teu

carro o que vai definir a velocidade que ele chega não é a carroceria é o motor carroceria tanto faz então aqui da mesma forma aí vamos dizer que você queira usar o iweb como o frontend como a parte visual lógica conectora do teu aplicativo a n não tá muito claro para mim o que que é isso ainda fica tranquilo a gente vai botar a mão na massa você vai entender e aí você pode usar por exemplo o Fire base que é uma ferramenta do Google de backend aqui nos Bastidores pessoal o firebase é utilizado pela

lift dos Estados Unidos a lift caso você não conheça é concorrente do Uber lá mas são mais de 20 milhões de motoristas usando o negócio o tempo todo em tempo real então assim pode ter certeza que se D conta da lift vai dar conta do teu aplicativo também a gente aqui fala de outras ferramentas Como por exemplo o zano que é um backend muito legal ele é 100% no code assim então você consegue criar tudo de forma visual eu vou usar o supa base aqui porque ele é um backend muito robusto muito barato inclusive tem

um plano gratuito que nos permite ir muito longe no plano free plano free excelente aliás eu tenho alunos já com aplicativos em utilização com mais de 500 usuários ainda no plano free do supa base Então ela ela é gostosa de mexer assim eu te sugiro fortemente por isso que a gente vai fazer com ela aqui tá Então galera vamos lá passo a passo vamos começar a colocar a nossa mão na massa tá pessoal presta atenção fica comigo aqui ó Qual que é o primeiro passo pra criação de um aplicativo sempre sempre o primeiro passo eu

chamo isso aqui de MIB tão importante que eu me deu o trabalho de dar um nome para isso aqui e se você é um velho como eu você vai falar oh MIB filmão hein Renato Will Smith Tomy le Jones caçando alienígenas esse garoto Parece até o Capitão América o melhor do melhor do melhor Senor é não é desse MIB que eu tô falando no caso né quando eu falo MIB é o seguinte pessoal o primeiro passo aqui é você buscar o seu modelo ou a sua musa ou melhor a fonte de inspiração pro teu aplicativo

o é de interface ou a parte de design do teu aplicativo e o b é banco de dados Esse é o primeiro passo galera MIB MIB busque um modelo desenhe a interface pense no banco de dados isso aqui é antes de ir pro computador isso aqui é antes de abrir o Web qualquer ferramenta que seja então assim ó primeiro passo aqui qual que é o modelo que a gente vai usar galera olha só se você é um designer um desenvolvedor extremamente experiente com 10 15 anos de carreira Você já colocou na sua cabeça um repertório

que te permite criar as coisas do zero isso é fantástico cara eu eu ainda tô na criação do meu reperttório eu tô quase há uma década nessa brincadeira mas você vê gente que assim do nada do zero já começa a desenhar coisas lindas e sabe exatamente onde vai o quê se você tá aqui comigo você provavelmente assim como eu ainda não tem esse repertório e tá tudo bem com isso galera por isso que é muito importante você passar 60 70 80% do teu tempo no MIB pensando em qual é o modelo de inspiração que você

vai usar pensando na interface pensando no banco de dados então aqui ó Qual que é o aplicativo que a gente vai criar é uma lista de mercados certo então você pode ir lá no Google e procurar por aplicativo lista de mercado busque um modelo que tem mais ou menos as coisas que você quer criar ah Renato não é exatamente igual não importa que seja mais ou menos igual vai em imagens que você já vai começar a anotar alguns padrões ó olha só aplicativo de Lista de Compras queel a lista de compras clássica que a gente

já conhece né iten Zinho aqui caixinha marcado iten Zinho aqui caixinha marcado iten Zinho aqui caixinha marcado só de fazer esse pré estudo aqui galera olha só aplicativo de lista de mercado é tudo meio parecido é você pegar e acessar Algum deles e ir lá interagir com ele para ver como que ele funciona eu vou usar pessoal o Google Keep Porque o Google Keep é o que eu uso como lista de mercado né então você vem aqui vai em keep.google.com se você quiser fazer também clica aqui em Nova lista ó e ele vai te dar

uma nova lista então o que que eu preciso comprar eu preciso comprar pão de trigo picanha alface mortadela frango e queijo por exemplo Opa criei os meus itens no banco de dados aí eu venho aqui e Marco os que eu já comprei que que acontece quando eu marco que eu já comprei eu clico na caixinha você vê que ele vem aqui para baixo e a caixinha fica marcada né ó e aí quando eu desmarco ele volta aqui para cima pronto galera tudo que a gente precisa de inspiração já está aqui a gente já tem o

modelo do nosso aplicativo galera a gente já tem o layout ó um menuzinho aqui do lado um cabeçalho aqui em cima o conteúdo aqui no meio os itens a caixinha de marcado tá tudo resolvido galera então a primeiro passo aqui ó já achamos vai ser o Google Keep Nossa inspiração show estamos em dúvida Putz onde é que eu insiro esse elemento você vai voltar no Google Keep isso galera não é nada mais importante para um desenvolvedor do que ter um modelo de inspiração para onde recorrer quando tiver em dúvida sobre qual próximo passo a seguir

interface agora ou design galera Como que eu sugiro fortemente você desenhar a interface primeira coisa Conheça o conceito de Wire frames Wire frames galera é um desenho bem rústico mais ou menos do que você quer fazer ó Isso são ir frames sempre que você vai ah trabalho como desenvolvedor eu quero entregar um projeto para um cliente Você vai desenhar os Wi frames vai entregar isso aqui para ele vai falar é isso que você quer galera wireframe é um recurso muito poderoso e assim ó onde é que você vai desenhar isso aqui ai Renato mas eu

não conheço nenhuma ferramenta de design de Wire frames ou ai a ferramenta que eu vi é galera para com a noia Você vai desenhar isso aqui numa folha de papel Você vai desenhar isso aqui na tua mão Você vai desenhar isso aqui no box do teu chuveiro se você quiser não importa onde quer ver vamos ver isso na prática nem tudo se resolve no computador galera para isso a gente vai para nosso querido estimado bloco de notas Então vamos lá desenhar isso na mão ó galera então vocês vão pegar literalmente qualquer folha de papel rascunho

sulfite tem um bloquinho de notas desse aqui na tua casa e aí você vai desenhar na mão o qual é a interface Qual é a tela que você quer que o teu usuário veja Então olha só vamos desenhar um negócio muito parecido com que a gente tem no Google ali ó a gente tem um menuzinho lateral aqui onde aqui tá o teu logotipo aqui tão várias opções de navegação aquele menu clássico que você conhece de um milhão de aplicativos diferentes aqui vai ter um cabeçalho Zinho geralmente com algumas opções também de lugares de navegação aqui

um botão para você fazer cadastro enfim alguma coisinha assim e todos esses botões aqui pessoal eles não vão nem ter funcionalidade a gente vai criar só pela estética mesmo tá só para desenhar a interface Então esse aqui vai ser o menu esse aqui vai ser cabeçalho ou barra de navegação e aí aqui sim estará o meu conteúdo principal ó essa interface não é comum para você é o que a gente acabou de ver então aqui vai tá a nossa lista de mercado meu Deus Renato que caligrafia horrível concordo 100% contigo não nego não e aí

aqui a gente vai ter o quê pessoal Quais são os elementos essenciais nessa tela a gente vai ter um campinho aqui ó onde a pessoa vai inserir o nome do produto a gente vai ter um botão em que quando a pessoa tocar se ela tiver no celular ou clicar se ela tiver no computador clicou aqui vai adicionar um produto lá no banco de dados E aí aqui pessoal vai ter uma lista com todos os produtos criados então produto um produto 2 produto 3 produto 4ro aí que que vai ter nessa lista aqui ó vai ter

uma caixinha aqui para cada um desses produtos em que quando você clica ele como comprado ele vai ficar marcadinho assim ó comprei o pão e comprei a alface falta comprar esses dois por exemplo Esse é o layout Essa é a interface Esse é o design da nossa lista de mercado Será que a gente consegue ainda hoje fazer uma telinha de autenticação de usuários podemos arriscar né como é que é uma tela de de usuários clássica pessoal clássica acessa aí numa guia anônima por exemplo teu Google enfim você vai ver que é mais ou menos sempre

o seguinte ó a tela aqui no meio com um logotipo aqui aí Aqui tem um campo onde você insere teu e-mail aqui um campo onde você insere tua senha meu Deus Renato tá ficando mais feio ainda é verdade galera como disse não nego não e aqui um botão onde você faz o login ou cadastro de usuário Isso é uma tela de autenticação de usuários galera Então olha só que interessante só nessa brincadeira a gente já sabe Exatamente tudo que a gente precisa criar para ter as duas telas 100% funcionais do nosso aplicativo vamos voltar pro

computador agora desenho concluído galera então desenho finalizado já temos o wireframe da nossa interface Que show e nem come nem abrimos o Web ainda você vê que coisa doida confia em mim galera passa 90% do teu tempo no teu MIB é um é o tempo mais bem investido da criação do teu aplicativo por fim banco de dados ah Renato eu não conheço banco de dados Calma calma relaxa Respira fundo se você já usou uma planilha uma vez na sua vida você vai conseguir entender banco de dados Então olha só abra uma planilha o primeiro passo

tá na dúvida abre uma planilha criamos aqui uma planilha no Google tá Chama o Web banco de dados show de bola Vamos dar um zoom nela P gala planilha você já abriu na sua vida né Pensa comigo como que a gente estruturaria uma planilha para acompanhar os produtos que a gente precisa comprar pra nossa casa seria mais ou menos assim ó pão queijo Alface carne não né Você bate o olho aqui cara que estranho não é assim como que seria uma planilha dessa galera é incentivo para você você vai primeiro desenhar as colunas então cada

coluna vai ter um tipo de valor Qual que é a primeira coluna nome do produto aí aqui sim galera vai ter o pão a carne alface e a picanha e a segunda coluna é outra informação que a gente precisa alimentar que é a seguinte tá comprado pão não tá comprado carne tá comprado alface não picanha sim pronto concorda comigo galera que isso aqui é como a gente estrutura uma planilha isso aqui é como você faria isso é o nosso banco de dados então o que que a gente tem aqui ó aqui na planilha a gente

vai renomear como produtos a gente tem uma planilha de produtos com dois Campos nome do produto e comprado que que vai em cada Campo desse aqui vai um texto e Aqui vai um valor que é sempre sim ou não banco de dados modelado galera isso aqui a gente já consegue extrair todas as informações que a gente precisa então aqui ó a gente vai ter uma tabela chamada produtos aí dentro dessa tabela a gente vai ter um campo nome do produto do tipo texto e um campo comprado do tipo sim ou não verdadeiro ou falso ou

galera na programação a gente chama isso de buano Tá o que que é um buano buano é quando é sim ou não só existe duas possibilidades zero ou um verdadeiro ou falso negativo positivo enfim esse é o nosso banco de dados G então nosso planejamento do aplicativo foi realizado com sucesso Invista o tempo que for necessário aqui para que a gente possa finalmente passar pro segundo passo que é o qu galera Agora sim a gente vai pro segundo passo então que Aí sim galera vamos abrir o Wi web aí agora a gente vai criar um

novo projeto no Wi web então se você já criou a tua conta free no Wi web você vai cair numa tela mais ou menos como essa aqui e aí você vai dar um Create or duplicate Projeto Criar projeto né quer usar algum template ele te pergunta então já tem por exemplo ó um CRM que é parecido com o pipedrive assim Aquele modelo de kamban aqui né um curso online um formulário multipasso um portal de empregos um dashboard um negócio tipo chat GPT você vê que já tem bastante coisa aqui né eu vou começar em branco

tá porque a gente desenha juntos como é uma interface muito simples e a gente já fez nosso wireframe no papel vamos começar em branco aqui e aí eu vou chamar de lista de mercado YouTube Live e na linguagem eu vou botar português que ele já seta como português aqui a nossa linguagem padrão criar projeto lembrando galera isso tudo é free hein você não precisa pagar para nada projeto vai ser totalmente free E aí vamos abrir o editor do projeto que a gente criou e temos o nosso aplicativo esperando para ser montado aqui galera show de

bola então a gente já tá com a parte do eweb prontinha tá próximo passo Vamos para o supabase criar também um novo projeto Então você já deve ter criado a tua conta fre no supa base e aí você vai cair numa tela mais ou menos como essa talvez sem esses projetos aqui né Você só vai clicar em new Project ou novo projeto escolha uma organização a organização que você criou ali durante o processo de cadastro do supabase nome lista de mercado YouTube Live também escolha uma senha Gere uma senha Opa gerou uma senha copiei deixa

eu anotar essa senha aqui do lado porque pode ser que eu preciso dela depois região ou seja onde você quer hospedar o seu banco de dados onde que tá mais próximo de você para que os dados viagem mais rápido possível para não dar delay assim pro usuário né para ficar uma interf uma um tempo de espera mais legal coloca São Paulo é mais próximo da imagino de todos nós aqui né Criar novo projeto Opa aí ele fala assim ó configurando o projeto ó estamos configurando seu projeto aguarde um pouco vai demorar alguns minutinhos aqui para

terminar de criar o teu projeto não tem problema a gente já pode partir pros próximos passos enquanto ele vai fazendo essa criação tá agora lá no eweb galera voltamos a gente vai desenhar a nossa interface principal que é a lista de mercado propriamente dita né E aí galera olha só E aí vamos lá então e aí você percebe que logo de cara que que você tem aqui ó você tem um cabeçalho na parte superior Onde estão todos os menus aqui coisas que a gente vai explorando no decorrer da criação Não se preocupe muito com isso

por enquanto pode voltar aqui pra aba de layout não sabe como voltar clica em alguma duas vezes aqui por exemplo ó abriu as bibliotecas fecha abriu os elementos fecha novamente ó essa aqui é a parte principal tá clica aqui em layout aqui está uma árvore de elementos então tudo que você tem na tela no nosso caso a gente só tem uma sessão aqui chamada Blank né que é em branco tá vai tá aqui aqui é a tela do seu aplicativo propriamente dita Então o que o usuário vai ver vai tá aqui e aqui são as

configurações então quando eu seleciono alguma coisa aqui na tela aqui do lado direito são as propriedades dessa coisa que eu selecionei então aqui a gente vai modificando essas propriedades Então vamos pegar Como que tava o nosso desenhinho lá né galera a gente tinha então esse desenho aqui Que Nós criamos concorda comigo vamos recriar isso galera Então vem aqui em Ed que é adicionar é onde você busca os elementos que você quer adicionar tá então vamos começar a inserir as sessões no nosso aplicativo primeiro passo pega esse Blank aqui ó que veio junto pode deletar ele

tá seleciona ele e aperta delete no teclado pode deixar em branco aqui e ele te fala ó precisamos adicionar uma nova sessão no teu aplicativo clica em adicionar nova sessão ele já vai abrir essa aba aqui ó que se você clicar em Ed você vai ver que ele cai no mesmo lugar né Ó então adicionar nova sessão ele aqui vai em layouts galera aqui em layouts você vai começar a ver algumas coisas prontas que vão agilizar em muito a nossa vida Então olha só a primeira coisa que a gente precisava inserir não esse menu lateral

aqui que a gente definiu ó clica aqui em Side menu galera menu lateral em inglês Opa aí ele Pergunta assim ó você quer incluir variáveis junto galera variáveis é um conceito da programação que Imagino que muitos de vocês já devem conhecer essa altura ou senão também não tem problema mas é assim para esse menu funcionar ele precisa vir junto com algumas variáveis de de lógica né Então quais são as variáveis largura do menu e se o menu está aberto ou não a gente vai ver um pouquinho mais disso mais para frente não se preocupa muito

mas pode deixar tudo marcado e clica em Place component que é posicionar componente ô galera chegou o nosso menu Prontinho aqui muito parecido com o que a gente fez aqui hein então agora a gente pode ir em e buscar também a nave bar a gente não tinha que colocar um cabeçalho Zinho aqui ó vamos pegar essa nave bar que é a barra de navegação ou cabeçalho variáveis pode trazer junto não tem problema você estão estão todos convidados ó coisa boa galera temos nosso menu lateral nosso cabeçalho que que falta então a gente tem três sões

aqui né menu lateral cabeçalho e conteúdo então falta aqui adicionar Olha esse cara já pronto aqui es ser clicado galera content que é conteúdo em inglês clicou e chegou Eita nós Montamos a nossa tela galera em quantos minutos pouquíssimos aí você vê que ele traz aqui um conteúdo e ele já fala assim não delete este bloco e substitua com seu conteúdo então ele já tá aqui esperando redondinho mas Renato você só usou coisa pronta você não falou que você ia criado zero galera olha só Qual que é a essência o Pilar fundamental do low code

nós não reinventamos a roda então assim ó se já existiram excelentes Engenheiros excelentes designers criando coisas que funcionam maravilhosamente bem porque raios de motivo a gente vai ter a arrogância de achar que a gente consegue fazer melhor do que eles galera toda a programação evoluir sempre em cima de coisas que foram criadas anteriormente se hoje os programadores desenvolvem em Python é porque alguém criou o Python numa outra linguagem se hoje a gente desenvolve em WI web é porque alguém criou o web em outra linguagem então a gente pode ir lá ficar desenhando menu um por

um podemos vamos ficar lá 30 40 minutos desenhando um menu igual esse tranquilo mas por que se isso não agrega valor pro nosso usuário pro nosso cliente entendeu Então galera essência do low code a gente não reinventa roda a gente pega coisas fantásticas excelentes que funcionam e que são bonitas e aplica para nós aplicamos pro nosso objetivo aí a gente reserva a capacidade cerebral não para ficar reinventando coisas que já foram inventadas a gente usa nossa capacidade cerebral para agregar valor para os nossos usuários e clientes para pensar nos recursos que fazem do nosso aplicativo

verdadeiramente diferenciado e já temos aqui galera o menu lateral o cabeçalho e o nosso conteúdo aqui show de bola você deve ter percebido aqui que tem dois modos né modo edição e modo visualização então geralmente a gente tá aqui no modo edição que é o que te permite interagir com os elementos e o modo visualização que é o que te permite já realmente interagir com um aplicativo como se você fosse um usuário mesmo tá então voltamos aqui pro modo edição e agora galera a gente já tem a interface principal redesenhada né Vamos desenhar a nossa

aba de conteúdo tá que vai ser a principal ali então o que que a gente sabe que vai na nossa aba de conteúdo galera olha pro desenho que a gente fez aqui ó que que tem na nossa aba de conteúdo vai ter o título do aplicativo vai ter Um textinho qualquer vai ter um campo de entrada de dados onde a pessoa vai digitar o nome do produto vai ter um botão em que a pessoa vai clicar ou tocar para inserir o produto no banco de dados e vai ter uma lista com todos os produtos adicionados

no banco e dentro dessa lista vai ter o quê uma caixinha para marcar se o produto foi comprado e o nome do produto isso é a nossa aba de conteúdo Então vamos lá então ó galera aqui na nossa árvore de elementos do lado esquerdo a gente já tem esse bloquinho aqui Place holder que ele chama né ó e aí dentro já tenho esse texto que que eu vou fazer vou fazer diferente eu vou deletar esse bloquinho ele é um Place holder Block ele Place holder significa eu tô aqui só ocupando espaço para você encher com

as tuas coisas né então eu vou deletar ele aí esse contêiner aqui galera eu vou pintar ele opa olha só eu vou lá nas propriedades eu vou pintar ele de branco então cliquei aqui ó em background que é fundo color que é cor cliquei aqui para selecionar a cor e vou selecionar um ó pode ser vermelho pode ser o que você quiser eu vou selecionar um branco tá ó que é essa esse código FF f f que você deve estar vendo aqui né E aí o conteúdo que tá atrás desse contêiner eu vou deixar ele

background color um cinzinha isso é um pouco mais comum hoje em dia assim né pode ser preto se você vai fazer um Dark mode aí muito louco eu vou deixar um cinzinha que eu gosto muito que é o F5 F8 fa você vai ver que ele é um um cinzinha leve assim sabe Opa deixei aqui um fundinho cinza e o nosso o nosso contêiner nem aparece aqui por porque ele não tem nenhum elemento ainda né então ele não tá nem ocupando espaço na tela mas tá beleza agora eu vou pegar o nosso contêiner e vou

começar a adicionar elementos dentro dele então qual que é o nosso primeiro elemento adicional título do aplicativo vamos em adicionar aí você vai lá em elementos e aqui em elementos você vai achar alguns modelos de texto para você adicionar como por exemplo o texto o Hing galera esses esses dois caras são a mesma coisa a diferença que o Hing ele já vem maiorzão assim né ele é para um título mesmo então vou pegar ele clico seguro ó tô segurando o mouse posso posicionar Ele diretamente aqui mas assim na minha experiência aqui é mais difícil de

achar Onde exatamente is aqui é botar o elemento tá então eu gosto de trazer ele aqui pra árvore de elementos ó tô segurando o mouse ainda tá então Opa dentro do conteúdo tem o contêiner dentro do contêiner Ah é aqui mesmo que eu quero posicionar ó show e eu clico duas vezes nele e altero meu primeiro App no web show aí vou adicionar mais um agora um texto comum ó cliquei soltei Opa arrastei né E aí vou botar embaixo desse texto aqui esse é nosso primeiro aplicativo criado no Wi web uma lista de mercado seja

bem-vindo pô Renato Mas que bela porcaria que você criou hein coisa feia feia feia mesmo galera por quê Porque eu tô posicionando elementos dentro desse contêiner ó se quiser saber onde estão os elementos clica nessa setinha aqui do lado do contêiner para você mostrar ó tá vendo Então a gente tem dois elementos lado a lado mas não quero lado a lado eu quero um em cima do outro seleciona o contêiner aí você vai descer aqui galera até layout direção do layout horizontal Não não quero as coisas horizontais quero verticais ah agora sim galera quero um

em cima do outro não era assim que tava o nosso layout ó elemento embaixo elemento elemento elemento em cima eles estão empilhados verticalmente então altero aqui para vertical show Podemos até fazer mais uma brincadeira aqui ó tá vendo esse cara que é o Row GAP Row significa linha em inglês GAP intervalo vou alterar para 12 pixels Opa você percebe que ele já dá uma uma distanciada aqui ó então ele abriu 12 pixels de distância entre todos os elementos dentro desse contêiner dá mais um espacinho livre assim né galera Isso aqui é bom ah Renato mas

pô eu preciso saber inglês eu precisa entender o que faz cada propriedade dessa galera primeiro que assim sabe em inglês ajuda Sem dúvida nenhuma você vai já bater o olho você vai entender o que que pode ser né mas na minha experiência não é necessário a gente tem muitos muitos muitos alunos que não sabem inglês e usam as ferramentas em inglês tranquilamente por quê Porque você vai criando repertório pô só que a gente já usou a cor de fundo a gente já usou o Row GAP a direção cara você três propriedades que você já sabe

o que são entendeu então pouco a pouco você vai entendendo e por repetição Você já se lembra exatamente o que que era então não se preocupa muito com isso ISO parte do processo mesmo sempre fala confusão é o primeiro passo paraa compreensão Então vamos continuar inserindo elementos aqui tá agora eu quero adicionar o próximo esse aqui já foi né textinho já foi agora vamos adicionar o campo de entrada de dados onde a pessoa vai digitar o nome do produto adicionar galera eu tenho logo aqui em elementos também ó você vai ver que eu tenho os

inputs inputs significa entrada de dados Eu tenho um input comum aqui eu tenho um select que é aquele que você coloca na tela e abre várias opções né um mul select um upload de arquivo uma máscara para você botar por exemplo Ah só só quero aceitar número de WhatsApp aqui um selecionador de cores de idom tem um monte de coisa o que a gente quer é um input normal porque vai só um texto né No entanto eu já te convido a experimentar um negócio ainda mais legal que o eweb nos traz que se você vier

aqui em input e controls aqui do lado esquerdo ó ele tem uns inputs é a mesma função só que mais estilizados já então eu vou pegar esse cara que é o default aqui que é o padrão ó cliquei Seguro segurei vou jogar embaixo do texto Ó você vê que ele já traz o quê um grupinho em que tem aqui o título do que vai exatamente nesse Campo o campo propriamente dito que é um input e aqui um hint que ele chama que é uma dica né pra gente deixar mais claro o que que se espera

naquele conteúdo né então aqui eu já consigo preencher as informações para ficar mais claro Olha só posso substituir aqui por nome do produto aqui no input eu posso vir aqui nas configurações dele e aqui alterar o Place holder que é o textinho de espera para nome do produto e aqui em additional hint que é a dica clico duas vezes e boto assim ó exemplo pão francês em alguns lugares é o famoso Pão de Trigo também então aqui já fica um pouquinho mais estilizado entendeu show Já conseguimos concluir o nosso campo de entrada agora um botão

em que a pessoa vai clicar tocar para inserir o produto no banco de dados vamos em adicionar elementos temos aqui ó o botão como você tá vendo um botãozinho clássico imagem vídeo número tem mon coisa tá aqui o botão também te convido a conhecer essa aba de botões aqui porque vai ter a mesma coisa galera botões já pré estilizados aí já tem um botão um pouquinho mais bonitinho aqui ó vou arrastar ele fiz a primeira cagada galera colei ele fora do nosso contêiner você percebeu então o que que eu vou fazer ó clico e arrasto

ele de volta se você não sabe exatamente onde colar ele ó vamos dizer eu posso colar aqui Putz ele ficou dentro daquele grupinho na dúvida pode pode colar ele aqui em cima ó e aí depois você arrasta os outros Vai ajeitando entendeu ah não esse botão Na verdade ele tem que vir ó esse grupo aqui em cima esse texto aqui E esse texto aqui Opa o texto tá errado ah agora sim meu primeiro app esse é o nosso primeiro aplicativo aqui vai o nome do produto Aqui tá o nosso botão show de bola aí aqui

no nosso botão Galera eu posso clicar duas vezes aqui e botar adicionar produto que é o que eu quero que esteja no botão e aí que que eu quero dizer com um botão que já vem estilizado ele já vem com os iconz aqui ficar mais bonitinho né então vou selecionar esse ícone aqui aí eu posso vir aqui nas propriedades dele ó clico no ícone pega uma biblioteca aí Aqui tem várias bibliotecas de ícones que a gente pode usar né Vou procurar aqui por Shop que é de compras e vou procurar se temem alguma das bibliotecas

Opa já temos um carrinho de compras aqui ó ó Aquele carrinho de compras estava bonitinho hein esse aqui ó pá quero esse mesmo então já tem um carrinho de compras e um adicionar produto aqui ó show de bola galera e agora queremos uma lista com todos os produtos adicionados no banco vai ser a última parte do nosso conteúdo Então vou em adicionar elementos aí aqui em elementos você vai encontrar em data display uma tabela um data Grid um camb que é aquele que se arrasta as coisas tem um monte de coisa a gente vai adicionar

uma lista então trouxe a lista para cá ó Opa ficou fora vamos jogar ele para cima ainda ficou fora vamos jogar ele dentro do contêiner Ah agora eu acertei ó agora veio para cá a lista Aí eu já tenho aqui uma listinha com os meus produtos aí aqui eu já vou colocar os nomes dele a gente nem tem banco de dados eh criado ainda né mas já vou colocar ó pão queijo mortadela só para exemplificar o que que vai aqui né mas galera a gente criou só o nome do produto faltou aquela caixinha para marcar

se o produto foi criado né então a gente vai vir aqui e adicionar um ícone vou pegar o ícone aqui ó e soltar do lado do Pão oh meu Deus ficou em cima do pão não quero em cima quero do lado Renato tranquilo galera seleciona o container Zinho aqui ó layout direção horizontal Olha só você vai fazer isso aqui galera quatro cinco vezes você nunca mais esquece você já bate o olho você já sabe que éem layout direção e aí inclusive a gente já pode usar também o GAP aqui ó agora não é um GAP

de linha é um GAP de coluna de 12 pixels ó que aí quando os elementos estão horizontais a coluna é o que separa cada um né então 12 pixels de distância entre cada coluna aí esse Icone Zinho aqui ó eu vou trocar por um quadradinho que vai ser o Square dessa biblioteca aqui ó então eu vou usar esse cara aqui quando não tiver comprado e eu vou usar esse cara aqui quando tiver comprado então agora vai ser esse aqui ó pronto e assim galera está montado o nosso layout Vamos só fazer umas leves Opa vamos

só fazer umas melhorias leves no layout Vamos pegar esse container que ele tá muito feio e esse aqui é o erro número um que eu vejo em design de aplicativos de alunos nossos tá tá vendo que ele não tem espaço Branco galera que o contêiner começa aqui já tá colado com texto não fica meio você não fica meio ofegante assim meio nervoso Quando você vê eu fico então a gente precisa dar mais espaço de respiro pras coisas galera Então como é que a gente faz isso ó pega esse contêiner aqui seleciona ele viu que eu

cliquei no no brg azul aqui do lado né e a gente vai lá em espaçamento ou spacing aí ele te pergunta assim ó Qual é o pading que você quer dar galera pading é um espaçamento interno ou seja quanto de de respiro interno eu dou até começar a posicionar elementos você pode escolher essa caixinha aqui ó e setar um número só como por exemplo 36 pixels que ele já vai colocar dos quatro lados tá vendo em cima embaixo direita e esquerda aqui você pode colocar para setar os dois de cima os dois verticais os dois

horizontais ou aqui individualmente vou deixar 36 pixels em todos já já dá um respiro né galera já Opa já tô menos claustrofóbico aqui aí eu vou pegar esse content aqui galera que é o que tá em cima do contêiner né o content aquele que a gente pintou de cinzinha e eu vou dar um pading nele também de 32 pixels porque aí o nosso contêiner Ah ele já fica separadinho olha que coisa boa galera aí eu venho aqui no contêiner E se eu quiser brincar ainda eu posso fazer um recurso de design moderno que o pessoal

gosta bastante em bordas e sombras Então vou vir aqui em sombra ó vou adicionar uma sombra e eu vou adicionar uma sombra bem leve galera vai ser de 10 pixels aqui 10 pixels aqui meu Deus Renato Quase tive um colapso nervoso aqui maior erro da galera que eu vejo com sombra é quando fica muito preto né Então galera vamos reduzir isso aqui ó a intensidade ele tá preto beleza mas a opacidade eu vou reduzindo até 5% tem que ser muito pouco galera tá vendo que tá 005 aqui no final 5% olha 10% se quiser forçar

muito a barra tem que ser levinho levinho galera levinho foi Á é o 10 né isso aí galera sombrinha Sutil ó tá tranquila at um pouquinho mais pesado do que eu faria ainda deixa seis aqui que tá ótimo vai show sombrinha leve Tá de boa né galera e mais um ajuste Zinho aqui ó vamos pegar galera esse grupinho que eu tenho aqui ó e vamos dar mais um flego Zinho para ele então vamos colocar uma margem na parte de cima dele de uns 24 pixels e vamos pegar esse botão e colocar uma margem na parte

de baixo dele embaixo Aqui tá vendo ó de 24 pixels também ó Opa já dá um fgz um pouco maior né galera Então tá beleza agora já tá massa aqui com isso a gente tem então o nosso layout criado aqui na interface principal galera ah Renato mas não gostei de como é que ficou eu acho que tem que mexer em outras coisas galera olha só existe uma característica muito comum que eu percebo nos meus alunos que dão certo que decolam no aprendizado e os que não dão certo basicamente é que os alunos que dão certo

eles são cientistas malucos eles assumem para si essa coisa de Cara preciso testar preciso fuçar porque No pior dos casos Beleza vai estourar um negócio aqui eu começo de novo eu volto refaço tá tudo bem galera não vai explodir tua casa não vai explodir teu computador tá tranquilo então assim galera Experimenta um outro botão aqui a invés de um botão testa um ícone se você quiser pinta esse botão de vermelho faz o que você quiser Testa o que você quiser e vê o que acontece porque em último caso você vai clicar nessa setinha aqui ó

ou vai apertar control Z no teu teclado e vai desfazer igual eu fiz ó não pintei de vermelho não gostei contrl Z cont control Z Pronto voltei tá tudo bem galera tá de boa entendeu então teste as coisas Ah não gostou desse posicionamento testa horizontal ah testa esse negócio aqui os meus alunos que dão certo eu percebo que é muito isso eles falam Exatamente isso eles falam Renato eu sempre vou assistindo as tuas aulas mas eu nunca faço exatamente o que você tá fazendo para não ficar preso eu vou fazendo leves variações se você escreve

x eu escrevo Y Se Você pinta de azul pinto de vermelho brinque galera seja um cientista maluco confim isso aqui é o que vai te levar muito longe e podemos então passar para o próximo passo que vai ser o quê agora a gente vai lá pro nosso banco de dados do supabase criar a nossa tabela de produtos então voltamos lá no supabase Com certeza já vai estar criado essa altura do campeonato né você vai aqui do lado em table editor ou editor de tabela tá não há nenhuma tabela disponível Claro não criamos né então vamos

clicar em criar uma nova tabela o nome dessa tabela vai ser produtos vamos habilitar o nível de segurança de linha galera por enquanto não porque a gente não vai lidar ainda com aplicativos multiempresas que é onde o usuário se autentica e o usuário só pode ver os dados que ele próprio criou Então por enquanto desabilita esse RL S aqui ó tá Ou seja a tabela vai ficar pública tá tranquilo depois a gente vai depois a gente brinca mais com isso aqui então é só isso que você precisa preencher aqui ó produtos desabilita e aí vamos

para as colunas ou seja Quais são os campos que vão ter na tua tabela a gente já falou sobre isso né galera a gente já sabe que só precisamos de dois Campos nome do produto e o comprado então ó ele já trouxe dois Campos aqui que é o ID do produto tranquilo a data de criação do produto tá tudo bem Vamos adicionar uma nova coluna que vai ser nome underline produto chame como você quiser seja um cientista maluco vai ser do tipo qual tipo vai ser hein número inteiro galera aqui tem uma cacetada de coisa

isso tudo a gente explica mais a fundo lá na comunidade Não se preocupe com isso só selecione texto tá que é um texto livre que você pode digitar e aí você pode adicionar uma nova coluna eu não vou adicionar aqui eu vou adicionar depois só para você ver que você não precisa decidir tudo aqui tá vou dar salvar Opa criou a nossa tabela produtos e aí eu já posso aqui mesmo adicionar uma nova coluna tá vendo ó cliquei eu vou adicionar uma nova coluna chamada comprado qual que vai ser o tipo número inteiro texto tarã

Opa tá vendo Bull aqui embaixo ó boleano lógico verdadeiro ou falso é isso que eu quero salvei então aqui galera eu já tenho a minha tabela criada com o nome do produto e comprado E aí aqui você já pode até fazer o seguinte ó crie alguns produtos de teste no próprio supabase ou seja na própria tabela tá então você vai vir aqui em inserir uma nova linha um novo Row um novo item aqui a gente não tava inserindo ó cada item numa linha então isso aí você vai inserir uma nova linha ID automaticamente gerado ó

deixa assim tá tranquilo criado tá tranquilo nome do produto Opa nome do produto vai ser pão francês Tá Renata aqui é Pão de Trigo não tô nem aí comprado falso não tá comprado ainda Opa já foi adicionado nosso pão francês aqui vamos adicionar mais um então só para teste agora vai vir a picanha e a picanha já está comprada não pode faltar Então galera a gente já tem o nosso banco de dados criado e populado Olha só que coisa boa aqui no sup base e agora podemos ir para o próximo passo que é lá no

Wi web configurar a integração com o supabase eu preciso conectar esses dois caras né como é que eu faço isso vamos para o Wi web plugins data sources que são fontes de dados ou seja de onde você quer puxar osos dados que você vai usar no teu aplicativo Renato de uma API qualquer do Z ano do supabase do airtable de uma Google planilha Olha só de um banco de dados SQL mil coisas aqui sopa base obviamente né adicionar e ele pergunta primeiro qual a sua URL do projeto tá vendo que já tem um carinha aqui

ó find it here clica nele que ele já vai te levar direto lá pra tela do supabase aí você pode ó lista de mercado e ele já te leva aqui para configurações api entendeu u ó então nem precisa disso aqui vamos voltar lá pro nosso só para você ver como que chega no mesmo lugar né a gente estava aqui na nossa tabela Project settings que é configurações do projeto api Opa aqui eu peguei as informações Então essas informações aqui ó você pega no supabase em settings que são configurações api E aí pegamos Então o quê

a nossa URL do projeto copiei aí ele me pergunta qual seu URL do projeto colei cont control V a sua chave pública de api a chave pública de api é essa aqui ó a non Public tá vendo ó copiar colar já viu que já habilitou o botão continuar aqui né Vamos embora conectou aí você vê que ele inclusive Já puxou a tabela produtos aqui né você quer habilitar a tabela Real Time galera isso aqui é pra tabela atualizar automaticamente e tal é até legal mas é um recurso mais avançado que precisaria habilitar lá vou deixar

desabilitado por agora tá então vou continuar quer testar seja o cientista maluco fique à vontade aí com superp b configurado com as tabelas Real Time desativadas eu vou adicionar uma nova coleção então a coleção é efetivamente eu configurei a fonte de dados né que é sup base a coleção é exatamente qual dado eu vou puxar da minha fonte dados Então vou colocar aqui ó Qual a fonte produtos quando tem asterisco aqui é que são Campos obrigatórios tá folder é uma pasta não precisa organizar em pastas tá tranquilo Qual a fonte que você quer puxar supa

base é a única fonte que a gente configurou né modo dinâmico s agora continuar Qual a tabela produtos é a única que a gente tem quais Campos você quer trazer selecionar todos traz todos tá tranquilo continuar configuração da query quer trazer quantos itens de cada vez aqui você vê que a paginação já está habilitada com 100 itens galera aqui assim a gente dificilmente vai ter 100 itens então só deixa como tá sem filtro sem ordenamento tá tudo certo ele só vai trazer os 100 itens do banco de dados os 100 primeiros itens do banco de

dados né tá de boa e aí eu já posso dar um fetch aqui ó que ele vai atualizar então o que que eu tenho aqui ó no um opa ele já me trouxe o pão francês comprado false vou clicar aqui no um para ele voltar deixa eu ver o dois picanha comprado true É isso aí galera você vê que ele já pegou em tempo real então aqui galera já posso dar um Dan que é finalizado porque eu já configurei a minha fonte de dados e eu já configurei a minha coleção de produtos então aqui a

gente já conseguiu fazer eh criamos a data source ou seja fonte de dados com os dados do supabase e Nós criamos nossa primeira coleção que foi o quê a lista de produtos que a gente vai trazer em tempo real Então galera já podemos partir para o próximo passo que é no web listar os produtos de forma dinâmica que que eu quero dizer com isso hoje no Wi web eu estou mostrando os produtos de forma estática são os dados que eu alimentei aqui né Agora não agora eu quero que nessa lista realmente ele traga lá do

supabase Quais são os meus produtos Então como é que eu vou fazer isso ó vou lá em layout para voltar paraa nossa árvore de elementos vou em Collection list aqui ó e aí na lista de coleções você vai ver que aqui em no lapizinho vai aparecer Quais são os elementos que você quer puxar nessa lista ó então Collection list presta atenção galera não é o Collection item não é no item é na lista Então vou vir aqui na lista itens eu vou clicar nessa tomadinha que que eu faço quando eu clico nessa tomadinha galera tomadinha

é o ícone que vocês mais vão clicar no Wi web é que você quer conectar com alguma coisa entendeu eu quero conectar com o qu galera do céu já apareceu a coleção produtos aqui com o iconeinstagram é um texto estático ainda presta atenção eu tô trazendo todos os itens na minha lista mas eu não expliquei pro web o que que ele tem que mostrar nesse texto é o que eu sempre falo o iweb as ferramentas no code elas fazem tudo o que você pede para fazer não fazem nada do que você não pede para elas

fazerem Então você clica aqui no texto ó e clica qual é o texto que eu quero mostrar aqui clica na tomadinha eu quero conectar quero conectar com o qu você vai ver que ele já tá trazendo ó Um item P datata ou seja os dados do item que ele trouxe lá do supabase quer mostrar o comprado dele não quero mostrar o nome dele então só clica aqui no nome produto ó ele próprio já vai montar item data nome produto Olha só galera dá um visualizar aqui ó eu já tenho o pão francês e a picanha

que coisa boa né então se eu vier aqui no supa base lá no meu editor de tabela de novo for na minha tabela produtos e inserir um novo produto como por exemplo Alfa que eu não comprei ainda aí eu volto aqui no wweb e eu dou um atualizar os dados ó recarregar dados você vê que ele não atualiza sozinho porque assim pô teu aplicativo w web tá aqui o banco de dados do supabase tá aqui mas como é que o w web vai saber que tem coisa nova lá no banco de dados entendeu isso a

gente até poderia fazer funcionar com Real Time mas não precisa porque basta a gente recarregar Os dados aqui ó cliquei em recarregar pronto aí ele foi lá no supabase e buscou de novo os dados aí você vê que a nossa alface já aparece galera então o que que nós fizemos aqui basicamente nós fomos na Collection list definimos que os itens a repetir era a coleção produtos e aí no textinho dentro do item definimos que mostrariam o nome underline produto e aí já podemos partir galera para o próximo passo que é novamente no eweb vamos agora

cadastrar o produto no banco de dados aliás vamos marcando as coisas que a gente já fez aqui né galera vai ficando tão mais claro né Bora minha sanidade agradece Então vamos cadastrar o produto como que a gente vai fazer isso o que que eu quero fazer galera eu quero que ao clicar em adicionar produto Vamos pro modo edição botão e eu vou aqui agora começar a mexer com os workflows que que é um workflow galera olha só venho aqui ó nos raiozinho workflow é a parte lógica ou seja algo vai acontecer mediante uma interação do

usuário então vou clicar em novo aqui e aí você vê cliquei aqui em new né ó como você viu e aí você vê que ele já aparece um evento qual evento no Clique ao clicar nesse botão quero que algo aconteça tem outras opções aqui que você pode escolher não cabem agora deixa no Clique e eu quero adicionar uma nova ação aqui ó Qual ação eu quero executar galera se você for de cima a baixo aqui ó você logo já vai ver que pô apareceu uns iconz do superas aqui eu acho que tem coisa né ó

e aí você vai ver várias opções selecionar um banco de dados inserir o banco de dados atualizar deletar listar todos os arquivos de armazenamento de arquivos inserir né você já deve ter se ligado que é o insert Database Então a gente vai usar o superbase nos workflows né superbase insert tava como Database Né tava o logo do superbase mas estava escrito Database insert aqui eu posso escrever o nome da ação não precisa mas vai ser inserir produto no banco de dados qual em qual tabela eu quero inserir quero inserir na tabela produtos quer inserir um

ou vários quero inserir um quais Campos você quer inserir nome e comprado qual que vai ser o nome eh picanha não galera eu não vou definir de forma estática eu vou definir de forma dinâmica né então eu puxo aqui a tomadinha E aí eu vou pegar galera olha só tá vendo que tem um carinha chamado answer value aqui ó deixa eu explicar melhor como é que funciona vou dar um close aqui no meu workflow vou voltar lá daqui a pouco eu volto aqui no workflow tá então se você selecionar o input aqui ó clicar aqui

nesse bugzinho aqui do lado e clicar em variáveis você vai ver todas as variáveis que existem no seu aplicativo nesse momento tá galera O que são variáveis variáveis são informações que você armazena de forma temporária assim no teu aplicativo tá então tem várias variáveis como por exemplo ó mostrar menu mobile Ele trouxe isso quando a gente trouxe o side menu lá por exemplo tem a largura do menu aqui que ele definiu mas aqui no final você vai ver que tem um ó variáveis de elemento valor da resposta e olha só que interessante põe no modo

de visualização e escreve qualquer coisa aqui ó você percebe que quando eu escrevo alguma coisa nesse input ele altera automaticamente o valor daquela variável ali ó então é assim que funciona quando você quer puxar o valor de um campo você não puxa do campo você puxa da variável que aquele Campo tá alimentando entendeu inclusive para ficar mais intuitivo Você pode até modificar o nome desse input aqui para fic mais claro Então olha só ele tá answer aqui que é resposta em inglês ele veio automático isso né Você pode vir aqui em conf ó cliquei no

input cliquei em configurações tá vendo que tem o nome do elemento aqui ó altere ele de answer para nome do produto por exemplo você vai ver que ele já alterou lá na variável também você também consegue alterar isso galera lá em layout aqui tá vendo ó nome do produto ó input nome do produto por exemplo isso aqui você tá mudando só o nome interno no Wi web isso aqui não afeta tem nada que o usuário tá vendo tá então voltando agora pro workflow do botão a gente tem lá inserir um produto no banco de dados

Qual que é o nome do produto que eu quero trazer aí galera talvez não esteja aqui em coleções tá vendo que tem algumas categorias aqui né aqui são coleções aqui são workflows aqui são funções um JavaScript umas coisas bem legais e mais avançadas assim né mas vem aqui no primeiro que ele vai te mostrar ó o valor do input nome do produto é isso que eu quero esse é o nome do produto que eu quero enviar para lá show de bola e o comprado aqui ó eu já quero mandar na verdade como false quero sempre

que eu for criar eu mande como false então você pode botar false aqui ó e ele vai inserir esse produto no banco de dados vamos ver se isso aqui tá funcionando então vamos em visualizar vamos escrever brócolis aqui por exemplo e vamos clicar em adicionar produto Ah mas não aconteceu nada aqui Renato nem apagou o testinho que estava aqui galera o eweb faz tudo que você pede nada do que você não pede né então vamos no sup base só espera um pouquinho não precisa nem clicar em atualizar Só espera uns segundinhos opa já apareceu o

nosso brócolis aqui galera comprado igual falso show de bola mais um teste rápido aqui se a gente quiser por exemplo uma mostarda adicionar produto supa base espero Opa já apareceu a nossa mostar Então galera tá funcionando ah Renato mas tá muito feio isso eu quero que apague o testinho eu quero que me mostre um alerta de que o produto foi criado com sucesso Vamos né custa nada sejemos os cientistas malucos né galera voltamos pra edição adicionar produto cliquei no workflow então o que que eu quero que aconteça inseri o produto no banco de dados logo

depois eu quero retar o valor de uma variável ó reta aquela variável do input eu vou chamar de limpar Campo isso aqui nem precisa dar o nome eu dei porque fica mais intuitivo né qual variável você quer resetar eu quero recetar aquela variável input nome do produto ó e aí depois galera eu ainda quero adicionar uma nova ação Opa essa aqui vai explodir tua cabeça se você é um usuário com conhecimento básico em JavaScript você vai amar isso aqui porque olha só aqui você consegue pegar e executar um JavaScript customizado qual JavaScript customizado que a

gente consegue executar aqui galera aperta f12 no teu navegador que você vai abrir as ferramentas de desenvolvedor né E você pode fazer literalmente qualquer tela até numa aba em branco aqui ó aí vai no console e digita assim ó Alert abre parênteses aí vai lá e abre aspas aí coloca assim ó aqui vamos fazer um teste para ver o que rola fecha aspas fecha parênteses e aperta Enter Oh galera olha só apareceu uma altinha aqui na tela tá vendo Ok então a gente vai usar esse Alerta próprio do próprio navegador JavaScript mesmo isso eu faço

questão de mostrar para quem gosta de JavaScript vai conseguir usar isso aqui de forma muito fácil né Então fecha isso aqui aqui eu vou mostrar um alerta produto criado com sucesso parabéns você está virando um ninja do Web fechei dei Close visualizar vou adicionar novo produto ali que vai ser por exemplo um frango adicionar produto produto criado com sucesso parabéns e limpou o campo galera Eita coisa boa e lá no supa base apareceu o nosso frango então cadastro o produto sendo realizado com sucesso Opa quase pulei pra próxima etapa quase Renato calma Renato Por que

que os produtos não estão aparecendo aqui bicho porque lembra que a gente precisa recarregar os dados né então vai mais uma configuração que a gente precisa no adicionar produto ó mostrei tudo lá no final eu quero fazer o quê eu quero eu quero ir lá no supabase e buscar de novo os dados atualizados Então vou lá em adicionar uma novação E aí eu vou usar esse fatch Collection aqui ó você vê que aqui não não tem o iconz do supabase não preciso né Eu só preciso buscar a coleção novamente qual coleção produtos é só isso

galera buscar coleção produtos eu vou chamar isso aqui de atualizar lista de produtos tá aí dei um close visualizar mais um produto que a gente vai comprar agora que vai ser uma BT RBA adicionar produto fez tudo mostrou o alerta dei Ok opa ele já atualizou e me trouxe tudo atualizado aqui galera percebeu Inclusive a própria BBA que a gente acabou de criar ó agora sim então a gente finalizou então nós cadastramos o produto com o insert nós resetamos o valor da variável para limpar o campo Nós criamos um alerta em JavaScript e nós demos

um fat Collection para atualizar os dados e assim temos o cadastro de produtos sendo feito com sucesso lá no supabase Nossa integração tá indo longe agora galera a gente precisa mostrar quando o produto está comprado por você deve ter percebido que ó tinha um item comprado lá qual que é a picanha Por que que aqui não tá mostrando galera porque o iweb faz já sabe né então vamos lá pro modo edição E aí essa caixinha aqui galera Ó seleciona a caixinha Qualquer uma que você selecionar você já tá selecionando todas na verdade porque é uma

lista em tempo real isso aqui né vai no lapizinho E aí olha só que que eu tenho aqui galera um ícone que é a caixinha o quadradinho né Ó que se chama fa traço Square Então olha só quando eu estiver com produto não comprado Quero mostrar o ícone fa tro Square tá que é o nome que o web deu para esse cara aqui mas o que a gente tinha falado é que eu queria mostrar esse cara aqui ó a caixinha marcada quando o produto tiver comprado o nome dele é fa traço check traço Square tá

E aí galera agora Olha só eu quero definir isso aqui de forma dinâmica Ou seja eu quero que dependa de uma o iweb dependendo do caso se o item tá comprado ou não quero que você mostre uma coisa ou outra quando a gente quer cara qualquer coisa que seja dependendo de qualquer informação que não seja estática galera tomadinha tomadinha o tempo todo tomadinha então o legal da tomadinha é que você consegue não só trazer dados mas fórmulas galera e aí pô muita gente um pouquinho mais avançada vai olhar essas fórmulas já vai adorar isso aqui

né então a fórmula que a gente vai trazer aqui é o if que que é o if na programação praticamente a primeira coisa que você aprende em qualquer curso de programação de qualquer linguagem tecnologia né se determinada condição for verdadeira retorne x se não for verdadeira retorne Y isso é o if então vou clicar aqui no IF ó e aí olha leia a descrição Você tá vendo que eu tô com o mouse ali no IF ó Leia essa descrição galera Ó condição valor um valor dois que que isso significa ó primeiro eu seto a condição

aí depois eu seto o valor se a condição for verdadeira aí depois o valor se a condição for falsa com vírgula no meio vamos fazer isso na prática ó se aí eu venho aqui e puxo o item data comprado eu quero puxar o status comprado desse item aqui ó se o item data comprado for igual a false ou seja o item não está comprado pulo a vírgula aqui ó qual o ícone que eu quero mostrar quando o produto não está comprado esse aqui far Fi Square entre aspas né E se essa condição não for verdadeira

ou seja se o item estiver comprado aí eu quero far fa check Square E aí galera vou fechar isso aqui vou dar um visualizar e olha só a picanha aqui galera e se eu for lá no supabase e marcar Mais Um item como comprado como por exemplo a Bet agora virou true aí eu venho aqui e atualizo os dados ó Opa Beta já apareceu aqui como comprado Então dessa forma a gente consegue mostrar quais itens estão comprados então a gente usamos a fórmula if no ícone para verificar se o comprado é igual a false e

definimos qual o ícone a exibir de acordo com o resultado do IF agora galera a gente vai fazer o quê vamos marcar o produto como comprado quando a gente Clica nele então como é que a gente vai fazer isso ó Voltamos para edição E aí eu venho aqui e seleciono o item né ó quando eu clico nesse grupinho do item aqui quero executar um workflow qual workflow eu quero executar Adiciona uma nova ação eu vou fazer um update que que é um update galera é atualizar um dado no banco de dados ou seja eu não

quero criar um novo dado eu quero atualizar um dado que Já exista Tá beleza então marcar como comprado vou chamar aqui ó Qual a tabela produtos Qual o ID Qual é a identificação desse produto que eu quero puxar tomadinha item data ID ó ele já tem aqui gravado a identificação tá vendo vou só mandar essa mesma identificação Qual campo eu quero atualizar Campo comprado ó eu quero que vire o quê true eu quero que vire false depende né galera que que eu quero tomadinha se depende é porque é tomadinha ó então eu vou puxar de

novo um if então aqui galera posso fazer um if posso fazer um if de novo mas tem uma forma diferente de fazer olha só que interessante ó eu posso puxar o comprado aqui ó pô Renato mas se já tá falso eu vou mandar falsa de novo Você só coloca galera uma exclamação antes porque em JavaScript Quando você bota uma exclamação é que você tá invertendo o valor que veio veio pra frente entendeu então exclamação comprado significa o exato oposto disso sacou então se tiver falso eu vou mandar o oposto que é true se tiver true

manda o oposto que é falso vamos ver se isso vai funcionar na prática Opa ainda não logo depois você sabe que a gente precisa dar um fet de novo né ó para atualizar essa coleção qual coleção quero atualizar produtos então atualizar lista de produtos fechei visualizei vamos ver se dá certo Quero marcar o pão francês como comprado opa ele marcou Quero marcar a mostarda como comprado marcou ô galera que coisa boa no entanto o que que não tá muito intuitivo é que quando eu boto o mouse ele não muda o ponteiro do mouse estranho isso

né volto paraa edição vou aqui no item e eu consigo configurar aqui galera clica no lapizinho vai lá pro final aí você vai ter aqui ó cursor efeitos cursor tá vendo ó pode colocar o cursor como você vai ver que tem várias opções aqui né tá na dúvida procura assim no Google ó CS cursor lembre-se galera todas essas propriedades que a gente tá falando aqui ó são propriedades CSS tá se você conhece CSS vai ter muita facilidade inclusive então aqui ele já te mostra quais são todos os cursores Olha só o default é esse contexto

menu help Pointer ó o que a gente quer é o Pointer que é o de clicar né então é Pointer Ó tem vários outros também mas enfim o que a gente quer é o Pointer Opa vamos visualizar Ah agora sim ó já fica com cara de botão tá vendo alface brócolis desmarquei a mostarda desmarquei a picanha e por aí vai galera Então olha só ele tá marcando os produtos como comprado ou não comprado desmarca BT rabba funcionando direitinho Galera É isso aí E se a gente for no supabase a gente vai confirmar né Ó que

tá só o qu ó a BT a os true pão francês alface brócolis né pão francês alface brócolis É isso aí que que tá meio confuso assim né galera ordenamento então pô tem que aparecer olha só como que é no Google ó os produtos não comprados em cima e os comprados embaixo como que a gente faz isso galera vamos lá então agora galera a gente vai reordenar os produtos para pegar primeiro os não comprados depois os comprados isso a gente pode fazer de várias formas assim como o Google fez aqui né ó a gente pode

fazer da seguinte forma podemos fazer esse ordenamento diretamente por aqui então pego a minha lista e eu venho aqui ó e uso a função aqui embaixo vai ter uma função chamada da sorte que é ordenar Isso é uma forma legal de fazer via fórmula né só que a gente pode fazer isso também lá direto na busca da coleção do supabase então eu vou lá em data Collection produtos é aquela coleção de produtos que a gente trouxe e aqui na configuração da query eu posso usar o sort para adicionar um ordenamento eu quero ordenar pelo comprado

salvar e testar vamos ver se já deu certo aqui ó visualizar e já deu certo galera ele já trouxe primeiros não comprar e depois os comprados E aí se eu for lá e clicar aqui você vê que a picanha já desceu então É isso aí galera o frango já desceu e se eu desmarcar a mostarda ele já sobe É isso aí exatamente o que eu queria então com isso galera a gente já tem o nosso aplicativo 100% funcional de lista de mercado e você já aprendeu olha só que interessante o que você já aprendeu aqui

tá em 30 50 minutos sei lá quanto tempo foi até Perdi as contas aqui mas você já aprendeu os cinco Pilares fundamentais para se criar qualquer aplicativo que vier à tua cabeça você aprendeu como planejar a criação é o MIB lembra você aprendeu sobre design a gente criou a interface você aprendeu sobre lógica a gente executou operações lógicas a partir da interação do usuário você aprendeu sobre banco de dados a gente modelou o banco de dados e criamos as nossas tabelas no banco de dados fizemos todas as operações crud que que é crude né Toda

vez se ouvir crude significa criar itens no banco de dados R que é de ler né read ler itens no banco de dados u que é de update ou atualizar itens e o d que é de delete Opa esse a gente não fez Mas não tem problema né galera também você sentiu que seria na mesma pegada né basicamente para deletar Um item bastaria a gente enviar um ID do item na ação delete lá do supabase então a gente fez tudo isso aqui e a gente ainda fez integração api com um serviço externo que no nosso

caso foi o próprio supabase então a gente interagiu com o serviço externo via apis essa api tava por trás ali daquela configuração interna do supabase Mas ela tá por lá então com isso Pessoal vocês Já conseguiram pegar os pilares fundamentais da criação de qualquer tipo de aplicativo E aí você concorda comigo que independente do aplicativo que você queira criar vai ser uma variação disso que aprendemos agora quer ver um exemplo ah Renato eu quero criar um sistema de gestão para fábrica de piscinas galera concorda comigo que sistema de gestão para fábrica de piscinas nada mais

vai ser do que criar e modificar usuários no banco de dados Criar e modificar produtos criar orçamentos criar pedidos de venda criar ordens de produção ah Renato eu quero criar um aplicativo delivery galera concorda que vai ser mesma coisa Criar e modificar usuários produtos variações complementos pedidos entregadores horário de funcionamento Ah Renata eu quero criar um banco digital galera Isso aqui vai ser pura integração api com Bas que é um Banking as a service então lá na comunidade ccar por exemplo a gente tem um módulo onde a gente faz uma integração completa com asas aquela

fintec né né onde você troca a ap o tempo todo aí você vai lá e fala da mesma forma que a gente conversou com supabase aqui a gente não conversou assim ó supabase inclui esse item aí no banco de dados aí o sup base forl retornou item criado galera isso é api então quando a gente faz uma um banco digital com um banco por trás que que a gente faz Ah eu quero fazer uma criação de conta bancária por exemplo o asas cria essa conta ele retorna a conta é criada o número da conta é

tal ou asas pega essa conta e cria uma chave pix tal para ela ou asas emite esse pix ou asas emite esse Boleto paga essa conta emite cartão você faz qualquer operação qu você criar um banco digital usando nada mais do que variações disso que você aprendeu agora ah Renato Mas como Eu transformo isso num aplicativo multiempresas ou multitenant ou seja eu quero que assim como se eu e você acessarmos gmail.com por exemplo concorda que é o mesmo aplicativo web Que A Gente Tá acessando mas eu vou logar lá com o meu e-mail e você

vai logar lá com o teu e-mail você vai ver só os teus dados eu vou ver só os meus dados poderíamos fazer isso na lista de mercado tranquilamente galera por que não fizemos porque senão ia mais uma meia hora no nosso tutorial né e não é o nosso foco aqui tão a fundo semim te mostrar as funcionalidades mais básicas mas o supabase já tá totalmente preparado também para fazer esse cadastro e autenticação de usuários para você conseguir acessar associar os produtos a cada usuário de forma que se eu logar lá eu só vou ver os

meus meus produtos e se você logar você só vai ver os teus produtos então conseguiria tranquilamente criar um aplicativo multiempresas no we web ah Renato como eu faço para publicar o aplicativo galera o iweb cria aplicações web e pwa pwa são progressive Web Apps ou seja são aqueles aplicativos que você consegue abrir no computador no tablet no celular sempre por meio de um navegador E aí inclusive quando você abre num navegador você consegue colocar para aparecer aquela opção de adicionar pra tela inicial você já deve ter visto isso em vários aplicativos web né e ele

vai pra tela inicial e a partir dali ele abre como se fosse um aplicativo nativo então ele já está publicado então ele vai funcionar normal só que assim ó tudo que a gente fez aqui só você consegue visualizar para publicar comercialmente ou seja para eu ir lá e publicar no meu app.com.br por exemplo ou meu app.sar pcom.br enfim aí você precisa ir para o plano pago do Wi web que depois eu vou mostrar como que essas ferramentas funcionam pessoal elas liberam um plano free para você testar criar aprender e depois você vai pro plano pago

para poder lançar comercialmente o teu aplicativo a gente vai falar de preço daqui a pouco ah Renato quero publicar na Play Store e na App Store consigo consegue galera qualquer pwa pode ser publicado nas lojas por meio do que eles chamam de webview então se você quiser procura no YouTube pelo meu vídeo que é assim ó Como publicar apli cativos Renato a procura assim no YouTube que você vai achar eu não vou nem marcar aqui porque sinceramente assistir isso agora vai ser só perda de tempo então pô foca aqui depois você assiste ele mas saiba

que sim dá para publicar na Play Store na App Store qualquer tipo de aplicação web tá mas aí consigo utilizar recursos nativos alguns sim alguns não por exemplo câmera sim GPS sim armazenamento offline ou seja funcionar na quando tá desconectado aí não funcionamento em segundo plano aí não que é o qu quando você tá com o celular no bolso tela apagada ele funcionando ainda também não aplicativos web não funciona com esses recursos nativos funciona com esses então nesses casos eu vou te sugerir uma outra ferramenta que se chama flutter Flow que inclusive Aí sim a

gente tem um tutoriais mais densos sobre ela tudo ela é muito boa para Apps nativos que precisam desse tipo de recurso nativo tá então o Web vai ser muito para aplicações web mesmo ah Renato e eu consigo estender as funcionalidades do Wi web então vamos dizer que eu preciso inserir um gráfico preciso inserir uma interface muito louca preciso inserir uma loucura qualquer galera sempre vai conseguir por quê porque o Wi web ele tem uma integração muito colada com JavaScript inclusive você consegue integrar pacotes npm galera npm se você já é um pouquinho da programação você

vai saber que é super biblioteca de coisas prontas que existem já no mundo aí então existem bibliotecas npm para tudo o que você imagina né galera já é como a gente fala a gente não reinventa roda né já tem biblioteca criada para fazer tudo para mostrar Alerta na tela para mostrar gráfico na tela gráfico personalizado para montar aqueles gráficos diário tudo tudo que você imagina já existe na internet você pode trazer isso pro web inclusive você vê que já tem até integração pronta com Open Ai aqui né então espero que você tenha conseguido aprender a

criar o seu primeiro aplicativo no Wi web Espero que tenha conseguido entender bem Como funciona essa dinâmica aí e agora voltamos lá pros conceitos então turma voltando aqui agora provavelmente deve ter ficado claro para você que praticamente tudo que você cria com programação tradicional escrevendo linhas de código você cria também com o iweb eu vou te explicar o porqu disso Olha só aqui eu vou explicar um conceito um pouquinho mais técnico de programação mas eu te prometo que você vai entender fica comigo que vai valer a pena você ter esse conhecimento aqui tá como que

funciona o teu computador o teu Notebook teu dispositivo enfim o hardware que é a parte física do teu computador ele só entende um idioma ele não entende JavaScript ele não entende Wi web ele não entende Python ele não entende nada disso o único idioma que ele entende é o binário é aquele 0 0 01 que você com certeza já deve ter visto em filme já deve ter ouvido falar por aí ou que eles cham também de código de máquina só para você ter ideia todo o curso de programação começa com o seguinte desafio escreva hello

world que em inglês é olá mundo na tela esse é sempre o primeiro desafio de qualquer coisa de programação para você escrever isso em binário ou seja em código de máquina é isso aqui que tá na tela que você vai ter que redigir E aí cada sequência binária dessa representa uma instrução específica que o computador vai entender é assim que você se comunica com o computador que o computador entende instruções mas à medida que as tecnologias de programação foram evoluindo por exemplo 50 e poucos anos após a invenção da Computação surgiram as linguagens de programação

de segunda geração como por exemplo able que é uma abstração é uma forma mais simplificada de você escrever softwares que aí sim vão virar código de máquina pro teu computador entender então na prática esse aqui é o código de máquina que a gente viu antes isso aqui é para você fazer a mesma coisa só que na linguagem assembly Então olha como é uma linguagem mais visível um pouco mais pelo menos né Muito mais enxuta muito mais simples aí o que que teu computador faz ele pega esse idioma assembly ele transforma em código de máquina em

binário aí o computador consegue ler e aí continuamos galera em 72 surgiram as linguagens de terceira geração como por exemplo JavaScript que é a mais popular hoje em dia então hoje como é que você escreve hello world na tela em JavaScript com uma simples linha de código um alerta hello world que aí sim esse Alerta ele não se comunica com computador ele vai virar um código assembly que vai virar um código de máquina que vai se comunicar com o computador entendeu onde eu quero chegar né e assim Vamos galera até as tecnologias de quinta geração

que surgiram há 20 anos atrás que são low code e no code ou seja foi ficando tão simples tão abstrato que se tornou visual então agora existem essas ferramentas que nos permitem criar esses aplicativos basicamente com o mouse sem você precisar digitar o código então assim falando na prática Se você pegar a interface do Wi web como a gente viu aqui eu quiser colocar um texto na tela eu simplesmente arrasto um elemento de texto para cá e escrevo o que eu quiser dentro dele já tá publicado já tá funcionando já tá rodando já tá tudo

pronto então turma isso é low code é uma forma visual e abstrata de você criar softwares que vai se transformando em códigos cada vez menos abstratos até que o teu computador consiga entender esse código então quando você cria um software com script na programação tradicional por assim dizer isso vai ser compilado pela linguagem C que vai ser compilado Por assembly que vai virar código de máquina quando você usa o Wi web ou uma plataforma low code é a mesma coisa isso vai virar um código JavaScript que vai virar um código C que vai virar um

código assembly que vai virar um código de máquina é só isso galera isso é low code E aí talvez o que alguns críticos de low code digam ou até mesmo críticos de linguagens de alto nível como JavaScript é que toda vez que você usa uma abstração você perde um pouquinho de performance e isso é verdade realmente por quê Porque às vezes fica um código um pouquinho mais inchado um software um pouquinho mais pesado só que hoje em dia a gente já não tem muito problema com isso né isso talvez era um problema H 30 anos

atrás quando a gente tinha aqueles modens antigos que demoravam 6 minutos para abrir um site hoje em dia você vai demorar 1.2 segundo ou 1.4 segundo Vamos combinar que é a mesma coisa né por isso que hoje a grande maioria dos programadores trabalham com linguagens de alto nível e por isso que low code e no code T se tornado tão populares e olha só como isso não é novo como que a gente a gente criava site lá em 1995 galera a gente abriu o bloco de notas e tinha que digitar o HTML assim era literalmente

assim que se criava site lá atrás pula 10 anos no tempo em 2005 já surgiam ferramentas como Microsoft front page Adobe dreamweaver que talvez você já tenha usado que eram as primeiras ferramentas que te permitiam não mais escrever um site mas desenhar um site visualmente pula no tempo para hoje hoje em dia nem se pensa mais em escrever sites do zero com código de programação né pessoal qualquer pessoa que vá criar um site que vá criar uma loja virtual e-commerce qualquer coisa assim hoje em dia já vai direto para ferramentas como WordPress com elementor já

vai direto para criadores de lojas virtuais como novens Shop já tem tudo isso pronto não mais qualquer necessidade de ficar reinventando a roda pode notar que atualmente quase 69% dos Sites criados no mundo já são criados com ferramentas no code low code ou seja mais de duas a cada três que existe todo um ecossistema enorme de ferramentas né mas eu gosto muito de estudar essas ferramentas e elencar elas em diferentes categorias Então eu tenho na minha cabeça assim quatro quadrantes aqui estão as ferramentas que elas são muito boas assim Elas têm muitos recursos mas são

muito difíceis de se aprender essas aqui não são as que eu dou prioridade existem as ferramentas que T poucos recursos são mais fraquinhas mas são fáceis de aprender também não dou muita bola para essa aqui porque você via de regra não vai conseguir criar aplicativos robustos com elas elas vão empacar em em coisas muito básicas vão só criar coisas muito simplesinhas não é isso que vai te permitir chegar muito longe existem uns nabos aí na internet que é umas ferramentas que tem poucos recursos Ainda por cima são difíceis de aprender já citei aqui no canal

algumas eu foco nessas as ferramentas que tem muitos recursos Ou seja que te permitem criar praticamente qualquer tipo de aplicativo e que sejam fáceis de usar que ten uma curva de aprendizagem tranquila e as principais dessas são Bubble flutterflow e o iweb as três principais que a gente mais fala já tem vídeos aqui no canal onde eu falo um pouco mais sobre a diferença entre essas três ferramentas Mas não se preocupe que a gente vai falar mais sobre isso até o final desse vídeo Quanto custa o iweb Renato eles T um plano free Onde você

consegue criar Quantos aplicativos você quiser usando todos os recursos mas somente em versão de desenvolvimento que que isso significa que você não consegue publicar comercialmente o seu aplicativo você não consegue hospedar ele ali num domínio para mandar para um cliente começar a usar para um usuário começar a utilizar por exemplo e o objetivo dessas ferr entas via de regra é exatamente esse as ferramentas te dão a possibilidade de criar testar e aprender no plano grátis E aí quando você está para lançar seu aplicativo você vai para um plano pago que no caso do Wi web

aqui parte de 9 por mês e lembre-se Wi web Assim como as ferramentas que a gente também ensina aqui no canal Bubble flutterflow te permite criar aplicativos multiempresas então eu faço questão de deixar claro isso aqui porque às vezes as pessoas se confundem um pouco ai Renato mas Criei um sistema de gestão para barbearia então se eu tiver 100 barbearias eu vou ter que pagar 100 aplicativos diferentes Vai dar 9 vees 100 vou pagar 3.900 por mês Renato não pessoal o motivo pelo qual software é um modelo de negócio tão rentável é que ele é

completamente escalável Então você cria um aplicativo só assim como você acessa o Gmail aí com teu e-mail Você concorda que você só vai ver os teus dados e se eu acesso o Gmail com o meu e-mail eu só vejo os meus e-mails isso é um aplicativo multiempresas você cria um sistema de autenticação de cada usuário cada empresa tem a sua própria interface seus próprios dados lá dentro então vamos dizer que você esteja lá com um custo de R 200 por mês do Wi web por exemplo com zero clientes Opa tá no prejuízo recebeu teu primeiro

cliente pagando R 100 por mês Opa agora o prejuízo já não é tão grande lá no terceiro cliente já empata do quarto cliente em frente você percebe que tua receita aumenta exponencialmente e o teu custo não teu custo aumenta muito pouquinho então se você tem 100 barbearias te pagando r$ 1 por mês você tem uma receita de R 10.000 por mês mas o teu custo continua baixo tá como eu faço dinheiro com eweb aprendi me tornei autos desenvolvedor eweb que que eu faço agora pessoal os quatro tipos de oportunidades mais comuns que eu vejo entre

os nossos alunos primeiro deles é o empreendedor que quer criar uma Startup quer criar um SAS que significa software como serviço né Ou seja que você vende no modelo de assinatura ou um micro SAS que é a ideia de um SAS mas para resolver uma dor bem nichada bem específica de um público bem específico pega aqui por exemplo nosso aluno Mauro Ele criou alguns aplicativos de automação de WhatsApp para empresas de venda de curso online e faz um baita dinheiro então ele já recebeu a placa de 6D aqui que a gente envia as plaquinhas comemorativas

né quando a pessoa atinge um determinado patamar de faturamento o Mauro ele tá para receber a placa de sete dígitos ou seja quase R 1 milhão deais faturados por meio de assinatura de aplicativos mais ou menos no mesmo exemplo que eu dei do sistema de gestão de barberia No caso dele uma ferramenta de automação de WhatsApp então é aquilo quais são as dores os problemas que você enxerga seja na tua empresa seja dentro do segmento em que você atua ou em conversas com amigos teus ou na tua cidade no teu Barro que problema você enxerga

que pode ser resolvido por meio de software Ah se eu criar um sistema de gestão para isso um aplicativo de vendas para isso uma automação para isso pensa no horizonte infinito de possibilidades que existem aí quer ver um exemplo esse aqui é o Thiago Costa um outro aluno nosso Ele criou um perfil no Instagram chamado construindo uma Startup onde ele mostrou do zero Como foi esse processo de criar um negócio digital de criar um aplicativo começou no dia zero e aí começou ó dia dois analisando a estratégia dos Meus concorrentes entendendo o mercado mapeando funcionalidades

dos concorrentes ele foi mostrando dia a dia em 90 dias utilizando ferramentas no code que a gente Ensina ele já tinha o aplicativo pronto no dia 120 ou seja 4 meses ele já tinha R 1.000 por mês de receita recorrente mensal Só que já muito mais do que cobria o custo dele o Thiago hoje já tem três aplicativos criados com no code um deles ele vendeu por R 30.000 para um usuário que era cliente dele exatamente para ele poder focar nos dois que estão gerando uma baita de uma receita com potencial maior ainda e o

segundo tipo o desenvolvedor o freelancer ou seja aquela pessoa que sabe utilizar o eweb mas não necessariamente porque ela quer criar um aplicativo para si próprio ela quer criar um aplicativo para outras pessoas quer criar ideias para outras pessoas o que via de regra é muito mais simples Até porque você não precisa se preocupar com marketing do teu negócio com captação de clientes você basicamente se preocupa boa parte do tempo mais em criar em desenvolver em sentar a banda na cadeira e criar o que você foi contratado para criar aqui como exemplo a Adre por

exemplo ela até brinca né quem diz que freela não pode ganhar seis dígitos Ela tá aqui com a plaquinha dela de seis dígitos faturados R 100.000 já faturados como desenvolvedora freelancer ou seja disponibilizando o portfólio dela na internet as pessoas contatam ela ah eu quero criar um aplicativo aqui pra minha Pet Shop eu quero criar um aplicativo aqui pra minha papel Aria para minha barbearia ela vai lá cria sob demanda entrega e recebe e aqui pessoal estão A grande maioria dos desenvolvedores no cod lood hoje fazendo dinheiro como desenvolvedores freelancer criando aplicativos sob medida e

a demanda é infinita Qual que é a base do trabalho do freelancer né via de regra o desenvolvedor no code ele começa cobrando alguma coisa na faixa de r$ 50 à hora aí teu objetivo é o seguinte lotou tua agenda já tem os próximos 2 TR meses de trabalho comprometido começa a aumentar teu valor aumenta para 70 90 100 R 1$ 130 teu o valor hora e vai aumentando hoje em dia os melhores desenvolvedores no code que eu conheço cobram na faixa de r$ 300 por hora aqui no Brasil mas eu já vi até alunos

nossos trabalhando para fora ganhando 90 120 150 dó por hora inclusive vou até marcar uma entrevista que eu fiz com um aluno nosso aqui em que ele conta Exatamente Essa trajetória dele até começar a ganhar ali mais de 10.000 por mês como desenvolvedor desenvolvendo aplicativo sob medida para empresas de fora do Brasil só que morando no Brasil em Fortaleza o terceiro tipo as agências de desenvolvimento também conhecidas como software houses ou fábricas de software esses via de regra pessoal são aqueles desenvolvedores freelancer que começaram a lotar muito agenda aí às vezes vira uma bola de

neve porque se você atende muito bem o teu cliente ele vai te indicar para outro para outro para outro para outro e de repente tá todo mundo querendo vir contratar o teu serviço e você sente que tá deixando dinheiro na mesa então o que que o desenvolvedor freelancer faz começa a puxar mais uma pessoa para trabalhar junto mais uma mais uma mais uma daqui a pouco tem quatro cinco seis desenvolvedores juntos e eles são uma fábrica de software aqui com exemplo o pessoal da café apps essa aqui é a plaquinha deles de S dig mais

de R 1 milhão de reais faturados mas na verdade eles já fazem muito mais do que isso todos os anos então eles já criaram aplicativos enormes para empresas enormes do mercado brasileiro já fecharam aplicativos de R 500.000 porque a software House te permite pegar projetos mais completos e mais complexos né e por fim o quarto tipo de pessoa que consegue transformar esse conhecimento em dinheiro o Executivo funcionário que não necessariamente tá buscando empreender ou criar aplicativo pros outros mas que tá buscando reconhecimento profissional dentro da empresa dele tá buscando ser promovido tá buscando Criar automações

e soluções pra empresa onde ele atua eu comecei com esse perfil aqui já contei minha história em outros vídeos e essa é uma das formas mais eficazes de você conseguir transformar esse conhecimento em dinheiro porque olha só você sabe exatamente quais são as dores da empresa em que você tá lá trabalhando Você sabe quais são os problemas do teu setor os dados que se perdem um monte de planilha usada e as planilhas não se conversam os erros de comunicação entre equipes você sabe tudo que poderia ser automatizado então muitas vezes você tá na posição perfeita

para conseguir criar um aplicativo uma automação software pra tua empresa pro teu setor e usar isso para escalar muito bem aí dentro então já vi vários relatos de alunos nossos que me contam isso eles falam Renato eu tinha um cargo de analista Criei um software que resolveu uma baita de uma pendenga aqui do meu setor agora o meu trabalho é completamente diferente Eu Sou coordenador do departamento tecnológico simplesmente por eu ter criado e implantado essa ferramenta que automatizou o trabalho de oito pessoas e claro a pessoa hoje ganha muito mais do que ganhava naquela época

então usar o software como um trampolim para te levar a novos patamares dentro da tua empresa Renato Quais são as vantagens e desvantagens de usar low Code em relação à programação tradicional as três principais vantagens e você vai me ouvir falando isso o tempo todo primeiro é muito mais rápido e fácil de se criar os aplicativos quer ver um exemplo prático disso tem um vídeo meu em que eu mostrei Um Desafio realizado onde o pessoal lá do Bubble que também é uma ferramenta no code que a gente fala muito aqui no canal pessoal do Bubble

foi lá pegou quatro iniciantes que estavam há dois dias a vendendo Bubble e colocaram eles contra um engenheiro Senior com mais de 10 anos de experiência em desenvolvimento tradicional e deram o seguinte objetivo quem consegue criar um aplicativo listinha de coisas por fazer Tod list eles chamam né muito parecido com essa lista de mercado que a gente criou hoje em 3 minutos e 27 segundos a primeira iniciante em Bubble terminou o aplicativo em 12 minutos os quatro iniciantes em Bubble tinham terminado o aplicativo e o engenheiro Senior não conseguiu terminar nesses 12 minutos ele até

falou ó precisaria de pelo menos uns 50 minutos a 1 hora para conseguir terminar isso aqui não é porque ele é ruim não é porque programação é ruim pessoal é porque o objetivo dela não é ser rápida já vou falar sobre aqueles casos onde a programação vai ser uma escolha mais inteligente do que no Gold voltando pras vantagens é muito mais rápido muito mais fácil não só de se criar o aplicativo mas de se aprender a habilidade aprender a usar a ferramenta e principalmente fazer correções e melhorias no aplicativo porque pessoal criar o aplicativo é

só o primeiro passo cá entre nós criar aplicativo não é Edifício independente da tecnologia que você usar o grande desafio está depois de criado porque se você criou uma Startup os teus usuários vão exigir melhorias constantes Você vai precisar fazer correções o tempo todo implantar novos recursos melhorar o aplicativo e você precisa ser rápido nisso você não pode pedir se meses para fazer uma melhoria senão você perde o teu cliente idem se você desenvolve aplicativos para outras pessoas idem se você é um desenvolvedor freelancer se você é uma software House pessoal vai o tempo todo

pedir para vocês Ah mas e agora pra gente implantar um novo pacote de melhorias como é que fica então com ferramentas no code e low code Isso fica muito mais fácil e muito mais rápido agora qual a desvantagem do no code low Code em relação à programação tradicional que você não faz com no code low code 100% do que você faria com programação tradicional lembra desse exemplo que eu dei aqui ó Toda vez que você sobe uma camada de abstração você abre mão de alguns recursos que você pode fazer aqui com assembly por exemplo mas

que com JavaScript você não faz quer ver um exemplo um papo bem técnico assim sim preciso fazer um gerenciamento da memória do Hardware com assembly você faz com JavaScript você não faz agora você precisa fazer um gerenciamento da memória do Hardware ou você precisa criar um aplicativo que resolve a dor do teu cliente até o final do vídeo eu vou falar um pouquinho mais sobre o que é possível Criar e o que não é possível criar com no code low code mas eu já adianto que você consegue criar A grande maioria das aplicações quanto tempo

demoro para aprender Geralmente eu vejo nossos alunos nos primeiros 30 dias um pouco mais lentos na jornada por quê Porque não é só aprender a usar a ferramenta junto com isso a pessoa já vai aprender fundamentos básicos de programação mesmo embora você não esteja escrevendo código mas você vai conseguir entender os fundamentos de programação como que funciona o desenvolvimento de um software Qual que é a lógica por trás do negócio então você aprende muito fundamento por isso que nos 30 dias geralmente é o momento mais conturbado da jornada por assim dizer mas quem passa desses

30 dias quando chega no segundo mês você já começa a sentir que tá pegando jeito já começa a criar seu primeiro aplicativ ativo já começa a tirar tua ideia do papel e isso tudo pessoal eu sei porque a gente realiza pesquisas com os nossos alunos para saber como eles estão se sentindo a cada etapa da jornada né e é isso aqui que eles nos reportam e lá no terceiro mês é quando a maioria deles já consegue começar a encaminhar a finalização de uma primeira versão que a gente chama de MVP né do seu aplicativo ou

seja aquela primeira ideia que ele tinha ele já começa a deixar entregue no terceiro mês Claro que não vai ficar a coisa mais linda desse mundo mas é uma primeira versão já 100% funcional então geralmente isso aqui é o que eu vi isso aqui é o que você pode ter de expectativa se você se dedicar em mais ou menos umas 10 horas de estudo por semana que que é possível criar Renato com o wib com no Code com low code pessoal aqui eu vou pegar vários cases de aplicações já criadas com ferramentas no code low

code ferramentas criadas por alunos nossos por conhecidos meus enfim e eu vou trazendo aqui no que são as principais categorias de aplicativos que eu vejo que vocês querem criar primeiro deles marketplaces o que que são marketplaces são aqueles tipos de portais que são os pontos de encontro entre compradores e vendedores como por exemplo airbnb ou seja quem tem imóvel querem encontrando quem quer o imóvel OLX Mercado Livre Dog Hero enfim esse tipo de aplicativo que geralmente cru oferta com demanda um exemplo disso é a Comet que eu já até mostrei num vídeo aqui no nosso

canal a Comet foi criada em Bubble uma ferramenta no code que a gente também fala aqui poderia tranquilamente ter sido criada também em WI web que foi de 0 a 00.000 por mês em 18 meses eles tiveram uma trajetória muito rápida assim muito por conta do no code o fundador até conta história nesse vídeo né finex como por exemplo esse aluno nosso Lucas que criou uma fintech já recebeu investimento que já tá com mais de 50.000 usuários fintech são softwares voltados pra área financeira né então ele tem uma integração por exemplo com Open Banking ele

consegue pegar todo o extrato bancário em todos os bancos que o cliente utiliza consegue fazer operações financeiras consegue até criar bancos digitais porque você consegue fazer integrações com banco Winter integração com os Bank Nesa service que são aquelas empresas que prestam serviço bancário para você colocar tua cara enfim consegue criar finex a dividende finance aqui por exemplo é um kys muito legal de fintech é uma fintech lá que liga bancos a pessoas que estão buscando empréstimos nos Estados Unidos já processaram mais de 1 bilhão de Dólares em empréstimos dentro da plataforma deles sistemas de gestão

como por exemplo a Zeno aqui que é de um aluno nosso que é um sistema de gestão para advogados dentre praticamente qualquer outro sistema de gestão né o sistema de gestão pessoal é aquilo pense ferramentas de gestão de dados a Renato eu preciso cadastrar clientes agendar horários emitir pedidos de venda emitir orçamento tudo isso nada mais é do que gestão de dados então sistema de gestão é muito amplo assim você consegue criar sistemas de gestão com iweb com no code aplicativos de vendas também conhecidos como crms o primeiro aplicativo que eu criei foi um aplicativo

de vendas lá em 2014 aplicativos delivery como delivery direto Expresso delivery ou do nosso aluno aqui que é pad que nutre por exemplo criada também com no code plataforma zad a própria plataforma da comunidade sem codar aqui que você tá vendo por exemplo ela é criada 100% com ferramenta R code então tudo que você vê aqui toda a tela de interação todas as animações Então tudo isso aqui é criado 100% no code você consegue criar redes sociais como Twitter Facebook Instagram dentre outras claro que reservadas as proporções né não é com no code que você

vai fazer uma plataforma para 1 bilhão de usuários para isso você precisa de uma infraestrutura absurda de quantidades absurdas de dinheiro equipes de dezenas de milhares de Engenheiros de software não é à toa que essas ferramentas na escala que elas atingiram são criadas no código tradicional mas agora uma social pô com números normais de 10.000 100.000 usuários isso você consegue tranquilamente criar com ferramentas no code low code inclusive se você acessar Notre twitter.com é uma cópia do Twitter criada com no code criada com Bubble só para você ver como não há limitação em se criar

uma rede social com no code aplicativos de Inteligência Artificial que Opa estão na moda hoje então a própria plataforma de Inteligência Artificial do grupo G4 no Brasil é criada com no code por alunos nossos a Creator Rocket de alunos nossos e assim integração com GPT tudo isso inclusive já mostrei em vários vídeos aqui no canal isso é até que relativamente tranquilo de se criar aplicativos de automação de WhatsApp ou basicamente qualquer api eu faço questão de citar api porque api caso você não conheça é meio que como se fosse o cabo USB da internet né

api é como você conecta qualquer coisa a qualquer outra coisa e hoje tudo tem api pessoal é um mundo muito maravilhoso isso que a gente vive então ah Renato eu quero criar um aplicativo por exemplo em que eu pego um post que tá lá no Instagram crio um vídeo com inteligência artificial usando chat GPT posto esse vídeo lá no YouTube e cobro assinatura usando PayPal ou Pague Seguro por exemplo pra pessoa continuar usando meu aplicativo e armazena esse vídeo lá no Dropbox consegue fazer tudo isso via api Olha que mundo maravilhoso tá aqui que não

é possível criar com no code primeira coisa pessoal jogos que a gente chama de triple a né esses jogos Absurdos com super gráficos para isso você precisa ir pro código no entanto você consegue que criar jogos mais simples 2D e até 3D com ferramentas no code como construct por exemplo que a gente Inclusive tem aulas lá na comunidade sem codar ensinando mas aí não seria o eweb seriam outras ferramentas no code low code tá o eweb é para criação de aplicações web como a gente viu lá no nosso tutorial sistemas embarcados novamente isso aqui não

é uma aplicação web né uma aplicação web é aquela que funciona num dentro de um navegador sistemas embarcados são aqueles que vão dentro do carro dentro de barcos dentro de equipamentos Fabriz esse tipo de coisa esse tipo de sistema ele é muito customizado ele é muito feito especificamente para aquele hardware então não existe ferramenta no code para isso sistemas Ultra complexos também é aquilo né não é 100% dos aplicativos que você consegue criar com no code low code e até mesmo sites lembra que a gente tava falando 70% dos Sites do mundo são criados Ah

mas e os outros os outros os criadores entenderam que devido ao nível de complexidade era necessário descer um nível de abstração ou seja ir pro código ou ir para códigos até de abstração mais baixa ali então ah Renato eu quero quero criar um robô de criptomoeda que vai fazer arbitragem entre diferentes corretoras asas coisas maluca assim galera esquece Realmente você vai pra linha do código mesmo tá agora é muito difícil definir o que exatamente é um sistema muito complexo porque é muito caso a caso o que eu consigo te adiantar mais ou menos o seguinte

eu recebo pessoal todos os dias mensagens no Direct e-mails com pessoal falando assim Renato essa aqui é minha ideia consigo criar com no code e de cada 10 ideias umas oito ou nove você consegue as outras a gente é muito sincero em falar ó cara isso aqui você não consegue isso aqui eu te sugiro ir para uma linguagem de programação X então se você tá na dúvida logo aqui embaixo do vídeo eu vou colocar um botão para você falar com a gente pelo WhatsApp aí chega lá e pergunta Cara meu aplicativo que eu quero criar

é esse esse esse eu consigo e a gente fala se você realmente consegue tá como é que eu aprendo o Web galera principal forma de se aprender qualquer ferramenta eu sempre sugiro é o famoso f e clica foi assim que há 10 anos atrás eu aprendi é se meter na ferramenta e falar cara eu vou investir no mínimo umas 100 horas do meu tempo aqui para ficar Só fuçando nessa ferramenta vou pegar uma ideia simples qualquer de alguma coisa que eu queira criar como ah essa lista de mercado que o Renato criou vou criar ela

agora multiusuários e de outra cor e vou ficar fuçando E clicando até conseguir esse é um caminho que sinceramente eu sugiro para todo mundo porque é o tipo de mentalidade que consegue te levar muito longe porque quando você apanha e descobre uma solução para Aquilo em que você apanhou que você efetivamente aprende né E você também tem uma documentação muito boa do Wi web então toda a documentação dele eles ali apresentam o que faz cada elemento o que faz cada interface te ajuda muito nesse espírito do fus clica terceira forma no nosso canal do YouTube

Então a gente tem muito vídeo tempo todo muito tutorial muita coisa ensinando por lá também você vai conseguir aprender muita coisa e por fim pessoal na comunidade sem codar o que é comunidade sem codar turma comunidade sem codar nada mais é do que o nosso curso completo do zero ao avançado então lá a gente começa a ensinar pra pessoa que é um lego completo um lego assim não só em WI web mas um LEGO em programação que nunca efetivamente criou absolutamente nenhum software na vida e a gente começa ali do zero criando a conta gratuita

na ferramenta criando o nosso primeiro aplicativo juntos e aí a gente vai evoluindo passo a passo criando coisas cada vez mais complexas até os recursos mais avançados para você poder criar absolutamente qualquer coisa e a comunidade sem codar não tem só curso we web tem muitos outros cursos porque a gente entende que um bom desenvolvedor é aquele que tem um arsenal de ferramentas que tem uma caixa de ferramenta para e que sabe exatamente Quando utilizar cada ferramenta então o iweb é muito bom para muitos tipos de aplicações flutterflow por exemplo é muito bom para aplicativos

nativos aqueles integrados com celular que inclusive funcionam offline Bubble para uma gama enorme de aplicativos também Zana um motor um backend que te permite escalar até dezenas de milhares ou centenas de milhares de usuários supa base um banco de dados extremamente popular na internet e além disso aulas de design aulas de performance e escala para que você não Impact mesmo ao atingir números Absurdos de usuários no teu aplicativo aulas de segurança e privacidade para você ficar blindado contra hackers e muitos outros cursos na comunidade sem codar você tem acesso ao grupo exclusivo dos membros Então

somos mais de 17.000 membros lá e a gente tá todos os dias pessoal interagindo um monte Então lá é onde a gente tira dúvidas pessoal tô empacado aqui que que eu faço Qual foi a minha ideia quando eu criei esse grupo é aquilo se você tem 17.000 pessoas com o mesmo problema as 17.000 não precisam descobrir a solução para aquilo basta que uma descobra a solução para aquilo as outras 16.999 Vão descobrir por tabela porque aquela lá vai postar a resolução do problema dela na comunidade de todo mundo aprendeu juntos então vocês não fazem ideia

do quanto eu aprendo na comunidade com os nossos alunos inclusive então fico bem feliz que direto a gente também recebe depoimento assim ó oi Renato VM agradecer pelo conteúdo que disponibiliza didática é muito boa ou a gente realmente luta para ter uma didática muito boa aliás a gente tem uma cultura do problem based learning ou seja do aprendizado baseado em problemas né a gente sabe que pô nós adultos gostamos de aprender as coisas não em teoria mas sim em prática então a gente tá sempre criando aulas com a maior aplicabilidade prática possível então a gente

pô galera preza muito por qualidade de aula por didática de fácil compreensão e o pessoal reconhece isso queria também parabenizar um dos seus instrutores que sempre responde muito rápido nunca me deixou sem uma solução todas vezes que eu apareci com alguma dúvida meio cabulosa o anon aquelas aulas mais avançados que ele gravou vale ouro então pô a gente coleciona depoimentos desse aqui a gente realmente vê que estamos conseguindo ajudar vocês Na sua jornada temos lives tira dúvida com os professores toda quinta-feira à noite nossos professores existe um professor para cada ferramenta né nossos professores entram

ao vivo para tirar suas dúvidas ali na hora para agilizar teus projetos e assim os nossos professores não estão só na Live não eles estão também no grupo esclarecendo as dúvidas ali e além disso às vezes você tem uma dúvida um pouquinho mais rápida você tem acesso às inteligências artificiais sem codar e a gente treinou inteligências artificiais com a documentação das ferramentas Então a nossa Inteligência Artificial do Wi web aqui por exemplo leu centenas de páginas da documentação do Wi web para você conseguir esclarecer dúvidas de forma rápida como por exemplo como faço para ordenar

uma lista Aí ele na hora já vai conseguir te dar resposta use a opção sorte em uma fórmula perfeito galera então isso aqui te ajuda a esclarecer dúvidas de forma bem rápida e essas ias tem uso ilimitado pros alunos da comunidade sem codar ainda os alunos da comunidade sem codar conseguem trabalhos como desenvolvedor então a gente ajuda você a encontrar as empresas querendo contratar os desenvolvedores como por meio da A1 Dev A1 Dev pessoal é Nossa plataforma em que as empresas acessam para conseguir encontrar desenvolvedores no code low code então aqui as empresas postam as

oportunidades pode ver que praticamente todos os dias tem novas oportunidades aparecendo E aí você consegue ir lá e olhar a oportunidade então todos os dias as empresas vem aqui e postam novas oportunidades e aí você pode ir lá se interessou por uma oportunidade você acessa acessa para ver os detalhes dessa oportunidade vê aqui que que a empresa tá precisando e entra em contato diretamente com eles fazendo a tua proposta de serviço e funciona viu galera toda semana eu recebo depoimentos como esse aqui ó Fala Renato passando aqui para te agradecer pela comunidade fechamos quase R

20.000 em contrato só essa semana maioria vindo do asion Dev a gente envia ainda as placas comemorativas PR os nossos alunos ou seja os nossos alunos que atingem um determinado grau de faturamento recebe uma placa física Nossa como essas que eu tenho aqui atrás ó quando você faturar seus primeiros R 10.000 como desenvolvedor ou com um aplicativo criado com no code enfim você vai receber a placa 5D bonitona essa placa quando você chegar nos R 100.000 em faturamento você vai receber a 6D chegou em R 1 milhão deais vai receber a 7D que é essa

que o Rafa da cafs tá segurando aqui na foto e quando você faturar R 10 milhões de reais você vai receber a 8d e te falo já mandamos quatro placas dessa aqui tá estamos para mandar a quinta inclusive se você você mora em Florianópolis eu faço questão de te entregar pessoalmente essa placa tá essa que eu tava entregando pro luí semana passada só para você ter uma ideia a gente já enviou mais de R 65 milhões deais em solicitações de placas PR os nossos alunos então você vê que a galera realmente tá conseguindo transformar esse

conhecimento em dinheiro né alunos da comunidade sem codar recebem acesso à prova de certificação Então você consegue fazer uma prova mesmo que a gente tem ali onde você consegue comprovar que você tem conhecimento técnico na ferramenta isso é muito bacana pessoal porque a gente tem prova com menos de 15% de taxa de aprovação ou seja se você vai lá pega essa certificação de que você passou na prova e apresenta para um contratante cara basicamente ele vai jogar todos os outros currículos fora e você Tá contratado porque você já comprovou que você passou numa prova que

poucos passam aí você vê que o pessoal até vai lá e bota no Linkedin porque realmente gera muito reconhecimento essa prova de certificação e assim galera vários outros benefícios Então você recebe desconto em ferramentas ali que a gente tem um crédito de $1 para você poder usar no Bubble só $1 em crédito já quase paga o curso templates prontos de projeto certificado de participação no curso ferramenta de planejamento de aplicativos O Bubble Essential kit que é uma extensão do Bubble com componentes prontos e assim novas aulas e atualizações o tempo todo né então toda vez

que começa a surgir uma dúvida comum ali no grupo da comunidade a gente Opa vamos gravar uma aula para ensinar isso aqui que a gente já criou uma baita de uma aula para ninguém ficar com dúvida né e mais um monte de aula bônus Então a gente tem o módulo do Caleb fundador das Z api galera contando pra gente como criar uma fintech a gente tem módulo de criação de jogos lives de convidados mas masterclasses essas duas aqui valem ouro a gente tem uma Master Class só sobre como viver de no code um a long

de mais de 3 horas de duração onde a gente corre do começo ao fim o processo para você conseguir pegar esse teu conhecimento e transformar em dinheiro por meio do desenvolvimento freelancer de aplicativos como encontrar clientes como montar escopos de projeto como entregar o aplicativo Inclusive essa masterclass foi com Rafa Almeida sócio da café apps que eu comentei ali que é uma software House que fatura múltiplos milhões todos os anos e a outra masterclass que já temos disponível É vivendo de micras com Bruno Okamoto fundador de uma Startup gigante também criador da comunidade micras e

ele conta pra gente também mais de 3 horas todo o processo de criação de um software como serviço Então como que você encontra as melhores ideias de software Como que você valida para saber se a ideia é boa ou se não é como que você monta o teu MVP quais recursos vai ter como que você faz um estudo de concorrentes Como que você lança Como que você faz marketing E por aí vai galera pessoal o meu objetivo com a comunidade sem codar É esse aqui eu acredito de coração que para qualquer pessoa ter sucesso nessa

vida precisa sacar o que são essas três letrinhas aqui T é de trabalho duro Então se tem alguém aí te falando Ah vai dar certo só precisa fazer isso 5 minutos por semana pô galera é balela então assim pô no code low code são muito mais fáceis que programação tradicional muito mais fáceis significa que você não vai precisar se empenhar de forma alguma Se você não se dedicar no mínimo umas 10 horas por semana não adianta você não vai sair do lugar mas não basta trabalhar duro você tem que trabalhar duro na direção certa você

não basta ficar cavando um buco no jardim da tua casa você vai chegar todo dia suado no final do dia vai ter uma super sensação de dever cumprido mas você não tá realmente agregando valor então é nisso que a gente ajuda na comunidade é te mostrar para onde direcionar os seus esforços para você ter o melhor resultado possível e tudo isso é multiplicado pelo ambiente em que você tá imerso porque pessoal como eu falei lá atrás quando você tem um problema que você vai buscar e vai ver que outra pessoa já teve aquele problema meses

atrás e já encontrou a solução Você já consegue no mesmo dia dar encaminhamento pro teu projeto isso não tem preço imagina se todo médico fosse lá tentar aprender do zero a medicina não você não parte do ponto zero você parte de onde todo mundo tá igualado naquele ambiente hoje então você vai chegar lá você já vai estar com mais de 17.000 pessoas eu os professores todo mundo pessoal na mesma jornada que você todo mundo querendo buscar sucesso profissional fazer dinheiro reconhecimento promoção enfim por meio de tecnologia por meio de desenvolvimento de aplicativos Então isso é

a comunidade sem codar o objetivo dela é ser o melhor ambiente do mundo para você aprender desenvolvimento no code low code e conseguir transformar esse conhecimento em dinheiro então se você quiser fazer parte será muito bem-vindo O link tá aqui na descrição desse vídeo grande abraço te vejo do outro lado