Deploy Single Page Apps in Bunny CDN

Hosting single-page applications (SPAs) like React or Angular on Bunny CDN can be a bit tricky. However, with the right configuration, you can efficiently serve your frontend applications directly from Bunny CDN’s edge servers.

Hosting Single Page Application

SPAs, when built, generate a set of CSS, JavaScript, and a single index.html file. According to Bunny CDN’s official docs , you can upload the contents of your ./dist/ folder to Bunny CDN and configure it as shown below:

In this setup, when a requested file is not found, Bunny CDN serves index.html with a 200 OK status. This ensures that all routes in your application correctly resolve to the main entry point, making it a simple and effective way to deploy SPAs, including Angular and React apps.

Hosting Multiple Single Page Application

To achieve this, you can use Bunny CDN Edge Rules , which allow you to control how requests are handled and routed to the appropriate application.

By defining custom routing rules, you can direct requests to the correct app based on the URL path. Below is an example setup:

How It Works

• Each SPA is stored in a separate directory within Bunny CDN storage.
• Edge Rules are used to route requests based on URL patterns.
• If a request does not match any predefined conditions, it falls back to serving /index.html with a 200 OK status.

This setup ensures that each SPA is accessible via its own path while still benefiting from Bunny CDN’s global edge network. Additionally, you have full control over request handling, making it a flexible solution for hosting multiple frontend applications efficiently.