Skip to content

Commit c6c9a05

Browse files
author
edgeonecc
committed
init
0 parents  commit c6c9a05

15 files changed

+5314
-0
lines changed

.eslintrc.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"extends": "next/core-web-vitals"
3+
}

.github/workflows/deploy.yml

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
name: Build and Deploy
2+
3+
on:
4+
push:
5+
branches:
6+
- main
7+
8+
jobs:
9+
build-and-deploy:
10+
runs-on: ubuntu-latest
11+
12+
steps:
13+
- name: Checkout repository
14+
uses: actions/checkout@v4
15+
16+
- name: Setup Node.js
17+
uses: actions/setup-node@v4
18+
with:
19+
node-version: 20
20+
21+
- name: Install dependencies
22+
run: npm install
23+
24+
- name: Build project
25+
run: npm run build
26+
27+
- name: Deploy to EdgeOne Pages
28+
run: npx edgeone pages deploy ./out --name my-edgeone-pages-project --token ${{ secrets.EDGEONE_API_TOKEN }}
29+
env:
30+
EDGEONE_API_TOKEN: ${{ secrets.EDGEONE_API_TOKEN }}

.gitignore

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
.yarn/install-state.gz
8+
9+
# testing
10+
/coverage
11+
12+
# next.js
13+
/.next/
14+
/out/
15+
16+
# production
17+
/build
18+
19+
# misc
20+
.DS_Store
21+
*.pem
22+
23+
# debug
24+
npm-debug.log*
25+
yarn-debug.log*
26+
yarn-error.log*
27+
28+
# local env files
29+
.env*.local
30+
31+
# vercel
32+
.vercel
33+
34+
# typescript
35+
*.tsbuildinfo
36+
next-env.d.ts

