wix app tutorial

Tutorial: Erstellen Sie Ihre erste WIX -Anwendung auf Ihrem Computer

In diesem Tutorial gehen wir durch, wie Sie eine WIX -Anwendung erstellen, die mit der WIX -Plattform interagiert, die Sie dem Wix App -Markt einreichen können, auf dem die Eigentümer von Wix -Website es auf ihren Websites bereitstellen können.

1. Richten Sie Ihre App in einem WIX -Entwicklerkonto ein

A. Melden Sie sich bei Wix -Entwicklern an (oder melden Sie sich an).

B. Klicken

Sie sollten diesen Bildschirm erhalten:

C. Gehen Sie zu Workspace> OAuth und kopieren Sie Ihre App ID und App Secret Key . Sie brauchen sie später.

2. Richten Sie die Anwendung auf, um eingehende HTTPS -Verbindungen zu empfangen

Da die meisten Entwicklermaschinen nicht für eingehende Verbindung geöffnet sind und keine HTTPS -Zertifikate haben, werden wir den Prozess mit NGROK beschreiben. (Wenn Sie Ihre Anwendung ohne diese Einschränkungen auf einem Server hosten, können Sie diesen Schritt überspringen.)

NGROK installieren und ausführen

HINWEIS: Starten Sie einen HTTP -Tunnel am Port Ihrer App. Hören Sie sich an (Standard ist 3000). Sie sollten so etwas wie folgt erhalten:

Schließen Sie den NGROK -Prozess nicht - Sie benötigen ihn für den gesamten Prozess.

3. Richten Sie Ihre Anwendungs ​​-URLs ein

https://<12345678>.ngrok.io/signup Gehen https://<12345678>.ngrok.io/login App URL Arbeitsbereich> OAuth B. In Redirect URL ENTER:
Denken Sie daran, "12345678" durch ** Ihre NGROK -Zeichenfolge zu ersetzen, die Sie oben erhalten haben. Zum Beispiel:

D. Klicken Sie auf Speichern.

4. Registrieren Sie Ihre Bewerbung, um Ihr erstes Webhook zu erhalten

A. Gehen Sie zu Workspace> Webhooks und fügen Sie einen neuen Webhook hinzu.

B. Wählen Sie die Kategorie Wix_Developers und das Ereignis app_provisioned_webhook aus.

C. Richten Sie die Webhook Callback-URL auf https: // <12345678> .ngrok.io/webhook-callback ein.

Denken Sie daran, "12345678" durch ** Ihre NGROK -Zeichenfolge zu ersetzen, die Sie oben erhalten haben.

D. Klicken Sie auf Speichern. Jetzt sollten Sie Ihren öffentlichen Schlüssel am unteren Bildschirmrand sehen. Kopieren Sie Ihren Public key . Sie werden es später brauchen.

5. Erstellen und führen Sie Ihre App aus

A. NPM herunterladen und installieren

B. Klonen Sie die Wix -Probenanwendung auf Ihre Maschine

C. In der Datei config.js (im src -Ordner) :

• Suchen und ersetzen Sie die App_ID durch den Wert, den Sie von Wix -Entwicklern kopiert haben:
• Finden und ersetzen Sie den Public_key durch den Wert, den Sie von Wix -Entwicklern kopiert haben:

D. In der Datei cmmutiningInicals.js (im src -Ordner) finden und ersetzen Sie den app_secret durch den Wert, den Sie von Wix -Entwicklern kopiert haben:

E. Führen Sie Ihre App aus

• Durchsuchen Sie die geklonte Probenanwendung
• Führen Sie npm install aus
• Führen Sie npm build
• Führen Sie npm start

Sie sollten so etwas bekommen:

Gut gemacht! Jetzt ist es Zeit, sicherzustellen, dass Ihre App wie erwartet funktioniert.

6. Testen Sie Ihre App

A. Klicken Sie auf Test Your App

B. Wählen Sie eine Site aus und klicken Sie auf Test Your App

C. Wenn Sie aufgefordert werden, klicken Sie Add To Site :

D. Geben Sie der App ein, Daten zu erfassen, indem Sie auf Allow and Install erfassen:

E. Sie sollten mit Ihrer Anwendungs ​​-ID und Ihrer Site -Instanz -ID einen Druck in den Browser erhalten:

Herzlichen Glückwunsch, du bist fertig!

Jetzt können Sie Ihre Anwendungslogik und andere WIX -APIs hinzufügen.