Setting up a static website generator with Cloudflare Pages
Hi,
We are dev team working on a new feature on top of our platform for restaurant reservations management.
We would like to start offering to our clients simple websites, which we would generate with a "restaurant website generator".
From our Admin Panel, ou team would setup a restaurant website from the restaurant profile, parameter it with domain name, set texts, upload logo and photos and "launch" it.
We already have 3 custom restaurant website templates in HTML (only a few pages, index.html, contact.html, menu.html, privacy-policy.html), all data needed can already be created in our backend and is accessible through our API.
We're looking into the best technical solution to achieve this and to host the websites as static websites for the best SEO, likely on Cloudflare Pages.
Whatever the solution chosen we will likely have to setup on the server/infrastructure each new domain and have a SSL certificate generated.
We are thinking about generating static websites : we generate the websites' HTML on demand from our backend app and send them to the infrastructure through an API.
Is Cloudflare Pages the right way for that?
We would not have a repository for each website, just static HTML files. Can we create new websites, setup domain name, upload HTML files via the Cloudflare API?
An alternative would be a Dynamic Website Generator : the website is generated by the frontend depending on the domain name requested, with data fetched from our API. We initially thought we would use Astro (JS framework) for this, we built websites this way before, but we can't manage to retrieve the domain name and send it to the API. We are looking to use Nuxt or Next instead.
9 Replies
Thanks for anyone that could help us figure out if Cloudflare Pages is the thing we shoud look into.
Of what I see we would need an Enterprise plan to allow apex domains directly.
this problem is interesting, I think I have a way, I'll try to sketch up something after I finish my current meeting
All of this looks fine
For Apex Domains, it is mostly a matter of whether the customers' DNS provider supports ANAMEs/CNAME Flattening/Provider's Name of Choice for allowing CNAMEs at the Apex
Thanks for answering and good remark. Cloudflare could not handle apex domains?
We want to avoid limiting ourselves to DNS providers that would. I already know GoDaddy and Namecheap.com don't.
Some of our clients already have domain names. For those that don't we can register domains on Cloudflare registrar.
We already had such issue on other projects. We can't ask our clients to switch their NS servers as they might have emails and other services already setup. The best would be if they just have to update the apex A record.
Or we do this with the www subdomain and then manage a redirection from www to non-www separately?
If you do it on a subdomain(www, etc.), then they can just CNAME it as normal
But yeah then you have to deal with the root yourself
Apart from that everything is doable with the Cloudflare Pages API directly, so we can create something automated that the sales team can use to easily create a website for a client through our interface?
Yup, though I would also tell your CSM before setting this up, since there is a limit to the number of projects you can add(which can be raised).
Cloudflare Pages supports deploying 100 sites to your account. If you need to raise this limit, contact your Cloudflare account team. In order to protect against abuse of the service, Cloudflare may temporarily disable your ability to create new Pages projects, if you are deploying a large number of applications in a short amount of time. Email [email protected] if you need this restriction removed.
@agathorpt hi. I would be interested in your thoughts if you would have time.
@jonben I've done something very similar. This is my setup:
- Main site, example.com, this is just my own landingpage, pricing, etc.
- App site, example.APP (notice different domain). This is where the customer logs in, creates pages etc, all happens at example.APP/dashboard
- All other routes (not example.app/dashboard) are proxied to an api (e.g. a worker) - The worker reads the hostname and path and returns the correct page.
Add some caching for the worker and you have super fast custom hosting and super easy to maintain.
You could easily do it with pages, I did it with vercel only because they allow unlimited custom domains (I think cf has 100). You can use the API to easily connect/remove domains.