PyScript :شروع کار با پایتون در مرورگر

تیم Anaconda راه جدیدی را برای اجرای کد پایتون در مرورگر اعلام کردند. آیا این رویکرد جدید می تواند شروع یک تغییر در پشته توسعه frontend باشد؟ در این مقاله، نگاهی به این ویژگی جدید از طریق یک مثال عملی خواهیم انداخت.

مقدمه ای بر PyScript

PyScript یک چارچوب نوظهور (و به جرات می توانم بگویم - اکوسیستم) برای اجرای کد پایتون در مرورگر است.

شما می توانید بدون اتکا به هیچ سروری کدهای پایتون را در داخل مرورگر خود اجرا کنید.

PyScript از Web-Assembly و Pyodide برای پر کردن شکاف بین JavaScript و Python استفاده می کند. این قابلیت امکان ارتباط دو طرفه بین زبان ها را فراهم می کند.همچنین به توسعه دهندگان و دانشمندان داده اجازه می دهد تا قدرت کل اکوسیستم پایتون را در برنامه وب بدون میزبانی هیچ برنامه‌ی تحت سروری آزاد کنند!

1. HTML ساده

بیایید به یک فایل HTML بسیار ساده نگاه کنیم و کد پایتون خود را در آن بسازیم:

صفحه وب حاصل به صورت زیر است:

2. نصب PyScript

خوب.. چیزی برای نصب وجود ندارد!

تنها کاری که باید انجام دهیم این است که 2 تا سورس به هد HTML خود، یک فایل جاوا اسکریپت و یک CSS اضافه کنیم.

تمام!

با اضافه کردن کتابخانه ها در قسمت head دیگر قادر به جاسازی و استفاده از کدهای python هستیم.

3. اسکریپت پایتون خود را بنویسید

حالا بیایید کد پایتون را به فایل HTML خود اضافه کنیم:

با افزودن تگ py-script می توانیم کد پایتون را در آن جاسازی کنیم.

صفحه وب حاصل به شکل زیر است:

ولی... همه خروجی ها را چاپ کرد اما تگ H1 شبیه یک پاراگراف معمولی شد. اینطور نیست؟

این به این دلیله که فایل CSS ارائه شده تمام headingها را بازنویسی و override می کند. اما با این وجود، ما می توانیم کد پایتون خود را بدون وابستگی خارجی در مرورگر اجرا کنیم! ارزشش را دارد!

4. یک مثال پیچیده تر

خب در این مثال از تابع و یک حلقه foreach استفاده کردیم و نتیجه به این شکل در می آید:

5.استفاده از پکیج های پایتون

• به راحتی می توان از پکیج های پایتون با استفاده از تگ py-env استفاده نمود:

به این ترتیب، numpy و matplotlib را به پروژه خود اضافه کرده ایم. حالا بیایید از این بسته ها استفاده کنیم:

6.ترسیم اعداد تصادفی

و نتیجه:

سخن پایانی

PyScript رویکردی تازه را به اکوسیستم پایتون و جاوا اسکریپت ارائه می کند. به معنای واقعی کلمه این دو دنیا را با هم ادغام می کند! دانشمندان علوم داده‌ای که مایلند نتایج تحقیقات خود را به اشتراک بگذارند، اکنون می‌توانند این کار را راحت‌تر انجام دهند. شاید بتوانیم زمینه های جدیدی از توسعه front-end را مشاهده کنیم.

من شخصاً کنجکاو هستم که ببینم ما را به کجا خواهد برد :)

ویدیوی مربوط به این قسمت رو تو یوتیوب براتون میزارم: