(Django) Split frontend and backend - django

Question

I want to split front (Brunch) and back (Django). I have this folder structure:
backend
mydjangoapp
static
mydjangoapp
image
javascripts
stylesheets
index.html
frontend
app
public
image
javascripts
stylesheets
index.html
So for example, path to stylesheet inside index.html would be:
[Backend] static/mydjangoapp/stylesheets/app.css
[Frontend] /stylesheets/app.css
I use frontend paths to test frontend locally with brunch server and backend paths with django app on deploy. Currently deploy procedure looks like this:
brunch build
move content of public folder to backend/static/mydjangoapp
change all paths inside index.html, app.js etc. to match backend
static path.
Not very convenient. Is there a way to do it automatically? I guess i could change static paths in backend to match frontend or write a script to do it. But its not really a proper solution, is it? There must be a way to render index.html directly from frontend folder and load static files without changing paths. Tried to google it, but no luck.

Answer 1

So. I've done some research and came to this solution:
1) I used nginx server in front of my django application and configured it to resolve static files like so (nginx config file, http section):
server {
listen <%= ENV["PORT"] %>;
server_name _;
keepalive_timeout 5;
location / {
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_redirect off;
proxy_pass http://app_server;
}
location ~* .*\/.+\..+$ {
root path/to/my/static/files;
}
}
So static paths are the same as in frontend. No need to change those. Django app don't resolve static files at all. It just loads a template.
2) I wrote a python script to compile and copy needed files to backend (it sits in frontend root directory):
#!/usr/bin/env python
from subprocess import call
import shutil
import os
BACKEND_FOLDER = "../backend/ui/public"
call(["brunch", "build", "-p"])
shutil.rmtree(BACKEND_FOLDER)
shutil.copytree("public", BACKEND_FOLDER)
print ("Deployed to: " + BACKEND_FOLDER)
Now all that i need to do is to run that script.

Answer 2

What you can do is use either post-brunch or after-brunch plugins to copy the files from frontend/public to the django static directory of your choice.
Example with after-brunch
exports.config = {
plugins: {
afterBrunch: [
'cp -r public ../backend/static'
// cp -r /from/frontend/path /to/backend/path
]
}
}
Example with post-brunch
exports.config = {
plugins: {
postBrunch: function(files) {
console.log("Run custom javascript code to copy files.")
}
}
}