A frase “Figma para desenvolvedores” tem sido usada por várias startups de ferramentas de desenvolvimento nos últimos anos, mas uma empresa chamada MightyMeld acredita que seu produto – direcionado a desenvolvedores React – realmente faz jus a ela.
O MightyMeld, que está saindo da versão beta privada hoje, criou o que chama de “maneira visual de construir aplicativos da web sofisticados e interfaces de usuário de front-end”. Ele permite que os desenvolvedores encontrem, modifiquem e enviem alterações de código para produção “de uma forma visual que está sempre em sincronia com o código ativo e em execução”.
MightyMeld é um pouco como o Chrome DevTools – mas não o chame de ferramenta de baixo código! Pelo menos foi o que me disseram várias vezes em duas entrevistas que conduzi, primeiro com o investidor principal James Lindenbaum da Heavybit (que anteriormente foi cofundador e CEO da Heroku) e depois com o fundador e CEO da MightyMeld, Steven Schkolne.
No início, o que Schkolne estava descrevendo para mim parecia um pouco com o Dreamweaver, a ferramenta de desenvolvimento de sites que usei há muitos anos. O Dreamweaver era conhecido por seu ambiente WYSIWYG (“o que você vê é o que você obtém”) – você podia criar páginas da web e até aplicativos simples usando uma interface parte visual e parte código.
Mas Schkolne deixou claro que o MightyMeld é mais sofisticado que o Dreamweaver, porque pode criar aplicativos React inteiros. MightyMeld usa a arquitetura baseada em componentes do React, na forma de JSX — a extensão JavaScript criada pelo Facebook para usar com o React. Schkolne descreveu JSX como “basicamente uma forma de escrever coisas que se parece muito com HTML, mas na verdade são componentes”.
“Depois de ter essa estrutura”, continuou ele, referindo-se à estrutura de componentes do JSX, “essa é uma espécie de observação subjacente que nos fez (construir) o MightyMeld. Isso me fez pensar, talvez algo assim seja possível. Porque esta estrutura aqui no código React é muito semelhante à hierarquia Figma. Então você pode realmente ter essa ferramenta que mescla os dois (visual e código).
Painel do MightyMeld
Em minha discussão com James Lindenbaum, ele observou que encontrar uma empresa do tipo “Figma para desenvolvedores” para investir era uma tarefa difícil. Então, quando descobriu o que Schkolne havia criado com o MightyMeld, ficou intrigado.
“Os sistemas frontend tornaram-se muito densos e complicados”, disse ele, “e, portanto, a edição do código frontend tornou-se (…) um atoleiro contínuo. Coisas como Jamstack e todas essas outras coisas em que estamos envolvidos aceleraram isso, porque apenas tornaram o lado do cliente mais grosso. Portanto, há cada vez mais código de UI. E muitas vezes, até mesmo algo como encontrar o lugar certo no código — em alguma enorme árvore de componentes do React ou qualquer outra coisa — para atualizar algo visual no editor de texto é realmente muito difícil. Portanto, esse desejo de ter uma ferramenta que permita editar o que é fundamentalmente visual, com uma ferramenta visual, tem sido claramente algo desejável há muito tempo – mas ninguém tinha realmente feito um bom trabalho nisso, até onde nós estavam preocupados.”
O que Lindenbaum gostou no MightyMeld, quando o conheceu pela primeira vez, foi que a interface visual produzia “código normal”.
“Muitas vezes as pessoas constroem bons sistemas de edição visual, mas não produzem código normal”, disse ele. “Eles não conseguem olhar para o seu código existente, eles não produzem código normal que você possa usar com todas as suas ferramentas normais. Eles geralmente são uma espécie de universo contido.”
Em outras palavras, uma plataforma de baixo código.
“Mas o que ele estava construindo”, continuou Lindenbaum, referindo-se ao produto de Schkolne, “era na verdade uma maneira de olhar para uma base de código React existente e, em seguida, visualizá-la completamente dentro da janela do navegador – estilo tela infinita, como Figma ou ferramentas semelhantes, onde você pode realmente ver todos os componentes.”
Visualização git lado a lado mostrando atualizações de código geradas
De acordo com Schkolne, o MightyMeld é um produto único no ecossistema de ferramentas de desenvolvimento, embora ele reconheça que o Storybook é semelhante. Storybook, que é uma ferramenta de código aberto mantida pela empresa Chromatic, se descreve como “um workshop de front-end para construir componentes de UI e páginas isoladamente”.
“Somos inspirados pelo Storybook, mas queremos ir um pouco mais fundo e realmente executar todo o seu aplicativo”, disse Schkolne. “O Storybook executa componentes isoladamente, executamos todo o seu aplicativo de uma só vez.”
Ele acrescentou que viu “uma tonelada de geradores de código Figma-to-React” no mercado, como o Plasmic, bem como muitos aplicativos de IA que geram código React. Ele então se referiu a todos os produtos de baixo código existentes – ele se recusou a mencionar qualquer um pelo nome, mas disse que alguns estão “atendendo a uma boa necessidade e a um ecossistema para pessoas que estão iniciando projetos greenfield e talvez queiram um ponto de partida”.
Mas, novamente, ele insistiu que o MightyMeld vai além de outros produtos de desenvolvimento visual.
“Mas o que acontece quando você quer evoluir e continuar aprimorando seu produto”, disse ele. “É para isso (…) que o MightyMeld foi projetado. E como engenheiro, preciso ser capaz de iterar e avançar minha base de código de muitas maneiras diferentes (por meio de) um aplicativo codificado.”
Arrastar e soltar do MightyMeld
Perguntei a Schkolne que tipos de ferramentas seus usuários-alvo estão usando atualmente para visualização de aplicativos.
Ele respondeu que muitos de seus mercados-alvo usam VS Code e GitHub, mas para visualização de aplicativos “eles realmente não estão usando uma ferramenta para isso além do Chrome DevTools”. Ele descreveu o MightyMeld como “um tipo melhor de avanço em relação ao Chrome DevTools”.
Por sua vez, Lindenbaum diz que o MightyMeld é um exemplo de “uma ferramenta estruturada para fazer trabalho de desenvolvimento”. Ele indicou que isso se aplica até mesmo ao uso de IA generativa (como quase todas as ferramentas de desenvolvimento agora, o MightyMeld apresenta geração de código de IA). A forma como o produto usa IA, disse ele, é ajudar você no contexto do aplicativo — em vez de, por exemplo, simplesmente gerar algum código.
“É quase (…) como pedir ao seu amigo que está sentado ao seu lado, que é um profissional com a ferramenta, para vir e olhar por cima do seu ombro e fazer algumas sugestões, ou fazer algumas edições para você. Acho que o uso pretendido da IA pelo MightyMeld é mais parecido com isso”, explicou ele.
Ele acrescentou que o Retool, um produto de baixo código que criei recentemente e mencionei durante nossa conversa, tem uma abordagem semelhante à IA. Portanto, ele não está afirmando que o MightyMeld é único no que diz respeito à IA.
James Lindenbaum é sem dúvida um dos pioneiros do moderno ecossistema de “ferramentas de desenvolvimento”, tendo sido cofundador da Heroku – uma das primeiras empresas de “plataforma como serviço” em nuvem – em 2007. Então perguntei a ele se ele acha que o mercado de desenvolvedores irá continuará a se expandir na próxima década, assim como fez na última década (alimentado pelo React e estruturas JavaScript semelhantes).
Em primeiro lugar, ele reconheceu o debate em torno das pessoas que usam produtos de baixo código e IA generativa para produzir código – são realmente desenvolvedores? Ele não tem uma opinião sobre isso, mas disse que “não há dúvida de que mais pessoas criarão software”.
“Isso já está acontecendo – mais pessoas no total terão o poder de construir software como resultado de alguns desses sistemas.”
Em particular, ele acredita que o mercado atual de IA exigirá novos tipos de ferramentas de desenvolvimento – semelhante ao que aconteceu quando a computação em nuvem decolou no início de 2010.
“Existem muitos tipos novos e diferentes de problemas com os quais você precisa de ferramentas para lidar”, disse ele. “E então, se você contar tudo isso como coisa de desenvolvedor, então sim, acho que esse mercado vai se expandir.”
YOUTUBE.COM/THENEWSTACK
A tecnologia avança rápido, não perca um episódio. Inscreva-se em nosso canal no YouTube para transmitir todos os nossos podcasts, entrevistas, demonstrações e muito mais.
SE INSCREVER
