pages-gem VS starter-workflows

If you don't want to use Jekyll as your static site generator for GitHub Pages and you want to have a custom domain for your GitHub Pages. This post is for you!

At the end of my last post, we had a structure in place that used GitHub Actions to run a workflow every time a change was committed to the PPC repository. That workflow would rebuild the website and publish it on GitHub Pages.

This guide will walk you through a comprehensive and straightforward approach to configuring GitHub Actions for Vue and Vite applications and using GitHub Pages for deployment, providing you with a clear and practical roadmap to implement CI/CD pipelines from scratch.

One day my friend Brandon Boone presented me with a quick and easy way to get a free landing page with a clean subdomain - GitHub Pages.

One of the nicest things about static site generators is that Github is offering a fully integrated solution for free. They manage your files using Git, will build your website using ANY static site generator with Github Actions, and allow you to host the output on Github Pages. When you use Frontmatter.codes in Visual Studio Code you will even get a fully featured (and free) CMS.

The test subjects include Vercel, Cloudflare Pages, GitHub Pages, and the newly discovered EdgeOne Pages from Tencent Cloud. The measurement indicators include global access latency, Google Lighthouse metrics and the smoothness of the deployment process.

Website Link :https://pages.github.com/

Browser.application is used when you want to support client-side routing. However, it requires you to be able to configure your web server to redirect requests to your index.html file. Since GitHub Pages doesn't allow you to customize their web server, you're forced to switch to another hosting service like Netlify, Render, or Cloudflare Pages. Thankfully, they all make it easy to do the configuration that's needed.

URL: GitHub Pages

The good news is that the deploy process doesn't get more complicated than what I've shown you above. The core concept remains the same. You have branches (say a master branch and several feature branches) in which you use to implement your web application and you have branches (say a staging and production branch) you use for deployment. Then, you have to tell your hosting provider, be it GitHub Pages, Netlify, Render, Cloudflare Pages, or something else, which branches you're using for your deployments.

At the end of my last post, we had a structure in place that used GitHub Actions to run a workflow every time a change was committed to the PPC repository. That workflow would rebuild the website and publish it on GitHub Pages.

Now that we have the basics in place, let's take things up a notch by introducing GitHub Actions. GitHub Actions allows us to automate various tasks like running tests, building, and deploying our application directly from our repository. In this blog, we’ll specifically focus on the CI (Continuous Integration) part to automate API testing for our Express app.

StyleSpark is a productivity tool designed to help developers gain insights into their coding styles by analyzing their code snippets and matching them to the styles of iconic programmers. Specifically, it is a new GitHub Action that programmers can include in their workflows to inspire personal growth and improvement in coding practices by providing users with a fun and educational way to explore different programming styles. It leverages Llama 3 to analyze snippets from your GitHub repos to identify how your style compares to computing's heroes! When it's done, it will update your README with a snazzy badge powered by Shields.io, like this one:

Jenkins and GitHub Actions are go-to tools for automating tasks like testing and deployment. These pipelines ensure that the latest version of your software gets built, tested, and delivered efficiently.

Using tools like GitHub Actions or CircleCI.

Más ejemplos de pipelines CI/CD

This guide will walk you through a comprehensive and straightforward approach to configuring GitHub Actions for Vue and Vite applications and using GitHub Pages for deployment, providing you with a clear and practical roadmap to implement CI/CD pipelines from scratch.

We use GitHub Actions to set up our CI/CD. The infra team (they renamed themselves to 'DevOps' a few years ago 🤔) set up a pool of runners for us and shared the IaC (Infrastructure as Code) repository for provisioning them.

There are a lot of tools that could help with making CI/CD pipelines, but for this project, I decided to go with Github Action, this was because I was already familiar with it and it would be a perfect fit for my project

GitHub Actions is a cloud-based CI/CD solution built into GitHub’s ecosystem that enables developers to automate workflows directly within their repositories. It supports workflows triggered by events known as actions such as code pushes, pull requests, and issue events, making it a great solution for teams already using GitHub for version control.