5月10日开始实习，今天是第二周

第一天

熟悉环境，搭建了nginx服务器，用php+sql数据库实现一个本地网页。

第二天

熟悉公司项目的业务与代码

艾特智能科技公司最近在做一个智慧小区的项目，要求在web端+app端+室内机实现社区硬件与软件服务的结合，比如业主通过app实现物业操作，管理人员通过web端查看物业管理信息，室内机具有信息推送的收发功能等。我目前做的项目是智慧小区的web端开发。带我的刘哥目前已经完成了楼宇管理和人员管理功能的开发，我的任务是一个星期做出物资管理操作。
我花了一天时间熟悉了他目前的代码：

• 结构说明：前后端未分离，均通过服务器传php到浏览器。前端主要使用了bootstrap和jquery，ajax传数据以及url路由到后端，后端方面php用了CI框架以及MVC包括控制层controller、数据层model、视图层view。
• 前后端的数据传递： view -> controller通过ajax选择post/get方法和对应的controller方法：当选择get方法时，参数可通过url的查询参数传入controller并得到相应的网页；当选择post方法时，参数通过post的数据包传入controller并得到相应的网页。
• 后端与数据库数据处理：controller ->model controller的方法命名与model的方法命名相同，controller得到页面传来的参数后传入model层，model层里编写sql语句操作数据之后返回到controller层，再由controller层返回到view层。

该项目代码不足

1. 目前在view层夹杂着很多php的代码，并未完全分离
2. 页面内容相似，但每次都要对页面修改大量变量，我认为可以做函数化或者用vue做到组件化

收获

• 在第一个星期内完成了物资列表管理的页面开发，并优化了小部分的代码结构。
• 在第二个星期完成物资状态管理的页面开发，主要还是物资列表与物资状态管理两个页面之间数据库sql语句和业务逻辑的熟悉。

今天做了一个很难过的梦，我忍不住记下来：
梦里我住着一个小区
小区周围的小孩时不时地会失踪
但庆幸的是他们总会自己走回来
然而他们回来的时候眼睛变得呆滞，笑容僵硬，行动也很奇怪
他们爸妈很开心找到自己的小孩但是又非常心疼一点办法都没有
从此就很少见那些小孩出门
渐渐地小区的人越来越少
我也是小区里的一个小孩，刷朋友圈看到有人卖广告
点进去发现这个广告是说线下排队玩游戏拿小猪佩奇的
然后我就想这绝对是个骗人的玩意，但是还是去了（？？？为什么呢）
线下排队人非常多，绕着一圈又一圈
然后这个广告商非常神奇，他们有操控下雨的能力，那些雨都是齐刷刷地往不同方向下的
他们玩游戏的通关方式是要躲避操控的雨不被淋湿
没躲过雨的人当然就会全身湿透，然后他们会提供一个换衣服的地方
很有意思的是，我进去换衣服，门一关，就出不来了
我怎么喊都没人应，意识到自己被拐了，非常害怕
过了两天，房间里面有个对讲机它有声音了
监狱外面的人说要用对讲机教我武功
学会了就放我出来
我还很开心，诶呦还有武功学
过了三个月，我学会了
这个武功也非常厉害，他们的机器配合上我的武功可以复制出五个我
那些被复制的我看起来就非常呆滞
他们把其中一个送回到我的家里
剩下三个留了下来做苦力
然后我就被放了，给了几千
我意识到这就是梦里一开始那个拐卖小孩的集团
小区的家长看到的都是被复制的小孩
所以我努力凑钱
过了三年终于回到家乡
发现家已经搬走
我再也找不到爸妈
估计家里那个被复制的我已代替着我活了下来

也就是说输入div标签名，所有div都会被执行，而且可以addClass还有setText。

## **第一：传递参数**
<div class="highlight"><pre>`<span></span>var $div = $('div')  
`</pre></div>

