Neste guia, apresento uma solução simples e poderosa que segue o padrão de atualizações do WordPress, tornando o processo totalmente transparente para seus usuários. Para isso, desenvolvi uma GitHub Action personalizada e um script PHP que trabalham juntos para gerenciar as atualizações de forma fácil e eficiente. É a mesma solução que uso para alguns dos meus próprios plugins, e agora estou compartilhando com a comunidade para que você também possa aproveitar.

Sem dependências extras, sem complicações – apenas GitHub e um pouco de mágica com PHP. Vamos começar!

O Que São Plugins Auto-Hospedados?

Antes de entrarmos nos detalhes, vamos entender: auto-hospedar plugins significa gerenciar o armazenamento e as atualizações de seus plugins de forma independente, fora do repositório WordPress.org. Isso permite que você controle onde seus plugins estão armazenados e como as atualizações são entregues, sem depender do repositório oficial do WordPress.

Em vez de hospedar o plugin no WordPress.org, você utiliza sua própria infraestrutura – como o GitHub, um servidor privado ou qualquer outro serviço de hospedagem de arquivos – para gerenciar o ciclo de vida do plugin.

Basicamente, auto-hospedar permite que os desenvolvedores criem, distribuam e atualizem plugins sob seus próprios termos, enquanto ainda fornecem aos usuários uma experiência de atualização familiar e fluida.

O Que É Necessário Para Auto-Hospedar Plugins no GitHub?

Agora que entendemos o conceito, vamos falar sobre o que é necessário e como o processo funciona. Em um nível geral, você precisará de:

1. Um Servidor (No Nosso Caso, GitHub)

Hospedar os detalhes do plugin: O servidor armazena metadados sobre o plugin, como versão mais recente, URL de download e outras informações necessárias.

Armazenar os arquivos de distribuição: Inclui o arquivo .zip do plugin, que será baixado durante o processo de atualização.

2. Um Script de Verificação de Atualizações no Plugin

Buscar dados do servidor: O script se comunica com o servidor (neste caso, o GitHub) para obter os detalhes mais recentes do plugin.

Comparar versões: Verifica se a versão instalada no site do usuário está desatualizada, comparando-a com a versão mais recente disponível no servidor.

Encaminhar atualizações: Se houver uma nova versão disponível, o script integra-se ao sistema de atualização padrão do WordPress, tornando o processo transparente para o usuário.

Com esses dois componentes trabalhando juntos, você pode oferecer uma experiência de atualização fluida e automatizada para seus plugins, mantendo total controle sobre o processo de distribuição.

O Lado do Servidor no GitHub

O objetivo aqui não é entrar em todos os detalhes técnicos da GitHub Action que desenvolvi, mas entender o fluxo geral do processo e por que ele é essencial para a solução. Fluxo Simplificado da GitHub Action:

1. Gerar Metadados JSON

A Action analisa o arquivo readme.txt e outros arquivos relevantes para criar um arquivo JSON contendo informações sobre o plugin, como versão, URL de download, descrição e muito mais. Esse JSON é essencial para que o script PHP no lado do plugin possa consultar o servidor e verificar atualizações.

2. Preparar o Pacote de Distribuição

A Action compila os arquivos do plugin em um pacote .zip pronto para distribuição. Durante esse processo, você pode definir regras específicas para excluir pastas ou arquivos desnecessários – como diretórios de desenvolvimento, casos de teste ou artefatos de build – garantindo que o pacote final seja limpo e otimizado.

3. Criar um Release

A Action automatiza a criação de um novo release no GitHub. Esse release serve como ponto de hospedagem para o arquivo .zip. Ele é marcado com a versão correspondente do plugin, garantindo que o WordPress e o script PHP possam buscar corretamente a versão mais recente.

O Lado do Plugin – Script de Verificação de Atualizações

Do lado do plugin, o script PHP atua como a “ponte” entre o plugin instalado no site WordPress e os metadados hospedados no GitHub.

1. Adicionar um Arquivo PHP Simples para Gerenciar Atualizações

O script de verificação de atualizações é integrado diretamente ao plugin. Ele monitora eventos de atualização do WordPress e utiliza filtros como plugins_api e site_transient_update_plugins para fornecer informações de atualização dinamicamente.

2. Buscar Dados JSON no GitHub

O script consulta o arquivo JSON hospedado no GitHub para obter informações atualizadas sobre o plugin, como versão, descrição, URL de download e outros detalhes importantes.

3. Comparar a Versão Atual com a Mais Recente

Após obter os dados do JSON, o script compara a versão instalada do plugin com a versão mais recente disponível nos metadados. Se forem iguais, nenhuma ação é tomada. Se houver uma versão mais recente, o script encaminha as informações de atualização ao sistema padrão do WordPress.

4. Seguir o Fluxo de Atualização Padrão do WordPress

Se uma nova versão estiver disponível, o WordPress assume o controle utilizando seu mecanismo padrão de atualização. Isso garante uma experiência fluida e familiar para os usuários.

É isso!

