Benutzerdefinierter Komponentengenerator

Entwickeln Sie benutzerdefinierte Komponenten mit Next Experience UI Framework und Erweiterung der UI-Komponente.

Komponenten sind wiederverwendbare Bausteine, mit denen Sie eine benutzerdefinierte Benutzeroberfläche erstellen. Next Experience Design System enthält eine Reihe von anpassbaren Komponenten, die Sie in Ihre benutzerdefinierte Benutzeroberfläche ziehen können. Entwickeln Sie eigene Komponenten, wenn Sie das Gesuchte in der Bibliothek Next Experience Design System nicht finden können.

Um die Bibliothek Next Experience Design System anzuzeigen, rufen Sie auf ServiceNow® Developer Site.

Vorteile der Erstellung benutzerdefinierter Komponenten

Durch die Entwicklung benutzerdefinierter Komponenten können Sie:

• Personalisieren Sie eine Benutzeroberfläche entsprechend den Anforderungen Ihrer Mitarbeiter, Kunden und Unternehmen.
• Machen Sie Ihre Mitarbeiter effektiver und reduzieren Sie den Kontextwechsel durch schnellen Zugriff auf wichtige Daten und Informationen.
• Passen Sie die einzigartige Omni-Channel-Umgebung Ihres Unternehmens mithilfe von APIs an, um Ihre Daten zu konsolidieren.

Beispielsweise möchten Sie möglicherweise eine Komponente erstellen, die die einem SLA zugeordneten Fälle anzeigt oder die aktiven Chats in einer bestimmten Warteschlange nachverfolgt. Sie können Next Experience UI Framework und Erweiterung der UI-Komponente verwenden, um die benötigte Komponente zu entwickeln, und über die HTTP-Effekt-APIauf Daten von Ihrer Plattform zugreifen. Sie können Plattformdaten auch mit GraphQL abfragen, indem Sie ein benutzerdefiniertes Schema erstellen. Weitere Informationen finden Sie unter Geskriptetes GraphQL.

Was Sie wissen müssen, bevor Sie beginnen

Bevor Sie mit dem Entwerfen und Erstellen Ihrer Komponente beginnen, stellen Sie Folgendes sicher:

• Einige allgemeine Kenntnisse über Konzepte, Entwicklung und Design von Webkomponenten.
• JavaScript-Wissen zum Definieren des Komponentenverhaltens.
• Kenntnisse über Node Package Manager (npm).
• Die neueste Version von Node.js, die auf Ihrem lokalen Computer installiert ist. Weitere Informationen finden Sie unter Node.js.
• ServiceNow CLI ist auf Ihrem Computer installiert.

Next Experience UI Framework

Next Experience UI Framework ist ein JavaScript-Framework, mit dem Sie Ihre Apps erweitern und Webkomponenten erstellen können, die in Ihren Anwendungen wiederverwendet werden können. Mit Next Experience UI Framework können Sie:

• Erstellen Sie eine einzelne Komponente, die an mehreren Stellen in Ihren Anwendungen verwendet werden soll.
• Kapseln Sie den Umfang der Komponente, um Konflikte mit anderem Code zu vermeiden.
• Fügen Sie Ihrer Komponente Eigenschaften, Slots und Aktionen hinzu, damit Benutzer die Komponente jedes Mal anpassen können, wenn sie sie in einem Arbeitsbereichverwenden.

Weitere Informationen finden Sie unter ServiceNow® Developer Site.

Erweiterung der UI-Komponente und Entwicklungs-Flow

Erweiterung der UI-Komponente ist eine Erweiterung von ServiceNow CLI, mit der Sie benutzerdefinierte Komponenten mit Next Experience UI Frameworkentwickeln können. Mit Erweiterung der UI-Komponentekönnen Sie:

• Erstellen Sie die für die Entwicklung einer Komponente oder eines Projektgerüstserforderlichen Dateien.
• Starten Sie einen lokalen Entwicklungsserver, um Ihre Komponente zu testen.
• Erstellen Sie ein Komponentenprojekt, und stellen Sie es in einer ServiceNow -Instanz bereit.

