Construisez avec audace. Publiez en toute sécurité.

Savoir ce que Studio possède

Portal Studio possède l’interface client : pages, emplacement des composants, jetons de marque, comportement réactif, navigation, pied de page, présentation d’identité, parcours et versions des tickets. Le Centre d’aide possède les langues, catégories, sections et contenu d’articles. Studio consomme ce contenu via un pont protégé; il ne crée jamais un deuxième magasin d’Articles.

Préparation complète avant de construire en profondeur

1. Ouvert Portal Studio → Démarrer → Préparation.
2. Confirmez l'adresse canonique du portail et ouvrez-la dans un onglet séparé.
3. Définissez le logo, l'icône du navigateur, l’icône tactile, l‘image sociale et la couleur du thème.
4. Confirmez les langues du Centre d’aide ; modifiez l’autorité de la langue dans le Centre d'aide, pas dans Studio.
5. Configurez la navigation et le pied de page global d'entreprise.
6. Choisissez un trajet de billet et configurez au moins un formulaire de demande.
7. Gardez au moins une méthode de connexion sécurisée active et vérifiez la découverte d’identité.
8. Exécutez Quality et établissez la poignée de main signée d'aperçu.
9. Créez la première version régie après que chaque élément de blocage est effacé.

Le pourcentage de préparation est calculé à partir des données d’espace de travail enregistrées et de l’état de prévisualisation.

Créer des pages et des sections réutilisables

1. Ouvert Construire → Pages Sélectionnez une page système protégée ou créez une page personnalisée.
2. Définissez l'itinéraire, le titre, le mode d'accès et la configuration locale. Les itinéraires système protégés ne peuvent pas être supprimés.
3. Ouvert Composants, filtrer par tâche ou maturité et placer un composant dans une fente compatible.
4. Utilisez l’inspecteur pour le contenu, l’apparence, la reliure, la visibilité et l’accessibilité.
5. Utilisez des modèles réutilisables pour les structures répétées; conservez les différences d'organisation ou de marque dans les variantes.
6. Enregistrez le brouillon et l'exercice de chargement, vide, erreur, invité et les états connectés dans l'aperçu.

Concevez une navigation et un pied de page pour chaque itinéraire

1. Ouvert Construire → Navigation & pied de page.
2. Créez des liens de bureau ordonnés et des groupes imbriqués ou méga-menu; confirmer le clavier et le comportement mobile.
3. Configurez le pied de page d'entreprise: marque, liens groupés, contact, social, confiance, newsletter, lien juridique, locale et statut.
4. Utilisez les conditions d'audience et de localisation uniquement lorsque cela est nécessaire; URLs, routes et ID ne sont jamais traduits.
5. Prévisualisez les personas publics, clients et organisationnels sur mobile, tablette et ordinateur.

Prévisualisez de vrais trajets, pas un seul écran heureux

1. Choisissez le support client, le ticket signé, les soins de facturation, l'organisation ou la transmission des connaissances.
2. Changez de personnage, d’organisation, de rôle et de langue du Centre d’aide.
3. Inspectez les points d'arrêt mobiles, grands mobiles et tablettes, ordinateurs portables, de bureau, larges et ultralarges.
4. Vérifiez les valeurs héritées, remplacées et réinitialisées; évitez la duplication inutile des points d'arrêt.
5. Exécutez les états clavier, RTL, mouvement réduit, chargement, vide, indisponible et autorisation.
6. Utilisez Test Lab pour l'accessibilité, la charge utile, le cheminement, les liaisons et les résultats du rendu avant révision.

Exploitez un centre d’aide de niveau Zendesk sans contenu en double

1. Créez des catégories, des sections, des articles, des traductions, des pièces jointes et des modèles dans Centre d'aide.
2. Activer les langues là-bas; les limaces localisées, la recherche, les flux, SEO et l'article chrome suivent la même autorité.
3. Dans Studio, placez la recherche de connaissances, les grilles de catégories/ressources, flux, accordéon de sujets, article, table des matières, commentaires, composants associés et précédents/suivi.
4. Configurez les flux en vedette, populaires et récents; utilisez des suggestions contextuelles dans les flux de tickets.
5. Prévisualisez les articles sans résultat, longs articles, pièces jointes, commentaires, surveillance/abonnement et remise de tickets.
6. Vérifiez la propreté des routes par langue, les balises canoniques et hreflang, les données structurées et l’invalidation du cache après publication.

Configurez la connexion en toute sécurité

1. Ouvert Identité & organisations → Identité et gardez au moins un chemin de connexion activé.
2. Choisissez la méthode par défaut, la stratégie d'enregistrement, la durée de session, l'application du domaine SSO et le comportement de découverte.
3. Ajoutez des fournisseurs avec des champs de routage visuel: type, domaines, priorité, présentation, état activé et vérifié. Les secrets restent dans le sous-système d'identité.
4. Pour SCIM, activez le provisioning, copiez le point de terminaison exact de l’espace de travail et faites pivoter le jeton.
5. Mapper les revendications et l’appartenance à une organisation, puis tester la création, la mise à jour, l’adhésion au groupe et la désactivation avec un client de test.
6. Prévisualisez les états invité, client, organisation déléguée et bloqué avant la publication.

Composez le parcours de support complet

