How Can I Integrate Prerender With My React/Angular/Vue Application?

Prerender is an excellent solution for enhancing the SEO of single-page applications (SPAs) developed with frameworks like React, Angular, and Vue. These frameworks are client-side JavaScript frameworks that operate in the browser after the initial HTTP request is made and the page has loaded. Since they cannot detect the requester's user agent or rewrite the URL to forward the request to the Prerender service before fulfilling the request, you need to integrate Prerender into another system component to achieve proper functionality.

For the best results, it is recommended that Prerender be integrated as close to the visitors as possible. Ideally, this should be done at the CDN or reverse proxy level. If that's not feasible, you should integrate Prerender directly into your web server.

CDN integration:

• For Fastly integration follow this guide

• You can find our Cloudflare integration here

• CloudFront integration guide

Reverse proxy integration:

• You can find our Nginx reverse proxy integration here

Web server integration:

• If you are using Nginx as your web server, follow this guide.

• For Apache web server: find the corresponding guide here

• Node.js with Express: for Node.js applications using Express, you can use the prerender-node middleware:

const prerenderMiddleware = require('prerender-node');
app.use(prerenderMiddleware.set('prerenderToken', 'YOUR_TOKEN'));