Forem: Rafael Nunes

Sopa de pedras está me tornando um programador melhor

Rafael Nunes — Sun, 11 Feb 2024 01:48:27 +0000

Sopa de pedras

Por muito tempo tentei fazer sopas das mais variadas formas, pesquisando sobre diversos tipos de elementos que melhorariam a sopa e tirariam o melhor proveito. De fato um conhecimento curioso.
Ultimamente, não tenho tantos ingredientes o quanto gostaria, o que me fez lembrar da história de 2 soldados voltando para casa após uma longa guerra. Ao chegar em sua cidade, acreditavam que os aldeões lhe dariam uma refeição, mas encontraram portas e janelas fechadas. Durante longos anos de conflitos, os aldeões não tinham muitos recursos e estocavam o que podiam.
Então, os soldados acenderam uma fogueira e ferveram a água na panela, colocando cuidadosamente algumas pedras dentro. Abismados, os aldeões se aproximaram para ver o que eles preparavam "Essa é uma sopa de pedras" os soldados disseram.
"Isso é tudo o que colocaram nela?" perguntaram os aldeões.
"Exatamente, embora algumas pessoas digam que com algumas cenouras ela ficar melhor". Um dos aldeões foi em seu estoque e buscou uma cesta de cenouras.
"É só isso?"
"Bom, com algumas batatas ela daria mais sustância" disseram os soldados.
Durante a hora que se seguiu eles listaram mais alguns ingredientes que melhorariam a sopa, acabaram obtendo uma grande panela fumegante. Eles então se sentaram e se puseram a comer a primeira refeição reforçada de ambos em meses.

Ser um catalisador da mudança

Apesar de enganados, o ponto é que os soldados reuniram a vila, se tornaram um catalisador de mudança e conseguiram transformar o não em um sim. Um resultado que todos saíram ganhando.

Pense em quantas vezes pediu alguma coisa e recebeu olhares vagos em troca. Solicitações sem resposta ou propostas que nunca vieram sem você saber o motivo.
Ao pedir algo as pessoas faram orçamento, as coisas irão precisar ser aprovadas e terá de vencer a fadiga.
Neste momento, é hora de usar as pedras e começar a cozinhar, planejar o que se pode pedir e se desenvolver, deixe que se adimirem com o resultado. Mostre um vislumbre do futuro e fará com que colaborem.

Muitas das vezes minha sopa não tem ingredientes suficientes, eu poderia sentar e me lamentar, de fato fiz isso por muito tempo. Até que comecei a vislumbrar resultados que gostaria, porém, não conseguiria obter facilmente.

As pessoas costumam seguir planos pré-definidos pelos outros muito facilmente quando vêm as possibilidades no futuro. Criar planos bem definidos, métodos, é uma maneira prática de conseguir fazer com que os outros colaborem ao ter um fim definido.
O conhecimento é a estrada que pavimenta o caminho da riqueza, quando se sabe qual caminho tomar.

Se a sopa for o seu código, poderia olhar para o HTML, CSS e JavaScript e pensar.
"Bom, isso é muito básico, são apenas pedras" ou
"Está na hora de fazer uma sopa de pedras".
Se você se deixar abater pelas tecnologias que não sabe, é provável que ficará abatido por toda sua jornada como desenvolvedor.

Apenas como exercício, pense em Henry Ford, mesmo não entendendo de carros, você deve saber quem ele foi. Aos 15 anos ele abandonou os estudos e se tornou mecânico. Durante sua vida ele poderia ter se lamentado da instrução que não teve e a qual foi questionado ao longo de sua vida à medida que crescia profissionalmente.
A verdade é que, mesmo que ele não tenha usado todo seu tempo para adquirir uma instrução geral, ele tinha conhecimento específico, planos bem definidos, os quais levaram ao cumprimento de seus objetivos, se tornando um agente catalisador.
Você será tão instruído quanto qualquer pessoa que reunir para participar de seus planos. Um homem capaz de reunir pessoas instruídas é por si tão instruído quanto qualquer uma delas.

A teoria da janela quebrada

A teoria da janela quebrada surgiu quando pesquisadores observavam o comportamento de prédios do interior e tentaram descobrir por que alguns são limpos e bem cuidados enquanto outros são deteriorados.
Basicamente, os prédios com janelas quebradas davam aos moradores a sensação de abandono, então as pessoas começavam a acumular lixo na área externa, começam a surgir pichações, danos estruturais e em um tempo relativamente curto o prédio acumula problemas demais para se querer consertar.

Criaturas que não nascem pra morrer

Não deixe a entropia dominar seu código, conserte as janelas quebradas os quanto antes. O código será como uma criatura, se for criado com intenção de durar, é preciso colocar as ideias em prática e não deixar a criatura morrer. A psicologia envolvida no processo é uma peça importante do momento em que ela poderá chegar ao fim.
Existem projetos que apesar da grande adversidade para os manter funcionando, eles são concertados, enquanto bons projetos podem ser descartados por ter uma janela quebrada. Será que um carro perde seu valor ao quebrar a janela? Pense assim todas as vezes que detectar um problema na sua aplicação, se quiser que ela sobreviva tempo suficiente para contar história.
Por fim, a entropia envolvida nos projetos, sejam eles profissionais ou pessoais, pode ser comparada a sopa de sapos.
Os sapos pulam fora da água quente se você os colocar em água fervente, mas se os colocar em água fria, fervendo com eles dentro, muitos irão perder o momento de sair de água e serão cozidos.

Não faça sopa de sapos.
Faça sopa de pedras.

