- 项目地址:https://atomgit.com/lijin/open-atom-contributor-leaderboard/
根据此项目的 README.md 文件里面的“项目使用”撰写一篇可以让更多非技术同学能玩转的教程
0、前提条件
可能有的人是首次使用,那么我们可以尽量全面介绍,照顾到细节。 为了简化操作的复杂度,尽量全部用 GUI 的形式来操作。
- Windows11
- Python3
- NodeJS v20.12.2
- Git Client:OpenLinkSaaS
1、安装所需软件和运行环境配置
1)安装 Python
推荐使用 Anaconda 进行 Python 开发,它集成了 Python 解释器和常用的科学计算库,方便管理环境和软件包,尤其适合数据科学、机器学习等领域。
- 下载地址 https://www.python.org/downloads/
- 双击安装 Python3 软件
- 验证 Python 安装成功
2)安装NodeJS
-
双击安装 NodeJS
- 验证 NodeJS 安装成功
3)安装OpenLinkSaaS
- 下载地址:https://www.linksaas.pro/download
- 双击安装
2、下载开源项“开放原子开源活动贡献榜”
2.1、用你的 AtomGit 登录 OpenLinkSaaS
2.2、设置 SSH,让你的本地电脑和AtomGit 进行通信
- 生成 SSH Key
- 复制 SSH Key 公钥
- 在 AtomGit 中设置此公钥
2.3、推荐使用 SSH 方式下载克隆
3、数据转换
进入“开放原子开源活动贡献榜”项目的“src”目录
在“src”目录下,打开终端
安装python 项目的依赖包:pandas
pip install pandas
执行命令python3 .\convert.py
4、项目test & build
1) test
进入“开放原子开源活动贡献榜”根目录,并且打开终端
注意,以下操作都在
master分支
操作。
- 安装 Nodejs 的 NPM 包依赖,执行下面命令
npm install
- 上线前本地查看数据和站点的渲染,执行命令
用于在开发模式下运行应用。 打开 http://localhost:3000 在浏览器中查看。如果你进行了编辑,页面将重新加载。 你还将在控制台中看到任何 lint 错误。
npm start
2) 推送到 master 分支
此时从本地看数据和页面如果都没有什么问题,那么可以先推送到 master 分支。
这里推荐两种操作方式二选一。
方式一:用 OpenLinkSaaS 操作
-
添加并提交有变化的文件
-
把提交了变更的数据推送到 AtomGit 远端仓库
-
检查更新成功
方式二:用 Git 命令操纵
分别执行命令
git add ./
git commit -m '更新说明'
git push
3) build
npm run build
,此时会产生的静态文件都将会在 “build目录"中。
4) 切换到build分支
,执行静态文件编译
从此处开始,操作都将会在
build 分支
操作。
4-1)这里推荐两种操作方式二选一。
方式一:用 OpenLinkSaaS 操作
- 接着手动删除“build目录”和“.gitignore”文件之外的所有文件。
- 手动把“build目录”里面的
所有
内容都移动到“build目录”之外,也就是和“build目录”同级别。再把“build目录”删除。
推送到远端 AtomGit 上的 build 分支
-
添加&提交
-
把提交了变更的数据推送到 AtomGit 远端仓库
-
检查更新成功
方式二:用 Git 命令操作
git checkout build
- 接着手动删除“build目录”和“.gitignore”文件之外的所有文件。
- 手动把“build目录”里面的
所有
内容都移动到“build目录”之外,也就是和“build目录”同级别。再把“build目录”删除。
推送到远端 AtomGit 上的build 分支
git add .
git commit -m '更新说明'
git push
- 检查更新成功
5、访问远端仓库地址查看更新
- 访问仓库地址,查看是否更新了数据。
- 如果没有请进入仓库的“设置”->“Pages”,手动点击下“保存”按钮,将会更快的刷新最新的数据。如下图。 。
以上。