前言

自己有份收藏的 Java 教程静态网页,之前将其保存为一份 100+MB,1000+ 页的 PDF 文件,然后放在手机上,但是,即便如此,依然还有将近 3/4 的内容无法放进来,而且使用体验并不好。所以,看到 github,和码云的 Pages 就考虑可以试试玩下,如果成功的话,那就可以很方便的使用这份资料了。而且,尝试新东西的乐趣我是最喜欢的了。

前段时间,开始着手尝试了 pages,因为不太想公开这份文档资料(),所以选择了可以创建 private 项目的码云了。一通操作之后,非常顺利的上线了,确实很好玩的。😄

但是,作为菜鸟级别的我当然希望做个笔记记录一下,既可以帮助自己随时复习这波操作,又可以帮助想看看 Pages 怎么搞的朋友,最主要的是那啥对吧,何乐而不为呢!

正题

OK,那我们就切入正题:
- 如何在码云上创建静态页面托管?
- 如何使用码云的 Pages 服务创建静态页面网站、个人博客等?

步骤

(下面操作中使用的是一同事做的技术分享,采用 reveal.js 写网页 PPT?总之,是一份 Java 基础培训教材的一部分,我也没有后面的部分。)
- step 1 : 创建码云在线仓库。
(这里我创建的是 Private 项目,也可以创建 Public 项目)

step120181220141125png

创建好之后就可以看到该项目的项目名、README 内容。

step220181220142354png

  • step 2 : 在本地新建一个 git 文件夹,将项目文件复制到 git 文件夹中。然后右键鼠标,点击 git base here 进入到 git 工具中

step3QQ20181220200639png

step4QQ20181220200711png

然后开始 git 操作:

  git config --global user.name "你的名字或昵称" //设置用户名
  git config --global user.email "你的邮箱" //设置邮箱
  git init   //初始化本地库
  git remote add origin <你的项目地址> //注:项目地址形式为:http://git.oschina.net/xxx/xxx.git或者 git@git.oschina.net:xxx/xxx.git//将本地项目与码云项目连接起来
  git clone <项目地址>//将码云上的项目下载到本地库中
  git pull origin master//更新 必须做的操作
  git touch init.txt //如果已经存在更改的文件,则这一步不是必须的
  git add .//添加要修改的文件
  git commit -m "第一次提交"//提交
  git push origin master//推送修改到码云

如果需要中间删除错误文件夹、文件,则使用下面 git 命令:

  git pull origin  master//确保服务器和码云上面的内容一致  如果不一致   那么先使用

  git rm -r --cached filename //要删除的文件/文件夹
  git commit -m "删除xxxx文件"

  git push origin master  //推送到码云上面

  • step 3 : 最终所有文件都上传到了码云上仓库中。

step5QQ20181220224049png

  • step 4 : 在项目页面点击项目名称下的功能链接中的“服务”,选择其中的“Gitee Pages”, 进入创建 Pages 页面。

step6QQ20181220224105png

在创建 Pages 页面基本上不需要做什么多余的操作(除非你需要使用分支),确定点击“启动”。

step7QQ20181220224215png

step9QQ20181220224329png

👏 😋 恭喜你,你已经成功创建了自己的静态页面托管 Pages 了。快来一起看看最终的效果吧:

案例链接:
Pages 页面:Java_The Quick Guide

step11QQ20181220225046png

  • step 5 : 修改页面源代码

如果需要修改静态页面的代码内容:可以使用代码的 Web IDE 功能。

step12QQ20181220225046png

可以在线编辑,随时生效。

step10QQ20181220225046png

好了,到此就完成了利用码云的 Pages 服务,进行了静态页面托管,可以随时在线访问静态页面了。你可以将自己的个人博客、个人简历做成精美的页面放在这里,也可以放些简单的企业、机构宣传网站,也可以放些技术文档教程之类,也可以放些个人小说、笔记等。大家可以一起尝试发现更多新鲜玩法。

“君子生非异也,善假于物也。” –《荀子 · 劝学》

总结

  1. 总得来说,整个 Pages 的创建其实非常简单,只要保证项目中的静态页面上的资源链接都是相对路径,在创建 Pages 后可以保证都能被正确加载就可以。
  2. 对我个人来讲,其实花费时间最多的是 Git 工具的学习和使用,在线仓库的管理和使用。对于这方面的知识,平时用的不多,也没有系统去学习,因此,这次的案例中因为 reveal.js 文件夹名称的问题真的花了好多时间解决,也学到练到了棒棒的技能😂 。个人觉得这其实才是我这篇帖子中对自己来说最大的知识点了。
  3. 最后,我终于发现 MarkDown 编辑语法的诀窍了,我才不会告诉你我一直认为这里帖子对 MarkDown 支持有问题(明明我都按照Markdown 教程 里的格式输入了,为什么还不能正常显示。)的原因是因为没有在符号和文字中间加空格空格空格….😂
  4. 忘了,补充下,Pages 需要在项目的根目录下有 index.html 文件,还支持其他什么什么的(那些都到我的知识盲点了,我都不懂了😄 ),详细情况看下条链接中的官方帮助文档。

  5. 码云官方 Pages 帮助文档:码云 Pages 帮助文档

P.S: 噗,终于补全了这篇帖子了

感谢    关注    收藏    赞同    反对    举报    分享