A janela quebrada e os sapos estarão por toda parte. A tendência é que eles aumentem. Não deixe o caos se estabelecer e dominar, pratique constantemente colocar seus planos em ação, a maioria nem tem um plano.

Seu aplicativo web pode ser monetizado

Rafael Nunes — Wed, 31 Jan 2024 16:13:06 +0000

Ultimamente tenho me contorcido na cama imaginando maneiras de monetizar aplicativos web Gratuitos.
Em teoria a resposta é bem simples, basta gerar tráfego. A questão é:

De onde viria esse tráfego?
Quando as pessoas estivessem usando minha aplicação grátis o que eu ganharia com isso?

Por quê monetizar?

Monetizar aplicativos é uma ótima maneira de viver de internet, e provavelmente entender do negócio é mais importante do que codar.

A tecnologia servirá como um braço para resolver problemas reais, mesmo que esses problemas sejam simples demais, alguém precisa de soluções simples. Problemas pequenos ainda são problemas, os mesmos demandam tempo, e através de um serviço web, é prático que se encontre algumas soluções por ai.

Pense em uma to-do list, alguém criou a primeira e então a segunda veio, hoje existem milhares de to-do list na internet com os mais variados tipos de diferenciais, uma delas poderia ser a sua, por que não?
Essa é uma pergunta que você terá que responder sozinho, por que não?

Mentalidade

Uma mente pessimista não precisará pensar em muitos porquês, provavelmente pensará em um ou dois. O desafio aqui é ser otimista. Esse estado de espirito lhe levará a criar uma lista de porquês. Talvez você até faça uma "porquê-list" 😂
Estimule o pensamento crítico, mas não perca o espirito que é necessário para a criação.

Programar em um ambiente controlado é muito confortável, pode ser dolorido o processo de aprendizagem mas as dores de ter uma aplicação funcionando são potencialmente maiores. Os aprendizados dessa jornada serão grandiosos.
Se você só segue o plano estruturado e bem definido de um professor, como se fosse uma escola em que uma provinha cai tudo o que você aprendeu. Tenho más notícias, é provável que você encontre problemas que jamais imaginaria encontrar.

E agora? Irá desistir?
Não seria surpresa dizer que a maioria fica pelo caminho. Quando pensar em parar reflita:
O fracasso só se destina a quem desistiu.
Se aceitar males como uma derrota temporária, se levantará mais vezes do que pode cair, talvez em alguma dessas vezes poderá descobrir que a oportunidade vem fantasiada de fracasso, e que tem um péssimo senso de humor.
Empreender levará tempo, e assim como uma empresa demora para conseguir se estruturar não espere resultados imediatos. Embora existem casos que acontecem, não se julgue como a exceção.

Faça o seguinte exercício. Imagine situações em que poderia uma aplicação simples resolver um problema. Quer um exemplo?

Monetizando

Este é o convert case. Tecnicamente o que ele faz é só transformar texto.
Ao clique de um botão o transforme em uppercase, taxado, somente a primeira letra maiúscula, todas minusculas...
O programador colocou bastante opções para quem deseja usar.

Esta aplicação é monetizada. Além da parte de doações também tem propagandas do google ads em sua página.
O google ads por si só já é um tema gigantesco, mas basicamente o google se torna dono do seu site, pois para ser aprovado você precisa estar em acordo com sua enorme lista de conteúdo e politicas da empresa.

Seu site obrigatoriamente terá que ter algum conteúdo para ser monetizado pelo google ads, mesmo que esse conteúdo seja escrevendo as funcionalidades que ele oferece.
Ele não poderá mais estar em faze de testes e seu domínio têm que já ter sido registrado a alguns meses.
Por mais que ele seja uma aplicação será julgado como conteúdo.

Embora as politicas de conteúdo para exibir anúncio sejam bem chatas. É possível que consiga aprovação mesmo tendo pouco conteúdo escrito por página. Esse é o caso do convert case.
O usei como exemplo pois foi o exemplo mais ilustrativo que conseguir pensar em que fosse somente a aplicação na página.

Google Ads

Pense comigo, se o convert case é uma aplicação tão simples e nós conseguiriamos construi-la com um simples javaScript, e algumas vezes até com css...
Por que você ainda não tentou?
Uma aplicação que poderá te render verdinhas, dólares, pingando na sua conta todos meses. TODOS OS MESES.

Isso me faz refletir se entrar de pé na porta para fazer isso para os outros é realmente o que eu consideraria justo, sabendo que essa possibilidade existe jamais será possível tirar essa conclusão sem tentar incansavelmente.

2.6 milhões de visitas seria um valor interessante de visitas. Se você ganhar um valor estimado de US$ 0,15 com 25 page views, sua RPM de página será igual a (US$ 0,15/25) * 1000, ou US$ 6.
Mas mesmo que fosse somente 1 dólar por cada 1000 já seriam 26 mil dólares.
Os dados de visualizações foram tirados do site similar web, dia 31/01/2024.

Não entenda errado, não significa que você ganhará isso. Mas imagine 200 dólares a mais todos os meses. Faria diferença para você?

Ter um aplicativo tão acessado exigirá algum planejamento. Como por exemplo:

estar dentro das políticas do programa
não ser uma página sem saída
ter divulgação através das redes sociais
Ter um texto que o SO poderá ajudar.
Navegabilidade
Acessibilidade e responsividade
Um texto com boas palavras chaves e SEO poderá te ajudar na rede de pesquisa.
Autoridade de domínio e do site.

Políticas de conteúdo
Políticas do google ads

Não deixe de ler as políticas coso monetizar dessa forma seja do seu interesse.

