[Django] #30296: Add how-to guide for JavaScript frameworks integration
Django
-------------------------------------+-------------------------------------
Reporter: Maciej | Owner: nobody
Olko |
Type: New | Status: new
feature |
Component: | Version:
Documentation | Keywords: javascript, rest,
Severity: Normal | api, assets
Triage Stage: | Has patch: 0
Unreviewed |
Needs documentation: 0 | Needs tests: 0
Patch needs improvement: 0 | Easy pickings: 0
UI/UX: 0 |
-------------------------------------+-------------------------------------
Question "How do I get Django and my JS framework to work together?" is
common question being searched on the Internet {1}{2} so it should be
vital to have at least introduction to this topic in Django's
documentation.
How-to guide would consist of two parts (B and C original descriptions by
Ayeric Augustin {3}):
A. Consider brief introduction how to make JSON response, what is a REST
API and link to API creation Django Packages grid?
B. Singe Page App model description — where Django only serves the API
We would need to explain CORS and CSRF in the clearest terms possible.
Many devs end up shotgun-debugging CORS or CSRF errors, which always
results in insecure deployments. (…) Perhaps a condensed version of Django
React SPA Aymeric's blog post {4} could do the job? (…)
C. Description of integrating a modern JS framework with
django.contrib.staticfiles
(…) The docs should at least give the general idea of "compile your
frontend to somewhere Django can find the files, then run collectstatic".
Discussion on django-developers: https://groups.google.com/d/topic/django-
developers/KVAZkRCq9KU/discussion
Related:
* https://fractalideas.com/blog/making-react-and-django-play-well-
together/
* https://fractalideas.com/blog/making-react-and-django-play-well-
together-hybrid-app-model/
* https://fractalideas.com/blog/making-react-and-django-play-well-
together-single-page-app-model/
* https://djangopackages.org/grids/g/api/
* https://djangopackages.org/grids/g/asset-managers/
* https://djangopackages.org/packages/p/django-cors-headers/
* https://code.djangoproject.com/wiki/AJAX
{1} https://stackoverflow.com/questions/41867055/how-to-get-django-and-
reactjs-to-work-together
{2} https://stackoverflow.com/questions/28590177/django-back-end-with-a
-dynamic-front-end-angularjs
{3} https://groups.google.com/d/msg/django-
developers/KVAZkRCq9KU/rt24LMnPCAAJ
{4} https://fractalideas.com/blog/making-react-and-django-play-well-
together-single-page-app-model/
--
Ticket URL: <https://code.djangoproject.com/ticket/30296>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.
Django
-------------------------------------+-------------------------------------
Type: New feature | Status: new
Component: Documentation | Version:
Severity: Normal | Resolution:
Keywords: javascript, rest, | Triage Stage: Accepted
api, assets |
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------
* stage: Unreviewed => Accepted
Comment:
Accepting, yes. This kind of guide would be great I think. (I guess the
difficulty is pitching it exactly right, but that's implementation... 🙂)
--
Ticket URL: <https://code.djangoproject.com/ticket/30296#comment:1>
Django
-------------------------------------+-------------------------------------
| Rousek
Type: New feature | Status: assigned
Component: Documentation | Version:
Severity: Normal | Resolution:
Keywords: javascript, rest, | Triage Stage: Accepted
api, assets |
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------
* owner: nobody => Josef Rousek
* status: new => assigned
--
Ticket URL: <https://code.djangoproject.com/ticket/30296#comment:2>
Django
-------------------------------------+-------------------------------------
| Rousek
Type: New feature | Status: assigned
Component: Documentation | Version:
Severity: Normal | Resolution:
Keywords: javascript, rest, | Triage Stage: Accepted
api, assets |
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------
Comment (by tapaswenipathak):
Hello folks: Can I take the ticket or the ticket is for internal folks?
--
Ticket URL: <https://code.djangoproject.com/ticket/30296#comment:3>
Django
-------------------------------------+-------------------------------------
| Rousek
Type: New feature | Status: assigned
Component: Documentation | Version:
Severity: Normal | Resolution:
Keywords: javascript, rest, | Triage Stage: Accepted
api, assets |
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------
Comment (by Josef Rousek):
Replying to [comment:3 tapaswenipathak]:
> Hello folks: Can I take the ticket or the ticket is for internal folks?
Hi there. Feel free to take it. I created a repo with basic guide, but
haven't got back. https://github.com/stlk/django-webpack
--
Ticket URL: <https://code.djangoproject.com/ticket/30296#comment:4>
Django
-------------------------------------+-------------------------------------
Type: New feature | Status: new
Severity: Normal | Resolution:
Keywords: javascript, rest, | Triage Stage: Accepted
api, assets |
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------
* owner: Josef Rousek => (none)
* status: assigned => new
--
Ticket URL: <https://code.djangoproject.com/ticket/30296#comment:5>
Django
-------------------------------------+-------------------------------------
Type: New feature | Status: new
Component: Documentation | Version:
Severity: Normal | Resolution:
Keywords: javascript, rest, | Triage Stage: Accepted
api, assets |
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------
Comment (by Thomas Güttler):
I think the first step would be to focus on how to get a library which you
can install via npm integrated into Django.
CORS, APIs, DRF ... are a different topic (and I think it is out of scope)
But I think this should be documented:
Imagine you want to integrate a simple npm installable JS library like:
https://github.com/BlueM/form-change-tracker
It is not that super simple, because above library has a dependency.
The task is not really hard. But up to now everybody does it in a
different way. It would be nice to have
a simple default way of integrating npm installable JS libraries.
--
Ticket URL: <https://code.djangoproject.com/ticket/30296#comment:6>