reflex
v0.6.6.post3
+ Searching for Pynecone? You are in the right repo. Pynecone has been renamed to Reflex. +Inglés | 简体中文 | 繁體中文 | turco | हिंदी | Português (Brasil) | italiano | Español | 한국어 | 日本語 | alemán | persa (پارسی) | Tiếng Việt
Reflex es una biblioteca para crear aplicaciones web de pila completa en Python puro.
Características clave:
Consulte nuestra página de arquitectura para saber cómo funciona Reflex bajo el capó.
Abra una terminal y ejecute (Requiere Python 3.9+):
pip install reflex La instalación de reflex también instala la herramienta de línea de comandos reflex .
Pruebe que la instalación se realizó correctamente creando un nuevo proyecto. (Reemplace my_app_name con el nombre de su proyecto):
mkdir my_app_name
cd my_app_name
reflex initEste comando inicializa una aplicación de plantilla en su nuevo directorio.
Puedes ejecutar esta aplicación en modo de desarrollo:
reflex runDebería ver su aplicación ejecutándose en http://localhost:3000.
Ahora puedes modificar el código fuente en my_app_name/my_app_name.py . Reflex tiene actualizaciones rápidas para que puedas ver tus cambios instantáneamente cuando guardas tu código.
Repasemos un ejemplo: crear una interfaz de usuario de generación de imágenes alrededor de DALL·E. Para simplificar, simplemente llamamos a la API OpenAI, pero puede reemplazarla con un modelo ML ejecutado localmente.
Aquí está el código completo para crear esto. ¡Todo esto se hace en un archivo Python!
import reflex as rx
import openai
openai_client = openai . OpenAI ()
class State ( rx . State ):
"""The app state."""
prompt = ""
image_url = ""
processing = False
complete = False
def get_image ( self ):
"""Get the image from the prompt."""
if self . prompt == "" :
return rx . window_alert ( "Prompt Empty" )
self . processing , self . complete = True , False
yield
response = openai_client . images . generate (
prompt = self . prompt , n = 1 , size = "1024x1024"
)
self . image_url = response . data [ 0 ]. url
self . processing , self . complete = False , True
def index ():
return rx . center (
rx . vstack (
rx . heading ( "DALL-E" , font_size = "1.5em" ),
rx . input (
placeholder = "Enter a prompt.." ,
on_blur = State . set_prompt ,
width = "25em" ,
),
rx . button (
"Generate Image" ,
on_click = State . get_image ,
width = "25em" ,
loading = State . processing
),
rx . cond (
State . complete ,
rx . image ( src = State . image_url , width = "20em" ),
),
align = "center" ,
),
width = "100%" ,
height = "100vh" ,
)
# Add state and page to the app.
app = rx . App ()
app . add_page ( index , title = "Reflex:DALL-E" )
Comencemos con la interfaz de usuario.
def index ():
return rx . center (
...
) Esta función index define la interfaz de la aplicación.
Usamos diferentes componentes como center , vstack , input y button para construir la interfaz. Los componentes se pueden anidar entre sí para crear diseños complejos. Y puedes usar argumentos de palabras clave para diseñarlos con todo el poder de CSS.
Reflex viene con más de 60 componentes integrados para ayudarle a comenzar. Estamos agregando activamente más componentes y es fácil crear sus propios componentes.
Reflex representa su interfaz de usuario en función de su estado.
class State ( rx . State ):
"""The app state."""
prompt = ""
image_url = ""
processing = False
complete = FalseEl estado define todas las variables (llamadas vars) en una aplicación que pueden cambiar y las funciones que las cambian.
Aquí el estado se compone de un prompt e image_url . También están los booleanos processing y complete para indicar cuándo deshabilitar el botón (durante la generación de la imagen) y cuándo mostrar la imagen resultante.
def get_image ( self ):
"""Get the image from the prompt."""
if self . prompt == "" :
return rx . window_alert ( "Prompt Empty" )
self . processing , self . complete = True , False
yield
response = openai_client . images . generate (
prompt = self . prompt , n = 1 , size = "1024x1024"
)
self . image_url = response . data [ 0 ]. url
self . processing , self . complete = False , TrueDentro del estado, definimos funciones llamadas controladores de eventos que cambian las variables de estado. Los controladores de eventos son la forma en que podemos modificar el estado en Reflex. Se pueden llamar en respuesta a acciones del usuario, como hacer clic en un botón o escribir en un cuadro de texto. Estas acciones se llaman eventos.
Nuestro DALL·E. La aplicación tiene un controlador de eventos, get_image , para obtener esta imagen de la API de OpenAI. El uso de yield en medio de un controlador de eventos hará que la interfaz de usuario se actualice. De lo contrario, la interfaz de usuario se actualizará al final del controlador de eventos.
Finalmente, definimos nuestra aplicación.
app = rx . App ()Agregamos una página desde la raíz de la aplicación al componente de índice. También agregamos un título que aparecerá en la pestaña de vista previa de la página/navegador.
app . add_page ( index , title = "DALL-E" )Puede crear una aplicación de varias páginas agregando más páginas.
? Documentos | ?️Blog | Biblioteca de componentes | ?️ Plantillas | ? Despliegue
Reflex se lanzó en diciembre de 2022 con el nombre de Pynecone.
¡A partir de febrero de 2024, nuestro servicio de alojamiento está en versión alfa! Durante este tiempo, cualquiera puede implementar sus aplicaciones de forma gratuita. Consulte nuestra hoja de ruta para ver lo que está planeado.
¡Reflex tiene nuevos lanzamientos y funciones cada semana! Asegúrate de destacar y ? mire este repositorio para mantenerse actualizado.
¡Agradecemos contribuciones de cualquier tamaño! A continuación se presentan algunas buenas formas de comenzar en la comunidad Reflex.
Buscamos activamente colaboradores, sin importar su nivel de habilidad o experiencia. Para contribuir, consulte CONTIBUTING.md
Reflex es de código abierto y tiene la licencia Apache 2.0.
