Python ist eine der gängigen Programmiersprachen zur Automatisierung von SEO-Prozessen.
Eine der großartigsten Bibliotheken zum Erstellen eines Front-Ends für unsere Apps ohne HTML-, CSS-Kenntnisse oder Codierung mit einem JavaScript-basierten Framework ist das Streamlit-Paket.
In diesem Streamlit In diesem Tutorial werden wir eintauchen, wie Sie mit Python und dem Dockerfile eine schöne App erstellen können, um Ihre Streamlit-App bereitzustellen.
Contents
Was ist Streamlit?
Streamlit ist ein Open-Source-App-Framework (ein Python-Paket), das uns die Möglichkeit gibt, gut aussehende Apps ohne Front-End-Entwicklungskenntnisse zu erstellen.
Dadurch sind wir von jeglicher Beteiligung befreit Front-End-Framework oder Codierung in HTML, CSS und JavaScript.
Sie verwenden reines Python, um Ihr Front-End zu entwickeln.
Wann wird die Streamlit-Bibliothek nützlich?
Zunächst einmal, wenn Sie Python-Skripte programmieren, die regelmäßig auf einem Computer mit einem Job-Scheduler wie Cron ausgeführt werden, ist Streamlit für Sie nicht nützlich.
Aber wenn Sie ein Tool entwickeln, das Sie teilen möchten mit Ihren Teammitgliedern, beispielsweise einer Keyword-Recherche-App, können Sie Streamlit verwenden.
Wenn Sie außerdem eine Benutzerauthentifizierungsmethode benötigen, hat die Streamlit-Community ein Paket entwickelt, das dies für Sie handhaben kann.
Erstellen einer Streamlit-App: Erste Schritte
Lassen Sie uns eine einfache App erstellen, die automatisch vervollständigte Abfragen für ein Seed-Keyword von der öffentlichen Google-API erhält.
Bevor Sie beginnen, erstellen Sie einen Ordner auf Ihrem Computer und benennen Sie ihn wie Sie wollen.
Außerdem gehe ich davon aus, dass Sie Python schon einmal installiert haben und die Grundlagen der Python-Programmierung kennen.
Für Während des gesamten Prozesses müssen wir diese Python-Bibliotheken verwenden:
- Requests.
- Streamlit.
- Streamlit-Authenticator.
- PyYAML.
Außerdem werden wir eine Python-Standardbibliothek importieren:
- JSON.
Der Tutorial-Code ist in meinem Streamlit-Starter-Template zu finden Repository auf Github.
Installieren des Streamlit-Pakets
Zunächst ziehe ich es vor, eine virtuelle Umgebung zu erstellen, indem ich python3 -m venv .env ausführe und dann das Streamlit-Paket durch Ausführen installiere pip3 install streamlit.
Erstellen Sie nun ein Python-Skript. Nennen wir es streamlit_app.py.
In komplexen Projekten mit zu vielen Funktionen bevorzuge ich separate Python-Skriptdateien für meine verschiedenen Funktionen und importiere diese dann in streamlit_app.py oder erstelle eine separate App mit Flask oder FastAPI.
Zum Beispiel: In einer Keyword-Recherche-App habe ich ein Python-Skript für verschiedene Funktionen, die Daten von Semrush abrufen, ein Skript zum Abrufen der Top-10- oder 20-Ergebnisse von Google, ein Skript zum Abrufen der Google-Autovervollständigung und von Google-bezogenen Suchanfragen usw.
Holen Sie sich die Google Autocomplete-Abfragen
Um Anfragen zu stellen, müssen wir das Requests-Paket verwenden. Um dieses Paket zu erhalten, müssen Sie pip3-Installationsanforderungen ausführen.
Außerdem müssen wir zum Analysieren der Autocomplete-API-Antwort die Python-Standard-JSON-Bibliothek importieren.
Zunächst einmal, Wir importieren die JSON-Standardbibliothek, das Requests-Paket zum Erstellen von Anfragen und Streamlit zum Erstellen unserer App.
Dann habe ich eine Funktion zum Abrufen der Google-Abfragen zur automatischen Vervollständigung als Liste von Zeichenfolgen definiert.
Ich habe die Ersetzungsfunktion zweimal verwendet, um alles einfach zu halten, aber Sie können die Re-Bibliothek für die Verwendung von Regex verwenden.
„““Eine Streamlit-App zum Abrufen der Google-Abfragen zur automatischen Vervollständigung „““ importiere JSON-Importanfragen import streamlit as st def google_autocomplete(keyword: str) -> list[str]: „““Automatische Google-Abfragen für ein Seed-Keyword erhalten Args: keyword (str): Das Seed-Keyword Rückgabewerte: list[str]: Eine Liste der Autocomplete-Abfragen „““ google_autocomplete_api: str = „https://www.google.com/complete/search“ google_autocomplete_params: dict = { „q“: Schlüsselwort, „cp“: 8, „client“: „gws-wiz“, „xssi“: „t“, „hl“: „en-US“ } Antwort = Anfragen.get(google_autocomplete_api, params=google_autocomplete_params) list_google_autocomplete_uncleaned: list[list] = json.loads((response.content).decode(„UTF-8“)[5:])[0 ] list_google_autocomplete_cleaned: list[str] = [ element[0].replace('<b>', '').replace('</b>', '') für Element in list_google_autocomplete_uncleaned ] return list_google_autocomplete_cleaned
Die Streamlit-App
Bis jetzt haben wir das Streamlit-Paket installiert und unsere Funktion definiert, um die Google-Autocomplete-Abfragen zu erhalten. Lassen Sie uns nun die eigentliche App erstellen.
Um die Streamlit-App anzuzeigen, müssen wir Streamlit mit dem Befehl run streamlit_app.py im Terminal ausführen, um unsere App lokal auszuführen. Nachdem Sie diesen Befehl ausgeführt haben, können Sie die App anzeigen, indem Sie zur URL http://localhost:8501/gehen.
Ja, sie ist leer, weil wir keine Überschrift usw. hinzugefügt haben. , dazu.
Screenshot des Autors, Oktober 2022
Hinzufügen einer Überschrift zur Streamlit-App
Lassen Sie uns eine Überschrift zu unserer App hinzufügen. Wie Sie oben sehen, habe ich das Streamlit als st importiert.
Jetzt können wir durch Aufrufen der Funktion st.title() der Seite eine Überschrift mit einem Titelstil hinzufügen. Sagen wir st.title(“Dies ist eine SEO-App der nächsten Generation“).
Denken Sie daran, dass nach dem Bearbeiten und Speichern Ihrer streamlit_app.py-Datei oben rechts auf der Seite ein Symbol angezeigt wird und Sie auf Immer zurück klicken müssen, um die App-Änderungen ohne Seitenaktualisierung anzuzeigen.
Screenshot vom Autor, Oktober 2022
Jetzt sieht unsere App wie im Bild unten aus. Wenn Ihr Systemdesign dunkel ist, hat Ihre App ein dunkles Design.
Screenshot des Autors, Oktober 2022
Text zur Streamlit-App hinzufügen
Um der App einen Textabsatz hinzuzufügen, müssen Sie die Funktion st.write() verwenden. Beispiel: st.write(“Make your ideas real”).
Screenshot vom Autor, Oktober 2022
Hinzufügen einer Texteingabe zur Streamlit-App
Wie Sie in der automatischen Vervollständigungsfunktion von Google gesehen haben, gab es ein Argument namens “Schlüsselwort”.
Dieses Argument muss aus der Benutzereingabe stammen.
Um die Benutzereingabe zu erhalten, können wir Verwenden Sie ein Texteingabefeld in Streamlit. Mit st.text_input() können wir eine Texteingabe hinzufügen. Beispiel: st.text_input(“Was ist Ihr Seed-Keyword?“).
Außerdem müssen wir es einer Variablen zuweisen, um es später zur Übergabe an unsere Funktion zu verwenden.
input_google_autocomplete_keyword: str = st.text_input( „Was ist Ihr Seed-Keyword?“)
Jetzt wollen wir unsere App ausführen, wenn es ein Eingabe-Keyword gibt. Hier verwenden wir eine if-Anweisung, um zu prüfen, ob die Variable leer ist oder nicht.
if input_google_autocomplete_keyword: output_list_google_autocomplete: list[str] = google_autocomplete( input_google_autocomplete_keyword)
Screenshot des Autors, Oktober 2022
Von der Streamlit-App herunterladen
Also haben wir eine Überschrift, eine Textzeile und ein Eingabetextfeld hinzugefügt, um das Seed-Schlüsselwort des Benutzers zu erhalten.
Nun müssen wir unser Geschriebenes ausführen Funktion und erstellen Sie eine Download-Schaltfläche für den Benutzer, um die Ergebnisse in einer Textdatei zu erhalten.
if output_list_google_autocomplete: st.download_button(„Download the output“, („n“).join(output_list_google_autocomplete))
Screenshot vom Autor, Oktober 2022
Wir haben unsere einfache App erstellt! Lassen Sie uns den Titel und das Favicon der App ändern.
Sehen Sie sich vorher den Abschnittscode der Streamlit-App bis jetzt an.
Screenshot vom Autor, Oktober 2022
App-Titel ändern Und Favicon
Der Standardtitel der App lautet streamlit_app · Streamlit, und das Favicon der App ist das Streamlit-Symbol.
Um den Titel und das Favicon zu ändern, müssen wir st.set_page_config() verwenden.
Außerdem bevorzuge ich die App Layout breit sein (Sie können es testen).
st.set_page_config( page_title=“Oh My App!“, page_icon=“😎“, layout=“wide“ )
Screenshot vom Autor, Oktober 2022 <
Festlegen des Standarddesigns der App
Das App-Design basiert auf den Systemeinstellungen des Benutzers, aber ich persönlich finde meistens heraus, dass das helle Design einen besseren Kontrast hat – und ich möchte nicht, dass mein Team seine Zeit darauf verwendet, herauszufinden, wie das App-Design geändert werden kann.
Um ein Standarddesign für die Streamlit-App festzulegen, müssen Sie zuerst einen Ordner erstellen und ihm einen Namen geben .strombeleuchtet. Erstellen Sie in diesem Ordner eine Datei und nennen Sie sie config.toml.
Innerhalb der config.toml müssen Sie die folgenden Zeilen einfügen, um das Standarddesign Ihrer App festzulegen.
[theme] base = „light“
Screenshot vom Autor, Oktober 2022
Benutzer in Streamlit authentifizieren
Stellen Sie sich vor, dass nach der Bereitstellung Ihrer App jemand die App-URL herausfindet und darauf zugreift.
Um Ihre App zu schützen, müssen Sie die Benutzer autorisieren, bevor sie die App verwenden können – wie die meisten SASSs, die wir jeden Tag verwenden.
Für eine Streamlit-App können wir das Streamlit-Authenticator-Paket verwenden. Um es zu installieren, geben Sie im Terminal, das sich in Ihrem App-Ordner befindet, den Befehl pip3 install streamlit-authenticator ein und importieren Sie das Paket in Ihre App.
Ich empfehle Ihnen, die Dokumentation des Streamlit-Authenticator-Pakets zu lesen, um besser zu werden verstehen, was vor sich geht.
streamlit_authenticator als stauth importieren
Erstellen Sie jetzt eine config.yaml-Datei zum Einfügen unserer Benutzer’ Anmeldeinformationen.
Anmeldeinformationen: Benutzernamen: firstUser: email: [email protected] name: Der erste Benutzername password: 12345 # Muss durch das gehashte Passwort ersetzt werden secondUser: email: [email protected] name: Der zweite Benutzername password: 111213 # Muss ersetzt werden mit dem gehashten Passwort-Cookie: Ablauftage: 30 Schlüssel: irgendein_Signaturschlüssel Name: irgendein_Cookie-Name vorautorisiert: E-Mails: – [email protected]
Wie Sie im Paketdokument sehen können, müssen wir jetzt die Passwörter mit den Hasher-Modulen hashen. Ich öffne lieber ein IPython und führe die folgende Codezeile aus.
hashed_passwords = stauth.Hasher([‘12345’, ‘111213’]).generate()
Creating Ein Anmelde-Widget
Jetzt müssen wir ein Anmelde-Widget erstellen, in dem Benutzer ihren Benutzernamen und ihr Passwort eingeben und sich dann bei der App anmelden können.
Zuerst müssen Sie das PyYAML-Paket installieren den Befehl pip3 install pyyaml und importieren Sie es mit import yaml.
Erstellen Sie dann ein Authenticator-Objekt und rendern Sie das Anmeldemodul.
mit open(./config.yaml“) als Datei: config = yaml.load(file, Loader=yaml.SafeLoader) authenticator = stauth.Authenticate( config[„credentials“], config[„cookie“][„name „], config[„cookie“][„key“], config[„cookie“][„expiry_days“], config[„preauthorized“] ) name, authentication_status, username = authenticator.login(„Login“, „main „)
Screenshot von Autor, Oktober 2022
Erfolgreich angemeldeten Benutzern die App anzeigen
Jetzt können wir die Variable authentication_status verwenden, um die App für unsere erfolgreich angemeldeten Benutzer anzuzeigen.
if authentication_status: authenticator.logout('Logout', ' main') # UNSER APP-CODE KOMMT HIER elif authentication_status == False: st.error('Benutzername/Passwort ist falsch') elif authentication_status == None: st.warning('Bitte geben Sie Ihren Benutzernamen und Ihr Passwort ein')
Bereitstellen Die Streamlit-App mit Docker
Jetzt befinden wir uns im letzten Schritt der Entwicklung unserer App.
Sie können verschiedene Dienste für die Bereitstellung Ihrer App nutzen, wie AWS, Google Cloud, Azure, Heroku, DigitalOcean usw.
Lassen Sie uns vor dem Dockerfile die Datei requirements.txt erstellen. Dazu können wir pip3 freeze > requirements.txt-Befehl.
Streamlit Dockerfile
Für die Bereitstellung unserer App verwende ich Python 3.9.10.
FROM python:3.9.10 WORKDIR /app COPY . . RUN pip3 install -r requirements.txt CMD [„streamlit“, „run“, „streamlit_app.py“] EXPOSE 8501
Abschluss
In diesem Tutorial haben wir gesehen, wie wir eine beeindruckende Benutzeroberfläche mit reinem Python erstellen und mit Docker bereitstellen können.
Weitere Informationen zu verschiedenen Streamlit-Widgets finden Sie unter deren gut dokumentierte API-Referenz.