diff --git a/.github/workflows/ci-cd.yml b/.github/workflows/ci-cd.yml
new file mode 100644
index 0000000..139a2b1
--- /dev/null
+++ b/.github/workflows/ci-cd.yml
@@ -0,0 +1,54 @@
+name: ci/cd for deployment
+
+run-name: ${{ github.actor }} are tigger ci/cd action
+
+on:
+  push:
+    branches: ["main"]
+
+# 必须添加下列权限
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# 限制并发，当触发新的工作流时，取消之前的工作流
+concurrency:
+  group: "pages"
+  cancel-in-progress: true
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: checkout repo code
+        uses: actions/checkout@v4
+      - name: set node version
+        uses: actions/setup-node@v4
+        with:
+          node-version: "20"
+      - name: Cache node modules
+        id: cache-npm
+        # 缓存node_modules
+        uses: actions/cache@v4
+        with:
+          path: './node_modules'
+          key: ${{ runner.os }}-${{ hashFiles('**/package-lock.json') }}
+        # 命中缓存就跳过安装依赖
+      - if: ${{ steps.cache-npm.outputs.cache-hit != 'true' }}
+        name: install dependencies
+        run: npm install
+      - name: build project
+        run: npm run build
+      - name: upload build file
+        uses: actions/upload-pages-artifact@v3
+        with:
+          # 指定上传文件夹
+          path: './dist'
+
+  deploy:
+    runs-on: ubuntu-latest
+    needs: build
+    steps:
+      - name: deploy to github pages
+        uses: actions/deploy-pages@v4
diff --git a/README.md b/README.md
index 07bcdf5..92f185e 100644
--- a/README.md
+++ b/README.md
@@ -1,3 +1,6 @@
 # react-workflow
 
 构建 react 工作流
+
+### 支持 ci/cd 上传构建后页面到 github action
+* 需要在仓库中的 settings -> pages 页面，设置 Build and deployment 为 GitHub Actions。