Bubble.io Tutorial (Pro Plan) - Algolia Search integrieren [Deutsch]

Schritt-für-Schritt Integration der Algolia Suchmaschine in Bubble.io - Professional Plan Feature

Chris Strobl
Chris Strobl

In diesem Video lernst du, wie du die professionelle Suchmaschine Algolia (https://algolia.com/doc) in Bubble native integrieren kannst.

Deutsche Bubble Tutorials - Algolio Search Engine integrieren

💵 Dieses Feature ist nur im Pro Plan ($129/Monat verfügbar).

📜 Dokumentation von Bubble mit weiteren Infos und Limitierungen der nativen Bubble Integration: https://manual.bubble.io/help-guides/working-with-data/using-algolia


Video Transkript

Hallo, mein Name ist Chris Strobl und ich zeige euch heute, wie wir Algolia in eure Bubble App integrieren können. Wir hatten ja bereits das Video mit der Fuzzy Search von der Bubble Input Search, was ich euch oben hier verlinkt habe. Aber wenn ihr wirklich eine mächtige Suchmaschine wollt, die ganz unterschiedliche Personalisierung kann oder die ein dynamisches Ranking macht und vor allem auch langfristig verschiedene AI und KI Produkte integriert, dann müsst ihr eigentlich zu Algolia gehen.

Und ich zeige euch heute, wie wir das Ganze in Bubble integrieren können. Legen wir direkt mal los, indem wir in die Settings gehen. Wichtig ist, dieses Feature gibt es nicht kostenlos. Das heißt, die native Bubble Integration ist nur im Professional und Agency Plan möglich, d. h. ihr müsst 129 Dollar pro Monat bezahlen. Aber wenn ihr eine Algolia Suchmaschine braucht, also eine wirklich mächtige Suche für eure Daten, finde ich das einen sehr fairen Preis, vor allem, weil das manuell zu integrieren ein erheblicher Aufwand ist. Ihr geht auf General. Und wir sehen bei General services API Keys. Enable Searching with Algolia.

Wenn ihr hier draufklickt, seht ihr brauchen drei Keys. Dafür logge ich mich ein in Algolia. Und gehe hier auf API Keys. Algolia ist zunächst mal kostenlos und ihr hab ein 14 Days free trial. Wenn ihr aber in die Skalierung geht, ist das eine Software as a Service Plattform, die quasi mit euch mitwächst, und mit eurem Nutzer mitwächst. Wir kopieren die API Keys. Es sind genau drei Stück. Und ihr seht jetzt, dass unsere Keys akzeptiert werden.

Und als nächstes zeige ich euch in der Datenbank, was ich bereits angelegt habe. Ich habe hier einen Tab, der heißt Answers und Answers hat quasi Transcripts und diese Transkripte möchte ich durchsuchen lassen.

Das heißt, ich gehe auf Privacy. Und sehe nun neben Answers und ich kann das für jeden Tab machen und Bubble weist explizit darauf hin, dass man die User z.B. gerade die privaten Informationen nicht über Algolia indexieren sollte. Das heißt, man sollte eigentlich nur Daten nehmen, die auch wirklich public sind, die indexierbar sind, die durchsuchbar sind. Es wäre sehr falsch, die Telefonnummern der Nutzer durch Algolia dadurch zu suchen.

Das heißt, man sollte hier unbedingt auf die Privacy Rules aufpassen und deswegen ist Aloglia ja auch unter Privacy gelistet. Wenn wir jetzt diese Daten in Aloglia haben wollen, dann müssen wir hier auswählen die Checkbox, dass dieser Data type Answers auch indexiert wird. Und ihr seht auch in den Permission ist wichtig, dass diese gesucht werden können. Wir gehen jetzt auf Trigger Algolia re-index. Refresh Test Index. Und Start re-indexing.

Ihr seht wir haben den Success. Und auch, was alles quasi von Algolia indexiert wird. Wenn wir jetzt in Algolia gehen und auf Indexes. Seht ihr, wie wir unsere verschiedenen Daten aus der Datenbank jetzt auch in Algolia haben. Das heißt, hier haben wir unsere Daten. Und diese sind nun auch in Algolia durchsuchbar. Als nächstes legen wir nun im Design Tab die unterschiedlichen Parameter fest, um das auch zu durchsuchen. Und genau hier ist auch die Integration so wertvoll. Anstatt das nämlich alles manuell über den API Connector zu machen, haben wir es quasi out of the box: die ganze Kette von Daten indexieren, über Daten wieder abgreifen und in der App darstellen.

Wir erstellen ein Input Field. Darunter eine Repeating Group. Type of content. Answers. Data source macht ihr nun "Algolia Search for". Ihr seht, neben der Do a search for, die wir traditionell nutzen, haben wir jetzt "Algolia Search for" und können hier auswählen Answers. Wir können nun entweder Any field machen, d. h. er durchsucht alles oder nur das Transkript und für den Query machen wir insert Dynamic data und nehmen das Input Field Input Suchen's value. Als nächstes legen wir noch kurz, um das zu finden in der Repeating Group Current cell's Answers' video ID. Und Current cell's Answer transcript. Ich truncate  das kurz zu 300 Zeichen, dass es nicht zu groß wird.

Und wir gehen jetzt einmal auf Preview. Aktuell haben wir alles. Und wenn wir jetzt ein Keyboard eingeben, sehen wir, wir haben neue Wörter und weniger Wörter. Wenn ihr zum Beispiel die Suchergebnisse wollt, dann... Wenn wir es einmal hier runter fügen und eingeben wir wollen Repeating Group's Answers List of Answers Count und fügen dahinter noch Antworten. Preview.

Wir haben jetzt 16 Antworten. Wir geben ein Pop up. Dann haben wir noch zwei Antworten. Und wenn wir noch weitergehen, haben wir 0 Antworten und so seht ihr das Algolia das ganze durchsucht. Wenn ihr das jetzt sortieren wollt, dann ist die Sortierung der Gruppe eben genau über den Algolia Algorithmus. Hierfür geht ihr in Aloglia selbst und ihr könnt hier im Dashboard quasi festlegen, wie genau die Konfiguration der Search API ist. Also wie wird das hier geordnet? Wie ist das Ranking? Wie ist das Sourcing? Das ist natürlich ein ganz anderes Thema.

Da müsst ihr euch mit der Algolia Dokumentation auseinandersetzen. Hierfür gibt's natürlich super Tutorials auf Algolia selbst. Wo euch Bubble eben helfen kann, ist vor allem diese Data Pipeline aus. Ich habe eine Datenbank über die Privacy Rules triggered ich den Algolia  Index und dann kann ich diesen wiederum abgreifen, um dann sehr gute Results und Ergebnisse zu bekommen.

Wenn euch dies Video gefallen habt, klickt auf den Like-Button und Subscribe unseren Channel. Das hilft uns, dass wir mehr Reichweite bekommen und dadurch lohnt es sich dann auch weiterhin noch mehr Content kostenlos anzubieten. Ich wünsche euch weiterhin viel Erfolg und auf bald.

Professional PlanFeatures