因开放而精彩,因开源而未来
GitHub · 开放原子基金会 · OpenHarmony
科成开放原子开源社团成立于 2024年1月11日,是开放原子开源基金会联合腾讯公司共同出资发起、由电子科技大学成都学院支持建设的高校学生社团。
社团以计算机技术和软件开发为主要领域,以推动开源事业为驱动力,致力于打造国内开源基础软件新生态,明确将自身定位为 连接校园与产业的开源人才培养基地。
| 技术方向 | 简介 |
|---|---|
| OpenHarmony (开源鸿蒙) | 分布式操作系统学习与应用开发 |
| openEuler (欧拉) | 企业级 Linux 操作系统研究 |
| OpenTenBase (腾讯数据库) | 开源数据库内核开发与优化 |
| 部门 | 职责 |
|---|---|
| 外联部 | 负责对外交流与企业合作对接 |
| 宣策部 | 负责品牌宣传与活动策划 |
| 项目部 | 负责技术开发与开源项目维护 |
| 组织部 | 负责社团日常管理与活动组织 |
| 秘书处 | 负责行政管理与文档工作 |
| 姓名 | 职位 |
|---|---|
| 陈圣夫 | 会长 |
| 李枨 | 副会长(OpenTenBase 方向负责人) |
| 李星谕 | 副会长(技术骨干) |
| 柴诗雨 | 副会长 |
| 林涛 | 副会长 |
- 开放原子菁英团奖 — 全国仅 3 个团队入选 (2025)
- 校源行优秀指导教师 — 指导老师魏雨东 (2025)
- 春耕计划优秀组织高校 — 社团组织工作获全国性认可 (2025)
- OpenTenBase 核心贡献挑战赛 — 社团成员荣获竞赛奖项 (2024)
| 技术 | 说明 |
|---|---|
| Parcel 2.x | 零配置构建工具,热重载开发 |
| 原生 JavaScript | 无框架依赖,约 1500 行代码 |
| CSS 变量 + data-theme | 亮/暗主题切换,localStorage 持久化 |
| IntersectionObserver | 滚动动画触发,性能优化 |
| localStorage | 本地数据存储,模拟数据库 |
| GitHub Actions | CI/CD 自动化部署 |
- 零框架:纯原生 JS/CSS,体积小、加载快
- 主题系统:支持手动切换 + 系统跟随 + 用户偏好持久化
- 动画性能:IntersectionObserver 替代 scroll 监听
- 响应式:移动端优先,多尺寸适配
- 无障碍:尊重
prefers-reduced-motion系统偏好
详细技术文档请查看 技术栈.md。
| 页面 | 文件 | 功能 |
|---|---|---|
| 首页 | src/index.html |
Hero、介绍、技术方向、动态、团队、项目 |
| 社团简介 | src/about.html |
社团详情、组织架构、荣誉成果 |
| 新闻动态 | src/news.html |
新闻列表,分页加载 |
| 新闻详情 | src/news-detail.html |
单条新闻内容 |
| 导航站 | src/projects.html |
开源资源链接导航 |
| 登录 | src/login.html |
管理员登录 |
| 管理后台 | src/admin.html |
申请管理仪表盘 |
| 分支 | 版本 | 描述 |
|---|---|---|
| Version_0.1 | 经典三栏版 | 经典三栏布局,Shader 背景动画,支持深色/浅色主题切换 |
| Version_0.2 | 全屏沉浸版 | 全屏沉浸式设计,滚动动画,现代化卡片布局 |
| Version_0.3 | 精致优化版 | 基于 v2 优化,添加系统级明暗主题,WebGL 背景增强 |
| Version_0.4 | 动画主题版 | 太阳/月亮切换按钮,响应式亮暗主题,米白/深蓝配色 |
| Version_0.5 | Parcel 构建版 | 引入 Parcel 构建系统,代码模块化分离,历史版本归档 |
| Version_0.6 | 视觉升级版 | 年轻活力风格,晨曦蓝主题,GitHub 蓝配色,卡片动效优化 |
| Version_0.7 | 明亮默认版 | 默认亮色主题,语义化图片命名,开源项目仪表盘,导航顺序优化 |
| Version_0.8 | 二维码动画版 | 双向滚动动画,二维码展开大图,页脚布局优化,CDUESTC 英文翻译 |
| Version_0.9 | 申请管理版 | 本地数据库管理,管理员后台仪表盘,申请记录查看/删除/导出,页脚管理员入口 |
| Version_1.0 | 在线部署版 | GitHub Actions CI/CD 自动化部署,GitHub Pages 在线托管,安全响应头配置 |
| Version_1.1 | 多页面版 | 新增 about/news/login/admin 等独立页面,完善站点结构 |
| Version_1.2 | 中英同步版 | 全站中英文同步、语言持久化、页脚功能统一、Favicon 图标优化 |
| 特性 | v0.1 | v0.2-v0.4 | v0.5-v0.6 | v0.7-v0.8 | v0.9 | v1.0 | v1.1 | v1.2 |
|---|---|---|---|---|---|---|---|---|
| 布局 | 三栏 | 全屏分栏 | 全屏分栏 | 全屏分栏 | 全屏分栏 | 全屏分栏 | 多页面 | 多页面 |
| 动画 | Shader | 滚动渐入 | 滚动渐入+主题动画 | 双向滚动动画 | 双向动画 | 双向动画 | 双向动画 | 双向动画 |
| 主题 | 手动 | 系统跟随 | 太阳/月亮按钮 | 亮/暗切换 | 亮/暗切换 | 亮/暗切换 | 亮/暗切换 | 亮/暗切换 |
| 构建 | ❌ | ❌ | Parcel | Parcel | Parcel | Parcel | Parcel | Parcel |
| 申请管理 | ❌ | ❌ | ❌ | ❌ | ✅ | ✅ | ✅ | ✅ |
| CI/CD | ❌ | ❌ | ❌ | ❌ | ❌ | ✅ | ✅ | ✅ |
| 多页面 | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ✅ | ✅ |
| 中英双语 | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ✅ |
| 语言持久化 | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ | ✅ |
# 安装依赖
npm install
# 开发模式(热重载)
npm run dev
# 生产构建
npm run build
# 清理构建缓存
npm run clean构建产物输出至
dist/目录,可直接部署至 GitHub Pages 等静态托管服务。
Organization-Blog/
├── dist/ # Parcel 构建产物(部署用)
├── src/ # 源代码
│ ├── index.html # 首页
│ ├── about.html # 社团简介
│ ├── news.html # 新闻列表
│ ├── news-detail.html # 新闻详情
│ ├── projects.html # 导航站
│ ├── login.html # 登录页
│ ├── admin.html # 管理后台
│ ├── css/
│ │ └── theme.css # 主样式文件
│ ├── js/
│ │ ├── theme.js # 主题管理器
│ │ ├── main.js # 核心逻辑(i18n、动画、轮播)
│ │ └── db.js # 本地数据库
│ ├── images/ # 图片资源
│ └── data/
│ └── news.json # 新闻数据
├── archive/ # 历史版本归档
│ └── docs/ # 各版本详细文档
├── 社团图标.jpg # 社团标志
├── 社团微信公众号二维码.png # 微信公众号二维码
├── package.json # npm 配置
├── README.md # 项目总览文档
├── CLAUDE.md # Claude AI 辅助开发文档
└── 技术栈.md # 技术栈详解文档
欢迎提交 Issue 和 Pull Request!
feat:新功能fix:问题修复docs:文档更新style:代码格式调整refactor:重构
Made with Memset
