如何使用Git

test link[1].

test footnote2[2].
test3[3].

如何使用Hexo中,介绍了如何使用github来支持hexo。有了github的支持,我们就可以:

  • 更为可靠的文件管理,不再担心文件丢失;
  • 更为通用的多人协同;
  • 更为便利的网站发布,类似vercel是支持从github中直接拉取文件。或者我们也可以自己写github action脚本,实现自动部署。

对于当前最简单的应用场景,我们可以先忽略branch,大部分的改动都在master上。后续,如果需要增加人工审核了,才需要涉及branch。

基于hexo,我们来介绍git怎么使用。都是命令行。理解了命令行,才能理解UI。


参考代码开发,我们通常会在本地部署一套测试环境,以及一套开发环境。对应的,我们假设在本地会有一套website,一套github.
website,可以理解为本地的测试环境,基于hexo init创建好,可以完整的hexo generate, hexo server.
github, 可以理解为开发环境,git clone的一个仓库,主要用于本地的md文件编写。我们开发的惯例,是在github中编写md文件,VSCode可以提供基本的preview功能,帮助我们进行基本的markdown语法校验。当编写完成后,再拷贝到website中,进行本地的hexo generate, hexo server预览。预览没有问题后,再把中间正确的md文件拷贝回github中,然后提交。

之所以不将整个hexo相关的环境都放到github中,主要是几个考虑:

1、维护的文件数量,

2、不同机器,对应的hexo环境可能不一样,比如node的版本,hexo的版本,hexo安装的package的情况等。
所以,最靠谱的方式,将hexo相关的脚本以及配置文件放到github中,然后每次线上编译时,使用container,安装指定版本的node、hexo以及配置文件指定的package。
但目前,我们比较简单,所以,就远端服务器上部署一套hexo环境,然后通过github action脚本,把md文件copy到source/_posts中,编译完成后,再拷贝到网站目录。


当我们创建一篇post后,hexo new post ‘guide-to-git.md
对应的,会在source/_posts/下新增一个guide-to-git目录和一个guide-to-git.md文件。

我们编写完成后,将test目录和test.md文件拷贝到website下,hexo generate && hexo server,进行预览。没有问题后,如果中间有改动,则将test目录和test.md拷贝后github中,准备提交。

首先,万恶之源,都是提交之前没有git pull。所以,
请先git pull

请先git pull

请先git pull

重要的事情说三遍。

然后git status, 看看当前目录下,文件相对于仓库的变化。比如,我目前git status后的截图:

确认修改是符合预期的,开始git add,git add的作用是将指定的改动添加到stage中(stage可以暂时理解为本地缓存,缓存内的改动会在下一次commit后提交进代码仓库)。如果确认modified和new的文件、目录都是要加入的,直接git add .
Stage all files: git add .
也可以单个文件或者目录:git add example.html (replace example.html with your file name)
Stage a folder: git add myfolder (replace myfolder with your folder path)

这时,再次git status, 你会看到变化:

status的输入,也会提醒要commit。我们commit一把, git commit -m ‘your commit message’

最后,git push即可。
以上就是最简单的git使用。涉及到: git status, git pull, git add, git commit, git push


  1. reference1. ↩︎

  2. reference2. ↩︎

  3. reference3. ↩︎

如何成为一名全栈开发者

说明:文档会持续更新,结合自己的进展,会持续迭代相关内容。


从大厂出来,关注了若干热点,如:web3,ai以及robot,结合自己的实际情况,工程背景,最后选择做indie coder。作为一个indie coder,自己最需要补的就是前端技能,因为自己是一个后端开发者,前端技能缺失。

通过和chatgpt交流,初步确定前端的架构:next.js。其中最大的考虑是vercel,基于vercel可以低成本(接近零成本)起步。

围绕着建站,从前往后,大概分为几块:

流量获取

前期,可以先忽略流量。先把内容做好。做的过程中,可以琢磨下关键词。试图通过更好的关键词,在长尾搜索中获得靠前的排名。这个后续在自己有更多的实战后分享。