Nas próximas postagem no blog, irei tratar de Autoridade.
Como saber a autoridade de um site. E posteriormente sobre palavras chave. Como escolher um mercado para criar meu app?
Todos temas baseados nas minhas pesquisas que tem se tornado parte da minha rotina para tentar monetizar as aplicações que venho a criar.

Exemplo prático.

Semana passada eu criei meu Primeiro aplicativo web funcional que resolve um pequeno problema. Gerar links para Whatsapp.

Bom, ele funciona, tem um layout questionável, várias melhorias para ser implementadas mas está em pé.
Podem conferir aqui:
Gerador de links para WhatsApp

Na ausência de conhecimentos específicos eu não criei um dos requisitos mais importântes para se monetizar no Google Ads, a navegabilidade.
Portanto será necessário replanejar a distribuição da funcionalidade, introduzir conteúdo ao corpo do site e deixa-lo como um projeto funcional aos olhos do google.
Também será nessesário fazer a compra do domínio para sua publicação, pensar em sua hospedagem fora do github e diversos outros fatores que irei compartilhar com vocês a medida que pesquiso e coloco em prática.

Convido também aqueles que tem interesse em fazer um apoio mútuo participar do processo, afinal são uma diversidade de habilidades demandadas.
Sou um programador front-end, disposto a me aventurar em outras áreas para que esse e demais projetos fiquem no ar. Meu propósito é resolver problemas de pessoas reais com tecnologia, e não guardar react no bolso.

Tem interesse de participar do processo? Críticas ou dúvidas?

linkedin
Me acompanhe no blog

Um Convite para Redescobrir a Paixão pela Programação

Rafael Nunes — Tue, 23 Jan 2024 03:20:10 +0000

Esse é um relato da minha última semana, onde concebi um layout do figma até a tela final.
Foram meses longe da programação, fazendo só alguma coisa aqui e ali. Para que as coisas tomassem rumos diferentes, decidi sentar todos os dias para fazer algo do início ao fim. Iniciar a formação de planos e hábitos no que mais gosto de fazer.

Tudo começa no desejo, um desejo ardente que me impulsionou a colocar tudo para fora. Minha vontade era ir direto ao código, a parte mais delicinha.
Porém, eu já sabia que fazer coisas sem nenhum planejamento seria como cavar várias covas rasas no deserto e que no fim eu acumularia frustração.
Quando esse desejo se tornou tão irresistível que me fez agir, eu abri o figma e comecei a colocar tudo do jeito que eu imaginava (dentro das minhas limitações técnicas de não designer). Aqui está o link do figma:
Figma
Sei que os designers vão se contorcer de dor ao ver meu layout, porém foi uma pequena conquista ao longo de 2 dias que me fez conseguir imaginar a concepção da estrutura do html necessária.

Com as duas estruturas uma ao lado da outra consegui planejar fixamente imaginando se usaria flex ou grid para organizar o conteúdo.
Observe que para alguém em processo de retomada e se esqueceu de muita coisa no código, quanto esforços custariam a tentativa e erro até conseguir uma estrutura legal no html e css? Provavelmente essas seriam as covas rasas que eu cavaria no deserto sem achar água.

Rapidamente falando um pensamento furtivo. Antes de formar esse plano eu me lembrei de quantas pessoas menos capacitadas tecnicamente construíram soluções que eu não fiz. E mais, foram recompensadas por isso mesmo que fosse uma coisa super simples demais. Este projeto é uma declaração de "Eu posso, sou capaz de fazê-lo e farei sem hesitar." É algo que me reconecta com meu propósito, solucionar problemas com tecnologia.

Planejar, embora eu reconheça minha conquista com esse projeto, também preciso reconhecer meu fracasso. Planejei bem a estrutura do código, mas não planejei bem em como eu conseguiria monetizar esse trabalho. Afinal é um problema simples, mas existem pessoas na internet que ganham dinheiro com essa mesma solução! Então por que não a minha?
E a resposta é, porque eu não planejei corretamente o modelo de monetização. Acreditei sem ler os termos que poderia me registrar no google ads e ser monetizado, não pensei na quantidade de pessoas que usariam a ferramenta recorrentemente e falhei em planejar algo que atendesse aos requisitos do google ads, que já é um assunto tão extenso que vale uma postagem só para isso. Por fim, deixei um campo para aqueles que desejam entrar em contato para automatizar seu whatsapp com chatbot, e um campo para doação caso essa ferramenta ajude alguém que deseja contribuir de alguma forma.

Motivado, agir foi a parte mais fácil até o 6, dia onde ví que algumas coisas atrasadas estavam demorando demais. No total, foram 8 dias para desenvolver a ferramenta, considerando o tempo que fiquei trabalhando nela não foi integral.
O tempo para pensar em lógica, métodos e funções novamente e codar, postar essa ferramenta, criar postagens e tentar alcançar a comunidade de alguma forma para que alguém veja e diga. "Ei, esse código pode ser melhorado em tal parte" feedbacks justos.
Houve inúmeros pormenores no processo de ação de codar como:

A implementação de acessibilidade com a tecla tab
O botão de submit do que ao usar um e um para outra função, descobri que mesmo sem ser type submit funciona como se fosse, e isso dava conflito no meu javascript.
Colocar um icone de compartilhamento com link do site, pegando um método nativo do navegador navigator.share() para celular (até então não deu certo, mas vou pesquisar até conseguir fazer funcionar e fazer uma postagem sobre isso.)

Por fim, no sétimo dia, por mais curioso que eu seja,já estava saturado de procurar soluções para colocar como "qual seria o melhor anúncio de ferramentas para automação de whatsapp",
"como implementar e onde as propagandas do google ads..." Questões em relação a hospedagem paga pois vou comprar um domínio para colocar essa ferramenta melhor posicionada nas buscas. Embora isso seja outra coisa que a princípio também não pensei, nomes e títulos para ranquear melhor. Por sí só é um enorme trabalho a parte.