要实现上面这个功能，我的理解是首先设置window对象jQuery为函数返回的结果，然后把参数'div'传递到函数内的DOM，作为变量进行下一步的操作。
<div class="highlight"><pre>`<span></span><span class="nb">window</span><span class="p">.</span><span class="nx">jQuery</span><span class="o">=</span><span class="kd">function</span><span class="err">（</span><span class="nx">selector</span><span class="err">）</span><span class="p">{</span>  
<span class="kd">let</span> <span class="nx">alldiv</span><span class="o">=</span><span class="nb">document</span><span class="p">.</span><span class="nx">querySelectorAll</span><span class="p">(</span><span class="nx">selector</span><span class="p">)</span>  
<span class="p">}</span>

<span class="nb">window</span><span class="p">.</span><span class="nx">$</span> <span class="o">=</span> <span class="nx">jQuery</span>
`</pre></div>

## **第二：返回对象**
<div class="highlight"><pre>`<span></span>$div.addClass('red')  // 可将所有 div 的 class 添加一个 red
$div.setText('hi')  // 可将所有 div 的 textContent 变为 hi
`</pre></div>

可以观察得到$div是一个对象，它的key有addClass和setText。

那我也返回一个含有addClass和setClass的对象。
<div class="highlight"><pre>`<span></span><span class="nb">window</span><span class="p">.</span><span class="nx">jQuery</span><span class="o">=</span><span class="kd">function</span> <span class="p">(</span><span class="nx">selector</span><span class="p">){</span>
<span class="kd">let</span> <span class="nx">alldiv</span><span class="o">=</span><span class="nb">document</span><span class="p">.</span><span class="nx">querySelectorAll</span><span class="p">(</span><span class="nx">selector</span><span class="p">)</span>  
  <span class="k">return</span><span class="p">{</span>
       <span class="nx">addClass</span><span class="o">:</span><span class="kd">function</span> <span class="p">(){},</span>
       <span class="nx">setClass</span><span class="err">：</span><span class="kd">function</span><span class="p">(){}</span>
  <span class="p">}</span>
<span class="p">}</span>
<span class="nb">window</span><span class="p">.</span><span class="nx">$</span> <span class="o">=</span> <span class="nx">jQuery</span>
`</pre></div>

## **第三：补全对象的key**

我们得到了alldiv，它是一个伪数组。如果每个div都要添加class的话，需要一个for循环，然后每一次用DOM的方法里的classList.add功能对div添加class。
<div class="highlight"><pre>`<span></span><span class="nx">addClass</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
               <span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span><span class="nx">i</span><span class="o">&lt;</span><span class="nx">alldiv</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span><span class="nx">i</span><span class="o">++</span><span class="p">){</span>
                   <span class="nx">alldiv</span><span class="p">[</span><span class="nx">i</span><span class="p">].</span><span class="nx">classList</span><span class="p">.</span><span class="nx">add</span><span class="p">(</span><span class="s2">"red"</span><span class="p">)</span>
               <span class="p">}</span>
`</pre></div>

同理有
<div class="highlight"><pre>`<span></span><span class="nx">setText</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
               <span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span><span class="nx">i</span><span class="o">&lt;</span><span class="nx">alldiv</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span><span class="nx">i</span><span class="o">++</span><span class="p">){</span>
                  <span class="nx">alldiv</span><span class="p">[</span><span class="nx">i</span><span class="p">].</span><span class="nx">textContent</span> <span class="o">=</span> <span class="s2">"hi"</span>
              <span class="p">}</span>
`</pre></div>