网站搭建

基于之前自己搭建个人博客的经历,还是先从最简单的静态网站开始。hexo/hugo是不错的起点。静态网站适合静态内容的发布。通过撰写md文件,编译后产生静态html,最后部署到服务器上,简单快捷,同时还能集成github。

静态网站 - hexo

详细参考:如何使用Hexo

动态网站 - next.js

学习中,大致路径:react、next.js

网站维护

流量监控

加入GA,后续分析自己的实践。主要是日常监控、异常发现(机会点识别)等。也有同学推荐:Plausible.这个目前还没有尝试。

内容建设

持续的输出,日拱一卒,积硅步以至千里。可以从自己日常的开发、社交媒体的阅读找到写作的灵感,然后快速输出。


等网站有一定的自然流量后,再申请google adsense,估计可以实现一定的收入。这个后续等有了第一笔收入后,再分享。

Privacy Policy

Privacy Policy for Rainfish.org

Last updated: 7th Nov, 2023

At Rainfish.org, accessible from https://rainfish.org, one of our main priorities is the privacy of our visitors. This Privacy Policy document contains types of information that are collected and recorded by Rainfish.org and how we use it.

If you have additional questions or require more information about our Privacy Policy, do not hesitate to contact us.

By using our website, you hereby consent to our Privacy Policy and agree to its terms.

Information We Collect

The personal information that you are asked to provide, and the reasons why you are asked to provide it, will be made clear to you at the point we ask you to provide your personal information.

If you contact us directly, we may receive additional information about you such as your name, email address, phone number, the contents of the message and/or attachments you may send us, and any other information you may choose to provide.

When you register for an Account, we may ask for your contact information, including items such as name, company name, address, email address, and telephone number.

How We Use Your Information

We use the information we collect in various ways, including to:

  • Provide, operate, and maintain our website
  • Improve, personalize, and expand our website
  • Understand and analyze how you use our website
  • Develop new products, services, features, and functionality
  • Communicate with you, either directly or through one of our partners, including for customer service, to provide you with updates and other information relating to the website, and for marketing and promotional purposes
  • Send you emails
  • Find and prevent fraud

Log Files

Rainfish.org follows a standard procedure of using log files.

如何使用Hexo

本文主要介绍如何在mac上配置hexo环境,完成md的编写与提交,最后push到github仓库中。

Hexo官方安装文档:hexo官方安装文档启动的5大关键步骤如下:

  1. 安装git -> 配置git(可以提交.md文件)-> git clone hexodemo
  2. 安装node -> 安装hexo
  3. 编写静态文件:hexo new page -> 找到合适的markdown编辑器编写
  4. 提交静态文件
  5. 等待服务器更新

安装git并配置github账号


安装git

mac默认应该是安装git了。可以打开Terminal输入 git --version
如果报命令未找到,那大概率没有安装,需要自己安装一个git

  • 方式1: 最简单的,安装Xcode Command Line Tools.
  • 方式2: 下载git二进制文件,并手动安装。下载路径:git on mac下载路径安装完毕后,再试着运行:git --version,确认是否安装成功。

配置github

为了方便且安全,我们使用ssh方式,实现客户端与github的通信。
因此,我们需要生成一对公私钥,用于身份校验和信息加解密。

在mac上生成ssh密钥

生成密钥:

打开Terminal
输入:ssh-keygen -t ed25519 -C “your_email@example.com
一路回车,最后会在 /Users/YOU/.ssh下产生 id_ed25519和id_ed25519.pub两个文件

本机配置

  • 在 /Users/YOU/.ssh目录下新增config文件。 touch ~/.ssh/config
  • 编辑config文件
1
2
3
4
Host github.com
AddKeysToAgent yes
UseKeychain yes
IdentityFile ~/.ssh/id_ed25519
  • 增加key到ssh-agent ssh-add --apple-use-keychain ~/.ssh/id_ed25519