1. Sélectionnez l'entrée de formulaire direct, assistant, recherche en premier, hub ou service-desk.
2. Créez un formulaire de demande nommé et versionné avec des sections et des étiquettes de champ accessibles.
3. Construire des conditions visuelles, le routage, les étapes SLA et d'approbation; avancé JSON est pour les modifications de développeur examinées uniquement.
4. Configurez les surfaces de liste, détail, fil, chronologie, pièce jointe, approbation, SLA et réponse.
5. Testez la recherche d'invités, les demandes de connexion, la visibilité de l'organisation, l'échec du téléchargement, la notification par e-mail et la déviation des connaissances.
6. Enregistrer un brouillon; publiez seulement après que l'adaptateur de route et le chemin de notification passent la vérification préalable.

Déplacement dans une version gouvernée

1. Exécutez la validation et le laboratoire de test. Corrigez les résultats de blocage; confirmez les avertissements autorisés avec contexte.
2. Les réviseurs commentent les chemins de page/nœud stable.
3. Les approbateurs inspectent les différences, prévisualisent les trajets, les modifications d'autorisation et les preuves.
4. Publiez ou planifiez via le programme d’exécution en arrière-plan. Quitter Studio n’annule pas une tâche durable.
5. Surveiller la progression, l'état et l'ID de corrélation. Arrêter/refaire uniquement à partir des contrôles de tâche.
6. Vérifiez les itinéraires critiques, l'identité, les tickets et les connaissances. Rétablissez une version antérieure immuable si nécessaire.

Migrer avec des preuves et un chemin de retour

1. Sélectionnez le modèle de fournisseur et créez un essai.
2. Examinez les paramètres découverts, les valeurs non mappées, le nombre de contenu et les captures de parité visuelle.
3. Complétez les mappages sécurisés et réexécutez la différence structurée.
4. Appliquez une ébauche, rapprochez les comptes et prévisualisez chaque voyage protégé.
5. Enregistrer l'acceptation autorisée; ne jamais écraser la version publiée actuelle lors de l'importation.
6. Publiez via la gouvernance et conservez le rapport de migration, l'ID de version et le point de restauration ensemble.

Prolongez les contrats, pas les modèles

Une extension sécurisée enregistre un type et un schéma de composant stable, déclare les permissions et les besoins en données, effectue le rendu via le compilateur canonique et fournit des Ne pas interroger des tables arbitraires, injecter l'éditeur JavaScript dans le portail public, créer un autre dépôt d'article ou contourner la porte de sortie.

Définir un package de composants

Fournissez les deux noms de propriété de compatibilité affichés, car l'inspection du paquet et la validation de sécurité effectuent des vérifications indépendantes.

{
  "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}
}

Forme de nœud

{
  "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"}
}

• Les ID restent stables lors des modifications et migrations.
• Les propriétés rejettent les champs non déclarés et HTML dangereux.
• Chaque vue liée aux données définit le chargement, vide, permission et erreur réessayable.
• Les composants de conteneur nomment leurs slots; les feuilles ne peuvent pas accepter d'enfants arbitraires.
• Marquez la maturité honnêtement: blocs planifiés, avertissements bêta, GA nécessite des preuves complètes.

Utilisez des DTO sécurisés par permission

1. Choisissez un ID existant en pointillés tel que tickets.mine, knowledge.featured ou customer.profile.
2. Lier uniquement les champs déclarés par son DTO versionné. Sources inconnues échouent avec data_source.unknown.
3. Passez le contexte du portail déjà autorisé ; n’acceptez jamais l’identité de l’espace de travail/du client d’une propriété non approuvée.
4. Les limites de liste sont serrées à.1–100. Normaliser la pagination, les valeurs locales et de recherche.
5. Si une nouvelle source est inévitable, ajoutez sa définition stable, son mappage sécurisé, ses permissions, son comportement vide et l'aperçu de la fixation.

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

Restez dans les limites de la confiance

{
  "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"}
  }
}

Inspectez, installez et mettez à niveau atomiquement

1. Mettre component.json À la racine du ZIP et garder chaque chemin relatif.
2. Exécutez d'abord l'inspection. L'installateur supprime les archives à 500 Entrées et 25 MB La validation de sécurité ajoute des limites indépendantes.
3. Vérifiez le SHA-256 attendu et la signature du paquet dans le processus de publication.
4. Installez dans un répertoire versionné. Ne jamais modifier une version installée en place.
5. Fournissez des migrations de propriétés pour casser les modifications de schéma et préserver les champs de compatibilité inconnus.
6. Ouvrez le composant dans un brouillon, exécutez chaque fixture d'état/viewport/personne et publiez via la gouvernance.
7. La fonction de rétablissement active la version immuable précédente du composant/document; conserver sa preuve de reproductibilité.

Prouver l'extension sur le même hachage de version

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

Les sources de portes sont nécessaires, mais pas suffisantes. Joignez les preuves de base de données/migration, visualisation du navigateur réel, fournisseur d'identité, isolation des autorisations, accessibilité, performances, file d'attente/cron, courrier électronique/pièces jointes, sauvegarde/restauration et déploiement au même hachage de version immuable.

• Unité: schéma, assainissement, forme DTO, conditions, migrations et défaillances typées.
• Contrat: chargement/vide/erreur/succès, maturité, slots, liaisons et parité à un rendu.
• Navigateur: clavier, mise au point, sémantique, RTL, zoom/reflow, mouvement réduit et tous les points d'arrêt.
• Sécurité: sondes cross-workspace, actions forgées, attaques de paquets, spoofing d'aperçu et fuite secrète.
• Opérations: progression durable, départ/retour, arrêt/réessai/reprise, rythme cardiaque du planificateur et retour en arrière.

Dépannage par état et ID de corrélation