"Se um trabalhador quiser fazer bem o seu trabalho, ele deve primeiro afiar suas ferramentas." - Confúcio, "Os Analectos de Confúcio. Lu Linggong"
Primeira página > Programação > Construindo um frontend usando apenas Python

Construindo um frontend usando apenas Python

Publicado em 2024-11-05
Navegar:942

O desenvolvimento de front-end pode ser uma tarefa assustadora, até mesmo um pesadelo, para desenvolvedores focados em back-end. No início da minha carreira, os limites entre frontend e backend eram confusos e esperava-se que todos cuidassem de ambos. CSS, em particular, era uma luta constante; parecia uma missão impossível.

Embora eu goste do trabalho de frontend, CSS continua sendo um desafio complexo para mim, especialmente porque aprendi por tentativa e erro. O meme de Peter Griffin lutando para abrir as cortinas captura perfeitamente minha experiência de aprendizagem de CSS.
Building a frontend using only Python

Mas hoje tudo muda. Ferramentas como o Streamlit revolucionaram o jogo para desenvolvedores como eu, que preferem o conforto da tela preta de um terminal. Já se foram os dias de luta com linhas de código que pareciam mensagens enigmáticas de alienígenas (olhando para você, CSS!).
Como sempre diz o doutor Károly Zsolnai-Fehér do Two Minute Papers: "Que hora para estar vivo!"
Com Streamlit, você pode construir um aplicativo web inteiro usando apenas código Python.
Quer vê-lo em ação? Apertem os cintos, porque estou prestes a compartilhar minha tentativa de criar o frontend para SQLZilla usando esta ferramenta incrível.

Para instalá-lo, basta abrir seu terminal e lançar este feitiço:

pip install streamlit

(Ou você pode adicioná-lo ao seu arquivo requirements.txt.)

Crie um arquivo, app.py e adicione este trecho de código para exibir um título "SQLZilla":

import streamlit as st

st.title("SQLZilla")

Comande o show!

Abra seu terminal novamente e digite este comando para ativar sua criação:

streamlit run app.py

Voilá! Seu aplicativo Streamlit deve aparecer em seu navegador, exibindo orgulhosamente o título “SQLZilla”.

Adicione uma imagem usando o método de imagem, para centralizá-la basta criar 3 colunas e adicionar no centro (que vergonha)


st.title("SQLZilla") left_co, cent_co, last_co = st.columns(3) com cent_co: st.image("logotipo_pequeno.png", use_column_width=True)
   st.title("SQLZilla")

   left_co, cent_co, last_co = st.columns(3)
   with cent_co:
       st.image("small_logo.png", use_column_width=True)
Para gerenciar configurações e resultados de consultas, você pode usar o estado da sessão. Veja como você pode salvar valores de configuração e armazenar resultados de consulta:


se 'hostname' não estiver em st.session_state: st.session_state.hostname = 'sqlzilla-iris-1' se 'usuário' não estiver em st.session_state: st.session_state.user = '_system' se 'pwd' não estiver em st.session_state: st.session_state.pwd = 'SYS' # Adicione outros estados de sessão conforme necessário
   st.title("SQLZilla")

   left_co, cent_co, last_co = st.columns(3)
   with cent_co:
       st.image("small_logo.png", use_column_width=True)
Para conectar o SQLZilla a um banco de dados InterSystems IRIS, você pode usar SQLAlchemy. Primeiro, instale o SQLAlchemy com:


pip instalar sqlalchemy
   st.title("SQLZilla")

   left_co, cent_co, last_co = st.columns(3)
   with cent_co:
       st.image("small_logo.png", use_column_width=True)
Em seguida, configure a conexão em seu arquivo app.py:


do sqlalchemy importar create_engine importar pandas como pd # Substitua pelos seus próprios detalhes de conexão motor = create_engine(f"iris://{usuário}:{senha}@{host}:{porta}/{namespace}") def run_query(consulta): com engine.connect() como conexão: resultado = pd.read_sql(consulta, conexão) resultado de retorno
   st.title("SQLZilla")

   left_co, cent_co, last_co = st.columns(3)
   with cent_co:
       st.image("small_logo.png", use_column_width=True)
Depois de se conectar ao banco de dados, você pode usar Pandas e Streamlit para exibir os resultados de suas consultas. Aqui está um exemplo de como exibir um DataFrame em seu aplicativo Streamlit:


se 'consulta' em st.session_state: consulta = st.session_state.query df = run_query(consulta) st.dataframe(df)
   st.title("SQLZilla")

   left_co, cent_co, last_co = st.columns(3)
   with cent_co:
       st.image("small_logo.png", use_column_width=True)
Para tornar seu aplicativo mais interativo, você pode usar st.rerun() para atualizar o aplicativo sempre que a consulta for alterada:


se 'query' em st.session_state e st.button('Run Query'): df = run_query(st.session_state.query) st.dataframe(df) st.rerun()
   st.title("SQLZilla")

   left_co, cent_co, last_co = st.columns(3)
   with cent_co:
       st.image("small_logo.png", use_column_width=True)
Você pode encontrar vários componentes Streamlit para usar. No SQLZilla, adicionei uma versão do editor de código ACE chamada streamlit-code-editor:


do code_editor importar code_editor editor_dict = code_editor(st.session_state.code_text, lang="sql", altura=[10, 100], atalhos="vscode") if len(editor_dict['texto']) != 0: st.session_state.code_text = editor_dict['texto']
   st.title("SQLZilla")

   left_co, cent_co, last_co = st.columns(3)
   with cent_co:
       st.image("small_logo.png", use_column_width=True)
Como o assistente SQLZilla é escrito em Python, acabei de chamar a classe:


do sqlzilla importar SQLZilla def assistant_interaction(sqlzilla, prompt): resposta = sqlzilla.prompt(prompt) st.session_state.chat_history.append({"role": "usuário", "content": prompt}) st.session_state.chat_history.append({"role": "assistente", "content": resposta}) se "SELECT" em resposta.upper(): st.session_state.query = resposta resposta de retorno
   st.title("SQLZilla")

   left_co, cent_co, last_co = st.columns(3)
   with cent_co:
       st.image("small_logo.png", use_column_width=True)
Parabéns! Você construiu seu próprio SQLZilla. Continue explorando o Streamlit e aprimore seu aplicativo com mais recursos. E se você gosta do SQLZilla, vote neste incrível assistente que converte texto em consultas!

Declaração de lançamento Este artigo foi reproduzido em: https://dev.to/intersystems/building-a-frontend-using-only-python-2ndn?1 Se houver alguma violação, entre em contato com [email protected] para excluí-la
Tutorial mais recente Mais>

Isenção de responsabilidade: Todos os recursos fornecidos são parcialmente provenientes da Internet. Se houver qualquer violação de seus direitos autorais ou outros direitos e interesses, explique os motivos detalhados e forneça prova de direitos autorais ou direitos e interesses e envie-a para o e-mail: [email protected]. Nós cuidaremos disso para você o mais rápido possível.

Copyright© 2022 湘ICP备2022001581号-3