PyScript for Education

Blake Rayfield Ph.D.

Northern Arizona University

A talk about education...

Simple Example

Whats Happening?

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Simple Example</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link rel="stylesheet" href="https://pyscript.net/releases/2023.03.1/pyscript.css" />
    <script defer src="https://pyscript.net/releases/2023.03.1/pyscript.js"></script>
</head>
<body>
    <py-script src=./main.py></py-script>
    <h2>Solve this simple math problem</h2>
    <div id='problem'></div>
    <input id='student-answer'>
    <button id='submit-answer' py-click="check_answer()" class='py-button'>Submit Answer</button>
    <div id='answer'></div>

</body>
</html>

Whats Happening?

#### main.py ####
import random
from pyscript import Element

r1 = random.randint(3, 9)
r2 = random.randint(3, 9)
SignOptions = ["+","-"]
sign_ = random.choice(SignOptions)

display(str(r1) + " " + sign_ + " " + str(r2) + " =", target='problem', append='True')

def check_answer():
    evaluation = Element("problem").innerHtml
    evaluation = evaluation.replace("<div>","")
    evaluation = evaluation.replace("</div>","")
    evaluation = evaluation.replace("=","")
    response_ = Element("student-answer").value
    if str(eval(evaluation)) == str(response_):
        Element("answer").write("Great Job!!!")
    else:
        Element("answer").write("Try Again")

What is the potential of PyScript in education

Early Education

Higher Education

What makes PyScript unique education?

Reason One.

  • Closer to what researchers/academics are already using across disciplines.
    • We (academics) are using this, and it’s not just CS and Engineering.

Two..

  • PyScript is (too) easy to understand, create, and “deploy.”
    • We can easily adapt research or other creations to the classroom with minimum “fitting” or costs.
    • Students can access it anywhere, with minimal requirements.

Three...

  • More flexible, and brings students closer to the material than existing tools (notebooks).

 

  • Many disciplines want students to focus on the content specific material, not the code.

 

Moving Beyond the Notebook

Moving Beyond the Notebook

A special note on notebooks

  • Notebooks are great when students have or you want students to have a programming background.

  • However, notebooks don’t let the content take the lead. PyScript seems to be a happy medium where you can push the content, while having the ability to change the code.

 

Bottom line, we don't always want students to have to confront the code.

Another Example

What are the advantages of Python and Pyscript over other frameworks like Flask?

Simplicity, function, and integration

  • Simplicity: No install, no server, "no" framework

Simplicity, function, and integration

  • Function: Direct relation to what academics are already doing.

Simplicity, function, and integration

  • Integration: The ability to use JS and Python with little to no work.

JS can do things Python has never needed

So where can we go?

My wish list

Wish List

  • The ability to export notebooks to PyScript.

Wish List

  • Better support for distribution, without internet...
A heat map of the worlds internet utilization.

A unique approach to PyScript app creation/managment

More support, better docs, and support for those that help...

Thank you

Blake Rayfield

blake.rayfield@nau.edu