Frontend Dev and Prod

[ericsandine]

I added a little bit to the README about how to build and deploy this but I can go over it a bit more in person so we can figure out what I'm missing.

For development we start a react dev server and the django server. The react server proxies to localhost:8000 so all api calls go to django, in the react app we'll want to make sure api call are relative urls.

For production we add the react apps build and static directories for Django to server. You run yarn build or npm build in the front end directory and it will bundle everything up, you commit, and deploy as normal. Eventually this is you could even split out and just throw it in an S3 bucket if you wanted.

I don't have merge permission it looks like but I'd like to get this merged in so people can start using it as their base.

[ericsandine]

@benmathes Ok, I think I'm a bit happier with this now. I updated the README

One thing about having the react build step write the HTML is that it inserts the current js file names, when the build step runs the files it outputs are named with this pattern: main.[file-hash].js which is for cache busting. We could have python do this if we wanted as the build outputs a manifest.json with the current file names. So basically we'd have python read that file and inject it into the template, wouldn't be too hard to wire up. This sounds pretty reasonable to me, and I can probably wire that up later, I actually like having Django serve that template instead of getting the static one built by the react app so we have an easier way to write in environment variables.

I think my only argument against the above plan would be that we'd have to customize the webpack build a bit more, I'm always hesitant to do that on projects like this because it's currently pretty close to a standard create-react-app layout for the frontend so if someone else comes along they should be able to get up and running pretty fast if they've worked with create-react-app before, the more I move the paths around the more complex that build becomes. I can see both sides on this one honestly so I'm not sure what to do there.

After heroku runs the build step for the frontend you end up with this structure on the server:

In the current state we no longer need to build the frontend, it will build it on Heroku and then write it into /voter_info/staticfiles to be served.