Construa com coragem, publique com segurança.

Saiba o que o Studio possui.

Portal Studio possui a shell de cliente-face: páginas, colocação de componentes, tokens marca, comportamento responsivo, navegação, rodapé, apresentação de identidade, viagens de ticket e lançamentos.

Pronto para construir profundamente.

1. Abra. Portal Studio → Iniciar → Pronto.
2. Confirme o endereço canônico do Portal e abra em separado.
3. Defina o logotipo, ícone do navegador, ícone de toque, imagem social e cor do tema.
4. Confirme idiomas da Central de Ajuda, mude a autoridade do idioma na Central de Socorro, não no Studio.
5. Configurar navegação e o rodapé global da empresa.
6. Escolha uma viagem de ticket e configure pelo menos um formulário de solicitação.
7. Mantenha pelo menos um método de entrada seguro ativo e revise a identidade.
8. Corra qualidade e estabelecer o aperto de mão assinado prévia.
9. Crie a primeira liberação governada depois que cada item de bloqueio estiver limpo.

A porcentagem de prontidão é calculada a partir de dados salvos do espaço de trabalho e estado de visualização, selecionando um item rotas diretamente para o seu próprio painel.

Construir páginas e seções reutilizáveis

1. Abra. Construir → Páginas e selecione uma página protegida do sistema ou crie uma página personalizada.
2. Ajuste a rota, título, modo de acesso e comportamento local.
3. Abra. Componentes, filtrar por trabalho ou maturidade, e colocar um componente em uma fenda compatível.
4. Use o inspetor para conteúdo, aparência, ligação, visibilidade e acessibilidade.
5. Usar padrões reutilizáveis para estruturas repetidas, manter diferenças de organização ou marca em variantes.
6. Guarde o rascunho e exercício de carga, vazio, erro, convidado e assinado em estados pré-visualização.

Projete uma navegação e rodapé para cada rota.

1. Abra. Construir → Navegação e rodapé.
2. Criar links ordenados para desktop e grupos aninhados ou megamenu, confirmar teclado e comportamento móvel.
3. Configurar o rodapé da empresa: marca, links agrupados, contato, social, confiança, boletim informativo, links legais, local e status.
4. Use o público e as condições locais apenas quando necessário; URLs, rotas e identidades nunca são traduzidas.
5. Visualize as personalidades públicas, clientes e organizações em celulares, tablets e áreas de trabalho.

Visualize viagens reais, nenhuma tela feliz.

1. Escolha suporte, ingresso assinado, cobrança de serviços, organização ou transferência de conhecimento.
2. Troque personas, organização, papel e linguagem da Central de Ajuda.
3. Inspecionem celulares, grandes celulares, tablets, laptops, desktops, pontos de interrupção largos e ultra-largados.
4. Verifique os valores herdados, anulados e reset; evite a duplicação desnecessária de pontos de parada.
5. Executar teclado, RTL, redução de movimento, carregamento, vazio, indisponível e estados de permissão.
6. Use o laboratório de testes para acessibilidade, carga útil, rota, ligação e resultados antes da revisão.

Operar uma Central de Ajuda nível Zendesk sem conteúdo duplicado

1. Crie categorias, seções, artigos, traduções, anexos e modelos em Centro de Ajuda.
2. Habilite idiomas lá, lesmas localizadas, buscas, feeds, SEO e artigos cromo seguem a mesma autoridade.
3. No estúdio, coloquem a pesquisa de conhecimento, categorias/recursos, feeds, acordeão tópico, artigo, índice, feedback, componentes relacionados e anteriores/próximos.
4. Configure feeds, populares e recentes; use sugestões contextuais em fluxos de tickets.
5. Visualização sem resultados, artigos longos, anexos, feedback, relógio/assinatura e entrega de bilhetes.
6. Verifique rotas locais limpas, canônicas/hreflang, dados estruturados e invalidação de cache após a publicação.

Configure o sinal com segurança.

