Django Front-end Integration
This is not a plugin (library) for Django but
Sample app to explain my thought.
I think It is better to build front-end source code and back-end source code separately. This prject do that.
Django project is so simple. This has 3 apps (app1, app2 and common) and 2 pages. Front-end source code comes from web-starter-kit which is best scaffold for front-end.
If you want to know web-starter-kit please check that repository.
static ├── favicon.ico ├── images ├── robots.txt ├── scripts ├── service-worker.js ├── styles └── tests staticfiles └── .gitkeep .tmp └──
This directory has all static files.
Build script generate code into this directory for production.
front-end source code will be generate into this directory in development.
The build process which is defined in
bin/collectstatic like this...
npm run buildcall gulp build task which generate code into
./manage.py collectstaticcopy above generated front-end code into
$ pip install -r requirements.txt $ npm install $ ./manager.py migrate $ ./manager.py runserver
To compile front-end source code continuously.
$ npm run watch
You know Django has
./manage.py collectstatic to build fron-end source code but we manage front-end source code outside of Django (
static directory). So we have to run that command after front-end build process. This script wrap those command.
Run scripts tests
# run test only 1 time. $ npm test # watch file and if the file is updated re-run it automatically. $ npm run test-watch