Mari Kita Kenalan Dengan Teknologi PyScript - CRUDPRO

Mari Kita Kenalan Dengan Teknologi PyScript

Apakah anda sudah mendengar tentang Python JavaScript? apakah anda baru mendengarnya? jika iya maka anda wajib membaca artikel ini sampai selesai, mari kita bahas!

CEO Anaconda Peter Wang mengatakan sesuatu yang sangat menarik di PyCon US 2022. PyScript adalah kerangka kerja JavaScript yang membolehkan anda membuat aplikasi Python di browser. Saat ini bisa kode python dapat langsung di sisipkan pada file HTML, di balik PyScript yang sederhana- ilmuwan informasi bisa membuat web website seputar model mereka dalam bahasa kesukaan mereka, asalkan mereka mempunyai pengetahuan basic HTML. HTML seperti SQL di satu area semua orang ketahui itu. anda dapat mendalami lebih dalam apa itu pyscript pada python pada postingan ini, ini adalah teknologi terbaru juga menaikan pengetahuan baru juga untuk anda tentang pyscript.

Pyscript ini memanglah teknologi baru walaupun memang masih belum familiar di kalangan pengembang ataupun programmer, akankah PyScript penuhi hype- nya? Cuma waktu yang hendak memberitahu. Hari ini, aku hendak menampilkan 2 contoh untuk berkenalan atau mengawali dengan PyScript dalam hitungan menit. Beri ketahui aku bila anda mau mangulas topik lebih lanjut, seperti pendidikan mesin serta menanggulangi input pengguna.

Mengapa Pyscript Wajib di pelajari?

PyScript merupakan sistem buat menyisipkan Python dalam HTML( Seperti PHP), bagi Anaconda Cloud. Ini berarti anda dapat menulis serta melaksanakan kode Python diantara tag HTML, memanggil library JavaScript, serta menanggulangi nyaris seluruh perihal yang terpaut dengan pengembangan website. Dengan adanya Pyscript ini berarti anda saat ini dapat membangun aplikasi basis web menggunakan bahasa python, ini merupakan terobosan bagi web developer juga :).

Tidak hanya itu, anda tidak perlu takut tentang pelaksanaan, sebab seluruhnya terjalin di browser. anda bisa memberikan model serta dasbor anda selaku file HTML, yang hendak melaksanakan kode tiap kali seorang membukanya di browser website. Apik sekali bukan? PyScript dibentuk di atas Pyodide, yang ialah port CPython ke WebAssembly atau Emscripten:

WebAssembly merupakan teknologi yang digunakan untuk menulis kode website menggunakan Python. Ini merupakan salah satu bahasa tingkatan rendah seperti perakitan dengan format biner kompak yang berjalan dengan kinerja nyaris asli serta sediakan bahasa dengan sasaran kompilasi sehingga mereka bisa berjalan di website, bagi Mozilla. Namun gimana anda dapat benar menggunakan PyScript? Ayo kita jawab berikutnya.

Cara Menggunakan PyScript

Anda dapat mengunduh rilis alfa PyScript di https://pyscript.net . kita tidak akan mengunduh file librarynya. Sebagai gantinya, kami akan menyisipkan cdn PyScript. Sebagai referensi, berikut adalah library yang harus anda gunakan atau lebih jelasnya anda dapat menggunakan ke web resminya:

<link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
<script defer src="https://pyscript.net/alpha/pyscript.js"></script>

PyScript membolehkan anda buat menulis Python dalam HTML memakai komponen berikut:

  • py-envberguna untuk mendefinisikan paket Python yang diperlukan untuk mengeksekusi kode Python anda.
  • py-script Bagian dari file HTML tempat anda menulis kode Python.
  • py-repl berguna untuk membuat komponen REPL yang mengevaluasi kode yang dimasukkan pengguna serta menunjukkan hasilnya.

Kami hendak menanggulangi 2 yang awal hari ini serta menaruh yang terakhir buat sebagian waktu lain. Ayo kita amati gimana anda bisa menulis program Hello World simpel di PyScript.

Contoh PyScript 1 - Hello World