1. Abra. Identidade e organizações → Identidade e manter pelo menos um caminho de entrada ativado.
2. Escolha o método padrão, política de registro, duração da sessão, SSO_-domínio de execução e comportamento de descoberta.
3. Adicione provedores com campos de roteamento visual: tipo, domínios, prioridade, apresentação, estado habilitado e verificado.
4. Para SCIM_, habilitar o provisionamento, copiar o ponto final exato do espaço de trabalho e girar o símbolo.
5. Mapas de reivindicações e membros da organização, depois teste criar, atualizar, membro do grupo e desativação com um inquilino do teste.
6. Visitante de visualização, cliente, organização delegada e estados bloqueados antes da publicação.

Componha a jornada de suporte completa.

1. Selecione formulário direto, assistente, busca-primeiro, hub ou serviço de entrada.
2. Crie um formulário de pedido com seções e etiquetas acessíveis.
3. Construir condições visuais, roteamento,SLAe passos de aprovação; avançadoJSONÉ apenas para mudanças de desenvolvedor revisadas.
4. Configurar lista, detalhes, linha de linha do tempo, anexo, aprovação, SLA e superfícies de resposta.
5. Teste de busca, pedidos de inscrição, visibilidade da organização, falha no upload, notificação por e-mail e desvio do conhecimento.
6. Economize um rascunho, publique apenas após o adaptador de rota e a notificação do caminho.

Mova-se através de uma libertação governada

1. Corrija os resultados do bloqueio, reconheça avisos permitidos com contexto.
2. Notas de lançamento e requisição de revisão.
3. Aprovamos inspecionar as diferenças, viagens de visualização, mudanças de permissão e evidências.
4. Publicar ou agendar através do assistente de segundo plano, deixar o Studio não cancela um trabalho durável.
5. Assista progresso, saúde e identificação de correlação.
6. Verifique rotas críticas, identidade, ingressos e conhecimento... volte para uma liberação prévia imutável quando necessário.

Migrar com evidências e um caminho de volta

1. Selecione o plano do provedor e crie uma corrida seca.
2. Reveja configurações descobertas, valores não mapeados, contagem de conteúdo e captura visual de paridade.
3. Mapeamentos seguros completos e refazer o diff estruturado.
4. Aplicar a um rascunho, conciliar conta e visualizar cada jornada protegida.
5. Registro autorizado de aceitação, nunca sobrescreva a atual publicação durante a importação.
6. Publicar através da governança e manter o relatório de migração, liberar identificação e ponto de retorno juntos.

Estenda contratos, não modelos.

Uma extensão segura registra um tipo de componente estável e esquema, declara permissões e necessidades de dados, faz através do compilador canônico, e fornece dispositivos/testes determinísticos. JavaScript no portal público, criar outro repositório de artigos, ou contornar o portão de liberação.

Defina um pacote de componentes.

Use um nome minúsculo, ID e versão semântica... forneça os nomes das propriedades de compatibilidade mostrados porque inspeção de pacotes e validação de segurança realizam verificações independentes.

{
  "schema_version": 1,
  "id": "acme.support_health",
  "slug": "acme-support-health",
  "name": "Support health",
  "version": "1.0.0",
  "entry": "renderer.php",
  "renderer": "server",
  "server_renderer": "renderer.php",
  "public_renderer": "public.js",
  "schema": {
    "type": "object",
    "properties": {
      "heading": {"type": "string", "maxLength": 120},
      "showSla": {"type": "boolean", "default": true}
    },
    "additionalProperties": false
  },
  "permissions": ["tickets.read"],
  "data_scopes": ["tickets.mine"],
  "accessibility": {
    "landmark": "section",
    "nameFrom": "heading",
    "emptyState": true,
    "errorState": true
  },
  "performance": {"max_js_bytes": 12000, "max_css_bytes": 8000},
  "performance_budget": {"js": 12000, "css": 8000, "requests": 0}
}

Forma de nó