Da para ver que por mais que seja trabalhoso transpor um layout, um projeto independente tende a ser bem mais trabalhoso, pois se escolher o método tradicional de front-end com código, é muito trabalho a se fazer, e pretendo compartilhar aqui essas dificuldades e soluções, me conectar com vocês pelo conhecimento que poderá ser agregado.

Por fim a aplicação saiu! Por enquanto no github pages, mas embreve em uma hospedagem própria sem restrições de código de rastreamento. Confiram ela no github:

Aqui uma prévia do que ela faz:

Acredito que a formação de planos imperfeitos ou com problemas não devem ser motivo para desistência. Quando eu comecei, sabia que iria errar, mas também sabia que estes planos são caminhos para criar planos melhores. Se você está passando por um período difícil, saiba que é possível reacender essa chama. Seja curioso, celebre suas conquistas, compartilhe seu conhecimento, conecte-se com outros e lembre-se sempre do seu propósito.
Acredito fortemente que me tornarei um desenvolvedor independente, e com essa determinação, planos, hábitos, movido pelo desejo não aceitarei o contrário pois sei que sou capaz e não irei me convencer do contrário. Se você também tem uma determinação, torne-se consciente de suas metas, não evite falhar, pois só fracassa aqueles que desistem.
Veja o resultado, com uma semana consegui colocar um plano imperfeito em prática.
Escolha pequenos problemas, pequenas soluções é provável que consiga completar uma tarefa de uma semana do que ter motivação para completar uma de dois meses.
Visite meu github : Gihub
Visite também meu linkedin: Linkedin

Como criar boas imagens com Stable Diffusion

Rafael Nunes — Tue, 20 Dec 2022 02:08:10 +0000

Para esse tutorial eu vou resumir a um categoria de criação desse aplicativo, a criação usando prompts para gerar imagens.
O promp é uma área que você coloca as palavras preferencialmente em inglês para uma imagem ser gerada. Sendo dividido entre promt e promt negativo. Se no prompt você coloca as coisas que você quer que apareça, no prompt negativo você coloca as coisas que você não quer!

Isso já ilustra bem o que você deve fazer, mas é bem complexo esse funcionamento e eu vou resumir em alguns tópicos para não gerar confusão.

ATENÇÃO!!
Esse post contem nudez artística gerada por inteligência artificial (um desenho) , se você se sente ofendido por esse categoria de conteúdo não recomendo que leia esse post.

Prioridade
Especificidade
Resolução
Configurações básicas
Influências
criando imagens semelhantes.

Prioridade

A ordem de prioridade de um promt é feita da primeira palavra para última, se eu digitar:

a cyberpunk girl with white hair

"a cyberpunk" terá mais prioridade do que o resto da frase. "girl" terá mais prioridade do que o resto da frase, mas menos prioridade do que "a cyberpunk". Isso significa que se eu colocar:

a girl cyberpunk with white hair

Provavelmente terei resultados diferentes, isso mesmo, resultados.
O programa por padrão conta com uma certa aleatoriedade que se você não controla, toda vez que apertar o botão uma surpresa vai aparecer com a mesma frase.
E isso é ótimo, pois assim da margem para fazer várias experimentações com o mesmo promp.

Especificações

As especificações de um prompt podem ser divididas em 2 categorias.

( parênteses )
{ colchetes }

Enquanto os parênteses vão dar mais relevância em algo da fraze os colchetes vão fazer com que sejam menos relevantes.
A regra inicial ainda vale, mas isso pode mudar a forma com que o computador enxerga essas partes que você vai dar mais relevância.

a cyberpunk girl with (white hair)

a cyberpunk girl with ((white hair))

a (cyberpunk) girl with ((((white hair))))

Na última eu dei tanta ênfase no cabelo branco que provavelmente alguns pontos do resto podem até ter passado despercebido na imagem gerada, isso pode destorcer o contexto e fazer com que as coisas fiquem diferentes do que você esperava. O oposto Também pode acontecer com as chaves, use-as com sabedoria.
Nos meus testes quando eu usava mais de 3 o contexto da frase começava a ficar deixado de lado pelo algoritmo. Então, você precisará achar um ponto que lhe agradar melhor e o mais importante; TESTAR BASTANTE!
Quanto mais específico e menos conhecido o que você colocar no prompt, mais chances você tem de não chegar no resultado esperado.

Resolução

Bem brevemente! Será possível você editar o tamanho da imagem antes que ela seja gerada. O tamanho que você definir, será de extrema importância para o resultado. Menos que 512 x 512 pixels ela fica com resultado bem ruim ou bem distorcido. Já 512 x 768 para meus testes é ótimo para gerar imagens de corpo todo. E com a resolução 1360 x 768 é excelente para gerar imagens que pegam paisagens.

A princípio eu pensei nesses tamanhos por ter relação direta com a tela que eu colocaria isso, simplesmente para ajustar e usar como plano de fundo, ou para postar em alguma rede social. Entretanto se você trocar a resolução, irá trocar o resultado.
No Stable Diffusion especificimente não dá pra aumentar a resolução depois da imagem criada, já ví outros que fezem mas eram pagos. Provavelmente existe algum software livre que seja capaz de aumentar a resolução se é o resultado que você deseja buscar, recomendo fazer uma busca por essa funcionalidade pois trocar o tamanho da imagem gerada retornará outra.

Configurações básicas

