Django After Web 2.0

ࣗݾ঺հ (JP) • ৉ ࢠሯ • νϣϯɾζʔϐϯ • @uranusjr

Me • Call me TP • Follow @uranusjr • https://uranusjr.com

http://macdown.uranusjr.com

https://docs.pipenv.org

www. .com

https://web.archive.org/web/20050801014309/http://www.djangoproject.com:80/

Dynamic Web Pages

The Cycle Client Django Request Response

It Works.

Image Credit: Kevin Fox

Single-Page Application Client Django Request Skeleton User Data Data Render
Interact

Frontend Framework Django REST Framework Django Model API

Why Django At All?

Django DB Forms Generic Views Templates URLs Admin Model Forms

Django DB URLs Django REST Framework View Sets Filters Routers
Serializers API Views

ORM Library REST

ORM • SQLAlchemy • PeeWee • PonyORM • … REST
• APIStar • Falcon • Flask? Pyramid? • Plain CGI (!)

Position of Django

Page-Based • Django is a back-end framework • Let it
do what it is good at • Connect front and back in templates

Static Frontend Framework

<!DOCTYPE html> <html> <head> <title>This is a bad idea</title> <script
src="react.js"></script> <script src="react-dom.js"></script> </head> <body>  </body> </html>

Modern Front End • ES6 with modules, TypeScript, etc. •
SCSS, LESS, Stylus, etc. • NPM and application bundler!

{% load static compress %} {% compress css %} <link
rel="stylesheet" type="text/x-scss" href="{% static 'site.scss' %}"> {% endcompress %} {% compress js %} <script type="module" src="{% static 'site.js' %}"></script> {% endcompress %}

https://owais.lone.pw/blog/webpack-plus-reactjs-and-django/

{% load webpack_loader %} {% render_bundle 'main' 'css' %} {%
render_bundle 'main' 'js' %}

django-parcel?

View Template Frontend Framework Context ???

<script> var data
= {{ data_json|safe }} </script> {% render_bundle 'main' 'js' %}

<script> var data
= JSON.parse('{{ data_json|escapejs }}') </script> {% render_bundle 'main' 'js' %}

Take a Step Back

View Template Frontend Framework Produces context Renders  the UI Also
renders the UI??

https://stimulusjs.org

Stimulus • By Basecamp (maintainers of Rails) • Interacts with
the DOM directly • Works well with PJAX (Turbolinks)

Stimulus • Easy parallel from Rails to Django • Use
what’s already there—templates • Mostly server-side integration

Stimulus framework jQuery re-imagined Works for Django too

Django’s Next Steps

DISCLAIMER

Vue (plus tools) Django DB Forms Generic Views Templates URLs
Admin Model Forms Components View View Model Style States Router DOM

https://channels.readthedocs.io/

https://pybee.org/project/projects/bridges/batavia/

SHAVE THE YAK

Summary • Pure SPAs don’t really need Django • Django
is still very good for modern MPA • How can Django ﬁt into the SPA model?

Django After Web 2.0

Django After Web 2.0

More Decks by Tzu-ping Chung

Other Decks in Programming

Featured

Transcript