NiceGUI एक Python-आधारित UI फ्रेमवर्क है जो वेब इंटरफेस बनाना आसान बनाता है। यह डेवलपर्स को वेब एप्लिकेशंस के लिए ग्राफिकल यूज़र इंटरफेस (GUIs) बनाने देता है, वह भी बिना HTML, CSS, या JavaScript जाने।
इस लेख में, मैं बताऊंगा कि आप NiceGUI का उपयोग करके उपयोगकर्ता-अनुकूल इंटरफेस कैसे बना सकते हैं। लेकिन, यदि आप Python में नए हैं, तो पहले हमारा Introduction to Python कोर्स करें और फिर अपने कौशल मजबूत करने के लिए Python Programming स्किल ट्रैक पर आगे बढ़ें।
NiceGUI क्या है?
NiceGUI एक Python लाइब्रेरी है जो केवल Python कोड के साथ वेब-आधारित यूज़र इंटरफेस बनाने में मदद करती है। यदि आप एक Python डेवलपर हैं जो UI बनाना चाहते हैं और HTML, CSS, या JavaScript से बचना चाहते हैं, तो NiceGUI आपके लिए है। यह तीन मुख्य तकनीकों पर आधारित है:
हालाँकि (और यही वास्तव में NiceGUI की खासियत है) NiceGUI को प्रभावी ढंग से उपयोग करने के लिए आपको इन तकनीकों को समझने की ज़रूरत नहीं है। यह छोटे वेब एप्लिकेशंस से लेकर जटिल प्रोजेक्ट्स तक के लिए पर्याप्त रूप से बहुमुखी है। इसकी एक बड़ी ताकत है—उसकी सुलभता। आप कम से कम कोड के साथ काम करने वाले इंटरफेस बना सकते हैं, भले ही आप Python में नए हों। नीचे के कोड पर नज़र डालें, मैं बताता हूँ कैसे।
NiceGUI के साथ शुरुआत
यहाँ, मैं इंस्टॉलेशन प्रक्रिया कवर करूँगा और आपका पहला सरल एप्लिकेशन बनाने में मार्गदर्शन दूँगा।
इंस्टॉलेशन प्रक्रिया
NiceGUI इंस्टॉल करने के कई तरीके हैं, जो आपकी पसंद पर निर्भर करते हैं। इसे इस तरह करें। अपने टर्मिनल या कमांड प्रॉम्प्ट में निम्न कमांड चलाएँ। मैं आपके टूल के अनुसार विकल्प दे रहा हूँ।
आपने NiceGUI इंस्टॉल कर लिया है, तो अब हमारा पहला इंटरफेस बनाने का समय है। आइए एक बुनियादी उदाहरण लें — एक साधारण हेलो संदेश दिखाना। पहले, एक नया Python फ़ाइल बनाएँ (जैसे, app.py)। फिर, निम्न कोड लिखें:
# Importing the module from nicegui import UI
# pass the text
ui.label('Hello World')# run it
ui.run()संचालित द्वारा
अब कोड चलाएँ। आप इसे सेव करके run बटन पर क्लिक करके चला सकते हैं या टर्मिनल में निम्न कमांड लिखें:
NiceGUI अपनी सादगी, इंटरैक्टिविटी, और इंटीग्रेशन क्षमताओं के लिए लोकप्रिय हो रहा है। यहाँ उन बातों का सार है जो इसे डेवलपर्स के लिए उपयोगी फ्रेमवर्क बनाती हैं।
उपयोगकर्ता-अनुकूल इंटरफेस
Streamlit या Dash जैसे अन्य टूल्स के विपरीत, आप NiceGUI से बहुत कम कोड में ग्राफिकल यूज़र इंटरफेस बना सकते हैं। उदाहरण के लिए:
from nicegui import ui
ui.label('Hello NiceGUI!')
ui.button('BUTTON', on_click=lambda: ui.notify('button was pressed'))
ui.run()संचालित द्वारा
उपरोक्त कोड में, मैं एक बटन परिभाषित करता हूँ और उसका क्लिक इवेंट हैंडल करता हूँ। जब मैं बटन क्लिक करता हूँ, तो button was pressed संदेश पॉप अप होता है। बस इतना ही। यह सबसे जटिल उदाहरण नहीं है, लेकिन आप देख सकते हैं कि बिना कॉन्फ़िगरेशन या जटिल लॉजिक के मैंने कितनी जल्दी एक फ़ंक्शनल UI सेट कर दिया।
बटन और नोटिफिकेशन के साथ NiceGUI इंटरफेस। चित्र: लेखक।
रियल-टाइम इंटरैक्टिविटी
NiceGUI के साथ आप ऐसे रियल-टाइम इंटरैक्टिव UI भी बना सकते हैं जो आपके ब्राउज़र में तुरंत प्रतिक्रिया दें। जब आप बैकएंड पर बदलाव करते हैं, तो WebSocket कनेक्शंस की बदौलत वे अपडेट फ्रंटएंड पर तुरंत दिखते हैं। सर्वर और क्लाइंट के बीच यह निरंतर संचार का मतलब है कि अपडेट देखने के लिए आपको पेज रिफ्रेश नहीं करना पड़ता।
from nicegui import ui
slider = ui.slider(min=0,max=100, value=50)
ui.label().bind_text_from(slider,'value')
ui.run()संचालित द्वारा
जैसे ही आप स्लाइडर को मूव करते हैं, लेबल बिना पेज रीलोड किए तुरंत अपडेट हो जाता है। यह NiceGUI का एक लाभ दिखाता है, खासकर Streamlit और Dash जैसे फ्रेमवर्क्स की तुलना में, जहाँ अपडेट के लिए अक्सर अधिक प्रयास करना पड़ सकता है।
स्लाइडर बनाना। चित्र: लेखक।
विज़ुअल एलिमेंट्स और लेआउट्स
NiceGUI में लेआउट विकल्प उपलब्ध हैं, जिनमें बटन, स्लाइडर, चार्ट्स, और 3D एलिमेंट्स शामिल हैं। आप इन एलिमेंट्स को पंक्तियों, कॉलम्स और कार्ड्स में व्यवस्थित कर सकते हैं—वह भी HTML या CSS लिखे बिना। उदाहरण:
from nicegui import ui
with ui.column():
ui.button('Button 1')
ui.button('Button 2')with ui.row():with ui.card().style('width: 300px; height: 150px'):
ui.label('Temperature')
ui.slider(min=0,max=100, value=20)with ui.card().style('width: 500px; height: 400px'):# Adjusting the size of the card
ui.label('Line Chart')
ui.echart({'title':{'text':'Sample Line Chart','left':'center','textStyle':{'fontSize':18}},'xAxis':{'type':'category','data':['Category A','Category B','Category C'],'axisLabel':{'rotate':0}# Ensures the labels are not rotated},'yAxis':{'type':'value'},'series':[{'name':'Values','data':[1,2,3],'type':'line','smooth':True,# Makes the line smoother'label':{'show':True}# Shows data points on the chart}]})
ui.run()संचालित द्वारा
मैंने इस कोड से एक इंटरैक्टिव लेआउट बनाया। कोड पहले NiceGUI से आवश्यक मॉड्यूल इम्पोर्ट करता है। फिर यह दो बटनों वाला एक कॉलम और दो कार्ड्स वाली एक रो बनाता है। पहले कार्ड में तापमान नियंत्रण है, जिसमें एक लेबल और तापमान समायोजित करने के लिए स्लाइडर है। दूसरे कार्ड में एक लाइन चार्ट है। अंत में, ui.run() परिणाम प्रदर्शित करने के लिए कोड चलाता है।
विज़ुअल एलिमेंट्स और लेआउट्स बनाना। चित्र: लेखक।
बाहरी लाइब्रेरीज़ के साथ इंटीग्रेशन
यदि आप डेटा साइंस या विज़ुअलाइज़ेशन में रुचि रखते हैं, तो अच्छी खबर है — NiceGUI NumPy, Matplotlib, और Plotly जैसी लोकप्रिय Python लाइब्रेरीज़ के साथ अच्छी तरह काम करता है। मान लीजिए आप ऐसे डेटा साइंस प्रोजेक्ट्स पर काम कर रहे हैं जिनमें जटिल डेटा प्रोसेसिंग या विज़ुअलाइज़ेशन की ज़रूरत है। इस स्थिति में, आप इन लाइब्रेरीज़ का उपयोग Python में सामान्य रूप से कर सकते हैं, और NiceGUI आपके लिए परिणाम वेब-आधारित इंटरफेस में दिखा देगा।
यहाँ एक उदाहरण है कि आप Matplotlib और NumPy के साथ NiceGUI का उपयोग करके वेब-आधारित इंटरफेस में एक बुनियादी डेटा विज़ुअलाइज़ेशन कैसे बना सकते हैं। पहले, आवश्यक लाइब्रेरीज़ इंस्टॉल करने के लिए यह कमांड चलाएँ:
अब, एक सरल Python स्क्रिप्ट बनाएँ जो एक प्लॉट जनरेट करे और NiceGUI का उपयोग करके उसे इस तरह दिखाए:
import numpy as np
import matplotlib.pyplot as plt
from nicegui import ui
# Generate some data using NumPy
x = np.linspace(0,10,100)
y = np.sin(x)# Create a Matplotlib plot
plt.plot(x, y)
plt.title('Sine Wave')
plt.xlabel('X-axis')
plt.ylabel('Y-axis')# Save the plot to display it in the web interface
plt.savefig('sine_wave_plot.png')# Define the NiceGUI interface@ui.page('/')defmain_page():# Display the plot using NiceGUI
ui.image('sine_wave_plot.png')# Run the NiceGUI application
ui.run()संचालित द्वारा
NiceGUI, Matplotlib और NumPy के साथ इंटरैक्टिव प्लॉट। चित्र: लेखक।
उन्नत फीचर्स और उपयोग के मामले
अब जब आपको NiceGUI की बुनियादी जानकारी है, तो इसके कुछ उन्नत फीचर्स देखें। ये आपको अधिक जटिल और इंटरैक्टिव वेब ऐप्स बनाने में मदद करेंगे।
डेटा डैशबोर्ड्स
मूलभूत लेआउट्स के अलावा, आप NiceGUI का उपयोग कर लाइव डेटा दिखाने वाले डैशबोर्ड भी बना सकते हैं। ऐसे करें:
पेज रीलोड किए बिना स्क्रीन पर डेटा अपडेट करने के लिए NiceGUI का उपयोग करें।
Matplotlib या Plotly जैसे टूल्स से चार्ट्स और ग्राफ़ जोड़ें।
बटन और ड्रॉपडाउन मेनू से उपयोगकर्ताओं को दिखाई जाने वाली चीजें बदलने दें।
उदाहरण के लिए, मैंने NiceGUI और Matplotlib का उपयोग करके लाइव स्टॉक प्राइस दिखाने वाला एक वित्तीय डैशबोर्ड बनाया।
from nicegui import ui
import plotly.express as px
import pandas as pd
# Sample data
df = pd.DataFrame({'time':['10:00','10:05','10:10'],'stock_price':[100,102,105]})# Create a Plotly line chart
fig = px.line(df, x='time', y='stock_price', title='Stock Price Over Time')# Use NiceGUI to display the chartwith ui.card():
ui.plotly(fig)
ui.run()संचालित द्वारा
NiceGUI और Plotly के साथ रियल-टाइम स्टॉक डैशबोर्ड। चित्र: लेखक।
आप अपनी ऐप को लाइव डेटा स्ट्रीम करने वाले API से भी कनेक्ट कर सकते हैं। ऐसा करने के लिए, Matplotlib या Plotly आपको ऐसे चार्ट्स बनाने में मदद करेंगे जो नया डेटा आते ही स्वतः रीफ्रेश हो जाएँ, जिससे उपयोगकर्ताओं को रियल-टाइम मार्केट व्यू मिले।
मशीन लर्निंग इंटरफेस
NiceGUI मशीन लर्निंग प्रोजेक्ट्स के साथ भी अच्छी तरह काम करता है। इसे इस तरह उपयोग कर सकते हैं:
ऐसी उपयोगकर्ता-अनुकूल स्क्रीन बनाएँ जिनसे आप अपने मॉडल के काम करने के तरीके को बदल सकें।
मॉडल के परिणाम जैसे-जैसे आएँ, उन्हें तुरंत दिखाएँ।
ट्रेनिंग से पहले और बाद के डेटा को उपयोगकर्ताओं को एक्सप्लोर करने दें।
उदाहरण के तौर पर, मैंने एक लीनियर रिग्रेशन के लिए इंटरफेस बनाया:
from nicegui import ui
import numpy as np
import plotly.graph_objects as go
X = np.array([1,2,3,4,5])
y = np.array([1,6,8,7,9])# Slope and intercept
slope =2.2
intercept =0.6# Create the initial figure with two traces
fig = go.Figure()
fig.add_trace(go.Scatter(x=X, y=y, mode='markers', name='Data'))# Actual data points# The prediction line uses the manually set slope and intercept
y_pred = slope * X + intercept
fig.add_trace(go.Scatter(x=X, y=y_pred, mode='lines', name='Prediction'))
fig.update_layout(title='Linear Regression Model',
xaxis_title='X',
yaxis_title='Y',
height=400)defupdate_model():
y_pred = slope * X + intercept
# Update the results with the fixed slope and intercept
result.set_text(f"Slope: {slope:.2f}, Intercept: {intercept:.2f}")# Update the prediction line in the plot
chart.update_traces(y=y_pred, selector=dict(name="Prediction"))# Create the UIwith ui.card().classes('w-full'):
ui.label('Linear Regression Demo').classes('text-h6')
ui.button('Update Model', on_click=update_model).classes('my-2')
result = ui.label(f"Slope: {slope:.2f}, Intercept: {intercept:.2f}")
chart = ui.plotly(fig).classes('w-full')
ui.run()संचालित द्वारा
ML में NiceGUI का इंटीग्रेशन। चित्र: लेखक।
NiceGUI बनाम अन्य Python UI फ्रेमवर्क्स
जब आप नया प्रोजेक्ट शुरू करते हैं, तो आप NiceGUI की तुलना Streamlit, Dash, और JustPy जैसे लोकप्रिय Python विकल्पों से कर सकते हैं। हालाँकि हर फ्रेमवर्क की खूबियाँ और कमियाँ होती हैं जो आपके प्रोजेक्ट के विकास को प्रभावित कर सकती हैं, आइए इन्हें उपयोग में आसानी और परफॉर्मेंस के संदर्भ में तुलना करें।
Feature
NiceGUI
Streamlit
Dash
Ease of Use
Simple, few lines of code. Python functions for events.
Easy for data apps and prototypes. Tricky for complex apps.
More control but requires more code.
Performance
Fast with FastAPI, handles many users well.
Slower, reloads entire app for changes.
Fast with Flask, needs more setup for some features.
Best For
Tasks requiring performance and scalability.
Quick prototypes, less suited for complex apps.
Complex apps, with more customization.
Deploying NiceGUI Applications
जब आप अपनी ऐप बना लेते हैं, तो आप उसे दूसरों के साथ साझा करना चाहेंगे। डिप्लॉयमेंट आपकी ऐप को इंटरनेट या लोकल नेटवर्क पर उपयोगकर्ताओं के लिए उपलब्ध कराता है। चूँकि NiceGUI ऐप्स Python-आधारित हैं, आपके पास कई डिप्लॉयमेंट विकल्प होते हैं।
क्लाउड डिप्लॉयमेंट विकल्प
आप Google Cloud Run या AWS में से चुन सकते हैं — क्लाउड डिप्लॉयमेंट के दो लोकप्रिय विकल्प। इन प्लेटफ़ॉर्म्स पर अपनी ऐप डिप्लॉय करने के बुनियादी चरण इस प्रकार हैं:
सुनिश्चित करें कि आपकी NiceGUI ऐप लोकल पर सुचारू रूप से चल रही है।
क्लाउड वातावरण में काम करने के लिए होस्ट और पोर्ट जैसी सेटिंग्स समायोजित करें।
अपने चुने हुए क्लाउड प्लेटफ़ॉर्म के लिए आवश्यक कॉन्फ़िगरेशन फ़ाइलें सेट करें।
अपनी एप्लिकेशन को पैकेज करें और उसे क्लाउड प्लेटफ़ॉर्म के कंटेनर रजिस्ट्री में पुश करें।
क्लाउड प्लेटफ़ॉर्म के टूल्स का उपयोग करके अपनी कंटेनराइज़्ड एप्लिकेशन डिप्लॉय करें।
डिप्लॉयमेंट प्रक्रिया आपके इस्तेमाल किए गए क्लाउड प्लेटफ़ॉर्म के प्रकार के अनुसार थोड़ी भिन्न हो सकती है। फिर भी, लगभग सभी क्लाउड प्लेटफ़ॉर्म उपयोग में आसान इंटरफेस और CLI टूल्स प्रदान करते हैं, जो क्लाउड होस्टिंग में नए लोगों के लिए भी इस प्रक्रिया को सरल बनाते हैं।
Docker सपोर्ट
Docker आपको अपनी ऐप और उसकी सभी डिपेंडेंसीज़ को एक सिंगल कंटेनर में पैकेज करने देता है, जिसे किसी भी सिस्टम पर, जो Docker सपोर्ट करता है, आसानी से डिप्लॉय किया जा सकता है। NiceGUI एक Docker इमेज भी प्रदान करता है, जो इसे कंटेनराइज़ेशन के लिए उपयुक्त बनाता है और डिप्लॉयमेंट की कई जटिलताओं को सरल कर देता है।
यह Docker इमेज सभी आवश्यक डिपेंडेंसीज़ शामिल करती है ताकि डेवलपमेंट और प्रोडक्शन वातावरण में एकरूपता बनी रहे। हालाँकि, आप आधिकारिक इमेज को अपनी एप्लिकेशन की अतिरिक्त आवश्यकताओं के लिए एक्सटेंड कर सकते हैं। डिप्लॉयमेंट प्रक्रिया आम तौर पर निम्न शामिल करती है:
अपनी एप्लिकेशन के लिए एक Dockerfile बनाएँ।
एक कंटेनर इमेज बनाएं।
उस इमेज को अपने चुने हुए होस्टिंग प्लेटफ़ॉर्म पर डिप्लॉय करें।
निष्कर्ष
NiceGUI एक ऐसा Python फ्रेमवर्क है जो उपयोग में आसान है, रियल-टाइम में काम करता है, और अन्य लोकप्रिय लाइब्रेरीज़ के साथ इस्तेमाल किया जा सकता है। इसलिए, चाहे आप छोटे या बड़े प्रोजेक्ट पर काम कर रहे हों, NiceGUI एक अच्छा विकल्प है।
मैं एक कंटेंट स्ट्रैटेजिस्ट हूँ जिसे जटिल विषयों को सरल बनाना पसंद है। मैंने Splunk, Hackernoon, और Tiiny Host जैसी कंपनियों को अपने दर्शकों के लिए आकर्षक और सूचनात्मक सामग्री बनाने में मदद की है।
NiceGUI FAQs
क्या मैं उन्नत इंटरैक्शंस के लिए NiceGUI में JavaScript का उपयोग कर सकता/सकती हूँ?⌄
हालाँकि NiceGUI का उपयोग करते समय JavaScript की आवश्यकता नहीं होती, आप उन्नत इंटरैक्शन और एनीमेशन के लिए कस्टम JavaScript कोड शामिल कर सकते हैं।
क्या NiceGUI थीम कस्टमाइज़ेशन सपोर्ट करता है?⌄
NiceGUI स्टाइलिंग के लिए Tailwind CSS का उपयोग करता है। आप इसकी कॉन्फ़िगरेशन को संशोधित कर कस्टम थीम बना सकते हैं और उन्हें अपनी NiceGUI एप्लिकेशंस पर लागू कर सकते हैं।
क्या मैं NiceGUI को डेटाबेस के साथ उपयोग कर सकता/सकती हूँ?⌄
हाँ, आप Python की लाइब्रेरीज़ का उपयोग करके NiceGUI को डेटाबेस के साथ इंटीग्रेट कर सकते हैं।
NiceGUI सेशन मैनेजमेंट को कैसे संभालता है?⌄
NiceGUI में सेशन मैनेजमेंट को FastAPI के सेशन और कुकी मैनेजमेंट फीचर्स से संभाला जा सकता है। आप उपयोगकर्ता सेशन और स्टेटफ़ुल इंटरैक्शंस भी बना और प्रबंधित कर सकते हैं।
%22%3E%3Cpath%20d%3D%22m-369%200h408v79h-408z%22%20fill%3D%22%237933ff%22%2F%3E%3Cpath%20d%3D%22m-148%200h306v45h-306z%22%20fill%3D%22%23974dff%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E)
%22%2F%3E%3C%2FclipPath%3E%3Cg%20clip-path%3D%22url(%23a)%22%3E%3Cpath%20d%3D%22m76%200h484v36h-484z%22%20fill%3D%22%23974dff%22%2F%3E%3Cpath%20d%3D%22m0%200h384v24h-384z%22%20fill%3D%22%2306bdfc%22%20transform%3D%22matrix(1%200%200%20-1%200%2060)%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E)
NiceGUI एक Python-आधारित UI फ्रेमवर्क है जो वेब इंटरफेस बनाना आसान बनाता है। यह डेवलपर्स को वेब एप्लिकेशंस के लिए ग्राफिकल यूज़र इंटरफेस (GUIs) बनाने देता है, वह भी बिना HTML, CSS, या JavaScript जाने।
इस लेख में, मैं बताऊंगा कि आप NiceGUI का उपयोग करके उपयोगकर्ता-अनुकूल इंटरफेस कैसे बना सकते हैं। लेकिन, यदि आप Python में नए हैं, तो पहले हमारा Introduction to Python कोर्स करें और फिर अपने कौशल मजबूत करने के लिए Python Programming स्किल ट्रैक पर आगे बढ़ें।
NiceGUI क्या है?
NiceGUI एक Python लाइब्रेरी है जो केवल Python कोड के साथ वेब-आधारित यूज़र इंटरफेस बनाने में मदद करती है। यदि आप एक Python डेवलपर हैं जो UI बनाना चाहते हैं और HTML, CSS, या JavaScript से बचना चाहते हैं, तो NiceGUI आपके लिए है। यह तीन मुख्य तकनीकों पर आधारित है:
हालाँकि (और यही वास्तव में NiceGUI की खासियत है) NiceGUI को प्रभावी ढंग से उपयोग करने के लिए आपको इन तकनीकों को समझने की ज़रूरत नहीं है। यह छोटे वेब एप्लिकेशंस से लेकर जटिल प्रोजेक्ट्स तक के लिए पर्याप्त रूप से बहुमुखी है। इसकी एक बड़ी ताकत है—उसकी सुलभता। आप कम से कम कोड के साथ काम करने वाले इंटरफेस बना सकते हैं, भले ही आप Python में नए हों। नीचे के कोड पर नज़र डालें, मैं बताता हूँ कैसे।
NiceGUI के साथ शुरुआत
यहाँ, मैं इंस्टॉलेशन प्रक्रिया कवर करूँगा और आपका पहला सरल एप्लिकेशन बनाने में मार्गदर्शन दूँगा।
इंस्टॉलेशन प्रक्रिया
NiceGUI इंस्टॉल करने के कई तरीके हैं, जो आपकी पसंद पर निर्भर करते हैं। इसे इस तरह करें। अपने टर्मिनल या कमांड प्रॉम्प्ट में निम्न कमांड चलाएँ। मैं आपके टूल के अनुसार विकल्प दे रहा हूँ।
pip के ज़रिए इंस्टॉल करें
PyPI के ज़रिए इंस्टॉल करें
Docker के ज़रिए इंस्टॉल करें
conda-forge के ज़रिए इंस्टॉल करें
सबसे पहले,
conda-forgeको अपने चैनलों की सूची में इस तरह जोड़ें:conda-forgeचैनल सक्षम करने के बाद, NiceGUI इंस्टॉल करने के लिए निम्न कमांड चलाएँ:पहला सरल एप्लिकेशन
आपने NiceGUI इंस्टॉल कर लिया है, तो अब हमारा पहला इंटरफेस बनाने का समय है। आइए एक बुनियादी उदाहरण लें — एक साधारण हेलो संदेश दिखाना। पहले, एक नया Python फ़ाइल बनाएँ (जैसे,
app.py)। फिर, निम्न कोड लिखें:अब कोड चलाएँ। आप इसे सेव करके run बटन पर क्लिक करके चला सकते हैं या टर्मिनल में निम्न कमांड लिखें:
NiceGUI का उपयोग कर लेबल दिखाएँ। चित्र: लेखक।
NiceGUI की प्रमुख विशेषताएँ
NiceGUI अपनी सादगी, इंटरैक्टिविटी, और इंटीग्रेशन क्षमताओं के लिए लोकप्रिय हो रहा है। यहाँ उन बातों का सार है जो इसे डेवलपर्स के लिए उपयोगी फ्रेमवर्क बनाती हैं।
उपयोगकर्ता-अनुकूल इंटरफेस
Streamlit या Dash जैसे अन्य टूल्स के विपरीत, आप NiceGUI से बहुत कम कोड में ग्राफिकल यूज़र इंटरफेस बना सकते हैं। उदाहरण के लिए:
उपरोक्त कोड में, मैं एक बटन परिभाषित करता हूँ और उसका क्लिक इवेंट हैंडल करता हूँ। जब मैं बटन क्लिक करता हूँ, तो button was pressed संदेश पॉप अप होता है। बस इतना ही। यह सबसे जटिल उदाहरण नहीं है, लेकिन आप देख सकते हैं कि बिना कॉन्फ़िगरेशन या जटिल लॉजिक के मैंने कितनी जल्दी एक फ़ंक्शनल UI सेट कर दिया।
बटन और नोटिफिकेशन के साथ NiceGUI इंटरफेस। चित्र: लेखक।
रियल-टाइम इंटरैक्टिविटी
NiceGUI के साथ आप ऐसे रियल-टाइम इंटरैक्टिव UI भी बना सकते हैं जो आपके ब्राउज़र में तुरंत प्रतिक्रिया दें। जब आप बैकएंड पर बदलाव करते हैं, तो WebSocket कनेक्शंस की बदौलत वे अपडेट फ्रंटएंड पर तुरंत दिखते हैं। सर्वर और क्लाइंट के बीच यह निरंतर संचार का मतलब है कि अपडेट देखने के लिए आपको पेज रिफ्रेश नहीं करना पड़ता।
जैसे ही आप स्लाइडर को मूव करते हैं, लेबल बिना पेज रीलोड किए तुरंत अपडेट हो जाता है। यह NiceGUI का एक लाभ दिखाता है, खासकर Streamlit और Dash जैसे फ्रेमवर्क्स की तुलना में, जहाँ अपडेट के लिए अक्सर अधिक प्रयास करना पड़ सकता है।
स्लाइडर बनाना। चित्र: लेखक।
विज़ुअल एलिमेंट्स और लेआउट्स
NiceGUI में लेआउट विकल्प उपलब्ध हैं, जिनमें बटन, स्लाइडर, चार्ट्स, और 3D एलिमेंट्स शामिल हैं। आप इन एलिमेंट्स को पंक्तियों, कॉलम्स और कार्ड्स में व्यवस्थित कर सकते हैं—वह भी HTML या CSS लिखे बिना। उदाहरण:
मैंने इस कोड से एक इंटरैक्टिव लेआउट बनाया। कोड पहले NiceGUI से आवश्यक मॉड्यूल इम्पोर्ट करता है। फिर यह दो बटनों वाला एक कॉलम और दो कार्ड्स वाली एक रो बनाता है। पहले कार्ड में तापमान नियंत्रण है, जिसमें एक लेबल और तापमान समायोजित करने के लिए स्लाइडर है। दूसरे कार्ड में एक लाइन चार्ट है। अंत में,
ui.run()परिणाम प्रदर्शित करने के लिए कोड चलाता है।विज़ुअल एलिमेंट्स और लेआउट्स बनाना। चित्र: लेखक।
बाहरी लाइब्रेरीज़ के साथ इंटीग्रेशन
यदि आप डेटा साइंस या विज़ुअलाइज़ेशन में रुचि रखते हैं, तो अच्छी खबर है — NiceGUI NumPy, Matplotlib, और Plotly जैसी लोकप्रिय Python लाइब्रेरीज़ के साथ अच्छी तरह काम करता है। मान लीजिए आप ऐसे डेटा साइंस प्रोजेक्ट्स पर काम कर रहे हैं जिनमें जटिल डेटा प्रोसेसिंग या विज़ुअलाइज़ेशन की ज़रूरत है। इस स्थिति में, आप इन लाइब्रेरीज़ का उपयोग Python में सामान्य रूप से कर सकते हैं, और NiceGUI आपके लिए परिणाम वेब-आधारित इंटरफेस में दिखा देगा।
यहाँ एक उदाहरण है कि आप Matplotlib और NumPy के साथ NiceGUI का उपयोग करके वेब-आधारित इंटरफेस में एक बुनियादी डेटा विज़ुअलाइज़ेशन कैसे बना सकते हैं। पहले, आवश्यक लाइब्रेरीज़ इंस्टॉल करने के लिए यह कमांड चलाएँ:
अब, एक सरल Python स्क्रिप्ट बनाएँ जो एक प्लॉट जनरेट करे और NiceGUI का उपयोग करके उसे इस तरह दिखाए:
NiceGUI, Matplotlib और NumPy के साथ इंटरैक्टिव प्लॉट। चित्र: लेखक।
उन्नत फीचर्स और उपयोग के मामले
अब जब आपको NiceGUI की बुनियादी जानकारी है, तो इसके कुछ उन्नत फीचर्स देखें। ये आपको अधिक जटिल और इंटरैक्टिव वेब ऐप्स बनाने में मदद करेंगे।
डेटा डैशबोर्ड्स
मूलभूत लेआउट्स के अलावा, आप NiceGUI का उपयोग कर लाइव डेटा दिखाने वाले डैशबोर्ड भी बना सकते हैं। ऐसे करें:
उदाहरण के लिए, मैंने NiceGUI और Matplotlib का उपयोग करके लाइव स्टॉक प्राइस दिखाने वाला एक वित्तीय डैशबोर्ड बनाया।
आप अपनी ऐप को लाइव डेटा स्ट्रीम करने वाले API से भी कनेक्ट कर सकते हैं। ऐसा करने के लिए, Matplotlib या Plotly आपको ऐसे चार्ट्स बनाने में मदद करेंगे जो नया डेटा आते ही स्वतः रीफ्रेश हो जाएँ, जिससे उपयोगकर्ताओं को रियल-टाइम मार्केट व्यू मिले।
मशीन लर्निंग इंटरफेस
NiceGUI मशीन लर्निंग प्रोजेक्ट्स के साथ भी अच्छी तरह काम करता है। इसे इस तरह उपयोग कर सकते हैं:
उदाहरण के तौर पर, मैंने एक लीनियर रिग्रेशन के लिए इंटरफेस बनाया:
ML में NiceGUI का इंटीग्रेशन। चित्र: लेखक।
NiceGUI बनाम अन्य Python UI फ्रेमवर्क्स
जब आप नया प्रोजेक्ट शुरू करते हैं, तो आप NiceGUI की तुलना Streamlit, Dash, और JustPy जैसे लोकप्रिय Python विकल्पों से कर सकते हैं। हालाँकि हर फ्रेमवर्क की खूबियाँ और कमियाँ होती हैं जो आपके प्रोजेक्ट के विकास को प्रभावित कर सकती हैं, आइए इन्हें उपयोग में आसानी और परफॉर्मेंस के संदर्भ में तुलना करें।
जब आप अपनी ऐप बना लेते हैं, तो आप उसे दूसरों के साथ साझा करना चाहेंगे। डिप्लॉयमेंट आपकी ऐप को इंटरनेट या लोकल नेटवर्क पर उपयोगकर्ताओं के लिए उपलब्ध कराता है। चूँकि NiceGUI ऐप्स Python-आधारित हैं, आपके पास कई डिप्लॉयमेंट विकल्प होते हैं।
क्लाउड डिप्लॉयमेंट विकल्प
आप Google Cloud Run या AWS में से चुन सकते हैं — क्लाउड डिप्लॉयमेंट के दो लोकप्रिय विकल्प। इन प्लेटफ़ॉर्म्स पर अपनी ऐप डिप्लॉय करने के बुनियादी चरण इस प्रकार हैं:
डिप्लॉयमेंट प्रक्रिया आपके इस्तेमाल किए गए क्लाउड प्लेटफ़ॉर्म के प्रकार के अनुसार थोड़ी भिन्न हो सकती है। फिर भी, लगभग सभी क्लाउड प्लेटफ़ॉर्म उपयोग में आसान इंटरफेस और CLI टूल्स प्रदान करते हैं, जो क्लाउड होस्टिंग में नए लोगों के लिए भी इस प्रक्रिया को सरल बनाते हैं।
Docker सपोर्ट
Docker आपको अपनी ऐप और उसकी सभी डिपेंडेंसीज़ को एक सिंगल कंटेनर में पैकेज करने देता है, जिसे किसी भी सिस्टम पर, जो Docker सपोर्ट करता है, आसानी से डिप्लॉय किया जा सकता है। NiceGUI एक Docker इमेज भी प्रदान करता है, जो इसे कंटेनराइज़ेशन के लिए उपयुक्त बनाता है और डिप्लॉयमेंट की कई जटिलताओं को सरल कर देता है।
यह Docker इमेज सभी आवश्यक डिपेंडेंसीज़ शामिल करती है ताकि डेवलपमेंट और प्रोडक्शन वातावरण में एकरूपता बनी रहे। हालाँकि, आप आधिकारिक इमेज को अपनी एप्लिकेशन की अतिरिक्त आवश्यकताओं के लिए एक्सटेंड कर सकते हैं। डिप्लॉयमेंट प्रक्रिया आम तौर पर निम्न शामिल करती है:
निष्कर्ष
NiceGUI एक ऐसा Python फ्रेमवर्क है जो उपयोग में आसान है, रियल-टाइम में काम करता है, और अन्य लोकप्रिय लाइब्रेरीज़ के साथ इस्तेमाल किया जा सकता है। इसलिए, चाहे आप छोटे या बड़े प्रोजेक्ट पर काम कर रहे हों, NiceGUI एक अच्छा विकल्प है।
यह जानने के लिए कि GUIs काम के भविष्य को कैसे आकार दे रहे हैं, GUIs and the Future of Work ट्यूटोरियल देखें। यदि आप AI एप्लिकेशंस पर काम कर रहे हैं और यूज़र इंटरफेस बनाने के लिए एक और तरीका ढूंढ रहे हैं, तो इस ट्यूटोरियल को देखें: Building User Interfaces For AI Applications with Gradio in Python.