Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
django CMS + Channels + DRF = ♥
Search
Iacopo Spalletti
September 17, 2016
Programming
0
310
django CMS + Channels + DRF = ♥
Given at PyCon Uk 2016 17 September 2016
Video:
https://www.youtube.com/watch?v=IW7mi5BIN6U
Iacopo Spalletti
September 17, 2016
Tweet
Share
More Decks by Iacopo Spalletti
See All by Iacopo Spalletti
Django dalle trincee: pattern e pratiche dopo 15 anni di esperienza su Django
yakky
0
60
Writing Async Microservices in Python
yakky
0
690
1 API - 3 Framework - 30 minutes
yakky
0
93
Building real time applications with Django and Channels 2 @ DjangoCon Europe
yakky
1
700
Building real time applications with Django and Channels 2 @ PyCon Italia
yakky
0
550
Building real time applications with Django
yakky
0
680
django knocker
yakky
0
57
django CMS application - A comprehensive approach
yakky
0
52
Liveblogging using channels
yakky
0
41
Other Decks in Programming
See All in Programming
AWS Summit Japan 2024と2025の比較/はじめてのKiro、今あなたは岐路に立つ
satoshi256kbyte
1
250
CIを整備してメンテナンスを生成AIに任せる
hazumirr
0
300
リッチエディターを安全に開発・運用するために
unachang113
1
270
Git Sync を超える!OSS で実現する CDK Pull 型デプロイ / Deploying CDK with PipeCD in Pull-style
tkikuc
4
470
The Modern View Layer Rails Deserves: A Vision For 2025 And Beyond @ RailsConf 2025, Philadelphia, PA
marcoroth
2
830
GPUを計算資源として使おう!
primenumber
1
290
QA x AIエコシステム段階構築作戦
osu
0
210
抽象化という思考のツール - 理解と活用 - / Abstraction-as-a-Tool-for-Thinking
shin1x1
1
860
AI時代の『改訂新版 良いコード/悪いコードで学ぶ設計入門』 / ai-good-code-bad-code
minodriven
24
10k
バイブスあるコーディングで ~PHP~ 便利ツールをつくるプラクティス
uzulla
1
300
DMMを支える決済基盤の技術的負債にどう立ち向かうか / Addressing Technical Debt in Payment Infrastructure
yoshiyoshifujii
4
650
脱Riverpod?fqueryで考える、TanStack Queryライクなアーキテクチャの可能性
ostk0069
0
570
Featured
See All Featured
Building an army of robots
kneath
306
45k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
34
5.9k
Building Flexible Design Systems
yeseniaperezcruz
328
39k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
18
1k
GraphQLとの向き合い方2022年版
quramy
49
14k
Building a Modern Day E-commerce SEO Strategy
aleyda
42
7.4k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.6k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Reflections from 52 weeks, 52 projects
jeffersonlam
351
21k
Raft: Consensus for Rubyists
vanstee
140
7k
Transcript
DJANGO CMS IN THE REAL TIME WEB DJANGO CMS +
CHANNELS + DRF = ♥
HELLO, I AM IACOPO Founder and CTO @NephilaIt django CMS
core developer @yakkys https://github.com/yakky
CONTENT-CENTRIC WEBSITES ARE BORING awesome design little (if any) interesting
code
BUT TIMES ARE A-CHANGIN'
ESCAPING THE CLICK- RELOAD PAIN
SPA ARE COMMONPLACE user interacts with the browser-side interface layer
interface reads/writes data from a backend outcome is shown seamlessly
'90S CALLED: 3-TIER ARCHITECTURE AGAIN (still an advancement over '80s
2-tier of plain web)
WHAT IF YOU MIX SPA AND CMS?
WHAT IF YOU MIX SPA AND CMS? Desktop notifications Real
time content updates Frictionless interaction
REAL WORLD-EXAMPLES Excuse the shameless plugs in the next slides
I focused on this topics in the past months Released
some code as a result I'm going to show you my findings
DJANGO CMS & CHANNELS What if you mix them?
WHAT'S DJANGO CMS? (in a nutshell)
WHAT'S DJANGO CMS One of the mostly widely used CMS
for Django Very simple frontend content editing Template-based page types Load of features available for integration in third- party apps
WHAT'S CHANNELS? (in a micro-nutshell)
WHAT'S CHANNELS Websockets for django \o/ (but it's actually more)
At most-once queue system Bring async to sync django code
WHAT'S CHANNELS Channels parlance ➡ Django concepts: Route ➡ URL
Consumer ➡ View
DESKTOP NOTIFICATIONS!
DESKTOP NOTIFICATIONS! Examples below using django-knocker https://github.com/nephila/django-knocker
DESKTOP NOTIFICATIONS! 0:00 / 0:09
DESKTOP NOTIFICATIONS! @receiver(post_publish) def notify_page_publish(**kwargs): page = kwargs.get('instance') language =
kwargs.get('language') knock = { 'title': 'Page update', 'message': page.get_title(language), 'icon': '/static/img/favicon.ico', 'url': page.get_absolute_url(language), 'language': language } group = Group('knocker-{0}'.format(knock['language'])) group.send({'text': json.dumps(knock)})
DESKTOP NOTIFICATIONS! BEHIND THE SCENES clients are added to a
per-language group as they connect simple js read messages from websocket and display as notifications
DESKTOP NOTIFICATIONS! @channel_session def ws_connect(message): prefix, language = message['path'].strip('/').split('/') gr
= Group('knocker-{0}'.format(language)) gr.add(message.reply_channel) message.channel_session['knocker'] = language
DESKTOP NOTIFICATIONS! notifications.onmessage = function (message) { var data =
JSON.parse(message.data); data = { body: notification.message, icon: notification.icon, tag: 'notifications_' + notification.language, url: notification.url }; var note = new Notification(notification.title, data); note.onclick = function () { document.location = notification.url; }};
LIVEBLOG! What if you can update django CMS page content
in realtime?
EXAMPLE djangocms-blog.liveblog
LIVEBLOG! A special channels-enabled plugin Upon save: Renders itself Emits
a message on a per-post group
LIVEBLOG! 0:00 / 0:46
LIVEBLOG! try: post = Post.objects.....get() except Post.DoesNotExist: message.reply_channel.send({ 'text': json.dumps({'error':
'no_post'}), }) return Group(post.liveblog_group).add(message.reply_channel)
LIVEBLOG! def save(self, *args, **kwargs): super(Liveblog, self).save(*args, **kwargs) notification =
{ 'id': self.pk, 'content': self.render(), 'creation_date': self.creation_date, 'changed_date': self.changed_date, } Group(self.liveblog_group).send({ 'text': json.dumps(notification), })
LIVEBLOG! var data = JSON.parse(message.data); var node = document.querySelectorAll( "div[data-post-id*='"
+ data.id + "']" ); var item = document.createElement('div'); item.innerHTML = data.content; if (node.length > 0) { node[0].parentNode.replaceChild(item.children[0], node[0]); } else { document.getElementById("liveblog-posts").insertBefore( item.children[0], document.getElementById( "liveblog-posts").children[0]); }
LIVEBLOG! Terrible hack: plugins are set in reverse order (latest-first)
upon save
DJANGO CMS + CHANNELS TAKE-HOME Enriched user experience Very simple
integration
DJANGO CMS + DRF
DJANGO CMS + DRF WHAT'S DRF (really?) A framework to
build REST interfaces in Django
DJANGO CMS + DRF LET'S GO ONE STEP BEYOND The
goal: Providing a unified API for web, SPAs, applications Integrating content in non-web environment Preserving the ease of use of a CMS
DJANGO CMS + DRF CURRENT STATE PoC application: djangocms-rest-view Stable
app for django CMS 3.5
DJANGO CMS + DRF DJANGOCMS-REST-VIEW Viewset Serializers A sample angular
client
DJANGO CMS + DRF 0:00 / 0:20
DJANGO CMS + DRF VIEWSETS : full pages list providing
pages metadata : full dump + rendered placeholders content + sekizai context : menu structure pages/ pages/<page-id>/ pages/menu
DJANGO CMS + DRF SERIALIZERS Currently very dumb Just map
the model attributes Provide rendered HTML for each page placeholder (really dumb) Discover sekizai resources in plugins
DJANGO CMS + DRF NEAT FEATURES Provides the sekizai context
⬇ Client load JS/CSS on demand Provides the page template name ⬇ Client can use a custom template for each page
DJANGO CMS + DRF CUSTOM TEMPLATES <div class="rest-header" ng-bind-html="content_page.placeholders.header |
<article class="body"> <div ng-bind-html="content_page.placeholders.content | safe"></div> </article>
DJANGO CMS + DRF SCOPE Very limited now Does not
map every django CMS feature: form submission dynamic apphooks (have to implement custom DRF for external apps) Used by a few projects in production
DJANGO CMS + DRF TAKE-HOME Still road to go Major
hurdle: sensible and simple plugin serialization Benefits are huge Stay tuned!
WHAT'S THE FUTURE Future looks bright!
CHANNELS Channels is maturing quickly Easy integration ➡ tons of
new applications Easily fits in CMS flow ➡ great potential to invent new things
DRF by 2016 - complete experimental phase from 2017 -
let's build REST-powered django CMS platforms
PROJECTS REPOSITORIES django-cms: https://github.com/divio/django-cms channels: https://github.com/django/channels DRF: https://github.com/tomchristie/django-rest-framework django-knocker: https://github.com/nephila/django-knocker
djangocms-blog: https://github.com/nephila/djangocms-blog djangocms-rest-view: https://github.com/nephila/djangocms-rest-view
GRAZIE! Follow me on: https://github.com/yakky https://github.com/nephila https://twitter.com/yakkys
QUESTIONS?