Django and JavaScript

UseJSON Encoding for Data Consumed by JavaScript

• DO 😀

{{ page_data|json_script:"page-data" }}
<script>
let data = JSON.parse(document.getElementById('page').textContent);
injectNameIntoDiv('scoopName', data.scoop.name);
</script>

• DON'T 😥

injectNameIntoDiv('sccopName', {{ scoop.name }});

Reference

• 책/Two Scoops of Django 3.x
• https://docs.djangoproject.com/en/3.2/ref/templates/builtins/#json-script
• nodeguide.com/style.html
• github.com/rwaldron/idiomatic.js