Hello there!
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 16.13.2
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 😃
https://docusaurus-cf-pages.pages.dev/
Add a Custom Domain To Your App
Redirecting www to apex domain
Contact
- If you face any issues, Do not hesitate to contact me
Top comments (0)