GitHub Actions vs Jenkins：在博客

用户343461278320
3 阅读6分钟

引言
在现代软件开发过程中，代码质量是决定项目成败的重要因素之一。尤其对于非科班出身的开发者，面对大型项目或团队协作时，常常会遇到代码风格不一致、提交内容不规范、构建流程混乱等问题。这些问题如果不加以控制，会导致团队效率低下，甚至影响项目稳定性。

本文将通过一个典型的“博客平台”项目作为案例，深入探讨如何借助 CI/CD 工具（GitHub Actions 与 Jenkins）实现代码规范与工程化的提升。我们不仅会介绍两种工具的基本原理和使用方式，还会通过具体配置示例来说明它们在实际业务场景中的应用价值。

GitHub Actions 与 Jenkins 的基础原理对比

GitHub Actions 的设计思想

GitHub Actions 是 GitHub 提供的一套自动化流程工具，它基于事件驱动的方式运行工作流（Workflow），可以在代码提交、拉取请求创建、合并等事件中触发预设的任务。其核心概念包括 workflow（工作流）、job（任务）、step（步骤）和 action（动作）。GitHub Actions 的优势在于它与 GitHub 紧密集成，可以做到完全无服务器的配置和使用。

Jenkins 的传统架构

Jenkins 是一款老牌的持续集成和持续交付工具，它的核心理念是“可扩展性”和“插件生态”。Jenkins 依赖于 Job 配置文件（通常是 XML 格式），并通过插件系统支持各种任务类型（如编译、测试、部署等）。Jenkins 的优势在于功能强大、定制化程度高，但需要额外的服务器资源以及较为复杂的配置过程。

对比表格：GitHub Actions vs Jenkins

特性GitHub ActionsJenkins
部署方式基于 GitHub 平台，无需额外服务器需要独立服务器或容器部署
配置语言YAML 文件定义工作流XML 文件定义 Job
学习曲线较低，适合初学者中等偏高，需要了解 Job 和 Plugin 概念
插件生态内建部分功能，第三方 Action 可用插件数量多，功能扩展性强
资源占用低至无服务器需求需要额外资源支持
是否开源是（部分功能为闭源）是

从上表可以看出，在现代 DevOps 实践中，GitHub Actions 更加轻量易用；而 Jenkins 则更适合复杂、定制化的构建需求。

在博客平台项目中实现代码规范

1. 使用 ESLint 实现 JavaScript 规范检查

在开发博客平台时，前端通常使用 JavaScript 构建页面交互逻辑。为了保证前端代码质量，我们可以使用 ESLint 进行静态代码分析，并通过 CI/CD 流程进行自动化检查。

以下是一个 lint.js 示例脚本：

const { execSync } = require('child_process');

function runESLint() {
  try {
    execSync('npx eslint . --ext .js --ext .jsx', { stdio: 'inherit' });
    console.log('ESLint 完成');
    return true;
  } catch (error) {
    console.error('ESLint 报错，请修改代码后重新提交');
    return false;
  }
}

runESLint();

该脚本会运行 ESLint 检查当前目录下的 .js 和 .jsx 文件。若存在违规项，则输出错误信息并返回失败状态。

在 GitHub Actions 中可以通过如下 workflow.yml 进行集成：

name: Code Quality Check

on: [push, pull_request]

jobs:
  lint:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v3

      - name: Set up Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '16'

      - name: Install dependencies
        run: npm install

      - name: Run ESLint
        run: npx eslint . --ext .js --ext .jsx

通过这样的配置，在每次推送或拉取请求时都会自动运行 ESLint 检查，并防止不合格的代码被合并进主分支。

2. 使用 Prettier 实现统一格式化

除了静态检查外，在前端开发中格式化也是一项重要的工程化手段。Prettier 可以自动修复格式问题，并确保所有开发者使用统一的样式标准。

以下是一个 Prettier 格式化脚本示例：

const { execSync } = require('child_process');

function formatCode() {
  try {
    execSync('npx prettier --write src/**/*.{js,jsx}', { stdio: 'inherit' });
    console.log('格式化完成');
    return true;
  } catch (error) {
    console.error('格式化失败，请检查文件内容');
    return false;
  }
}

formatCode();

该脚本会递归查找 src/ 目录下的所有 .js 和 .jsx 文件，并进行格式化操作。若执行失败，则提示错误并返回失败状态。

同样地，在 GitHub Actions 中也可以添加如下配置：

name: Code Formatting

on: [push, pull_request]

jobs:
  format:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v3

      - name: Set up Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '16'

      - name: Install dependencies
        run: npm install

      - name: Format code with Prettier
        run: npx prettier --write src/**/*.{js,jsx}

通过上述两个步骤的组合应用，可以大大减少因编码风格不一致带来的问题，并提高整个团队的协作效率。

工程化实践：结合 CI/CD 实现自动化部署

除了静态检查与格式统一外，在博客平台项目中还应引入自动化部署流程。这不仅有助于加快发布周期，还能减少人为失误带来的风险。

在 GitHub Actions 中实现构建与部署

以下是一个完整的 workflow.yml 示例：

name: Deploy Blog Platform

on:
  push:
    branches:
      - main

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v3

      - name: Set up Node.js environment
        uses: actions/setup-node@v3
        with:
          node-version: '16'

      - name: Install dependencies
        run: npm install

      - name: Run tests and linters
        run: |
          npm test
          npx eslint .
          npx prettier --check src/**

      - name: Build project with Webpack
        run: npm run build

      - name: Deploy to server via SSH (示例)
        uses: appleboy/scp-action@master
        with:
          host_name_or_ip_address_list_by_comma_separated_value_string_formatting_for_multiple_servers:"your-server-ip"
          username:"your-username"
          password:"your-password"
          source_path:"./dist"
          target_path:"/var/www/blog-platform"

该配置会在每次向 main 分支推送新内容时自动执行以下流程：

  1. 下载源码并安装依赖；
  2. 运行单元测试、ESLint 和 Prettier；
  3. 构建前端资源；
  4. 将构建结果上传到目标服务器上部署。

这种全自动化的流水线方式极大提升了交付效率，并减少了人为干预带来的潜在风险。

小结
通过本文我们可以看到，在非科班转行程序员的成长过程中，“代码规范”与“工程化思维”是提升能力的关键环节。无论是选择 GitHub Actions 还是 Jenkins 来实现 CI/CD 流程，都可以显著改善项目的质量和可维护性。

下一步学习建议包括：

  • 掌握更多关于 Git Hook 和 Pre-commit 工具的使用；
  • 学习如何结合 Docker 技术进一步优化构建环境；
  • 研究如何将 Linter 和 Formatter 工具整合进 IDE 或编辑器中；
  • 探索更高级别的 CI/CD 工作流设计模式；
  • 掌握如何利用 Kubernetes 或 Cloud Build 工具进行云端自动化发布。

本文参考文献： http://www.hncyxsy.com/juejin-nmxudgwtoy.html

avatar
文章
阅读
粉丝