Setting Up this Site
Overview of Docusaurus
According to ChatGPT - Docusaurus is an open-source static site generator for creating documentation websites. It was designed to make it easy to maintain documentation websites for open-source projects, and includes features like automatic generation of a table of contents, search functionality, and the ability to easily update the website's layout and theme. Docusaurus is built with React, and uses Markdown for formatting content. It is intended to be easy to use and customize, and can be deployed to a variety of hosting platforms, including GitHub Pages and Netlify.
You can learn more about docusaurus at the docusaurus.io.
How I Set up and Host Docusaurus
Below are the steps I took to set up and host this site:
- Setup an environment for a Node.js project.
- Install nvm by running
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.3/install.sh | bash - Install and select node version 16 with
nvm install 16followed bynvm use 16
- Install nvm by running
- Run the following command to create a new docusaurus project:
npx create-docusaurus@latest my-website classic; change "my-website" to whatever you want your docusaurus project to be. - Run
cd my-websiteto enter the project directory. - Run
npm startto start the development server. - Open a browser and navigate to
http://localhost:3000to view the site to ensure it is running properly. - Now you can stop the application by pressing
Ctrl+Cin the terminal.- Assuming that everything in steps 1-6 worked, you can now deploy the site to Cloudflare Pages by continuing to step 7.
- Create a new repository on GitHub and push the project to it in order for Cloudflare to pull from. Insert the following commands one at a time into the terminal. Note: you must be within the root directory of "my-website" when running these commands
git init
git add -A
git commit -m "initial commit"
git branch -M main
git remote add origin https://github.com/username/repository.git
git push -u origin main - Head over to Cloudflare and sign up for an account if you don't already have one.
- Create a new project on Cloudflare Pages and select the GitHub repository you just created.
- Next, choose "Create React App" as the framework.
- Finally, create an environment variable with the name of "NODE_VERSION" and the value of "16.14.2" or whatever subversion of nodejs 16 was installed in step number 1.
- Click "Deploy Site" and wait for the site to deploy.
- Once the site is deployed, you can view it by clicking the "View Site" button.
- You can now make changes to the site and push them to GitHub to update the site.
Here is a tutorial that I initially followed https://dev.to/gaurishhs/deploying-docusaurus-to-cloudflare-pages-565g