"일꾼이 일을 잘하려면 먼저 도구를 갈고 닦아야 한다." - 공자, 『논어』.
첫 장 > 프로그램 작성 > Python만 사용하여 프런트엔드 구축

Python만 사용하여 프런트엔드 구축

2024-11-05에 게시됨
검색:908

프런트엔드 개발은 백엔드에 초점을 맞춘 개발자에게 벅차고 심지어 악몽 같은 작업이 될 수 있습니다. 내 경력 초기에는 프런트엔드와 백엔드 사이의 경계가 모호했고 모두가 두 가지를 모두 처리해야 했습니다. 특히 CSS는 끊임없는 투쟁이었습니다. 불가능한 임무처럼 느껴졌습니다.

프론트엔드 작업을 좋아하지만 CSS는 나에게 여전히 복잡한 과제로 남아 있습니다. 특히 시행착오를 통해 배웠기 때문입니다. 블라인드를 열기 위해 고군분투하는 Peter Griffin의 밈은 CSS 학습 경험을 완벽하게 포착합니다.
Building a frontend using only Python

하지만 오늘은 모든 것이 변합니다. Streamlit과 같은 도구는 터미널의 검은색 화면의 편안함을 선호하는 저와 같은 개발자를 위한 게임에 혁명을 일으켰습니다. 외계인이 보낸 암호 메시지처럼 보이는 코드 줄과 씨름하던 시대는 지났습니다(CSS님, 보세요!).
Two Minute Papers의 Károly Zsolnai-Fehér 박사는 항상 이렇게 말합니다. "살아있기 좋은 때입니다!"
Streamlit을 사용하면 Python 코드만 사용하여 전체 웹 애플리케이션을 구축할 수 있습니다.
실제로 보고 싶으십니까? 버클을 채우세요. 이 멋진 도구를 사용하여 SQLZilla용 프런트엔드를 만드는 시도를 공유하려고 합니다.

설치하려면 터미널을 열고 다음 주문을 시전하세요.

pip install streamlit

(또는 요구사항.txt 파일에 추가할 수 있습니다.)

app.py라는 파일을 만들고 다음 코드 조각을 추가하여 "SQLZilla" 제목을 표시합니다.

import streamlit as st

st.title("SQLZilla")

쇼를 진행하세요!

터미널을 다시 열고 다음 명령을 입력하여 생성을 활성화하세요.

streamlit run app.py

짜잔! Streamlit 앱이 웹 브라우저에 나타나며 "SQLZilla"라는 제목이 자랑스럽게 표시됩니다.

이미지 방법을 사용하여 이미지를 추가하고 중앙 집중화하려면 3개의 열을 만들고 중앙에 추가합니다(부끄러운 일입니다)

   st.title("SQLZilla")

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

구성 및 쿼리 결과를 관리하려면 세션 상태를 사용할 수 있습니다. 구성 값을 저장하고 쿼리 결과를 저장하는 방법은 다음과 같습니다.

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

SQLZilla를 InterSystems IRIS 데이터베이스에 연결하려면 SQLAlchemy를 사용할 수 있습니다. 먼저 다음을 사용하여 SQLAlchemy를 설치합니다.

pip install sqlalchemy

그런 다음 app.py 파일에서 연결을 설정합니다.

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

데이터베이스에 연결하면 Pandas 및 Streamlit을 사용하여 쿼리 결과를 표시할 수 있습니다. Streamlit 앱에 DataFrame을 표시하는 방법의 예는 다음과 같습니다.

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

앱을 더욱 대화형으로 만들려면 쿼리가 변경될 때마다 st.rerun()을 사용하여 앱을 새로 고칠 수 있습니다.

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

사용할 수 있는 다양한 Streamlit 구성 요소를 찾을 수 있습니다. SQLZilla에는 streamlit-code-editor:
라는 ACE 코드 편집기 버전을 추가했습니다.

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']

SQLZilla 도우미는 Python으로 작성되었으므로 방금 클래스를 호출했습니다.

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

축하해요! 자신만의 SQLZilla를 구축하셨습니다. 계속해서 Streamlit을 탐색하고 더 많은 기능으로 앱을 강화하세요. 그리고 SQLZilla를 좋아하신다면 텍스트를 쿼리로 변환하는 이 놀라운 도우미에게 투표하세요!

릴리스 선언문 이 글은 https://dev.to/intersystems/building-a-frontend-using-only-python-2ndn?1에서 복제됩니다.1 침해 내용이 있는 경우, [email protected]으로 연락하여 삭제하시기 바랍니다.
최신 튜토리얼 더>

부인 성명: 제공된 모든 리소스는 부분적으로 인터넷에서 가져온 것입니다. 귀하의 저작권이나 기타 권리 및 이익이 침해된 경우 자세한 이유를 설명하고 저작권 또는 권리 및 이익에 대한 증거를 제공한 후 이메일([email protected])로 보내주십시오. 최대한 빨리 처리해 드리겠습니다.

Copyright© 2022 湘ICP备2022001581号-3