Com certeza você encontrará tutoriais bem mais detalhados sobre configurações. Entretanto existem algumas coisas que podem ser importantes configurar especialmente se você está usando a versão do Google Colab.

Upscaling

R-ESRGUN 4X+

irá trazer traços mais realistas
R-ESRGUN 4X+ Anime 6b
Irá trazer traços mais desenhados.

Face Restoration

A opção code former é bem interessante para trazer bons resultados para um rosto.
E na linha que vai de 0 a 1, me recomendaram preencher com 6, onde quanto maior o número mais precisos ficariam os traços do rosto. Experimente...

Stable Diffusion

O checkbox

[x] Emphasis: use (text) to make a model pay more atention to text and [text] to make it more pay less atention

Se não marcado irá fazer com que o que você coloque no prompt fique mais preciso, porém fica bem mais complicado de entender esse caminho. Por via das dúvidas deixe marcado.

Influências

Para conseguir fazer prompts melhores é bom que você analise o prompt de outras pessoas

https://rentry.org/artists_sd-v1-4 você irá encontrar vários estilos para colocar no seu prompt e seguir um resultado interessante e aproximado.
https://lexica.art/ você encontrará prompts dos quais poderá testar no seu e ver os resultados que consegue

Os dois são ótimos para começar, e você pode testar usando o rentry da seguinte forma:

a real (cyberpunk woman) with a white hair, Agnes Cecile

a real (cyberpunk woman) with a white hair, (Agnes Cecile)

a real (cyberpunk woman) with a white hair, ((Agnes Cecile))

a real (cyberpunk woman) with a white hair, ((Agnes Cecile)), Casey Baugh

Repare que eu já até adicionei o nome de um segundo artista para colocar o nome de arte e isso fica sensacional

Primeira forma	Segunda forma

Criando imagens semelhantes.

Criar imagens semelhantes como o exemplo acima vai demandar um tipo de refinamento que controla um pouco essa aleatoriedade.
O Seed é a informação que permite que toda vez que você aperte o botão com o mesmo prompt gere uma imagem nova.

É possível capturar esse seed da imagem que você gerou clicando no sinal verde quando ela é carregada, ao clicar no dado ela volta a ficar aleatória.
E também é possível pegar de uma imagem salva que você não tenha alterado a descrição.

00041-3430797675-a real (cyberpunk woman) with a white hair, Agnes Cecile.png

O primeiro bloco representa o número da foto, você pode usar esse valor para pesquisa-la na sua galeria caso goste dela ou tenha como referência.
O segundo valor é o Seed, esse que você preenche no campo Seed, para deixar a aleatoriedade gigantesca que o programa tem mais próxima do que você quer. Se deixar o padrão -1, cada imagem iá ser gerada com um Seed diferente, e vocẽ não irá conseguir controlar só com pequenas alterações no prompt.
Depois vem a descrição do prompt.

Agora você já sabe como fazer para gerar uma imagem semelhante. Existem algumas coisas que é bom relembrar que podem afetar essa igualdade. Tamanho da resolução, versão do programa, configurações, o sampler e os steps.
Os steps são a quantidade de passos que o programa vai ter para montar sua imagem.
Para rostos tenho conseguido bons resultados em torno de 20 a 35 steps, e para objetos extremamente detalhados próximo do máximo de 150, porém as descrições ficam muito específicas.

Segue imagens que eu adorei compor.

00101-3430797675-a real (cyberpunk woman) with a white hair and (((((big mamma))))), Agnes Cecile.png	00182-3430797675-a real ((cyberpunk girl)) with a (white hair) and (beautiful (large tits) naked), Agnes Cecile, Casey Baugh.png	00192-3430797675-a real (cyberpunk woman) with a white hair and (beautiful large tits naked), Agnes Cecile, Charlie Bowater, (Casey Baugh).png

Por último você irá poder testar bastante para atingir diversos tipos de personagens e alcançar seus resultados.

Como usar o Stable diffusion

Rafael Nunes — Sun, 18 Dec 2022 16:23:07 +0000

O passo a passo de como criar artes digitais.

O Stabble Difusion é o queridinho do momento criado pela OpenAI. Existe a mais diversa gama de possibilidades de artes que você pode criar, inclusive treinar o algoritmo para criar artes personalizadas ao seu gosto.

O tutorial de como gerar cada foto ficará para o próximo post, já que para usar ele é necessário aprender a como acessa-lo não é muito fácil de se fazer, dispensando a instalação vou mostrar uma forma de como usar.

Hugging face

Se você está curioso para testar esse programa entre aqui :

Huggingface

Pronto, com a versão demo você pode satisfazer seus desejos pandoricos de apertar o botão de gerar a foto, mas se você quer ir mais fundo como eu, vou mostrar como eu usei o google colab para rodar esse programa. O principal motivo de não baixar localmente é a quantidade de recursos que gerar essas fotos consomem, infelizmente não tenho hardware suficiente para aguentar essa missão, não cheguei a consultar nenhuma documentação porque algumas pessoas chegaram a falar de 4GB para GPU e eu não tenho nem 1GB, mas tenho uma solução que me permite usar um hardware simples para ela.

Cadastrese no huggingface

Abra na pagina inicial e feito o cadastro você receberá um e-mail de confirmação, confirme e faça o login na sua conta.

Posteriormente vamos criar o token de acesso.

Google collab

Usando o google drive e o google colab Google Colab link

Serão 5 passos de inicialização e na primeira etapa será preciso vincular a sua conta do google, lá é onde serão armazenados os dados no seu google drive. Dentro do seu drive será criado uma pasta chamada SD onde estarão os dados do programa e posteriormente poderão ser guardadas as fotos. Recomendo que você abra seu drive e verifique se essa pasta foi criaada para dar continuidade.