README.md

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
# Next.js Project Deployment to EdgeOne Pages
2+
3+
This is a Next.js template project that uses GitHub Actions for building and deployment to [EdgeOne Pages](https://edgeone.ai/products/pages).
4+
5+
## Project Overview
6+
7+
This project provides a starter template for Next.js applications, integrating GitHub Actions workflows and automatic deployment functionality.
8+
9+
Complete `.github/workflows/deploy.yml` configuration is as follows:
10+
11+
```yml
12+
name: Build and Deploy
13+
14+
on:
15+
push:
16+
branches:
17+
- main
18+
19+
jobs:
20+
build-and-deploy:
21+
runs-on: ubuntu-latest
22+
23+
steps:
24+
- name: Checkout repository
25+
uses: actions/checkout@v4
26+
27+
- name: Setup Node.js
28+
uses: actions/setup-node@v4
29+
with:
30+
node-version: 20
31+
32+
- name: Install dependencies
33+
run: npm install
34+
35+
- name: Build project
36+
run: npm run build
37+
38+
- name: Deploy to EdgeOne Pages
39+
run: npx edgeone pages deploy ./out --name my-edgeone-pages-project --token ${{ secrets.EDGEONE_API_TOKEN }}
40+
env:
41+
EDGEONE_API_TOKEN: ${{ secrets.EDGEONE_API_TOKEN }}
42+
```
43+
44+
## Step 1: GitHub Actions Build
45+
46+
This project uses [GitHub Actions](https://docs.github.com/en/actions) for automated building. When code is pushed to the main branch, it triggers the following build process:
47+
48+
1. Checkout the repository code
49+
2. Setup Node.js 20 environment
50+
3. Install project dependencies
51+
4. Build the project using Next.js
52+
53+
## Step 2: EdgeOne Pages Deployment
54+
55+
After the build completes, the project is automatically deployed to [EdgeOne Pages](https://edgeone.ai/products/pages) through the following process:
56+
57+
1. The build phase generates the `./out` directory
58+
2. The EdgeOne command line tool is used for deployment:
59+
```bash
60+
npx edgeone pages deploy ./out --name my-edgeone-pages-project --token ${{ secrets.EDGEONE_API_TOKEN }}
61+
```
62+
63+
## Setting Up the Repository Secret
64+
65+
To deploy to EdgeOne Pages, you need to add your `EDGEONE_API_TOKEN` as a repository secret in GitHub:
66+
67+
1. Navigate to your GitHub repository
68+
2. Go to "Settings" > "Secrets and variables" > "Actions"
69+
3. Click "New repository secret"
70+
4. Name: `EDGEONE_API_TOKEN`
71+
5. Value: Your EdgeOne API token
72+
73+
Obtain your `EDGEONE_API_TOKEN` from EdgeOne Pages by visiting: https://edgeone.ai/document/177158578324279296
74+
75+
# References
76+
77+
- EdgeOne Pages Documentation: https://edgeone.ai/docs/pages
78+
- GitHub Actions Documentation: https://docs.github.com/en/actions

README.zh.md

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
# Next.js 项目部署到 EdgeOne Pages
2+
3+
这是一个 Next.js 模板项目,使用 GitHub Actions 进行构建并部署到 [EdgeOne Pages](https://edgeone.ai/products/pages)
4+
5+
## 项目概述
6+
7+
本项目提供了 Next.js 应用程序的启动模板,集成了 GitHub Actions 工作流和自动部署功能。
8+
9+
完整的 `.github/workflows/deploy.yml` 配置如下:
10+
11+
```yml
12+
name: Build and Deploy
13+
14+
on:
15+
push:
16+
branches:
17+
- main
18+
19+
jobs:
20+
build-and-deploy:
21+
runs-on: ubuntu-latest
22+
23+
steps:
24+
- name: Checkout repository
25+
uses: actions/checkout@v4
26+
27+
- name: Setup Node.js
28+
uses: actions/setup-node@v4
29+
with:
30+
node-version: 20
31+
32+
- name: Install dependencies
33+
run: npm install
34+
35+
- name: Build project
36+
run: npm run build
37+
38+
- name: Deploy to EdgeOne Pages
39+
run: npx edgeone pages deploy ./out --name my-edgeone-pages-project --token ${{ secrets.EDGEONE_API_TOKEN }}
40+
env:
41+
EDGEONE_API_TOKEN: ${{ secrets.EDGEONE_API_TOKEN }}
42+
```
43+
44+
## 步骤1:GitHub Actions 构建
45+
46+
本项目使用 [GitHub Actions](https://docs.github.com/zh/actions) 进行自动化构建。当代码推送到 main 分支时,会触发以下构建过程:
47+
48+
1. 检出代码仓库
49+
2. 设置 Node.js 20 环境
50+
3. 安装项目依赖
51+
4. 使用 Next.js 构建项目
52+
53+
## 步骤2:EdgeOne Pages 部署
54+
55+
构建完成后,项目会通过以下过程自动部署到 [EdgeOne Pages](https://edgeone.ai/products/pages):
56+
57+
1. 构建阶段生成 `./out` 目录
58+
2. 使用 EdgeOne 命令行工具进行部署:
59+
```bash
60+
npx edgeone pages deploy ./out --name my-edgeone-pages-project --token ${{ secrets.EDGEONE_API_TOKEN }}
61+
```
62+
63+
## 设置仓库密钥
64+
65+
要部署到 EdgeOne Pages,你需要在 GitHub 中添加 `EDGEONE_API_TOKEN` 作为仓库密钥:
66+
67+
1. 导航到你的 GitHub 仓库
68+
2. 进入 "Settings" > "Secrets and variables" > "Actions"
69+
3. 点击 "New repository secret"
70+
4. 名称:`EDGEONE_API_TOKEN`
71+
5. 值:你的 EdgeOne API 令牌
72+
73+
从 EdgeOne Pages 获取你的 `EDGEONE_API_TOKEN`,访问:https://edgeone.ai/document/177158578324279296
74+
75+
# 参考资料
76+
77+
- EdgeOne Pages 文档:https://edgeone.ai/docs/pages
78+
- GitHub Actions 文档:https://docs.github.com/zh/actions

app/globals.css

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;
4+
5+
:root {
6+
--foreground-rgb: 0, 0, 0;
7+
--background-start-rgb: 214, 219, 220;
8+
--background-end-rgb: 255, 255, 255;
9+
}
10+
11+
@media (prefers-color-scheme: dark) {
12+
:root {
13+
--foreground-rgb: 255, 255, 255;
14+
--background-start-rgb: 0, 0, 0;
15+
--background-end-rgb: 0, 0, 0;
16+
}
17+
}
18+
19+
body {
20+
color: rgb(var(--foreground-rgb));
21+
background: linear-gradient(
22+
to bottom,
23+
transparent,
24+
rgb(var(--background-end-rgb))
25+
)
26+
rgb(var(--background-start-rgb));
27+
}
28+
29+
@layer utilities {
30+
.text-balance {
31+
text-wrap: balance;
32+
}
33+
}

app/layout.tsx

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import type { Metadata } from "next";
2+
import { Inter } from "next/font/google";
3+
import "./globals.css";
4+
5+
const inter = Inter({ subsets: ["latin"] });
6+
7+
export const metadata: Metadata = {
8+
title: "Create Next App",
9+
description: "Generated by create next app",
10+
};
11+
12+
export default function RootLayout({
13+
children,
14+
}: Readonly<{
15+
children: React.ReactNode;
16+
}>) {
17+
return (
18+
<html lang="en">
19+
<body className={inter.className}>{children}</body>
20+
</html>
21+
);
22+
}

app/page.tsx

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
import Image from "next/image";
2+
3+
export default function Home() {
4+
return (
5+
<main className="flex flex-col items-center justify-between min-h-screen p-24">
6+
<div className="z-10 items-center justify-between w-full max-w-5xl font-mono text-sm lg:flex">
7+
<p className="fixed top-0 left-0 flex justify-center w-full pt-8 pb-6 border-b border-gray-300 bg-gradient-to-b from-zinc-200 backdrop-blur-2xl dark:border-neutral-800 dark:bg-zinc-800/30 dark:from-inherit lg:static lg:w-auto lg:rounded-xl lg:border lg:bg-gray-200 lg:p-4 lg:dark:bg-zinc-800/30">
8+
Get started by editing&nbsp;
9+
<code className="font-mono font-bold">app/page.tsx</code>
10+
</p>
11+
<div className="fixed bottom-0 left-0 flex items-end justify-center w-full h-48 bg-gradient-to-t from-white via-white dark:from-black dark:via-black lg:static lg:size-auto lg:bg-none">
12+
</div>
13+
</div>
14+
15+
<div className="relative z-[-1] flex place-items-center before:absolute before:h-[300px] before:w-full before:-translate-x-1/2 before:rounded-full before:bg-gradient-radial before:from-white before:to-transparent before:blur-2xl before:content-[''] after:absolute after:-z-20 after:h-[180px] after:w-full after:translate-x-1/3 after:bg-gradient-conic after:from-sky-200 after:via-blue-200 after:blur-2xl after:content-[''] before:dark:bg-gradient-to-br before:dark:from-transparent before:dark:to-blue-700 before:dark:opacity-10 after:dark:from-sky-900 after:dark:via-[#0141ff] after:dark:opacity-40 sm:before:w-[480px] sm:after:w-[240px] before:lg:h-[360px]">
16+
<Image
17+
className="relative dark:drop-shadow-[0_0_0.3rem_#ffffff70] dark:invert"
18+
src="/next.svg"
19+
alt="Next.js Logo"
20+
width={180}
21+
height={37}
22+
priority
23+
/>
24+
</div>
25+
26+
<div className="grid mb-32 text-center lg:mb-0 lg:w-full lg:max-w-5xl lg:grid-cols-2 lg:text-left">
27+
<a
28+
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template&utm_campaign=create-next-app"
29+
className="px-5 py-4 transition-colors border border-transparent rounded-lg group hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
30+
target="_blank"
31+
rel="noopener noreferrer"
32+
>
33+
<h2 className="mb-3 text-2xl font-semibold">
34+
Docs{" "}
35+
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
36+
-&gt;
37+
</span>
38+
</h2>
39+
<p className="m-0 max-w-[30ch] text-sm opacity-50">
40+
Find in-depth information about Next.js features and API.
41+
</p>
42+
</a>
43+
44+
<a
45+
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
46+
className="px-5 py-4 transition-colors border border-transparent rounded-lg group hover:border-gray-300 hover:bg-gray-100 hover:dark:border-neutral-700 hover:dark:bg-neutral-800/30"
47+
target="_blank"
48+
rel="noopener noreferrer"
49+
>
50+
<h2 className="mb-3 text-2xl font-semibold">
51+
Learn{" "}
52+
<span className="inline-block transition-transform group-hover:translate-x-1 motion-reduce:transform-none">
53+
-&gt;
54+
</span>
55+
</h2>
56+
<p className="m-0 max-w-[30ch] text-sm opacity-50">
57+
Learn about Next.js in an interactive course with&nbsp;quizzes!
58+
</p>
59+
</a>
60+
</div>
61+
</main>
62+
);
63+
}

next.config.mjs

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
/** @type {import('next').NextConfig} */
2+
const nextConfig = {
3+
output: 'export',
4+
};
5+
6+
export default nextConfig;

0 commit comments

Comments
 (0)