把addClass和setText的内容结合到函数内，得到：
<div class="highlight"><pre>`<span></span><span class="nb">window</span><span class="p">.</span><span class="nx">jQuery</span><span class="o">=</span><span class="kd">function</span> <span class="p">(</span><span class="nx">selector</span><span class="p">){</span>
  <span class="kd">let</span> <span class="nx">alldiv</span><span class="o">=</span><span class="nb">document</span><span class="p">.</span><span class="nx">querySelectorAll</span><span class="p">(</span><span class="nx">selector</span><span class="p">)</span>
  <span class="k">return</span><span class="p">{</span>
       <span class="nx">addClass</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
               <span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span><span class="nx">i</span><span class="o">&lt;</span><span class="nx">alldiv</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span><span class="nx">i</span><span class="o">++</span><span class="p">){</span>
                   <span class="nx">alldiv</span><span class="p">[</span><span class="nx">i</span><span class="p">].</span><span class="nx">classList</span><span class="p">.</span><span class="nx">add</span><span class="p">(</span><span class="s2">"red"</span><span class="p">)</span>
               <span class="p">}</span>
       <span class="p">},</span>
       <span class="nx">setText</span><span class="o">:</span> <span class="kd">function</span><span class="p">(){</span>
               <span class="k">for</span><span class="p">(</span><span class="kd">var</span> <span class="nx">i</span><span class="o">=</span><span class="mi">0</span><span class="p">;</span><span class="nx">i</span><span class="o">&lt;</span><span class="nx">alldiv</span><span class="p">.</span><span class="nx">length</span><span class="p">;</span><span class="nx">i</span><span class="o">++</span><span class="p">){</span>
                  <span class="nx">alldiv</span><span class="p">[</span><span class="nx">i</span><span class="p">].</span><span class="nx">textContent</span> <span class="o">=</span> <span class="s2">"hi"</span>
              <span class="p">}</span>
      <span class="p">}</span>
   <span class="p">}</span>
<span class="p">}</span>
<span class="nb">window</span><span class="p">.</span><span class="nx">$</span> <span class="o">=</span> <span class="nx">jQuery</span>

总结

以上代码实现一个 jQuery 的 API。

Http请求

请求一般是get和post

输入：curl -s -v -H “Frank: xxx” – “https://www.baidu.com"

浏览器显示：

1
2
3
4
5

GET / HTTP/1.1
Host: www.baidu.com
User-Agent: curl/7.54.0
Accept: */*
Frank: xxx

输入：curl -X POST -s -v -H “Frank: xxx” – “https://www.baidu.com"

浏览器显示：

1
2
3
4
5

POST / HTTP/1.1
Host: www.baidu.com
User-Agent: curl/7.54.0
Accept: */*
Frank: xxx

浏览器显示格式：

1
2
3
4
5
6
7
8
9

1动词 路径 协议/版本
2Key1: value1
2Key2: value2
2Key3: value3
2Content-Type: application/x-www-form-urlencoded
2Host: www.baidu.com
2User-Agent: curl/7.54.0
3
4要上传的数据

• 请求最多包含四部分，最少包含三部分。（也就是说第四部分可以为空）
• 第三部分永远都是一个回车（\n）
• 动词有 GET POST PUT PATCH DELETE HEAD OPTIONS 等
• 这里的路径包括「查询参数」，但不包括「锚点」
• 如果你没有写路径，那么路径默认为 /
• 第 2 部分中的 Content-Type 标注了第 4 部分的格式

Http响应

浏览器显示：

1 协议/版本号 状态码 状态解释
2 Key1: value1
2 Key2: value2
2 Content-Length: 17931
2 Content-Type: text/html
3
4 要下载的内容

状态码要背，是服务器对浏览器说的话：

1
2
3
4
5
6
7
8

1xx 不常用
2xx 表示成功
3xx 表示滚吧
4xx 表示你丫错了
5xx 表示好吧，我错了
状态解释没什么用
第 2 部分中的 Content-Type 标注了第 4 部分的格式
第 2 部分中的 Content-Type 遵循 MIME 规范

IP

• 一般默认情况下，hosts 文件里会有一行127.0.0.1 localhost，意思就是 localhost 指向 127.0.0.1，所以 localhost 也表示设备自己。
• 路由会给自己分配一个好记的内网 IP，如 192.168.1.1

做一个服务器

1
2
3
4
5
6

cd ~/Desktop; 
mkdir node-demo; 
cd node-demo
touch server.js
编辑 server.js （下图为编辑内容）
node server.js 8888

另外开一个gitbash窗口输入以下内容，观察效果即可

1

curl http://localhost:你的指定的端口/xxx

或者直接在浏览器输入

1

http://localhost:你的指定的端口/xxx

效果：

1
2
3
4
5

用户请求 / 时，返回 html 内容
该 html 内容里面由一个 css link 和一个 script
css link 会请求 /style.css，返回 css 内容
script 会请求 /main.js，返回 js 内容
请求 / /style.css /main.js 以外的路径，则一律返回 404 状态码

• 文件内容是有 HTTP 头中的 Content-Type 保证的。content-type后面的东西才有用
• 输入路径的/xxx没有用，不能代表什么，不要被迷惑。
• 如果server.js内加上以下内容，会得到hi%。这个 % 不是我们的内容，% 表示结尾。如果不喜欢，把 ‘Hi’ 换成 ‘Hi\n’。

  1 2	response.write('Hi') response.end()

大部分参考来自从输入 URL 到页面加载完成的过程中都发生了什么事情？

总过程：

1. 输入网址URL
2. 缓存机制
3. DNS解析
4. TCP连接
5. 发送http请求
6. 接受响应，判断状态码选择处理方式
7. 判断缓存
8. 解码
9. 渲染
10. 连接结束

1.输入网址Url

端口默认为80，一共有6要素:协议，域名，路径，查询参数，锚点，端口

URI：统一资源标识符（英语：Uniform Resource Identifier）

URL:统一资源定位符(英语：Uniform Resource Locator）

URN:统一资源名称（英语：Uniform Resource Name）

URI可被视为定位符（URL），名称（URN）或两者兼备。

URL代表一个人的住址，如网址http://www.wikipedia.org/

URN如同一个人的名称，如书号ISBN 0-395-36341-1

换言之，URN定义某事物的身份，而URL提供查找该事物的方法

2.经过缓存机制

将URL与缓存进行比对如果请求的页面在缓存中且未过期，则直接进行第7步

2.1 彻底缓存的机制（http首部字段）：cache-control，Expires

–Expires是一个绝对时间，即服务器时间。浏览器检查当前时间，如果还没到失效时间就直接使用缓存文件。但是该方法存在一个问题：服务器时间与客户端时间可能不一致。因此该字段已经很少使用，现在基本用cache-control进行判断。

–cache-control中的max-age保存一个相对时间。例如Cache-Control: max-age = 484200，表示浏览器收到文件后，缓存在484200s内均有效。 如果同时存在cache-control和Expires，浏览器总是优先使用cache-control。

2.2 当缓存过期时，浏览器会向服务器发起请求询问资源是否真正过期，这就是缓存协商。对应http首部字段：last-modified，Etag

–last-modified是第一次请求资源时，服务器返回的字段，表示最后一次更新的时间。下一次浏览器请求资源时就发送if-modified-since字段。服务器用本地Last-modified时间与if-modified-since时间比较，如果不一致则认为缓存已过期并返回新资源给浏览器；如果时间一致则发送304状态码，让浏览器继续使用缓存。当然，用该方法也存在问题，比如修改时间有变化但实际内容没有变化，而服务器却再次将资源发送给浏览器。所以，使用Etag进行判断更好。

–Etag：资源的实体标识（哈希字符串），当资源内容更新时，Etag会改变。服务器会判断Etag是否发生变化，如果变化则返回新资源，否则返回304。

缓存协商的过程需要发起一起HTTP请求，如果返回304则继续使用缓存。对于移动端一次请求还是有代价的，所以我们需要避免304。
对于很少进行更改的静态文件，可以在文件名中加入版本号，如get.v1.js，并且把Cache-Control的max-age设置成一年半载，这样就不会发送请求。
需要注意的是，当这些文件更新的时候，我们需要更新其版本号，这样浏览器才会到服务器下载新资源。

3.DNS解析得到ip：

由于ip比较难记，所以一般输入域名，通过dns解析得到ip。

網域名稱系統（英文：Domain Name System，縮寫：DNS）是互联网的一项服务。它作为将域名和IP地址相互映射的一个分布式数据库，能够使人更方便地访问互联网。

DNS查找缓存顺序：浏览器缓存——>hosts文件——>路由器缓存——>网络服务商缓存——>根域名服务器缓存

4.建立连接–三次握手

得到 ip 地址后，知道了服务器的 IP 地址，下面便开始与服务器建立连接了。

TCP是互联网中的传输层协议，提供可靠的链接服务，采用三次握手确认一个连接：

1. 浏览器向服务器发送建立连接的请求。

2. 服务器接收到浏览器发送的请求后，想浏览器发送统一连接的信号。

3. 浏览器接受到服务器发出的同意连接的信号后，再次向服务器发出确认连接的信号。

当三次握手返程，TCP客户端和服务端成功的建立连接，就可以开始传输数据了。

第三次是防止了服务器端的一直等待而浪费资源

三次握手的过程：
主机向服务器发送一个建立连接的请求（您好，我想认识您）；
服务器接到请求后发送同意连接的信号（好的，很高兴认识您）；
主机接到同意连接的信号后，再次向服务器发送了确认信号（我也很高兴认识您），自此，主机与服务器两者建立了连接。

TCP/IP协议层次 模型共分为四层，分别是：应用层、传输层、网络层、数据链路层

应用层 http、ftp、DNS 比如浏览器登录界面

传输层tcp/udp 传的快慢

网络层ip 路由器，指导传送路径

数据链路层 交换机，处理帧数据

tcp协议：发送信息以后，可以确认信息是否到达，也就是有应答的方式。先确认有没有人，传到之后也会告诉你成功了。可以比喻成很慢的打电话，可以有效确认。但是速度上是比udp慢的。

UDP协议：发送以后就不管了，不去确认信息是否到达。说什么就传什么的机制。可以比喻成飞快的写信，发了不知道有没有收到，速度上比tcp快。

TCP 和 UDP 的区别是什么
TCP 可靠、面向连接、相对 UDP 较慢；

UDP 不可靠，不面向连接、相对 TCP 较快。搞定。

5.网页请求

浏览器会开始构造一个应用层的 http 请求，把传输层tcp 包被封到网络层的 ip 包里面，ip 包再被封装到数据链路层的数据帧结构中，再通过物理层的比特流送出去。

http规定如何请求响应的书写。应用层

tcp规定如何传输。传输层

ip规定如何连接以及对应位置。网络层

port对应ip不同服务

一个典型的 http 请求的 header 一般需要包括请求的方法，例如 GET 或者 POST 等。

浏览器向 web 服务器发送一个 HTTP 请求，请求中包含请求文件的位置、请求文件的方式等等

6.浏览器接受 HTTP 响应，检查 HTTP header 里的状态码，并做出不同的处理方式

比如404显示错误页面，304使用缓存，200下一步解码和渲染， 204页面不会发生更新。
常见状态码：200 ok, 204 no content, 206 partial content
301 moved permanently(资源已分配新的uri)，302 found(本次使用新uri访问)，303 see other(以get定向到另一个uri)，304 not modified, 307 temporary redirect(不会从post改为get)
400 bad request，402 unauthorized，403 forbidden, 404 not found
500 internal server error，503 service unavailable

7.如果是可以缓存的，这个响应则会被存储起来

根据首部字段判断是否进行缓存。例如，Cache-Control, no-cache(每次使用缓存前和服务器确认)，no-store 绝对禁止缓存

8.解码

9.1 浏览器拿到index.html文件后，就开始解析其中的html代码，遇到js/css/image等静态资源时，就向服务器端去请求下载

9.2 解析成对应的树形数据结构DOM树、CSS规则树，Javascript脚本通过DOM API和CSSOM API来操作DOM树、CSS规则树。

9.渲染

10.1 计算CSS样式（JS可动态修改dom或css,进一步改变渲染树和分布）

10.2 构建渲染树（Repaint：屏幕的一部分要重画，比如某个CSS的背景色变了，元素的几何尺寸没有变。Reflow：几何尺寸变了，我们需要重新验证并计算Render Tree。）

10.3 确认布局（定位坐标和大小，是否换行，各种position, overflow, z-index属性 ……）

10.4 绘制（调用操作系统Native GUI的API绘制，将每个节点转化为实际像素绘制到视口上）

10.断开连接–四次挥手

四次挥手的过程：
主机向服务器发送一个断开连接的请求（不早了，我该走了）；
服务器接到请求后发送确认收到请求的信号（知道了）；
服务器向主机发送断开通知（我也该走了）；
主机接到断开通知后断开连接并反馈一个确认信号（嗯，好的），服务器收到确认信号后断开连接；

本文有三个目的：
1.如何简化命令行
2.创建bash脚本 & 写bash脚本
3.创建js脚本 & 写js脚本

简化命令行

自动运行
目的：打开gitbash自动进入桌面目录
操作： 在 .bashrc里添加cd ~/Desktop

Alias指令别名 （可以缩写指令）
目的：定义一个指令的缩写，如：输入f可以打印fank is awesome
操作：在 .bashrc里添加alias f=”echo ‘frank is awesome’”

Path路径 （把一个文件夹放进path路径，可以用来创建脚本）
目的：把文件夹放进path路径
操作：export PATH=”目录的绝对路径:$PATH”

创建bash脚本

目的：创建一个名为demo的bash脚本
操作：

1
2
3
4
5
6
7
8
9
10
11

cd ~/local
touch demo
start demo
(编辑demo内容为想要的内容)
sh ~/local/demo  

//这一步已大致完成了所需内容，不过要简化指令：减去sh与路径//
//在.bashrc内添加以下两句//

export PATH="目录的绝对路径:$PATH" 
Source ~/.bashrc

此时只需要输入demo就可以执行demo文件里编辑的内容

如果想把demo改为demo.sh
操作：
mv ~/local/demo ~/local/demo.sh //修改后缀

查询命令的路径：
使用 type demo 可以看到寻找过程
使用 which demo 可以看到寻找结果

写bash脚本

目的：输入demo即可生成名字为demo的目录
操作： 在demo文件里编辑以下内容

1
2
3
4
5

mkdir demo
   cd demo
mkdir css js
touch index.html css/style.css js/main.js
      exit

目的升级：输入demo + 文件夹名字xxx，生成名字为xxx的目录
操作： 在demo文件里编辑以下内容

1
2
3
4
5

mkdir $1
cd $1
mkdir css js
touch index.html css/style.css js/main.js
Exit

此处：$1的意思为输入的第一个参数

目的二次升级：判断目录是否已存在
操作：在demo文件里编辑以下内容

1
2
3
4
5
6
7
8
9
10
11

if [ -d $1 ]; then
 		echo 'error: dir exists'
 		exit
else
			 mkdir $1
 			cd $1
 			mkdir css js
 			touch index.html css/style.css js/main.js
 			echo 'success'
 			exit
Fi

exit 0 表示没有错误
exit 1 表示错误代码为 1

语法规则

demo && echo ‘结束’ 表示只有在 demo 成功时，才会执行 echo ‘结束’
demo || echo ‘结束’ 表示只有在 demo 失败时，才会执行 echo ‘结束’
demo ; echo ‘结束’ 表示执行了demo之后才会执行 echo ‘结束’

创建Js脚本

目的：输入demo即可生成名字为demo的目录
操作：与bash大致相同：

1
2
3
4
5
6
7
8
9
10

cd ~/local
Touch demo
Start demo
编辑demo
node ~/local/demo          //此处需要注意： 不能用sh，而是node，因为语言不同

//这一步已大致完成了所需内容，不过要简化指令：减去node与路径//
//在.bashrc内添加以下一句//

#!/usr/bin/env node     //shebang，用于指定执行环境

此时只需要输入demo就可以执行demo文件里编辑的内容

写Js脚本

目的升级：输入demo + 文件夹名字xxx，生成名字为xxx的目录
操作： 在demo文件里编辑以下内容

1
2
3
4
5
6
7
8
9
10
11
12
13

var fs = require('fs')

var dirName = process.argv[2] // 你传的参数是从第 2 个开始的

fs.mkdirSync("./" + dirName) // mkdir $1
process.chdir("./" + dirName) // cd $1
fs.mkdirSync('css') // mkdir css
fs.mkdirSync('js') // mkdir js
fs.writeFileSync("./index.html", "")
fs.writeFileSync("css/style.css", "")
fs.writeFileSync("./js/main.js", "")

process.exit(0)

Js学习网址：http://nodejs/org/api

1.gitbash的位置定位到git指向username.github.io的文件夹，把博客代码放在这里
2.创建分支hexo，把博客的代码上传到这个分支

1
2
3
4
5

git branch hexo
git checkout hexo
git add .
git commit -m "blog"
git push origin hexo

3.在setting–Branches–Default branch中将backup设置为默认的分支，这样git push时就会push到这个分支上
4.对博客进行更新

1
2

依次执行git add . 、 git commit -m "some message" 、 git push推送源文件
执行hexo g -d 生成部署博客

目标： 用一个仓库做博客展示页，一个仓库存程序代码

搭建博客展示页仓库

1. 首先在桌面创建一个文件夹做展示页的仓库 （一个仓库就够了，不需要再创建多一个文件夹做存程序代码的仓库，因为用来做存代码的仓库可以包含在里面，接下来会说原因..）

2. 把Mr-Almost.github.io的文件夹右键用gitbash打开

3. 登陆github，创建空仓库，命名与文件夹相同，即“github的用户名.github.io”

配置 GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14

1.进入 https://github.com/settings/keys
2.如果页面里已经有一些 key，就点「delete」按钮把这些 key 全删掉。如果没有，就往下看
3.点击 New SSH key，你需要输入 Title 和 Key，但是你现在没有 key，往下看
4.打开 Git Bash
5.复制并运行 rm -rf ~/.ssh/* 把现有的 ssh key 都删掉，这句命令行如果你多打一个空格，可能就要重装系统了，建议复制运行。
6.运行 ssh-keygen -t rsa -b 4096 -C "你的邮箱"，注意填写你的邮箱！
7.按回车三次
8.运行 cat ~/.ssh/id_rsa.pub，得到一串东西，完整的复制这串东西
9.回到上面第 3 步的页面，在 Title 输入「我的第一个 key」
10.在 Key 里粘贴刚刚你你复制的那串东西
11.点击 Add SSH key
12.回到 Git Bash
13.运行 ssh -T git@github.com
14.输入 yes 回车

然后如果你看到 Permission denied (publickey). 就说明你失败了，请回到第 1 步重来，是的，回到第 1 步重来；如果你看到 Hi xxx! You’ve successfully authenticated, but GitHub does not provide shell access. 就说明你成功了！

1
2
3
4

- 一台电脑只需要一个 SSH key
- 一个 SSH key 可以访问你的所有仓库，即使你有 1000000 个仓库，都没问题
- 如果你新买了电脑，就在新电脑上重新生成一个 SSH key，把这个 key 也上传到 GitHub，它可以和之前的 key 共存在 GitHub 上
- 如果你把 key 从电脑上删除了，重新生成一个 key 即可，替换之前的 key

配置 git

1
2
3
4
5

git config --global user.name 你的英文名
git config --global user.email 你的邮箱
git config --global push.default matching
git config --global core.quotepath false
git config --global core.editor "vim"

五句话，依次运行。不执行的话，电脑可能会爆炸。

我是翟俊豪