Programming-Club-Curtin-Colombo/krypta-2026
GitHub: Programming-Club-Curtin-Colombo/krypta-2026
Curtin University Colombo 编程俱乐部为 KRYPTA 2026 Hackathon 竞赛构建的官方活动公告落地页，采用 Next.js 16 生产级前端模板，支持邮件订阅与多页面扩展。
Stars: 0 | Forks: 0
# KRYPTA 2026
**KRYPTA 2026** 的官方公开落地页 - 这是一个由 **Programming Club of Curtin University Colombo** 组织的首要多赛道 hackathon 竞赛。
[](https://github.com/Programming-Club-Curtin-Colombo/krypta-2026/actions/workflows/ci.yml)
[](https://krypta2026.vercel.app)
[](https://nextjs.org)
[](https://typescriptlang.org)
[](https://tailwindcss.com)
## 概述
本仓库包含 KRYPTA 2026 的**“即将推出 / 活动公告”**落地页。它被设计为一个生产级别的起始模板，确立了活动的标识，并允许在确认活动细节后进行无缝的未来扩展。
## 技术栈
| 层级 | 技术 |
|---|---|
| 框架 | Next.js 16 (App Router) |
| 语言 | TypeScript 5 |
| 样式 | Tailwind CSS v4 |
| 动画 | Framer Motion |
| 图标 | Lucide React |
| 主题 | next-themes |
| 字体 | Space Grotesk (标题), Inter (正文) 通过 `next/font` |
| 测试 | Vitest |
| Linting | ESLint (Next.js config) |
| 格式化 | Prettier |
| 部署 | Vercel |
## 项目结构
```
krypta-2026/
├── public/
│ ├── logo/ # Drop PNG logo assets here (see logo/README.md)
│ └── favicon.ico
├── src/
│ ├── app/
│ │ ├── api/
│ │ │ └── subscribe/ # POST /api/subscribe - email subscription proxy
│ │ ├── globals.css # Full design system (tokens, light/dark mode)
│ │ ├── layout.tsx # Root layout: fonts, SEO metadata, JSON-LD, ThemeProvider
│ │ ├── page.tsx # Home page - section composition
│ │ ├── robots.ts # robots.txt generation
│ │ ├── sitemap.ts # sitemap.xml generation
│ │ └── manifest.ts # PWA manifest generation
│ ├── components/
│ │ ├── layout/
│ │ │ ├── Navbar.tsx
│ │ │ └── Footer.tsx
│ │ ├── providers/
│ │ │ └── ThemeProvider.tsx
│ │ ├── sections/
│ │ │ ├── HeroSection.tsx
│ │ │ ├── AboutSection.tsx
│ │ │ ├── VisionSection.tsx
│ │ │ ├── WhatToExpectSection.tsx
│ │ │ ├── CompetitionFocusSection.tsx
│ │ │ ├── WhyParticipateSection.tsx
│ │ │ ├── TimelineSection.tsx
│ │ │ ├── OrganizedBySection.tsx
│ │ │ └── StayUpdatedSection.tsx
│ │ └── ui/
│ │ ├── AnimatedSection.tsx
│ │ └── ThemeToggle.tsx
│ └── lib/
│ └── utils.ts # cn() - Tailwind class merging utility
├── tests/
│ └── unit/
│ └── utils.test.ts # Vitest unit tests
├── .env.example # Environment variable template
├── .prettierrc
├── vitest.config.ts
├── next.config.ts
├── tsconfig.json
└── README.md
```
## 入门指南
### 前置条件
- Node.js 20+
- npm 10+
### 安装
```
git clone https://github.com/Programming-Club-Curtin-Colombo/krypta-2026.git
cd krypta-2026
npm install
```
### 环境设置
```
cp .env.example .env.local
# 如果需要，请使用您的实际值编辑 .env.local
```
### 开发
```
npm run dev
```
在浏览器中打开 [http://localhost:3000](http://localhost:3000)。
### 生产构建
```
npm run build
npm run start
```
### 检查
```
npm run lint # ESLint
npm run type-check # TypeScript strict type check
npm test # Vitest unit tests
npm audit --audit-level=high # Dependency security audit
```
## CI Pipeline
每次推送和 pull request 都会触发 **Standard CI Pipeline**。所有五个阶段都必须通过，Governance Engine 才会允许合并。
| 阶段 | 工具 | 检查内容 |
|---|---|---|
| **Build** | `next build` | 编译时正确性，页面渲染 |
| **Lint** | ESLint + `tsc --noEmit` | 代码风格和类型安全 |
| **Static** | `ts-prune` + `depcheck` | 未使用的导出和依赖项 |
| **Test** | Vitest | 单元测试正确性 |
| **Security** | `npm audit` | 依赖项中的高危/严重 CVE |
## 添加 Logo 资产
官方 KRYPTA 2026 logo 放置在 `public/logo/` 中。
| 文件 | 用途 |
|---|---|
| `krypta-logo.png` | 完整的字标（用于浅色和深色背景） |
| `krypta-icon-192.png` | PWA icon 192×192 |
| `krypta-icon-512.png` | PWA icon 512×512 |
有关完整的使用说明，请参阅 [`public/logo/README.md`](./public/logo/README.md)。
## 连接电子邮件表单
## 部署
本网站配置为在 **Vercel** 上部署。
1. 推送到您的 GitHub 仓库。
2. 将该仓库连接到一个新的 Vercel 项目。
3. 在 Vercel 的环境变量面板中设置 `NEXT_PUBLIC_SITE_URL`。
4. 部署。
`sitemap.xml`、`robots.txt` 和 `manifest.webmanifest` 会在构建时由 Next.js App Router 文件约定自动生成。
## 未来页面
以下页面计划用于未来的扩展。Sitemap 中已经为每个页面包含了注释掉的条目：
- `/about` - 完整的关于页面
- `/tracks` - 竞赛赛道详情
- `/schedule` - 活动日程
- `/sponsors` - 赞助商展示
- `/judges` - 评委阵容
- `/faq` - 常见问题
- `/register` - 注册门户
- `/workshops` - 研讨会列表
- `/rules` - 竞赛规则
- `/contact` - 联系表单
## 许可证
© 2026 Programming Club - Curtin University Colombo。保留所有权利。
标签：Syscall, TypeScript, Web开发, 前端, 安全插件, 活动落地页, 自动化攻击, 黑客松活动