{
  "id": "node-support-health",
  "type": "custom.acme_support_health",
  "props": {"heading": "Support health", "showSla": true},
  "bindings": {"requests": {"source": "tickets.mine", "limit": 5}},
  "responsive": {"mobile": {"padding": "16px"}, "desktop": {"padding": "24px"}},
  "conditions": [{"field": "identity.signed_in", "operator": "equals", "value": true}],
  "a11y": {"label": "Support health"}
}

• As identidades permanecem estáveis em edições e migrações.
• Propriedades rejeitam campos não declarados e inseguros. HTML.
• Cada visualização de dados define carga, vazio, permissão e saída de erro retrátil.
• Componentes de container nomeiam seus caça-níqueis, folhas não podem aceitar crianças arbitrárias.
• Marcar maturidade honestamente: blocos planejados, alertas beta, GA requer evidência completa.

Use DTOs seguros de permissão.

1. Escolha uma identidade pontilhada existente, como tickets.mine, knowledge.featured Ou customer.profile.
2. Apenas os campos declarados pelo DTO. data_source.unknown.
3. Passe pelo contexto já autorizado do Portal, nunca aceite a identidade de um cliente/espaço de trabalho de uma propriedade não confiável.
4. Os limites da lista estão presos a1–100 Normalizar paginação, localização e valores de busca.
5. Se uma nova fonte é inevitável, adicione sua definição estável, mapeamento seguro, permissões, comportamento vazio e visualização juntos.

{
  "success": true,
  "source": "tickets.mine",
  "contract_version": 1,
  "items": [
    {"id": 42, "number": "REQ-42", "subject": "Example", "status": "open"}
  ]
}

Fique dentro dos limites da confiança.

{
  "success": false,
  "error": {
    "code": "studio.permission_denied",
    "message": "You do not have permission to publish the Portal.",
    "retryable": false,
    "correlation_id": "ps_…",
    "meta": {"capability": "publish"}
  }
}

Inspecione, instale e atualize atomicamente.

1. Coloque component.json na raiz ZIP e manter todos os caminhos relativos.
2. O instalador caps arquivos em 500 entradas e... 25 MB A validação de segurança adiciona limites independentes.
3. Verifique o esperado SHA-256 e assinatura do pacote no processo de liberação.
4. Instale em um diretório versionado, nunca mute uma versão instalada.
5. Fornecer migrações de propriedades para quebrar mudanças de esquema e preservar campos de compatibilidade desconhecidos.
6. Abra o componente em um rascunho, execute cada estado/viewport/persona e publique através da governança.
7. O retorno ativa o componente imutável anterior, a liberação do documento, e mantém sua evidência de reprodutibilidade.

Prove a extensão no mesmo haxixe de liberação.

php tools/portal_studio_certify.php --source-only --json
php tools/test_portal_studio_contract.php
php tools/test_portal_one_renderer.php
php tools/test_portal_studio_engineer.php
php tools/test_portal_component_contracts.php
php tools/test_portal_one_renderer.php
php tools/test_portal_shell_contract.php
php tools/test_portal_knowledge_contract.php
node node_modules/@playwright/test/cli.js test tests/e2e/portal-studio-shell-visual-contract.spec.js tests/e2e/portal-custom-code-runtime.spec.js

Portões de origem são necessários, não suficientes, anexem banco de dados/migração, visual de navegador real, provedor de identidade, isolamento de autorização, acessibilidade, desempenho, fila/crono, correio/anexamento, backup/restauração e implementação de evidências para o mesmo hash de liberação imutável.

• Unidade: esquema, higienização, DTO, condições, migrações e falhas digitadas.
• Contrato: carga/vazio/erro/sucesso, maturidade, fendas, ligações e paridade de um renderista.
• Navegador: teclado, foco, semântica, RTL, zoom/refluxo, movimento reduzido e cada ponto de interrupção.
• Segurança: sondas de espaço de trabalho, ações forjadas, ataques de pacotes, spoofing prévia e vazamento secreto.
• Operações: progresso duradouro, licença/retorno, parada/retentação, batimento cardíaco do programador e retorno.

Solução de problemas por estado e identificação de correlação