buildpack for static websites

[r6m]

I'm new to buildpacks world and want some help if it's the right choice for me.
Is there a buildpack for react-app or hugo which I could pass the build directory to the nginx for just serving static files?

[dmikusa]

The Paketo Staticfile buildpack targets this use case. It is still in development, but you can give it a try and provide feedback through issues on that repo.

Alternatively, you could provide your own nginx conf or Apache HTTPD conf and use the server directly. This requires a little more upfront work than using Staticfile, but allows you to customize things to a degree you cannot with the Staticfile buildpack.

Hope that helps!

[fg-j]

Perhaps the angular, vue, and react examples in the Paketo samples repo could point you in a helpful direction, @r6m. None of those use NGINX to serve the app, but you could probably use the Nodejs and NGINX buildpacks together to accomplish that goal.

[ryanmoran]

One of the key points in building a static JS app is that you will need to run some sort of build process that will generate your static files. The node-run-script buildpack is what supports this feature. In order to indicate to that buildpack what it should run, you need to set the BP_NODE_RUN_SCRIPTS environment variable as described here. If you do this, and then include the staticfile, nginx, or httpd buildpacks as the last buildpack in your ordering, then you can get the outcome you are looking for.

[arjun024]

Here's a react (for build) + nginx (for run) example if you wanna checkout. Nginx buildpack here overrides the start command set by the Node.js buildpack to start the server using the nginx.conf at the root of the app. https://github.com/arjun024/react-nginx

[fg-j]

Love this sample app! @arjun024 Would you be willing to contribute it to the Paketo samples repo? I imagine this is a common use case to show off.

[r6m]

Thanks @fg-j, @arjun024, @ryanmoran and @dmikusa-pivotal
I built the react example and it did work well.
most of nodejs front-end and some backends now have a build script in package.json. maybe it could be simpler by just detecting build script in package.json and run build command instead of passing BP_NODE_RUN_SCRIPTS env variable. I mean we could just pass gcr.io/paketo-buildpacks/nodejs buildpack and if package.json has build script, then include paketo-buildpacks/npm-run-script or even something like paketo-buildpacks/yarn-build. This is how paketo-buildpacks/yarn-start is added. :)