|
@@ -1,25 +1,40 @@
|
|
|
```diff
|
|
|
Pynecone की तलाश हैं? आप सही रेपो में हैं। Pynecone का नाम Reflex में बदल दिया गया है। + +
|
|
|
```
|
|
|
+
|
|
|
<div align="center">
|
|
|
-<img src="https://raw.githubusercontent.com/reflex-dev/reflex/main/docs/images/reflex_dark.svg#gh-light-mode-only" alt="Reflex Logo" width="300px">
|
|
|
-<img src="https://raw.githubusercontent.com/reflex-dev/reflex/main/docs/images/reflex_light.svg#gh-dark-mode-only" alt="Reflex Logo" width="300px">
|
|
|
+<img src="https://raw.githubusercontent.com/reflex-dev/reflex/main/docs/images/reflex_dark.svg#gh-light-mode-only" alt="Reflex लोगो" width="300px">
|
|
|
+<img src="https://raw.githubusercontent.com/reflex-dev/reflex/main/docs/images/reflex_light.svg#gh-dark-mode-only" alt="Reflex लोगो" width="300px">
|
|
|
|
|
|
<hr>
|
|
|
|
|
|
-### **✨ Python (पायथन) में परफॉर्मेंट, अनुकूलनयोग्य वेब ऐप्स। कुछ सेकंड्स में ही डिप्लॉय करें ✨**
|
|
|
+### **✨ प्रदर्शनकारी, अनुकूलित वेब ऐप्स, शुद्ध Python में। सेकंडों में तैनात करें। ✨**
|
|
|
+
|
|
|
[](https://badge.fury.io/py/reflex)
|
|
|

|
|
|

|
|
|
[](https://reflex.dev/docs/getting-started/introduction)
|
|
|
[](https://discord.gg/T5WSbC2YtQ)
|
|
|
+
|
|
|
</div>
|
|
|
|
|
|
---
|
|
|
-[English](https://github.com/reflex-dev/reflex/blob/main/README.md) | [简体中文](https://github.com/reflex-dev/reflex/blob/main/docs/zh/zh_cn/README.md) | [繁體中文](https://github.com/reflex-dev/reflex/blob/main/docs/zh/zh_tw/README.md) | [Türkçe](https://github.com/reflex-dev/reflex/blob/main/docs/tr/README.md) | [हिंदी](https://github.com/reflex-dev/reflex/blob/main/docs/in/README.md) | [한국어](https://github.com/reflex-dev/reflex/blob/main/docs/kr/README.md) | [日本語](https://github.com/reflex-dev/reflex/blob/main/docs/ja/README.md)
|
|
|
----
|
|
|
|
|
|
-## ⚙️ इंस्टॉलेशन
|
|
|
+## [English](https://github.com/reflex-dev/reflex/blob/main/README.md) | [简体中文](https://github.com/reflex-dev/reflex/blob/main/docs/zh/zh_cn/README.md) | [繁體中文](https://github.com/reflex-dev/reflex/blob/main/docs/zh/zh_tw/README.md) | [Türkçe](https://github.com/reflex-dev/reflex/blob/main/docs/tr/README.md) | [हिंदी](https://github.com/reflex-dev/reflex/blob/main/docs/in/README.md) | [한국어](https://github.com/reflex-dev/reflex/blob/main/docs/kr/README.md) | [日本語](https://github.com/reflex-dev/reflex/blob/main/docs/ja/README.md)
|
|
|
+
|
|
|
+# Reflex
|
|
|
+
|
|
|
+Reflex शुद्ध पायथन में पूर्ण-स्टैक वेब ऐप्स बनाने के लिए एक लाइब्रेरी है।
|
|
|
+
|
|
|
+मुख्य विशेषताएँ:
|
|
|
+
|
|
|
+- **शुद्ध पायथन** - अपने ऐप के फ्रंटएंड और बैकएंड को पायथन में लिखें, जावास्क्रिप्ट सीखने की जरूरत नहीं है।
|
|
|
+- **पूर्ण लचीलापन** - Reflex के साथ शुरुआत करना आसान है, लेकिन यह जटिल ऐप्स के लिए भी स्केल कर सकता है।
|
|
|
+- **तुरंत तैनाती** - बिल्डिंग के बाद, अपने ऐप को [एकल कमांड](https://reflex.dev/docs/hosting/deploy-quick-start/) के साथ तैनात करें या इसे अपने सर्वर पर होस्ट करें।
|
|
|
+
|
|
|
+Reflex के अंदर के कामकाज को जानने के लिए हमारे [आर्किटेक्चर पेज](https://reflex.dev/blog/2024-03-21-reflex-architecture/#the-reflex-architecture) को देखें।
|
|
|
+
|
|
|
+## ⚙️ इंस्टॉलेशन (Installation)
|
|
|
|
|
|
एक टर्मिनल खोलें और चलाएं (Python 3.8+ की आवश्यकता है):
|
|
|
|
|
@@ -27,11 +42,11 @@ Pynecone की तलाश हैं? आप सही रेपो में
|
|
|
pip install reflex
|
|
|
```
|
|
|
|
|
|
-## 🥳 अपना पहला ऐप बनाएं
|
|
|
+## 🥳 अपना पहला ऐप बनाएं (Create your first App)
|
|
|
|
|
|
reflex को इंस्टॉल करने से ही reflex कमांड लाइन टूल भी इंस्टॉल हो जाता है।
|
|
|
|
|
|
-सुनिश्चित करें कि इंस्टॉलेशन सफल थी, एक नया प्रोजेक्ट बनाकर इसे टेस्ट करें। ('my_app_name' की जगह अपने प्रोजेक्ट का नाम रखें):
|
|
|
+सुनिश्चित करें कि इंस्टॉलेशन सफल थी, एक नया प्रोजेक्ट बनाकर इसे टेस्ट करें। ('my_app_name' की जगह अपने प्रोजेक्ट का नाम रखें):
|
|
|
|
|
|
```bash
|
|
|
mkdir my_app_name
|
|
@@ -51,14 +66,14 @@ reflex run
|
|
|
|
|
|
अब आप my_app_name/my_app_name.py में source कोड को संशोधित कर सकते हैं। Reflex में तेज रिफ्रेश की सुविधा है, इसलिए जब आप अपनी कोड को सहेजते हैं, तो आप अपने बदलावों को तुरंत देख सकते हैं।
|
|
|
|
|
|
-## 🫧 उदाहरण ऐप
|
|
|
+## 🫧 उदाहरण ऐप (Example App)
|
|
|
|
|
|
एक उदाहरण पर चलते हैं: DALL·E से एक इमेज उत्पन्न करने के लिए UI। सरलता के लिए, हम सिर्फ OpenAI API को बुलाते हैं, लेकिन आप इसे ML मॉडल से बदल सकते हैं locally।
|
|
|
|
|
|
|
|
|
|
|
|
<div align="center">
|
|
|
-<img src="https://raw.githubusercontent.com/reflex-dev/reflex/main/docs/images/dalle.gif" alt="A frontend wrapper for DALL·E, shown in the process of generating an image." width="550" />
|
|
|
+<img src="https://raw.githubusercontent.com/reflex-dev/reflex/main/docs/images/dalle.gif" alt="DALL·E के लिए एक फ्रंटएंड रैपर, छवि उत्पन्न करने की प्रक्रिया में दिखाया गया।" width="550" />
|
|
|
</div>
|
|
|
|
|
|
|
|
@@ -69,10 +84,12 @@ reflex run
|
|
|
import reflex as rx
|
|
|
import openai
|
|
|
|
|
|
-openai.api_key = "YOUR_API_KEY"
|
|
|
+openai_client = openai.OpenAI()
|
|
|
+
|
|
|
|
|
|
class State(rx.State):
|
|
|
"""The app state."""
|
|
|
+
|
|
|
prompt = ""
|
|
|
image_url = ""
|
|
|
processing = False
|
|
@@ -85,33 +102,33 @@ class State(rx.State):
|
|
|
|
|
|
self.processing, self.complete = True, False
|
|
|
yield
|
|
|
- response = openai.Image.create(prompt=self.prompt, n=1, size="1024x1024")
|
|
|
- self.image_url = response["data"][0]["url"]
|
|
|
+ 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"),
|
|
|
- rx.input(placeholder="Enter a prompt", on_blur=State.set_prompt),
|
|
|
+ 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,
|
|
|
- is_loading=State.processing,
|
|
|
- width="100%",
|
|
|
+ width="25em",
|
|
|
+ loading=State.processing
|
|
|
),
|
|
|
rx.cond(
|
|
|
State.complete,
|
|
|
- rx.image(
|
|
|
- src=State.image_url,
|
|
|
- height="25em",
|
|
|
- width="25em",
|
|
|
- )
|
|
|
+ rx.image(src=State.image_url, width="20em"),
|
|
|
),
|
|
|
- padding="2em",
|
|
|
- shadow="lg",
|
|
|
- border_radius="lg",
|
|
|
+ align="center",
|
|
|
),
|
|
|
width="100%",
|
|
|
height="100vh",
|
|
@@ -119,10 +136,14 @@ def index():
|
|
|
|
|
|
# Add state and page to the app.
|
|
|
app = rx.App()
|
|
|
-app.add_page(index, title="reflex:DALL·E")
|
|
|
+app.add_page(index, title="Reflex:DALL-E")
|
|
|
```
|
|
|
|
|
|
-## चलो इसे विस्तार से देखते हैं।
|
|
|
+## इसे समझते हैं।
|
|
|
+
|
|
|
+<div align="center">
|
|
|
+<img src="https://github.com/reflex-dev/reflex/blob/main/docs/images/dalle_colored_code_example.png?raw=true" alt="DALL-E ऐप के बैकएंड और फ्रंटएंड भागों के बीच के अंतर की व्याख्या करता है।" width="900" />
|
|
|
+</div>
|
|
|
|
|
|
### **Reflex UI**
|
|
|
|
|
@@ -156,7 +177,7 @@ class State(rx.State):
|
|
|
|
|
|
स्टेट (state) ऐप में उन सभी वेरिएबल्स (vars) को परिभाषित करती है जो बदल सकती हैं और उन फ़ंक्शनों को जो उन्हें बदलते हैं।
|
|
|
|
|
|
-यहां स्टेट (state) में `prompt` और `image_url` शामिल हैं। प्रगति और छवि दिखाने के लिए `processing` और `complete` बूलियन भी हैं।
|
|
|
+यहां स्टेट (state) में `prompt` और `image_url` शामिल हैं। प्रगति और छवि दिखाने के लिए `processing` और `complete` बूलियन भी हैं।
|
|
|
|
|
|
### **इवेंट हैंडलर (Event Handlers)**
|
|
|
|
|
@@ -168,8 +189,10 @@ def get_image(self):
|
|
|
|
|
|
self.processing, self.complete = True, False
|
|
|
yield
|
|
|
- response = openai.Image.create(prompt=self.prompt, n=1, size="1024x1024")
|
|
|
- self.image_url = response["data"][0]["url"]
|
|
|
+ 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
|
|
|
```
|
|
|
|
|
@@ -197,33 +220,34 @@ app.add_page(index, title="DALL-E")
|
|
|
|
|
|
<div align="center">
|
|
|
|
|
|
-📑 [Docs](https://reflex.dev/docs/getting-started/introduction) | 🗞️ [Blog](https://reflex.dev/blog) | 📱 [Component Library](https://reflex.dev/docs/library) | 🖼️ [Gallery](https://reflex.dev/docs/gallery) | 🛸 [Deployment](https://reflex.dev/docs/hosting/deploy)
|
|
|
+📑 [दस्तावेज़](https://reflex.dev/docs/getting-started/introduction) | 🗞️ [ब्लॉग](https://reflex.dev/blog) | 📱 [कॉम्पोनेंट लाइब्रेरी](https://reflex.dev/docs/library) | 🖼️ [गैलरी](https://reflex.dev/docs/gallery) | 🛸 [तैनाती](https://reflex.dev/docs/hosting/deploy)
|
|
|
|
|
|
</div>
|
|
|
|
|
|
## ✅ स्टेटस (Status)
|
|
|
|
|
|
-रिफ्लेक्स को दिसंबर 2022 में पाइनकोन नाम से लॉन्च किया गया।
|
|
|
-
|
|
|
-जुलाई 2023 तक, हम **Public Beta** (सार्वजनिक बीटा) चरण में हैं।
|
|
|
+Reflex दिसंबर 2022 में Pynecone नाम से शुरू हुआ।
|
|
|
|
|
|
-- :white_check_mark: **Public Alpha** (सार्वजनिक अल्फा): कोई भी रिफ्लेक्स इंस्टॉल और उपयोग कर सकता है। कुछ इशू हो सकते हैं, लेकिन हम उन्हें सुलझाने के लिए सक्रिय रूप से काम कर रहे हैं।
|
|
|
-- :large_orange_diamond: **Public Beta** (सार्वजनिक बीटा): गैर-उद्यम उपयोग-मामलों के लिए स्थिर।
|
|
|
-- **Public Hosting Beta** (सार्वजनिक होस्टिंग बीटा): _Optionally_, अपने ऐप्स को रिफ्लेक्स पर डिप्लॉइ और होस्ट करें!
|
|
|
-- **Public** (सार्वजनिक): रिफ्लेक्स उत्पादन के लिए तैयार है।
|
|
|
+फरवरी 2024 तक, हमारी होस्टिंग सेवा अल्फा में है! इस समय कोई भी अपने ऐप्स को मुफ्त में तैनात कर सकता है। देखें हमारी [रोडमैप](https://github.com/reflex-dev/reflex/issues/2727) योजनाबद्ध चीज़ों को जानने के लिए।
|
|
|
|
|
|
-रिफ्लेक्स में हर सप्ताह नई रिलीज़ और सुविधाएँ आ रही हैं! अपडेट रहने के लिए इस रिपॉजिटरी को :star: स्टार करें और समय-समय पर अवश्य देखें :eyes:।
|
|
|
+Reflex में हर सप्ताह नए रिलीज़ और फीचर्स आ रहे हैं! सुनिश्चित करें कि ⭐ स्टार और 👀 वॉच इस रेपोजिटरी को अपडेट रहने के लिए।
|
|
|
|
|
|
## (योगदान) Contributing
|
|
|
|
|
|
हम हर तरह के योगदान का स्वागत करते हैं! रिफ्लेक्स कम्यूनिटी में शुरुआत करने के कुछ अच्छे तरीके नीचे दिए गए हैं।
|
|
|
|
|
|
-- **Join Our Discord** (डिस्कॉर्ड सर्वर से जुड़ें): Our [Discord](https://discord.gg/T5WSbC2YtQ) हमारा डिस्कॉर्ड रिफ्लेक्स प्रोजेक्ट पर सहायता प्राप्त करने और आप कैसे योगदान दे सकते हैं, इस पर चर्चा करने के लिए सबसे अच्छी जगह है।
|
|
|
-- **GitHub Discussions** (गिटहब चर्चाएँ): उन सुविधाओं के बारे में बात करने का एक शानदार तरीका जिन्हें आप जोड़ना चाहते हैं या ऐसी चीज़ें जो भ्रमित करने वाली हैं/स्पष्टीकरण की आवश्यकता है।
|
|
|
-- **GitHub Issues** (गिटहब समस्याएं): ये बग की रिपोर्ट करने का एक शानदार तरीका है। इसके अतिरिक्त, आप किसी मौजूदा समस्या को हल करने का प्रयास कर सकते हैं और एक पीआर सबमिट कर सकते हैं।
|
|
|
+- **Join Our Discord** (डिस्कॉर्ड सर्वर से जुड़ें): Our [Discord](https://discord.gg/T5WSbC2YtQ) हमारा डिस्कॉर्ड रिफ्लेक्स प्रोजेक्ट पर सहायता प्राप्त करने और आप कैसे योगदान दे सकते हैं, इस पर चर्चा करने के लिए सबसे अच्छी जगह है।
|
|
|
+- **GitHub Discussions** (गिटहब चर्चाएँ): उन सुविधाओं के बारे में बात करने का एक शानदार तरीका जिन्हें आप जोड़ना चाहते हैं या ऐसी चीज़ें जो भ्रमित करने वाली हैं/स्पष्टीकरण की आवश्यकता है।
|
|
|
+- **GitHub Issues** (गिटहब समस्याएं): ये [बग](https://github.com/reflex-dev/reflex/issues) की रिपोर्ट करने का एक शानदार तरीका है। इसके अतिरिक्त, आप किसी मौजूदा समस्या को हल करने का प्रयास कर सकते हैं और एक पीआर सबमिट कर सकते हैं।
|
|
|
+
|
|
|
+हम सक्रिय रूप से योगदानकर्ताओं की तलाश कर रहे हैं, चाहे आपका कौशल स्तर या अनुभव कुछ भी हो।योगदान करने के लिए [CONTIBUTING.md](https://github.com/reflex-dev/reflex/blob/main/CONTRIBUTING.md) देखें।
|
|
|
+
|
|
|
+## हमारे सभी योगदानकर्ताओं का धन्यवाद:
|
|
|
|
|
|
-हम सक्रिय रूप से योगदानकर्ताओं की तलाश कर रहे हैं, चाहे आपका कौशल स्तर या अनुभव कुछ भी हो।
|
|
|
+<a href="https://github.com/reflex-dev/reflex/graphs/contributors">
|
|
|
+ <img src="https://contrib.rocks/image?repo=reflex-dev/reflex" />
|
|
|
+</a>
|
|
|
|
|
|
## लाइसेंस (License)
|
|
|
|
|
|
-रिफ्लेक्स ओपन-सोर्स है और [अपाचे लाइसेंस 2.0] (लाइसेंस) के तहत लाइसेंस प्राप्त है।
|
|
|
+रिफ्लेक्स ओपन-सोर्स है और [अपाचे लाइसेंस 2.0](https://github.com/reflex-dev/reflex/blob/main/LICENSE) के तहत लाइसेंस प्राप्त है।
|