reflex
v0.6.6.post3
+ Searching for Pynecone? You are in the right repo. Pynecone has been renamed to Reflex. +Anglais | 简体中文 | 繁體中文 | Turc | हिंदी | Portugais (Brésil) | Italien | espagnol | Accueil | 日本語 | allemand | Persan (پارسی) | Tiếng Việt
Reflex est une bibliothèque permettant de créer des applications Web full-stack en Python pur.
Principales caractéristiques :
Consultez notre page d'architecture pour découvrir comment Reflex fonctionne sous le capot.
Ouvrez un terminal et exécutez (nécessite Python 3.9+) :
pip install reflex L'installation reflex installe également l'outil de ligne de commande reflex .
Vérifiez que l'installation a réussi en créant un nouveau projet. (Remplacez my_app_name par le nom de votre projet) :
mkdir my_app_name
cd my_app_name
reflex initCette commande initialise une application modèle dans votre nouveau répertoire.
Vous pouvez exécuter cette application en mode développement :
reflex runVous devriez voir votre application s'exécuter sur http://localhost:3000.
Vous pouvez maintenant modifier le code source dans my_app_name/my_app_name.py . Reflex propose des actualisations rapides afin que vous puissiez voir vos modifications instantanément lorsque vous enregistrez votre code.
Prenons un exemple : créer une interface utilisateur de génération d'images autour de DALL·E. Pour plus de simplicité, nous appelons simplement l'API OpenAI, mais vous pouvez la remplacer par un modèle ML exécuté localement.
Voici le code complet pour créer ceci. Tout cela est fait dans un seul fichier 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" )
Commençons par l'interface utilisateur.
def index ():
return rx . center (
...
) Cette fonction index définit le frontend de l'application.
Nous utilisons différents composants tels que center , vstack , input et button pour créer le frontend. Les composants peuvent être imbriqués les uns dans les autres pour créer des mises en page complexes. Et vous pouvez utiliser des arguments de mots-clés pour les styliser avec toute la puissance du CSS.
Reflex est livré avec plus de 60 composants intégrés pour vous aider à démarrer. Nous ajoutons activement davantage de composants et il est facile de créer vos propres composants.
Reflex représente votre interface utilisateur en fonction de votre état.
class State ( rx . State ):
"""The app state."""
prompt = ""
image_url = ""
processing = False
complete = FalseL'état définit toutes les variables (appelées vars) d'une application qui peuvent changer et les fonctions qui les modifient.
Ici, l'état est composé d'une prompt et image_url . Il existe également les booléens processing et complete pour indiquer quand désactiver le bouton (lors de la génération de l'image) et quand afficher l'image résultante.
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 , TrueAu sein de l'état, nous définissons des fonctions appelées gestionnaires d'événements qui modifient les variables d'état. Les gestionnaires d'événements sont le moyen par lequel nous pouvons modifier l'état dans Reflex. Ils peuvent être appelés en réponse aux actions de l'utilisateur, comme cliquer sur un bouton ou taper dans une zone de texte. Ces actions sont appelées événements.
Notre DALL·E. L'application dispose d'un gestionnaire d'événements, get_image , auquel récupérer cette image à partir de l'API OpenAI. L'utilisation yield au milieu d'un gestionnaire d'événements entraînera la mise à jour de l'interface utilisateur. Sinon, l'interface utilisateur sera mise à jour à la fin du gestionnaire d'événements.
Enfin, nous définissons notre application.
app = rx . App ()Nous ajoutons une page de la racine de l'application au composant d'index. Nous ajoutons également un titre qui apparaîtra dans l’onglet aperçu de la page/navigateur.
app . add_page ( index , title = "DALL-E" )Vous pouvez créer une application multipage en ajoutant plus de pages.
? Documents | ?️Blog | Bibliothèque de composants | ?️ Modèles | ? Déploiement
Reflex a été lancé en décembre 2022 sous le nom de Pynecone.
Depuis février 2024, notre service d'hébergement est en alpha ! Pendant cette période, tout le monde peut déployer ses applications gratuitement. Consultez notre feuille de route pour voir ce qui est prévu.
Reflex propose de nouvelles versions et fonctionnalités chaque semaine ! Assurez-vous de mettre en vedette et ? surveillez ce référentiel pour rester à jour.
Nous acceptons les contributions de toute taille ! Vous trouverez ci-dessous quelques bonnes façons de démarrer dans la communauté Reflex.
Nous recherchons activement des contributeurs, quel que soit votre niveau de compétence ou votre expérience. Pour contribuer, consultez CONTIBUTING.md
Reflex est open source et sous licence Apache License 2.0.
