a
Cloudflare Pages is so amazing to me. Normally, when we deploy a frontend, we can deploy it in the VPS or github/gitlab pages (public repository).
But Cloudflare pages are free even for private repositories. You can see the price of Cloudflare Pages services below Image 1:
Let's get cracking
1. Sign in to Cloudflare
2. In the left sidebar, Choose the Workers & Pages option.
3. Choose the Pages tab and click Connect to Git button Image 2
4. You can choose GitHub or GitLab to connect
5. You should authorize and specify a repository Image 3
6. You can do some steps by the guide until step 2:Set up builds and deployments
In my case, My project uses Vite so I set the Build command as "npm run build" and the Build output directory as "dist" Image 4
7. After building processing is finished Image 5
8. I can access my website (In my case, I'm waiting for about 10 seconds, and my website can be accessed) Image 6
CI/CD
With this approach, when you update your code and push it to Github/Gitlab. It will trigger Cloudflare Pages that pull the project to build and deploy automatically
Easy to work with your team
With this approach, when you update your code in another branch and push it to Github/Gitlab. It will create a new domain to review with your members.
For example, I create a new branch named test, update my code, and push the branch to the Repository. Cloudflare triggered and deployed my branch in subdomains like Image 7 & Image 8
Conclusion
With the Cloudflare Pages, You can see I can deploy my website to the Internet easily. Let's deploy your project now!