Plataforma web para conversão, organização e preparação de arquivos com foco em produtividade.
O projeto é frontend-only, com interface em React + Vite e processamento local no navegador.
Versão em inglês: README.en.md
- Workspace frontend:
frontend/ - Build estático para GitHub Pages:
docs/
- Idioma
- Visão geral
- Principais recursos
- Idiomas da interface
- Arquitetura
- Arquitetura em camadas
- Stack tecnológica
- Estrutura do repositório
- Pre-requisitos
- Instalação
- Variáveis de ambiente
- Execução local
- Build, preview e deploy
- Scanner (bridge local)
- Segurança e privacidade
- Limitações conhecidas
- Troubleshooting
- Scripts disponíveis
- Contribuição
- Roadmap
- Licença
- Documentação principal (PT-BR): README.md
- English version: README.en.md
O PDF XinoConvert consolida ferramentas de PDF, imagem, documentos, scanner e utilitários em uma única experiência.
Objetivos principais:
- reduzir fricção em tarefas recorrentes de manipulação de arquivos
- manter operações sensíveis no navegador (client-side)
- permitir publicação simples em ambiente estático (GitHub Pages)
- Imagem para PDF com upload múltiplo, organização de ordem e exportação única ou separada
- PDF para imagens (JPG/PNG) com pacote ZIP
- Compressão de PDF no navegador
- Juntar PDF
- Dividir PDF
- Rotacionar PDF por páginas
- Remover páginas
- Extrair páginas
- Conversão entre JPG, PNG, WEBP, BMP e GIF
- Suporte de entrada para HEIC/HEIF
- Processamento em lote com download final em ZIP
- Conversão para PDF de TXT, MD, RTF, DOCX, CSV, XLS e XLSX
- Fluxo de digitalização com preparação de páginas
- Integração com bridge local opcional
- Fluxo alternativo com provider mock para desenvolvimento
- Etapas de importação, preparação e saída em PDF
- Conversão entre MP3, WAV, OGG, FLAC, AAC, M4A, MP4 e OPUS
- Conversão em lote (limite atual de 10 arquivos)
- Geração de ZIP para múltiplos arquivos
- Detecção automática de tipo de arquivo com sugestão de ferramenta
- Interface responsiva (desktop e mobile)
- Sidebar flutuante no desktop
- Tema claro/escuro
- Feedback de progresso e estado
- Navegação por categorias de ferramenta
Idiomas disponíveis:
- Português (pt-BR)
- English (en)
- Español (es)
- Français (fr)
Implementação:
i18next+react-i18next- idioma persistido em
localStorage - bandeiras SVG em
frontend/public/assets/flags/
A aplicação é preparada para deploy estático em docs/.
- roteamento SPA com
HashRouter - assets versionados e otimizados pelo Vite
- processamento local no navegador para fluxos principais
- raiz controla scripts de build/preview/deploy
frontendconcentra o app Reactdocsconcentra artefatos para publicação
flowchart TB
subgraph L1[Camada 1 - Apresentação]
P1[Pages]
P2[Components]
P3[i18n]
P4[Hooks de UI]
end
subgraph L2[Camada 2 - Aplicação]
A1[Services]
A2[Utils]
A3[Validação de arquivos]
A4[Orquestração de fluxos]
end
subgraph L3[Camada 3 - Domínio de Conversão]
D1[PDF pipeline]
D2[Image pipeline]
D3[Document pipeline]
D4[Audio pipeline]
end
subgraph L4[Camada 4 - Infraestrutura]
I1[Browser APIs]
I2[Workers]
I3[Libraries externas]
I4[Static assets]
end
L1 --> L2
L2 --> L3
L3 --> L4
- React 18
- Vite
- Tailwind CSS
- React Router
- i18next + react-i18next
- dnd-kit
- pdf-lib
- pdfjs-dist
- jsPDF
- JSZip
- heic2any
- browser-image-compression
- ffmpeg.wasm (carregado em runtime)
- Mammoth
- xlsx
- Lucide React
.
├─ docs/
│ ├─ index.html
│ ├─ assets/
│ ├─ css/
│ └─ js/
├─ frontend/
│ ├─ public/
│ │ ├─ assets/
│ │ │ ├─ flags/
│ │ │ ├─ social/
│ │ │ └─ visuals/
│ │ └─ favicon_pdf.ico
│ ├─ src/
│ │ ├─ components/
│ │ ├─ hooks/
│ │ ├─ i18n/
│ │ ├─ pages/
│ │ ├─ scanner/
│ │ ├─ services/
│ │ └─ utils/
│ ├─ index.html
│ └─ vite.config.js
├─ scripts/
├─ package.json
├─ README.md
└─ README.en.md
- Node.js 20+
- npm 10+
Na raiz do projeto:
npm installEsse comando instala dependências da raiz e do workspace frontend.
Arquivo de exemplo: frontend/.env.example
VITE_SCANNER_PROVIDER=bridge
VITE_SCANNER_BRIDGE_URL=http://127.0.0.1:24833Notas:
VITE_SCANNER_PROVIDER=mockpermite testar fluxo de scanner sem hardware
Na raiz:
npm run devURL padrão: http://localhost:5173
Comando equivalente no workspace:
npm run dev -w frontendnpm run buildnpm run build:pagesO artefato final é gerado em docs/.
Durante o build, o script scripts/generate-route-entrypoints.mjs cria index.html
em rotas públicas (exemplo: docs/pdf-tools/index.html) para evitar 404 em acesso direto.
npm run preview:pagesWorkflows principais:
.github/workflows/validate-pr.yml.github/workflows/deploy-pages.yml
Fluxo esperado:
- Pull request para branch principal valida build
- Push na branch principal gera build e publica no GitHub Pages
URL publica:
Providers da camada de scanner:
frontend/src/scanner/providers/ScannerProvider.jsfrontend/src/scanner/providers/LocalBridgeScannerProvider.jsfrontend/src/scanner/providers/MockScannerProvider.js
Endpoints esperados da bridge local:
GET /statusGET /devicesPOST /connectPOST /scanPOST /cancel
Teste sem scanner físico:
- Defina
VITE_SCANNER_PROVIDER=mock - Rode
npm run dev - Acesse a página de escaneamento
- Os fluxos principais rodam client-side
- Arquivos não são enviados para backend do projeto
- Dependências de runtime (como FFmpeg via CDN) podem existir em algumas funcionalidades
Recomendação:
- Para ambientes corporativos restritivos, valide políticas de rede/CDN antes da adoção
- Alguns formatos de escritório (DOC, ODT, PPT, PPTX) podem ter fidelidade parcial em conversão puramente client-side
- Compressão de PDF por recomposição de páginas pode gerar perda visual em níveis agressivos
- Conversor de áudio depende de carregamento de FFmpeg em runtime
- Primeira carga de algumas ferramentas pode ser mais lenta por download inicial de assets
- Verifique se o arquivo termina com
.heicou.heif - Atualize para a versão mais recente do projeto (suporte por extensão e fallback de preview)
- Alguns navegadores não renderizam HEIC diretamente
- O projeto aplica fallback de decodificação para preview; se falhar, teste outro navegador Chromium atualizado
Use scripts auxiliares na raiz:
npm run kill:4173
npm run preview:pagesnpm run devinicia frontendnpm run buildbuild de produção do frontend e geração de entrypoints estáticosnpm run build:pagesalias para build de páginasnpm run preview:pagespreview do buildnpm run preview:pages:autopreview sem strictPortnpm run kill:portencerra processo por portanpm run kill:4173encerra porta 4173npm run qa:assetsgera assets de QAnpm run test:xlsx-pdfexecuta rotina de teste para fluxo de planilha->PDF
npm run dev -w frontendnpm run build -w frontendnpm run preview -w frontend
Sugestão de fluxo:
- Crie branch de feature
- Rode
npm install - Desenvolva e valide com
npm run dev - Gere build com
npm run build - Abra PR com descrição clara de impacto funcional
Boas práticas:
- manter mudancas focadas por PR
- evitar alterar artefatos
docs/quando o objetivo for apenas desenvolvimento local - incluir contexto funcional e teste manual no PR
- Persistência de histórico por usuário
- Fila assíncrona para arquivos grandes
- Melhor fidelidade para formatos de escritório complexos
- Pipeline opcional de processamento remoto
Este projeto está licenciado sob os termos do arquivo LICENSE.