Aperte play nas demais etapas e espere carregar, algumas podem demorar alguns instantes até a etapa Download de Modelo/Carregar.
Quando chegar na etapa Download de Modelo/Carregar vai ser preciso colocar o token de acesso na parte escrita token:

Esse token é pegado lá no hugging face acessando a area Settings no lado esquerdo e selecionando a area token para criar um token novo. Assim como mostra o giff.

Eu tive problemas nessa parte pois o promp vai te pedir autorização e te retornar um link para aceitar os termos no qual você deve acessar. Eu abri o link e li todo o documento dele mas não tinha nada para aceitar.

Porém eu recarreguei a pagina e recomecei o processo passo a passo e me parece ter sido aceito automaticamente, nesse momento usei a versão 1.5 no colab e nesse tutorial o link se refere a essa versão, você pode ou não ter esse problema com o link que o prompt te retornar!

Agora é só fazer a inicialização .

Nessa ultima etapa assim como na etapa de vincular o token, pode demorar um tempo. O prompt te retornará dois links, a url local e a url pública.

Com a url pública você pode fazer o acesso e se quiser pode rodar até no celular.

Onde aprendi a usar o Stablle Diffusion

O que me motivou a escrever esse artigo foi o canal do Martucci no youtube, e se você quiser ver o tutorial dele para fazer a instalação do programa em português segue o link:

Tutorial no youtube

No canal dele você encontrará um conteúdo incrivel sobre stabble difusion. E se quiser encontrar a comunidade no discord:

Convite do discord

Abraço galerinha.

Atomic commits

Rafael Nunes — Mon, 12 Dec 2022 22:04:39 +0000

Sabe quando você vê uma pessoa que está pesada e sobrecarregada ?
Provavelmente você já presenciou algum amigo que acumulou problemas até o ponto que não aguentava mais e colocou tudo pra fora de uma vez.
Veio tudo com uma avalanche , e provavelmente isso causou mais problemas .
E depois desse ponto alguns chegam a se apegar ao problema que essa avalanche criou , ao ponto que o problema se tornou maior do que a situação , até que ! As pessoas desistem. Tentam começar de novo , algumas até seguem os mesmos passos e se enrroscam no mesmo raciocínio como um círculo sem começo nem fim.

Eu já tive esse carma, e hoje felizmente já consigo me ver livre dele.
Eu estou aqui pra falar de código , e como atomic commits mudou a minha forma de pensar, e ao poucos fui tirando esse peso.

Projetos

Meu GitHub era definitivamente uma enorme montanha de código sem vida , algo com início , meio e sem fim.
De um commit pro outro não era um tijolo , era a casa inteira. Ainda tenho muito disso nele e parte da soluçao foi dar foco ao que eu estava fazendo, e com dar foco eu comecei a olhar mais de perto.
Com isso fui fazendo commits menores , de forma que eu pudesse olhar pra traz e pensar , será que essa soluçao aqui foi a melhor ? E ao invez olhar um problema grande , eu comecei a enchergar pequenos problemas e com isso as coisas começaram a andar, a sensaçao de "isso é muito difícil " começou a diminuir.

Boas práticas

Atomic commits é uma boa prática do git pra marcar no seu código alguns "snapshots " , ou versões dele a medida que a linha do tempo aumenta.
Imagine você , desenvolvendo uma soluçao até que em alguma parte um bug começa a imendar no outro, e você já não sabe mais o que fazer . Quando você olha pro seu codigo, nem consegue enchergar direito os tijolos mais, alguém já pode até ter mechido e as coisas ficam acumuladas , problemas acumulados vindos todos de uma vez. O contl-z você já apertou inúmeras vezes e ao invez de melhorar parece que piora.

Com atomic commits é só você voltar pra última versão em que tudo funcionava . BOMM , o planeta explodiu e você vai lá ver o que aconteceu antes dele explodir.

git

git add .
git commit -m "Aqui meu código funciona"

Pronto , pra voltar pro último commit:

git reset --hard

E inspecione por que o planeta explodiu .
E caso a última versão tenha passado algo que você não viu e que ir mais a fundo :

git log --oneline

Pegue os caracteres iniciais desse commit e coloque :

git checkout 90ajf784

//Caracteres do commit

E aqui está uma outra versão mais antiga a sua escolha. Caso você queira partir desse ponto você vai precisar criar uma nova branch pois uma versão mais antiga que o último commit modificada daria conflito com o próximo commit a frente .
Seria possível fazer algo como ;

git branch hot-fix
do ponto que você voltou, e fazer um checkout na branch que você acabou de criar .

git checkout hot-fix

O mais importante desse processo é que ele te permite ver onde você errou e criar uma nova estratégia .

Eu gostei tanto disso que trouxe pra minha vida . Um processo passo a passo "baby steps " , sequências de pequenas conquistas merecem comemoraçoes.
Talvez você não tenha grandes soluçoes pra grandes problemas , mas tenha soluçoes pra problemas pequenos .
E se ser programador é ser um solucionador de problemas :

git add .
git commit -m 'passo 1 ' 

git add . 
git commit -m 'passo 2' 

git add . 
git commit -m 'passo 3'

git checkout master

git merge hot-fix

Agora você tem um conflito de merge , mas se você está interessado em git vou deixar pra você a soluçao .

Solucionar problemas

Definitivamente atomic commits trás uma nova versão de modo de pensar , eu me deparei com esse pensamento quando vi pessoas que tinham menos conhecimentos que os meus solucionando problemas maiores que eu conseguia. Até que percebi que eu estava apegado às problemas que eu criei, revirando soluçoes de programadores que fizeram coisas simples mas resolveram problemas, só tenho a agradecer a comunidade por deixar o código aberto. As vezes vejo os códigos como criaturinhas que alguém criou, pronta pra fazer alguma coisa .

