Building mixed frontend/backend projects using Epinio

I’ve been using Epinio to build several of my smart home projects in the last few months. I have really enjoyed not needing to worry about the complexity of Kubernetes while iterating on the code.

I recently decided it would be fun to build a wallboard to show me news, weather, and some traffic cameras at the local mountains so I could more easily decide where to ski!

This posed a problem, though. When building the app, I needed to build both the frontend and backend in the same pipeline (because `epinio push` is nice, and I didn’t want to require additional steps). If I just did a push, it would build the backend but leave the frontend in whatever state I pushed, so I had to continually rebuild the react app for the node.js backend to host.

BP_NODE_RUN_SCRIPTS to the rescue!

I got around this problem by adding a script to npm:

 “build-client”: “cd client; npm i; npm run build; cd -;”

This changes the directory into the client folder, installs the dependencies, builds the project, and then pops back into the main folder.

I got this to run as part of the pipeline by setting BP_NODE_RUN_SCRIPTS to build-client by running:

epinio app env set traffic BP_NODE_RUN_SCRIPTS build-client

Then all of my builds also ran build-client as part of their build process!

If anyone is interested, my (very incomplete and likely poorly written) code can be found at https://github.com/agracey/home-weather-traffic