Docusaurus is a commonly used static site generator. It is built on top of React.js and can be used to make any kind of site (personal website, product, blog, marketing landing pages, etc).
Cloudflare Pages is a JAMStack platform for frontend developers to collaborate and deploy websites.
Creating the App
- Open up your shiny terminals and create a Docusaurus app How to create: https://docusaurus.io/docs/installation#scaffold-project-website
Now, Once you've created change your directory to the project.
Then, Run the start command.
It will open up your browser to the development website: http://localhost:3000/
Now, Your Docusaurus Website is ready, Let's deploy it over Cloudflare pages.
Change your docusaurus.config.js url field to https://.pages.dev or your custom domain.
Unlike Vercel and Netlify, Cloudflare pages doesn't support cli deployments yet (They might come sooner or later)
EDIT: You can now deploy to Cloudflare pages via Wranger CLI. Read more here
So, You'll need to push all the code over Github.
git init git add -A git commit -m "initial commit" git branch -M main git remote add origin https://github.com/gaurishhs/Docusaurus-Cf-Pages.git git push -u origin main
After Running these commands, If you check your Github, You'll find the code there.
Head to your Cloudflare pages dashboard, Signup for pages if you haven't yet.
Create an app and select your Github repository.
Choose Create React App as your framework preset.
Create an environment variable
NODE_VERSION with the value
Docusaurus requires a node version more than or equal to node v14, 16.13.2 is a LTS(Long time support) Version of Node.js
Then Click Deploy, Within 2mins your app would be ready :)
Cloudflare has now introduced Fast builds 😃
Add a Custom Domain To Your App
Redirecting www to apex domain
- If you face any issues, Do not hesitate to contact me
Top comments (0)