Pada code editor yang anda gunakan, anda dapat menuliskan ciri seru diiringi dengan Tab buat membuat struktur dokumen HTML bawah. Di dalam<head tag, tambahkan 2 tautan yang disebutkan di bagian lebih dahulu. Contoh hello world tidak membutuhkan pustaka Python eksternal, jadi kita dapat membuang<py- env bagianitu sama sekali. Saat sebelum</ body tagpenutup, buka<py- script tagbaru yang hendak berisi logika Python. Perhatikan saja lekukannya- yang terbaik merupakan menghapusnya seluruhnya. Pemformatan tidak nampak bagus, namun anda hendak memperoleh kesalahan kebalikannya. Apa yang hendak kita jalani sederhana- cetak pesan hello world serta kabar datetime dikala ini:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
    <title>First Python HTML app</title>
</head>
<body>
    <py-script>
from datetime import datetime 
 
print("Hello World!")
print(f"It's now {datetime.now()}")
    </py-script>
</body>
</html>

Buka file HTML di browser, inilah yang hendak anda amati dalam sebagian detik:

Ini akan membawa Anda lebih banyak waktu untuk membuat kode di Flask, jadi PyScript sudah menunjukkan dirinya sebagai alternatif yang layak. Mari kita membahas contoh yang lebih kompleks berikutnya.

Contoh PyScript 2 - Bagan dengan Bokeh

Tanpa bagan, Anda tidak dapat membuat dasbor di sekitar produk data Anda. PyScript Saat ini tidak mendukung Plotly, jadi Anda harus memilihnya Matplotlib atau Bokeh. Mari kita pergi ke akhir. Ini membutuhkan banyak skrip Bokeh JavaScript, jadi salin saja dari cuplikan di bawah ini. Kali ini kita mengandalkan library Python eksternal Bokeh, jadi pastikan untuk menentukannya di tag . Saya menyalin contoh bagan dari galeri Bokeh untuk melihat cara kerjanya:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://pyscript.net/alpha/pyscript.css" />
    <script defer src="https://pyscript.net/alpha/pyscript.js"></script>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-2.4.2.min.js"></script>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-gl-2.4.2.min.js"></script>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-widgets-2.4.2.min.js"></script>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-tables-2.4.2.min.js"></script>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-mathjax-2.4.2.min.js"></script>
    <title>Bokeh Example</title>
    <py-env>
    - bokeh
    </py-env>
</head>
<body>
    <h1>Bokeh Example in PyScript</h1>
    <div id="chart"></div>
 
    <py-script>
		import json 
		import pyodide 
		from js import Bokeh, console, JSON
		from bokeh.embed import json_item
		from bokeh.plotting import figure
		from bokeh.resources import CDN
		 
		fruits = ['Apples', 'Pears', 'Nectarines', 'Plums', 'Grapes', 'Strawberries']
		counts = [5, 3, 4, 2, 4, 6]
		p = figure(x_range=fruits, height=350, title="Fruit Counts", toolbar_location=None, tools="")
		p.vbar(x=fruits, top=counts, width=0.9)
		p.xgrid.grid_line_color = None
		p.y_range.start = 0
		p_json = json.dumps(json_item(p, "chart"))
		Bokeh.embed.embed_item(JSON.parse(p_json))
    </py-script>
</body>
</html>

Anda dapat melihat, Tidak perlu mengetikan seluruh kode pada aplikasi web hanya untuk menampilkan bagan sederhana. Itulah salah satu kelebihan PyScript.

Python untuk Web dengan PyScript

Sederhananya, PyScript menyederhanakan proses penyajian produk data secara visual dan interaktif. apakah itu solusi terbaik? Tidak, setidaknya belum. Apakah ini yang paling mudah untuk memulai? dengan pukulan panjang. Saya senang melihat apa yang dibawa oleh rilis PyScript di masa mendatang. Seperti yang disebutkan pada web resminya, ini masih dalam versi alfa dan kemungkinan akan realis ke versi beta hingga production dan wajib kita tunggu, jadi harapkan banyak perubahan di masa mendatang. Beri tahu saya jika Anda tertarik menggunakan PyScript yang lebih canggih. Misalnya, membuat dasbor di sekitar model pembelajaran mesin.

Apa pendapat Anda tentang PyScript? Apakah Anda berencana untuk menggunakannya sebagai pengganti aplikasi web dasar Python? Beri tahu kami di bagian komentar di bawah.