Se você tiver dúvidas, precisar de ajuda na implementação ou quiser compartilhar seu feedback, deixe um comentário! Vamos colaborar para melhorar esta solução juntos!

Repositório GitHub para a GitHub Action: wp-self-host-updater-generator

Action no Marketplace do Github: wp-self-host-updater-generator

Repositório GitHub para o Script PHP: wp-self-host-updater-checker

FAQ

1. Funciona com MU-Plugins?

Parcialmente! O lado “servidor” no GitHub funciona perfeitamente. No entanto, como MU-Plugins não seguem o mesmo fluxo de atualização de plugins regulares, o script PHP precisa de ajustes. Já estou trabalhando nisso!

2. Funciona com Temas?

Ainda não! Algumas modificações são necessárias para suportar temas, mas essa funcionalidade será adicionada em breve.

3. Posso validar licenças antes de entregar atualizações?

Este fluxo é projetado para plugins “gratuitos”, então validação de licença não é suportada no momento. Estou explorando formas de adicionar isso no futuro.

4. Funciona com repositórios privados?

Quase! A Action funciona perfeitamente, mas o script PHP precisa de ajustes para usar tokens de autenticação em repositórios privados.

O post Como Auto-Hospedar Plugins do WordPress no GitHub e Entregar Atualizações apareceu primeiro em Eduardo Villão - PT-BR.

No mundo atual, onde performance e experiência do usuário são prioridades, escolher a biblioteca certa é fundamental. Uma solução que minimize o tamanho do bundle e melhore a usabilidade em dispositivos móveis, enquanto oferece validações robustas, pode fazer uma enorme diferença no seu projeto.

Bibliotecas Populares e Suas Limitações

Se você já precisou de máscaras para formulários, provavelmente encontrou bibliotecas como Inputmask, Cleave.js e IMask.

Embora essas bibliotecas sejam excelentes, elas vêm com algumas desvantagens:

Inputmask

• Poderosa e flexível, mas aumenta significativamente o tamanho do bundle (~20 KB gzipado).
• Não possui recursos como o atributo inputmode para uma melhor experiência em dispositivos móveis.

Cleave.js

• Simples e com suporte a máscaras dinâmicas.
• No entanto, carece de validação embutida ou configurações automáticas como minlength e maxlength.

IMask

• Oferece ótimos recursos com um tamanho moderado (~5 KB gzipado).
• É poderosa, mas pode ser excessiva para casos de uso mais simples.

Embora essas ferramentas sejam sólidas, senti que havia espaço para uma solução mais leve, flexível e focada na usabilidade em dispositivos móveis.

Apresentando Masky.js

Foi por isso que criei o Masky.js: uma alternativa ultra-leve (apenas 1.3 KB gzipado) que prioriza a performance sem abrir mão da flexibilidade e dos recursos essenciais.

Super Leve:

• Com apenas 1.3 KB gzipado, é uma das soluções mais compactas do mercado.
• Ideal para projetos onde o tamanho do bundle é crítico.

Amigável para Mobile:

• Define automaticamente o atributo inputmode com base na máscara, garantindo uma melhor experiência de digitação em dispositivos móveis.

Totalmente Personalizável:

• Suporte a máscaras personalizadas com prefixos, sufixos e até máscaras reversas.

Validação Embutida:

• Suporte nativo para validação de CPF e CNPJ (documentos brasileiros).

Automação:

• Calcula e aplica automaticamente os atributos minlength e maxlength com base na máscara.

Sem Dependências:

• 100% Vanilla JS, fácil de integrar com qualquer ambiente ou framework.

Comparação

Recurso	Masky.js	Inputmask	Cleave.js	IMask
Tamanho (Gzipado)	1.3 KB	20 KB	8 KB	5 KB
Dependências	Nenhuma	Nenhuma	Nenhuma	Nenhuma
Máscaras Personalizáveis
Prefixos/Sufixos
Validação de CPF/CNPJ
inputmode para Mobile
Validação de Min/Max
Máscaras Reversas

Como Usar o Masky.js?

A simplicidade é fundamental. Basta adicionar o atributo data-mask, e o Masky.js cuida do resto — prefixos, sufixos, validações e até ajustes automáticos de inputmode e minlength.

<!-- Simple Phone Mask -->
<input type="text" data-mask="(00) 00000-0000" />

<!-- Add Prefix and Suffix -->
<input type="text" data-mask="000-000" data-mask-prefix="+55 " data-mask-suffix=" ext" />

<!-- Built-in CPF Validation -->
<input type="text" data-mask="000.000.000-00" data-mask-validation="cpf" />

<script src="https://cdn.jsdelivr.net/npm/masky-js/dist/masky.min.js"></script>

Confira mais detalhes de uso na documentação.

Experimente o Masky.js

Se você está procurando uma solução de máscaras rápida, flexível e focada na performance, experimente o Masky.js!

GitHub: Masky.js

npm: Masky.js

Adoraria ouvir seus comentários ou sugestões!

O post Masky.js: Uma Alternativa Leve ao Inputmask, Cleave.js e IMask apareceu primeiro em Eduardo Villão - PT-BR.