O que acha implementar atômic commits no código ?
E quem sabe criar hábitos atômicos na sua vida ?

O que faz um dev front-end

Rafael Nunes — Sun, 11 Dec 2022 01:53:38 +0000

O que o mercado pede

Pra responder essa pergunta é importante que se tenha uma perspectiva de momento de mercado ou até da empresa que se está levando em consideração. Cada vez mais as soft skils tem sido um diferencial para se definir a contratação de um novo desenvolvedor.
Nesse momento especifico está tendo uma recessão no mercado de tecnologia pós pandemia, um trade-off bem grande , e com certeza as empresas vão cobrar desenvolvedores mais experiêntes para exercer a função de front-end.
Em tempos anteriores ser um full stack por exemplo era mais fácil que hoje com web master, porem hoje cada stack em sí já tem uma quantidade muito grande de conteúdo sosinha e é preciso ter um foco para se tornar um expecialista.

A função do front-end

Basicamente, o desenvolvedor front-end transforma um layout feito por um designer UI, wireframe feito em um figma da vida em um projeto para navegadores.
O figma é uma aplicação que fornece medidas dos objetos, paleta de cores do wirefreame facilitando bastante a vida do desenvolvedor. É possível transformar imagens em projetos para navegadores também, dando um pouco mais de trabalho para o desenvolvedor front-end como por exemplo descobrir o tipo da fonte, o tamanho das letras, as cores, tamanho dos objetos ... Mas não é uma tarefa impossivel.

Pode a principio parecer simpres transformar algo feito por um designer em uma interface para navegadores. Porém hoje existem uma série de competências que devem ser adiquiridas pelo desenvolvedor.
Implementação de acessibilidade, Tecnicas de clean code, regras de conventional commits no código, responsividade , testes unitarios, desempenho da interface , Pixel perfect são algumas das competências que geralmente são usadas por desenvolvedores front-end. Tudo isso para transformar um designe em código, dando vida ao projeto e o deixando de pé.
È no front-end que se define se a cor de um objeto muda quando você passa o mouse em cima, que se faz uma mensagem de erro quando você erra o login no formulario de uma rede social entre outras coisas.

O desenvolvedor acaba por adiquirir algumas outras habilidades como por exemplo fazer uma integração de API a uma página com javaScript consumindo dados, fazer um crud, uso de um fire base para integrar banco de dados a uma pagina por exemplo.
Na propria interface pode ter o uso de javaScript quando você clica em um botão, não necessariamente isso é uma coisa de back-end, a maioria das pessoas acaba acreditando que a linguagem de programação só é usada por quem desenvolve a API em si, o que não é verdade.

A exemplo disso temos frame works javaScript como React.js , Vue.js que são feitos para navegadores e usados por desenvolvedores front-end, sendo tecnologias mais atuais usadas no mercado.
Cada vez mais se cobra além de java script o type-script para uma tipagem mais forte na linguagem e diminuir o tempo de manutanção por exemplo, o uso de Sass, um framework UI como tailwind.
Tecnologias como o botstrap tem caido seu uso depois das funcionalidades de flex-box e grid do css. Cada vez mais exitem atualizações no css para se fazer o basico com ele e evitar o uso de muito código, deixando as paginas cada vez mais leves, um ponto de evolução que nem os proprios navegadores acompanham as linguagens na medida das atualizações, um profissional front-end tem que sempre estar se atualizando em relação as novas features da tecnologia se interando com a comunidade, lendo documentações e testando.

Ocasionalmente você pode ver um desenvolvedor front-end também rodando aplicações com docker e hospedando elas na AWS ou digital ocean, cada vez mais usando uma comunicação com servidores. Muitas empresas acabam por ver essa soft-skill mais como uma hard skill ao longo da carreira. Ou ao invez de ir pra essa ponta da tecnologia o wireframe ser feito pelo dev.
Existiram uma serie de habilidades que podem ser uteis para um dev front-end e tornar o trabalho diferenciado da maioria.

Você gosta da Area de front-end ? Já conhecia o trabalho de um dev ?

Uma maneira de ganhar dinheiro programando

Rafael Nunes — Fri, 09 Dec 2022 03:04:24 +0000

Provavelmente esse é um artigo que um guru da programação escreveria, eu sou um programador iniciante que está mais preocupado com a seguinte questão ; Centralizar a minha renda em um só empregador.

Apesar de não ter conseguido a minha vaga de programador junior ainda, é algo que já me preocupa. Deixar o controle financeiro do que recebo e não recebo nas maos do meu chefe, e acredito que você também está preocupado com isso e é por isso que está aqui.
Se você está alinhado com a ideia de enrriquecimento é sobre isso que vou falar, a prestação de servicos vou deixar para um outro momento, aqui vou descrever a construção de ativos.

1- criar templates

Quando se presta serviços de construção de sites, se você é desenvolvedor talvez você até faça esse site do zero, mas a maioria das pessoas não faz, o que elas fazem é pegar um template pronto em wordpress ou envato da vida e partir de um ponto de colocar conteúdo nele. Chega a ser enjoativo a quantidade de conteúdo no youtube e no instagram que te bombardeiam pra falar desse wordpress. E é ai que está o pulo do gato, essas pessoas falando de wordpress em algum momento podem estar falando de um template que você criou e colocou nessa plataforma para que os outros usem, sem sombras de dúvidas esse é um branding muito grande se for um template com um certo número de uso, ou melhor de compras...
Imagine que nesse mar de templates você tenha um que custa 50 reais, é um esforço bem grande criar um bom template e sem dúvidas esse seria um preço muito baixo se ele fosse vendido só uma vez, mas suponhamos que ele não seja um template de muito sucesso porem seja um bom trabalho que venda um pouco, cerca de 100 vendas no ano, isso significa que já são 5 mil reais por um produto que você fez só uma vez e agora com uma pequena manutenção você pode continuar vendendo ele.

