From 423389ba3ab9cbc130ea4ef85ecf065dbef5dcb7 Mon Sep 17 00:00:00 2001 From: govolokatliai Date: Thu, 22 Aug 2024 01:18:31 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E4=BA=86=E5=BC=80=E5=8F=91?= =?UTF-8?q?=E7=BB=84=E7=BD=91=E7=AB=99=E7=9A=84=E5=BF=AB=E9=80=9F=E4=B8=8A?= =?UTF-8?q?=E6=89=8B=E6=8C=87=E5=8D=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../devdocs/02-网站/02-开发组网站/快速上手.md | 204 ++++++++++++++++++ 1 file changed, 204 insertions(+) create mode 100644 docs/devdocs/02-网站/02-开发组网站/快速上手.md diff --git a/docs/devdocs/02-网站/02-开发组网站/快速上手.md b/docs/devdocs/02-网站/02-开发组网站/快速上手.md new file mode 100644 index 0000000..6335065 --- /dev/null +++ b/docs/devdocs/02-网站/02-开发组网站/快速上手.md @@ -0,0 +1,204 @@ +# 快速上手 +本指南写给技术背景较浅,但是又愿意参与网站内容开发的人 +:::info 信息 + +在正式开始编辑前,你可以看看我们的成品网站,每篇文章的下面会有一个`Edit This Page`的链接,是这篇文章的源代码,这里是网站的链接:[Click Me ](https://zscdev-demo.pages.dev/) + +::: +## 准备 +我们假设你所使用的是windows系统。 + +首先,我们需要安装必要的开发工具:git 和 nodejs。 + +访问如下链接:[git下载](https://git-scm.com/download/win) , [nodejs下载](https://nodejs.org/zh-cn/download/prebuilt-installer)。 + +:::info 信息 + +你也可以通过windows自带的WinGet包管理器下载,详见:[微软文档](https://learn.microsoft.com/zh-cn/windows/package-manager/winget/)。 + +::: + +:::tip git是什么? + +git是一个版本控制工具,他可以追踪一个项目的改动,并且大大方便了多人协作的管理。 + +::: + +:::tip 什么是Node.js? + +Node.js是一个在后端运行javascript的运行时。 + +::: + +访问github,如果没有账号,就注册一个,打开https://github.com/ZSCNetSupportDept/website。 + +点击上面的fork,创建仓库的一个分支,点击create fork。 + +进入你刚才fork的仓库,点击Code,选择HTTPS,复制下面的那一串内容。 + +然后,请打开你的终端,你可以在“开始”菜单栏里搜索"PowerShell"来打开。 + +如果你的系统没有安装PowerShell,你可以使用cmd,按`Win+R`,在弹出框里输入`cmd`打开。 + +输入`git clone 你复制的内容`,这将在你的当前目录下创建一个名为`website`的文件夹,并将开发组网站的全部内容复制到这个文件夹里面。 + + +:::tip 提示 + +你可能会需要科学上网的手段来访问github。 + +::: + + +然后,输入`cd website` + +切换到我们的项目目录下后,运行`npm install`来安装项目的所有依赖。 + +:::tip 提示 + +为了加速下载,你可能会需要配置npm镜像,可以输入`npm config set registry https://registry.npmmirror.com`。 + +::: + +现在,输入`npm start`,程序就会在你的电脑上构建并部署网站。 + +然后在你的浏览器上输入`https://localhost:3000` + +如果没有出错的话,你会看到我们开发组网站的主页。 + +## 编辑 +打开`website`下的`docs`文件夹,再打开`wiki`文件夹,这里就是我们的wiki内容仓库了。 + +仓库里的所有的文章都是以md结尾的markdown文件,你需要熟悉markdown的写法,才能对文章的内容修改和完善,markdown并不是特别复杂,你可以花一点时间去学会他。 +:::info 信息 + +这里是一些学习markdown的资源:https://markdown.com.cn/ \ +https://github.highlight.ink/mastering-markdown/intro \ +https://commonmark.org/ (英文) + +::: + +如果想要在文本中添加图片,视频,或者其他资源,请将这些素材放入static中,以方便管理。 + +对代码的修改将会自动同步到刚才打开的网页里,你可以在那里确认修改的结果满意与否,注意,你需要保存文件才会同步更改。 + +修改完毕后,输入`git add .`再输入`git commit`,并对你的修改做出一个简短的说明。 + +### 文件名 +你会发现,所有文件的名字前面都有一个数字,那就是文章在sidebar中出现的顺序,增添文件,请按照`order-filename.md`的格式修改名字。 + +在文件名前加一个下划线,系统就不会将文章加入成品网站中。 +## 推送到仓库 +:::tip 提示 + +你可以使用github desktop或github cli来简化这个流程,不过我们想让你在这个过程中学习SSH的用法,如果你想方便一点,直接跳到“使用github-cli”。 + +::: +### 选项1:使用SSH + +首先,确保你安装了SSH,你可以看微软的这片文档:[链接](https://learn.microsoft.com/zh-cn/windows-server/administration/openssh/openssh_install_firstuse?tabs=gui)。 + +打开终端,输入 + +```PowerShell + +ssh-keygen -t ed25519 + +``` + +然后在接下来的选项中检查密钥的存放路径,以及使用一个密码来加密这个密钥,我们建议你设置一个密码。 + +然后我们设置开机自动启动ssh-agent服务。 + +确保你使用了管理员权限运行了下面的PowerShell代码: + +```PowerShell + +Get-Service ssh-agent | Set-Service -StartupType Automatic + +Start-Service ssh-agent + +Get-Service ssh-agent + +``` + +最后一个命令应该会返回`Running`状态。 + +然后,你就可以输入`ssh-add`来加载你的密钥。 + +```PowerShell + +ssh-add 你的私钥位置 + +``` +:::tip 提示 + +每次重启电脑,你都要重新输入一遍`ssh-add`。 + +::: + +:::info 信息 + +关于SSH的配置,参考了这片[微软文档](https://learn.microsoft.com/zh-cn/windows-server/administration/openssh/openssh_keymanagement)。 + +::: + +接下来,我们配置github的SSH访问。 + +打开与私钥同目录下的公钥文件(以pub结尾),然后复制他,注意要全部复制,不要多出或减少任何内容。 + +点一下你的github头像,选择Settings,然后在侧边栏的Access板块找到SSH and GPG keys。 + +点击 `New SSH key`。 + +把密钥粘贴到下面,然后保存就行了。 + +在终端里输入 + +```PowerShell + +ssh git@github.com + +``` + +如果返回的文本里出现了你的用户名,配置就大概成功了。 + +现在就可以输入`git push`了 + +```PowerShell + +git push + +``` + +这个命令会向远端的仓库提交你在本地提交的commit,检查你的fork仓库,有没有更新到你本地的修改? + +:::info 信息 + +参考了github的文档:[Click Me ](https://docs.github.com/zh/authentication/connecting-to-github-with-ssh/about-ssh) + +::: + +### 选项2:使用github-cli +访问https://github.com/cli/cli/releases , 下载最新版本。 + +输入`gh`以检查安装的成功状况。 + +没问题的话,输入`gh auth login`,会弹出一个浏览器窗口,在弹出的窗口中完成登录。 + +然后,你应该就可以直接使用`git push`了,输入`git push`,然后查看你在github中的fork仓库,有没有更新到你本地的修改。 +:::info 信息 + +这里有更多关于github cli 的信息:[Click Me ](https://docs.github.com/zh/github-cli/github-cli/about-github-cli) + +::: + +### 提交pull request +一个pull request 是一个请求,将修改建议发送给主仓库,并让主仓库合并这些修改。 + +打开主仓库,选择上面的Pull Requests,然后选择New Pull Request,如果没有出现你的fork仓库,点击compare accross forks。 + +然后就可以Create Pull Request了。 + +我们会检查你的提交是否合适,然后在主仓库合并你的修改,这就是我们的开发流程了。 +