image

Acesse bootcamps ilimitados e +650 cursos pra sempre

Disponível apenas:

234 vagas
Article image
Lobão
Lobão19/04/2026 19:30
Compartilhe
CI&T - Do Prompt ao AgenteRecomendados para vocêCI&T - Do Prompt ao Agente

Do Terminal ao Localhost

    Minhas primeiras impressões usando Skills no Cursor (e por que achei melhor que o Lovable)

    No meu artigo anterior, que você pode, se quiser, ler aqui [ LINK ], falei sobre WordPress vs a Tríade da IA. Hoje, trago um relato de algo que testei de ontem para hoje e que mudou minha visão: o uso de Skills vs Lovable.

    E não estou me referindo a Hard-skill ou Soft-skill 😆😆

    O que eu entendi sobre as "Skills" Diferente de um prompt comum onde você pede algo isolado, as Skills são conjuntos de informações e diretrizes que a gente aplica no desenvolvimento. Eu usei o Cursor para isso. É como se, em vez de dar uma ordem solta, eu desse uma "base de conhecimento" para a IA seguir enquanto codamos juntos.

    A diferença prática: Controle vs. Conveniência Eu não sou expert em IA há anos; estou aprendendo agora, testando e tirando minhas conclusões. No Lovable, achei tudo muito "mágico", mas senti que ficamos presos. Você gera o prompt, eles criam a aplicação no ambiente deles e, se quiser editar ou fazer deploy no seu domínio, precisa pagar. Você fica meio refém da ferramenta.

    Com as Skills no Cursor, senti que o jogo inverteu para mim:

    • Tudo na minha máquina: O projeto nasce no meu diretório local, via terminal. O código é meu desde o segundo zero.
    • Custo e Liberdade: É praticamente "open-source". Não precisei pagar nada extra para editar. Uma vez que o Cursor entendeu meu prompt seguindo as diretrizes da Skill, ele desenvolveu o site usando React, TypeScript e Tailwind.
    • Mão na massa: Se eu quiser corrigir um texto ou trocar uma animação, posso mandar um prompt curto ou simplesmente "ir na unha" e editar o código diretamente no Cursor.

    O meu processo de teste (Passo a Passo) Segui as orientações da Claude (o chat normal, não o Claude.code) e o resultado foi bem significativo:

    image

    Etapa 01: Entendendo a Base (Documentação)

    Tudo começou com a pesquisa. Antes de rodar qualquer comando, abri o site oficial das Skills skill.sh para entender o que eu estava prestes a instalar. Ali, entendi que a skill frontend-design não é apenas um "gerador", mas um guia que utiliza Design Thinking para evitar interfaces genéricas e focar em detalhes estéticos reais.

    image

    Acesse a Skills que eu usei para o projeto clicando aqui: https://skills.sh/anthropics/skills/frontend-design

    Etapa 02: O Setup no Terminal (PowerShell)

    Com a teoria em mãos, fui para a prática. Abri o terminal (pwsh), criei o diretório skill-portifa no meu disco D: e naveguei até ele. Em seguida, chamei o Cursor para abrir a pasta e iniciar o ambiente de trabalho local.

    image

    Etapa 03: Injetando a Inteligência via npx

    Já dentro do terminal integrado do Cursor, rodei o comando de instalação:

    npx skills add https://github.com/anthropics/skills --skill frontend-design
    
    

    .O terminal exibiu o logo estilizado da Instalação da skill rodando no terminal a Instalação da skill rodando no terminal as SKILLS e iniciou a clonagem do repositório da Anthropic diretamente para o meu projeto.

    image

    Etapa 04: Seleção de Agentes e Configuração

    O instalador me deu uma lista de 41 agentes disponíveis. Selecionei o Cursor como o agente principal para receber essa "habilidade". Logo depois, defini que a instalação seria no escopo do projeto e utilizei o método de Symlink, que garante que eu use sempre a versão mais atualizada da Skill.

    Obs.: Nessa parte tem um detalhe que eu vacilei e rpecisa ficar atento no terminal para escolher a opção front-end/skills, algo asism, pois não há necessidade neste caso de puxar todos os agentes.

    image

    image

    Etapa 05: Instalação Concluída

    Em poucos segundos, o sistema confirmou: "Installation complete". A partir desse momento, a estrutura de pastas do meu projeto ganhou a pasta .agents/skills/frontend-design, pronta para ser usada pela IA durante o desenvolvimento.

    image

    Etapa 06: Desenvolvimento e o Localhost em tempo real

    Com tudo configurado, usei o chat lateral do Cursor para dar a ordem: "Use the frontend-design skill. Crie um site portfólio OnePage". A IA iniciou o raciocínio estratégico (Thinking), analisando meus arquivos locais e as dependências de React e Tailwind para começar a codar o site portfólio no meu próprio computador.

    image

    Veja no print acima como o processo é transparente:

    • No primeiro quadro, a IA analisa o ambiente e tenta rodar o comando npm create vite@latest, enfrentando o dilema de o diretório não estar vazio e decidindo estrategicamente como prosseguir.
    • No segundo quadro, ela já está em plena execução, criando componentes fundamentais como o Hero.tsx, Header.tsx, e até efeitos complexos com Framer Motion.

    É fascinante observar o chat do Cursor não apenas "escrevendo", mas realmente desenvolvendo o projeto do zero em React, seguindo as diretrizes da Skill que instalei.

    Após a conclusão da criação do projeto, acessei localhost:5173 para visualizar e olha que coisa linda!!

    image

    Percebi que, neste teste, o site não ficou 100% do jeito que eu queria de primeira, mas o resultado renderizado na tela é muito significativo perto do que eu imaginava que seria. O nível de fidelidade e a estrutura do código entregue pela Skill superaram minhas expectativas iniciais.

    Mas isso não é um problema, e sim parte do processo. Através do próprio chat do Cursor, é possível editar e atualizar seções, componentes, inserir ou remover imagens e ícones, tudo usando uma boa engenharia de prompt. A Skill continua te auxiliando nessas iterações para manter a consistência do design.

    E para quem, também gosta de "codar na unha" quando necessário, o código está ali: aberto, livre e, acima de tudo, SEU. Você não depende de pagar uma ferramenta proprietária cada vez que precisar atualizar um detalhe ou quiser fazer o deploy no seu próprio servidor. Essa autonomia é o que separa um usuário de plataforma de um desenvolvedor com controle total sobre sua entrega.

    Conclusão: Por que isso mudou meu jogo?

    Ainda estou digerindo tudo o que aconteceu entre ontem e hoje, mas a maior lição é sobre liberdade. A sensação de poder abrir qualquer arquivo e editar "na unha" ou via prompt — sem depender de uma assinatura "premium" para cada pequeno ajuste ou para ter o direito de fazer um deploy — é o que mais me empolgou.

    Para quem, como eu, está na jornada de aprendizado e quer ter controle total sobre o que constrói, o caminho das Skills se mostrou muito mais escalável e profissional. É o fim da "caixa preta": agora eu sei o que está acontecendo por baixo do capô e tenho a chave da oficina no meu bolso.

    Se você leu até aqui, quero deixar meu muito obrigado. Curta, comente, me ajude com essa troca de expeeriência, comaprtiklhe apra que mais colegas que estou começando a conehcer essa nova era das Skills aprendam tmabém como é fcial usar a ferramenta.

    💜🐺

    Compartilhe
    Recomendados para você
    Globant  - Java & Spring Boot AI Developer
    Accenture - Python para Análise e Automação de Dados
    Lupo - Primeiros Passos com Inteligência Artificial
    Comentários (0)
    Recomendados para vocêCI&T - Do Prompt ao Agente