我现在用mac少,不是特别熟悉了。具体的可以多看看在mac上生成ssh密钥

github上配置

  • copy公钥文件 pbcopy < ~/.ssh/id_ed25519.pub
  • 在github增加sshkey

    在边栏的“访问”部分中,单击 “SSH 和 GPG 密钥”。
    单击“新建 SSH 密钥”或“添加 SSH 密钥” 。在 “Title”(标题)字段中,为新密钥添加描述性标签。 例如,如果使用的是个人笔记本电脑,则可以将此密钥称为“个人笔记本电脑”。
    选择密钥类型(身份验证或签名)。 有关提交签名的详细信息,请参阅“关于提交签名验证”。
    在“密钥”字段中,粘贴公钥。
    单击“添加 SSH 密钥”。

测试是否配置成功

1
2
  
ssh -T git@github.com
1
2
3
> The authenticity of host 'github.com (IP ADDRESS)' can't be established.
> ED25519 key fingerprint is SHA256:+DiY3wvvV6TuJJhbpZisF/zLDA0zPMSvHdkr4UvCOqU.
> Are you sure you want to continue connecting (yes/no)?

出现上述信息时,可以先输入yes

当命令行出现如下信息,则表示配置成功,可以开始便捷使用git了。

1
2
> Hi USERNAME! You've successfully authenticated, but GitHub does not
> provide shell access.

安装Hexo


安装nvm

nvm官方链接
1
2
  
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.5/install.sh | bash

安装后,输入 nvm --version 看看是否安装成功。
如果遇到相关问题,可以参考 nvm_install_troubleshooting_on_macos

安装node

nvm安装好了之后,开始安装node。

1
2
  
nvm install node

安装后,输入node --version 看看是否安装成功。

安装hexo

1
npm install -g hexo-cli

撰写第一个文档


git clone hexodemo

选择一个工作目录,比如home,然后将hexodemo clone到home目录下

1
2
  
git clone git@github.com:xxx/hexodemo.git #具体路径请咨询仓库所有者

使用hexo init 初始化本地环境

1
2
3
4
  
hexo init hexo_local
cd hexo_local
npm install

具体参考hexo初始化

将hexodemo目录中的_config.yml, scaffolds, source目录拷贝到hexo_local下,替换原来的文件或者目录

1
2
3
4
5
6
  
cp hexodemo/_config.yml hexo_local
rm -rf hexo_local/scaffolds
cp -r hexodemo/scaffolds hexo_local
rm -rf hexo_local/source
cp -r hexodemo/source hexo_local

参考markdown语法以及hexo的语法,编写.md文件。

编辑source/_posts目录下已存在的md文件或者新建一个。

1
2
  
hexo new post xx.md

编辑中,如果遇到需要插入图片,需要特别小心。建议参考:插入图片需要安装hexo-render-marked插件

完成编写后,编译,并在本地服务器查看是否符合预期。

先完成hexo本地服务器的安装 hexo-server安装
然后打开一个新的终端,执行以下命令

1
2
  
npm install hexo-server --save

回到之前的终端,完成静态文件的生成和部署 hexo编译与部署

1
2
3
  
hexo clean #先clean一把
hexo genreate --deploy

打开浏览器,输入:http://localhost:4000 看看是否服务预期

编译没有报错,则将相关的.md文件和对应的目录拷贝回hexodemo下。

1
2
  
cp -r hexo_local/source/_posts/xxx.md hexodemo/source/_posts

提交静态文件

1
2
3
4
5
git status #查看下修改是否是预期的  
git pull
git add xx.md xx
git commit -m 'add first_post'
git push

查看

目前,已经完成了自动编译、部署脚本。所以git push新增的.md文件后,服务器会自动hexo generate, 然后把生成的静态文件部署到网站服务器上。
所以,git push提交后,大约过个3-5分钟,如果一切正常的话,在测试网站 会看到新的页面。