pensando fora da caixa

Mas talvez você não queira aprender php pra criar seu próprio template em uma plataforma grande, talvez existam outras que façam templates com node e js.
Caso você conheça alguma deixe aqui nos comentários por que eu não conheço, e gostaria de conhecer.

Você também poderia entrar em um site de freelas como o freelancer.com e publicar o seu template como um produto, ou ter um site para verder uma versão mais premium ou completa do template que você criou com a tecnologia que você escolheu e seguir o mesmo modelo de vender um template mais barato mas vender muitas vezes enquanto você dorme.

Criar um template não é algo exatamente fácil, provavelmente você criará muitos sites até chegar no template que seja interessante para ser vendido em uma escala maior. Mas sem sombra de dúvidas assim que você pegar o jeito poderá contruir vários templates que se materializam como infoprodutos. Esses que poderão ser escalados sem que necessariamente você aumente seus esforços para que alguém use ele.
Talvez a medida que você faça algumas vendas, possa criar alguma campanha de marketing para fortalecer a sua marca pessoal ou o seu produto.

Você já pensou em criar algum template ?

Como fazer um projeto sem travar

Rafael Nunes — Fri, 09 Dec 2022 03:00:01 +0000

doers

*É melhor algo feito, do que algo perfeito ! *

Essa é uma fraze de uma pessoa bem "doer", mas é verdade, é preferível que faça algo pequeno mas faça, do que tentar dar um grande salto e depois parar.

Pensando nas dificuldades que se encontra na hora de codar, eu fiz aqui um passo a passo para ser seguido pra que seu projeto ganhe vida, e essa é só uma forma que você pode adotar para faze-lo do inicio ao fim sem travar.

Analize do projeto.

Quando fizer a analize tente entender e anote suas dúvidas. Se preciso as anote para que na hora de codar não fique quebrando cabeça com o que você pode ou não fazer.

Tirar as dúvidas com o designer, caso tenha um.

Se necessário quebre o projeto em componentes,
Coisas que possam ser reaproveitadas pois são repetidas, talvez você economize boas linhas de código fazendo essas partes em uma folha de css global por exemplo.

Desenhe estrutura basica que o projeto vai ter como planejamento.
Pensar em blocos é mais fácil

Perceba como um objeto pode ter várias partes, assim já tendo a vizualização planejada do que você deve fazer para codar fica bem mais fácil.

Criar a estrutura base

Criar a estrutura de pastas

Observe que tudo que não for o index ou readme, fica na pasta src com suas respectivas pastas onde serão usadas no projeto.
A estrutura de pastas é muito importante para que você não se perca no meio.

Criar o HTML

Nessa parte já se começa a codificar

Não tem problema em criar ele e depois mudar, talvez alguma div não se comportou como você planejou, talvez houve algo que você deixou passar , você não precisa ter um planejamento perfeito antes de começar, mas não deixe de planejar o que será feito.

Criar o CSS

Criar arquivo de reset.css para zerar margens e paddings e outras coisas globais.
Um pra animações, outro para estrutura dos elementos, um para objetos comuns.
Dependerá do seu projeto e do seu tamanho , mas tenha folhas de codigo css separadas para cada tarefa, ao invez de fazer uma folha gigantesca.

criar o arquivo de style.css, é mais intuitivo criar de cima para baixo de acordo com a ordem dos elementos que você irá fazer.

criar o JS

Primeiro pensar na lógica do código para depois ir para ele
Se você estiver seguindo alguem e tiver errado, tente entender a lógica, não tente arrumar e escutar a pessoa.

Finalizando MVP

uma espécie de versão beta, pra dar vida ao projeto e depois ir fazendo melhorias.
Refatorando e etc.
Assim seu projeto ganha vida rapidamente e você já conseguirá ânimo para ir para o próximo ou melhora-lo.

Olá mundo

Rafael Nunes — Tue, 06 Dec 2022 23:34:53 +0000

Este é meu primeiro post, espero estar compartilhando aqui todos os dias algo novo.
O blog em sí já é algo novo para min vou deixar aqui soluções de problemas , hacksinhos e dicas relacionadas ao front end inicialmente.

Hoje vou mostrar como escrever olá mundo na tela com CSS, e quebrar a maldição de não ser um bom blogueiro .

No html vou deixar somente uma tagsinha de span para fazer essa brincadeira :

<span></span>

A estrutura base do html é importante para que o navegador reconheça a tabela de caracteres, lingua e versão do html, mas para rodar na sua maquina local não tem problema colocar só o span.
Agora vamos ao CSS:

span::before{
  content:"Olá "
}
span::after{
  content:"mundo"
}

Aqui nos temos pseudo elementos indicados por ::before ::after , um significa antes e o outro depois, ou seja, da nossa tag spam.
O content significa o conteudo, que nesse caso é um texto. Ao fazer a inserção do texto pelo css ele é inserido na folha de html e impresso no navegador, porêm não aparece no resultado das buscas dos navegadores, portanto não são semanticos, é bom ter isso em mente caso use essa tecnica para inserir texto 😉.

Ai está nosso olá mundo, e a maldição de ser um mal blogueiro está quebrada rs.