Heroku Cloud Native Buildpacks: Front-end Web

This repository is the home of Heroku Cloud Native Buildpacks for Front-end Web apps, also known as: websites, static web apps (SWA), single-page apps (SPA), progressive web apps (PWA), and browser apps.

What It Is

These Front-end Web buildpacks produce an OCI (container image) that launches a web server to host a directory of HTML, CSS, and Javascript files. The build process can run a command to generate the website, or simply read a directory of files as the web root.

All front-end frameworks that output static HTML are supported, while some popular frameworks are optimized with preset web server configuration.

The result is a static website:

• high-efficiency, high-performance server
• secure by default with minimal, purpose-built features
• separates front-end development (web UIs) from server-side programming (backend APIs).

What It Is Not

This static web server does not run custom code on the server. If an app requires a custom server-side web process, then use the appropriate language-specific CNBs.

Included Buildpacks

This repository contains multiple buildpacks:

Component Buildpacks

Buildpacks that provide a specific server-side component.

ID	Name	Provides
heroku/static-web-server	Static Web Server	The CNB default web process; an HTTP file server configurable via project.toml

Framework Buildpacks

Lower-level buildpacks that detect specific source layouts, frameworks, or tools, to automate configuration of build process and heroku/static-web-server. These framework buildpacks are completely optional.

ID	Name	Provides
heroku/website-ember	Website (Ember.js)	auto-detect for Ember.js
heroku/website-cra	Website (create-react-app)	auto-detect for create-react-app
heroku/website-nextjs	Website (Next.js)	auto-detect for Next.js (static exports)
heroku/website-public-html	Website (Public HTML)	auto-detect for public/index.html
heroku/website-vite	Website (Vite)	auto-detect for Vite

Usage

Configure the Static Web Server as the last buildpack for your app (unless using another buildpack to setup the web process), along with other language buildpacks the build might require.

Dev Notes

Run Tests

cargo test -- --include-ignored

Releasing A New Version

Action workflows are used to automate the release process:

1. Run Prepare Buildpack Releases.
2. Await completion of the preparation step.
3. Run Release Buildpacks.