Frontend-Entwicklung kann für Backend-orientierte Entwickler eine entmutigende, sogar alptraumhafte Aufgabe sein. Zu Beginn meiner Karriere waren die Grenzen zwischen Frontend und Backend verschwommen und von jedem wurde erwartet, dass er beides beherrscht. Insbesondere CSS war ein ständiger Kampf; es fühlte sich wie eine unmögliche Mission an.

Obwohl mir die Frontend-Arbeit Spaß macht, bleibt CSS für mich eine komplexe Herausforderung, insbesondere da ich es durch Ausprobieren gelernt habe. Das Meme von Peter Griffin, der darum kämpft, Jalousien zu öffnen, fängt meine Erfahrung beim Erlernen von CSS perfekt ein.

Aber heute ändert sich alles. Tools wie Streamlit haben das Spiel für Entwickler wie mich revolutioniert, die den Komfort eines schwarzen Bildschirms eines Terminals bevorzugen. Vorbei sind die Zeiten des Ringens mit Codezeilen, die wie kryptische Nachrichten von Außerirdischen aussehen (ich sehe dich an, CSS!).
Wie Doktor Károly Zsolnai-Fehér von Two Minute Papers immer sagt: „Was für eine Zeit, am Leben zu sein!“
Mit Streamlit können Sie eine komplette Webanwendung nur mit Python-Code erstellen.
Möchten Sie es in Aktion sehen? Schnall dich an, denn ich werde gleich meinen Versuch mit dir teilen, mit diesem tollen Tool das Frontend für SQLZilla zu erstellen.

Um es zu installieren, öffnen Sie einfach Ihr Terminal und wirken Sie diesen Zauber:

pip install streamlit

(Oder Sie können es Ihrer Datei „requirements.txt“ hinzufügen.)

Erstellen Sie eine Datei, app.py, und fügen Sie dieses Code-Snippet hinzu, um einen „SQLZilla“-Titel anzuzeigen:

import streamlit as st

st.title("SQLZilla")

Machen Sie die Show!

Öffnen Sie Ihr Terminal erneut und geben Sie diesen Befehl ein, um Ihre Kreation zu aktivieren:

streamlit run app.py

Voila! Ihre Streamlit-App sollte in Ihrem Webbrowser erscheinen und stolz den Titel „SQLZilla“ anzeigen.

Fügen Sie ein Bild mit der Bildmethode hinzu. Um es zu zentralisieren, erstelle ich einfach drei Spalten und füge sie in der Mitte hinzu (Schande über mich)

   st.title("SQLZilla")

   left_co, cent_co, last_co = st.columns(3)
   with cent_co:
       st.image("small_logo.png", use_column_width=True)

Um Konfigurationen und Abfrageergebnisse zu verwalten, können Sie den Sitzungsstatus verwenden. So können Sie Konfigurationswerte und Abfrageergebnisse speichern:

if 'hostname' not in st.session_state:
    st.session_state.hostname = 'sqlzilla-iris-1'
if 'user' not in st.session_state:
    st.session_state.user = '_system'
if 'pwd' not in st.session_state:
    st.session_state.pwd = 'SYS'
# Add other session states as needed

Um SQLZilla mit einer InterSystems IRIS-Datenbank zu verbinden, können Sie SQLAlchemy verwenden. Installieren Sie zunächst SQLAlchemy mit:

pip install sqlalchemy

Dann richten Sie die Verbindung in Ihrer app.py-Datei ein:

from sqlalchemy import create_engine
import pandas as pd

# Replace with your own connection details
engine = create_engine(f"iris://{user}:{password}@{host}:{port}/{namespace}")

def run_query(query):
    with engine.connect() as connection:
        result = pd.read_sql(query, connection)
        return result

Sobald Sie eine Verbindung zur Datenbank hergestellt haben, können Sie Pandas und Streamlit verwenden, um die Ergebnisse Ihrer Abfragen anzuzeigen. Hier ist ein Beispiel für die Anzeige eines DataFrames in Ihrer Streamlit-App:

if 'query' in st.session_state:
    query = st.session_state.query
    df = run_query(query)
    st.dataframe(df)

Um Ihre App interaktiver zu gestalten, können Sie st.rerun() verwenden, um die App zu aktualisieren, wenn sich die Abfrage ändert:

if 'query' in st.session_state and st.button('Run Query'):
    df = run_query(st.session_state.query)
    st.dataframe(df)
    st.rerun()

Sie können verschiedene Streamlit-Komponenten finden, die Sie verwenden können. In SQLZilla habe ich eine ACE-Code-Editor-Version namens streamlit-code-editor:
hinzugefügt.

from code_editor import code_editor

editor_dict = code_editor(st.session_state.code_text, lang="sql", height=[10, 100], shortcuts="vscode")

if len(editor_dict['text']) != 0:
    st.session_state.code_text = editor_dict['text']

Da der SQLZilla-Assistent in Python geschrieben ist, habe ich die Klasse einfach aufgerufen:

from sqlzilla import SQLZilla

def assistant_interaction(sqlzilla, prompt):
    response = sqlzilla.prompt(prompt)
    st.session_state.chat_history.append({"role": "user", "content": prompt})
    st.session_state.chat_history.append({"role": "assistant", "content": response})

    if "SELECT" in response.upper():
        st.session_state.query = response

    return response

Glückwunsch! Sie haben Ihre eigene SQLZilla erstellt. Entdecken Sie Streamlit weiter und erweitern Sie Ihre App mit weiteren Funktionen. Und wenn Ihnen SQLZilla gefällt, stimmen Sie für diesen unglaublichen Assistenten, der Text in Abfragen umwandelt!