Anwendungsbereich

Wenn Sie eine Next Experience UI Framework -Komponente bereitstellen, wird sie in einer bereichsbezogenen Anwendung in der Instanz bereitgestellt. Sie können einen Anwendungsbereich für die Komponente angeben, der als Namespace-Identifier verwendet werden soll. Verwenden Sie die Richtlinien für Namespace-Bezeichner für die Anwendungsentwicklung in der Instanz. Weitere Informationen finden Sie unter Anwendungsbereich.

Befolgen Sie beim Reservieren eines Anwendungsbereichs die folgenden Anforderungen:

• Maximum: 18 Zeichen.

• Fall: Schlangenfall.

• Format: x_customerprefix_componentname, wobei Folgendes gilt:
  • customerprefix ist der Wert in der Systemeigenschaft glide.appcreator.company.code in Ihrer Instanz.
  • componentname ist der Wert, der im Namensparameter der Komponente angegeben wurde, als Sie das Projekt erstellt haben.

Wenn Sie beim Erstellen Ihres Komponentenprojekts keinen Anwendungsbereich angeben, erstellt die Now CLI einen für Sie.

Alternativ können Sie dem Parameter scopeName in der Datei now-ui.json einen Wert hinzufügen. Weitere Informationen finden Sie unter Ändern Sie den Anwendungsbereich einer Komponente.

Referenzhandbuch

Das Now CLI-Referenzhandbuch finden Sie auf der Developer Site.

• Richten Sie Ihre -Umgebung ein
  Bereiten Sie Ihre lokale Umgebung vor, indem Sie die JavaScript-Laufzeitumgebung Node.js, Node Package Manager (npm) und Erweiterung der UI-Komponenteinstallieren. Mit diesen Tools können Sie Komponenten lokal entwickeln und erstellen und in Ihrer Instanz bereitstellen.
• Richten Sie Ihr -Projekt ein
  Erstellen Sie das Komponentenprojekt und den Satz von Dateien, die zum Entwickeln einer Komponente erforderlich sind. Sie können eine Verbindung zu Ihrer Instanz herstellen und einen Anwendungsbereich für Ihre Komponente erstellen, oder Sie können einen Bereich reservieren, um ihn später zu überprüfen.
• Verwenden Sie einen Proxy-Server mit Erweiterung der UI-Komponente
  Verwenden Sie einen Proxy-Server mit der Now CLI, um eine separate Datenquelle für Ihre Komponente zu definieren. Bei Verwendung eines Proxyservers leitet die Instanz Now CLI-Anforderungen an den Proxyserver weiter.
• Entwickeln Sie eine Komponente
  Fügen Sie Ihren Komponentencode hinzu, und testen Sie ihn mit einem lokalen Entwicklungsserver.
• Entwickeln Sie eine Komponente für Virtual Agent
  Erstellen Sie eine benutzerdefinierte Virtual Agent -Komponente, um Eingaben zu sammeln oder Informationen in der Virtual Agent -Client-Schnittstelle anzuzeigen.
• Fügen Sie eine Komponente zu hinzu Mitarbeiterbereich
  Verwenden Sie benutzerdefinierte Komponenten, um eine benutzerdefinierte Arbeitsbereich -Schnittstelle zu erstellen, die den spezifischen Anforderungen der Service Desk-Mitarbeiter Ihres Unternehmens entspricht.
• Stellen Sie eine Komponente in einer Instanz bereit
  Stellen Sie die Komponente bereit, die in Ihrer Instanz als Anwendungs-Plugin angezeigt werden soll.
• Ändern Sie den Anwendungsbereich einer Komponente
  Ändern Sie den Anwendungsbereich einer Komponente, wenn beim Bereitstellen Ihrer Komponente in einer Instanz Bereichsprobleme auftreten. Beispielsweise können Sie beim Erstellen einer Komponente im Offlinemodus einen Anwendungsbereich festgelegt haben, der bereits verwendet wird oder ungültig ist.