PyScript and Django: Basic PyScript Frontend and DOM manipulations | PyScript tutorial

This is a very simple project built with PyScript and Django.
Django on the backend side, and Pyscript as the frontend.

The main idea of the video is to show how to use only Python both for backend and frontend.

I wanted to show how to make AJAX (asynchoronous) GET and POST requests with Pyscript to Django project, and how to manipulate DOM with Pyscript.

The frontend of the project is written with Pyscript. When i'm clicking on the green button ... Pyscript sends a GET request to my Flask application and gets a random number from 1 to 10...

When I click on a card... Pyscript sends a POST request to the Django app and gets the float version of the sent numbers.

And again the video is about how to use Pyscript to send GET and POST requests to Flask, and how use Pyscript to manipulate with DOM.

Follow me @:

=== 📎 The source code is available via Patreon ===

Timecodes:

00:00 - Demo and description of the Pyscript Django project, attaching Python module to HTML template.
01:09 - Description of the basic Django project.
02:21 - Adding PyScript to Django project as a static file
03:40 - Basic example of DOM manipulations with PyScript (Pyscript onclick event handler and event listener).
06:20 - Sending GET requests with PyScript, using of pyfetch() to send requests to Django (frontend, PyScript side)
13:24 - Accepting a GET request from PyScript (backend, Django side)
15:04 - Checking a request's headers to determine AJAX request
16:15 - Sending POST request with PyScript to Django (frontend, PyScript side)
20:32 - Accepting a POST request from PyScript on Django side
23:02 - Using CSRF token with Pyscript
24:33 - Passing CSRF token with headers to Django
24:49 - Refactoring of header's definition

*** Other Django Tutorials ***

PyScript and Django: Basic PyScript Frontend and DOM manipulations | PyScript tutorial

#pyscript #django #redeyedcoderclub

[RedEyedCoderClub]

What video should I make next? Any suggestions?
Follow me @:

Timecodes:

00:00 - Demo and description of the Pyscript Django project, attaching Python module to HTML template.
01:09 - Description of the basic Django project.
02:21 - Adding PyScript to Django project as a static file
03:40 - Basic example of DOM manipulations with PyScript (Pyscript onclick event handler and event listener).
06:20 - Sending GET requests with PyScript, using of pyfetch() to send requests to Django (frontend, PyScript side)
13:24 - Accepting a GET request from PyScript (backend, Django side)
15:04 - Checking a request's headers to determine AJAX request
16:15 - Sending POST request with PyScript to Django (frontend, PyScript side)
20:32 - Accepting a POST request from PyScript on Django side
23:02 - Using CSRF token with Pyscript
24:33 - Passing CSRF token with headers to Django
24:49 - Refactoring of header's definition

[chillsoftwarengineer]

Can we submit the forms and add validations in the form through pyscript ?

[hidalgodonquijote]

Олег, спасибо за познавательный туториал. Планируете ли вернуться на свой русскоязычный канал?

[najmulsharifworld]

hi boss,
how to import the document under the function ? def on_click(e):

ul =
ul.innerHTML = 'Hello world'

[felixua]

у тебя там f-string, тогда f"I got: {number:.1f}", без float 😉

[CabraBRGamer]

First off all, thank you so much for this very interesting post.
My code before response = await make_request(... is not running and I dont know how to fix it. Any help would be wellcome. Tks

async def submit_form(e):
msg =
city_input =
city = city_input.value

body = json.dumps({'name': city})
response = await make_request(url='/', method='POST', body=body)
msg.innerHTML = response

if response.get('errors'):

else:
city_input.classList = 'form-control is-valid'
p = document.createElement('p')
p.innerHTML = 'Criado elemento ' + response['name']

ul =
li = document.createElement('li')
li.innerHTML = response['name']
ul.appendChild(li)