diff --git a/config.toml b/config.toml
index 9fcd112..a6effcd 100644
--- a/config.toml
+++ b/config.toml
@@ -72,21 +72,21 @@ enableEmoji = true  # Shorthand emojis in content files - https://gohugo.io/func
 [menu]
 
   [[menu.main]]
-    name = "文章"
+    name = "Posts"
     url = "posts/"
     weight = 1
 
   [[menu.main]]
-    name = "分类"
+    name = "Categories"
     url = "categories/"
     weight = 2
 
   [[menu.main]]
-    name = "标签"
+    name = "Tags"
     url = "tags/"
     weight = 3
 
   [[menu.main]]
-    name = "关于"
+    name = "About"
     url = "about/"
     weight = 4
diff --git a/content/posts/2018/Vim快捷键备忘录/index.md b/content/posts/2018/Vim快捷键备忘录/index.md
index 9eb4449..6f00980 100644
--- a/content/posts/2018/Vim快捷键备忘录/index.md
+++ b/content/posts/2018/Vim快捷键备忘录/index.md
@@ -121,11 +121,11 @@ Vim快捷键查询。
 
 ## 常用操作
 
-| 命令    | 作用                              |
-| ------- | --------------------------------- |
-| gg + dG | 清空文件内容                      |
-| viw,vaw | 选中光标所在单词(vaw包括前后空格) |
-|         |                                   |
+| 命令     | 作用                              |
+| -------- | --------------------------------- |
+| gg + dG  | 清空文件内容                      |
+| viw,vaw  | 选中光标所在单词(vaw包括前后空格) |
+| dtc, dfc | 删除到下一个字符c之前（之后）     |
 
 
 
diff --git a/content/posts/2018/为Ubuntu启用Swap分区.md b/content/posts/2018/为Ubuntu启用Swap分区.md
index a5df2f7..1471e2c 100644
--- a/content/posts/2018/为Ubuntu启用Swap分区.md
+++ b/content/posts/2018/为Ubuntu启用Swap分区.md
@@ -1,7 +1,7 @@
 ---
 title: 为Ubuntu启用Swap分区
 date: 2018-07-07 10:43:23
-tags: [Linux]
+tags: [linux]
 categories: vps
 ---
 
diff --git a/content/posts/2019/hugo部署笔记.md b/content/posts/2019/hugo部署笔记.md
index 5ed4006..4987179 100644
--- a/content/posts/2019/hugo部署笔记.md
+++ b/content/posts/2019/hugo部署笔记.md
@@ -4,7 +4,7 @@ date: 2019-07-26T22:08:48+08:00
 draft: false
 toc: false
 images:
-tags: [untagged]
+tags: [linux]
 ---
 
 使用的主题 <https://github.com/Track3/hermit>
diff --git a/content/posts/2019/使用Electron+React开发跨平台桌面应用.md b/content/posts/2019/使用Electron+React开发跨平台桌面应用.md
new file mode 100644
index 0000000..a2c4f15
--- /dev/null
+++ b/content/posts/2019/使用Electron+React开发跨平台桌面应用.md
@@ -0,0 +1,407 @@
+---
+title: "使用Electron+React开发跨平台桌面应用"
+date: 2019-07-29T19:59:59+08:00
+draft: false
+toc: true
+tags: [electron, react]
+categories: web
+images: ["img/electron.png"]
+---
+
+使用Electron开发跨平台桌面应用，已经被越来越多的人接受。从开发者的角度，以前需要很多代码才能做到的自动布局、脏区裁剪、图像栅格化、GPU加速，现在通通不用管了，即使要处理，也是几行代码的事；从企业角度，前端开发人员众多，比较容易招聘，另外，资深前端相对于资深C++客户端，薪资还是有差距的，也节省了不少成本。本文主要着重说明使用Electron+React搭建开发环境的步骤。
+
+<!--more-->
+
+## 技术栈
+
+- [**Electron**](https://electronjs.org/)
+- [**React - Create React App**](https://github.com/facebook/create-react-app)
+- [**Rescripts**](https://github.com/harrysolovay/rescripts)
+- [**Electron Builder**](https://github.com/electron-userland/electron-builder)
+
+## 开发环境设置
+
+创建一个新的React项目
+
+```shell
+npx create-react-app web-designer-test
+cd web-designer-test
+```
+
+添加依赖库
+
+```shell
+yarn add electron wait-on concurrently --dev
+yarn add electron-is-dev
+```
+
+- electron 用于界面开发的核心框架
+- electron-builder 用于构建安装包
+- wait-on concurrently  由于electron需要在react启动之后启动，所以增加这两个库用于同步进程启动顺序
+- electron-is-dev 判断当前运行环境
+
+创建文件`public/main.js`
+
+```js
+const electron = require('electron');
+const app = electron.app;
+const BrowserWindow = electron.BrowserWindow;
+
+const path = require('path');
+const isDev = require('electron-is-dev');
+
+let mainWindow;
+
+function createWindow() {
+  mainWindow = new BrowserWindow({width: 900, height: 680});
+  mainWindow.loadURL(isDev ? 'http://localhost:3000' : `file://${path.join(__dirname, '../build/index.html')}`);
+  if (isDev) {
+    // Open the DevTools.
+    //BrowserWindow.addDevToolsExtension('<location to your react chrome extension>');
+    mainWindow.webContents.openDevTools();
+  }
+  mainWindow.on('closed', () => mainWindow = null);
+}
+
+app.on('ready', createWindow);
+
+app.on('window-all-closed', () => {
+  if (process.platform !== 'darwin') {
+    app.quit();
+  }
+});
+
+app.on('activate', () => {
+  if (mainWindow === null) {
+    createWindow();
+  }
+});
+```
+
+增加下面的命令到`package.json`文件中的`scripts`标签内
+
+```js
+"electron-dev": "concurrently \"yarn start\" \"wait-on http://localhost:3000 && electron .\""
+```
+
+增加入口文件到`package.json`文件中
+
+```javascript
+"main": "public/main.js"
+```
+
+到现在为止，`package.json`文件应该类似于下面这样
+
+```json
+{
+  "name": "web-designer-test",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "electron-is-dev": "^1.1.0",
+    "react": "^16.8.7",
+    "react-dom": "^16.8.6",
+    "react-scripts": "3.0.1"
+  },
+  "main": "public/main.js",
+  "scripts": {
+    "start": "rescripts start",
+    "build": "rescripts build",
+    "test": "rescripts test",
+    "eject": "react-scripts eject",
+    "electron-dev": "concurrently \"yarn start\" \"wait-on http://localhost:3000 && electron .\""
+  },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "concurrently": "^4.1.1",
+    "electron": "^5.0.8",
+    "wait-on": "^3.3.0"
+  }
+}
+
+```
+
+为了开发环境下，不启动默认浏览器，需要设置`BROWSER`环境变量，在根目录创建`.env`文件
+
+```ini
+BROWSER=non
+```
+
+这个时候可以使用下面命令运行程序
+
+```shell
+yarn electron-dev
+```
+
+如果在新的程序窗口内出现了React的欢迎页，则表示一切已经准备OK。但是现在JavaScript的运行环境是浏览器，无法访问宿主机的资源，比如读取文件或注册表，所以需要切换到Node.js环境，使用`electron-renderer`作为[Webpack target](https://webpack.js.org/configuration/target/)，我们使用`Rescripts`来处理这个问题。
+
+安装依赖库
+
+```shell
+yarn add @rescripts/cli @rescripts/rescript-env --dev
+```
+
+修改`package.json`文件中`scripts`标签内的启动脚本
+
+```json
+"start": "react-scripts start",
+"build": "react-scripts build",
+"test": "react-scripts test",
+```
+
+修改为
+
+```json
+"start": "rescripts start",
+"build": "rescripts build",
+"test": "rescripts test",
+```
+
+在根目录新建文件`.rescriptsrc.js`
+
+```javascript
+module.exports = [require.resolve('./.webpack.config.js')]
+```
+
+最后，在根目录新建另一个文件`.webpack.config.js`
+
+```javascript
+// define child rescript
+module.exports = config => {
+  config.target = 'electron-renderer';
+  return config;
+}
+```
+
+现在就切换到了Node.js运行环境，可以随意访问主机资源了。
+
+## 打包环境设置
+
+首先，要添加依赖库
+
+```shell
+yarn add electron-builder --dev
+```
+
+CRA(**C**reate **R**eactive **A**pplication)默认创建的`index.html`，会使用绝对路径来访问资源，在Electron中会加载资源失败，所以需要修改配置，在`package.json`中增加`homepage`属性
+
+```json
+"homepage": "./",
+```
+
+接下来添加打包命令，在`package.json`中的`scripts`标签中
+
+```json
+"postinstall": "electron-builder install-app-deps",
+"preelectron-pack": "yarn build",
+"electron-pack": "electron-builder -mw"
+```
+
+- `"postinstall": "electron-builder install-app-deps"`用于确保本地依赖库都已经安装
+- `"preelectron-pack": "yarn build"`会保证在打包前构建应用
+- `"electron-pack": "electron-builder -mw"`会为Mac(m)和Windows(w)平台进行App打包
+
+在执行打包命令前，还需要设置打包参数，在`package.json`中添加如下信息
+
+```json
+"author": {
+    "name": "lniwn",
+    "email": "lniwn@live.com",
+    "url": "https://oaoa.me"
+  },
+  "build": {
+    "appId": "me.oaoa.web-designer-test",
+    "productName": "WebDesignerTest",
+    "copyright": "Copyright © 2019 ${author}",
+    "mac": {
+      "category": "public.productivity.utilities"
+    },
+    "win": {
+      "icon": "assets/icon.png",
+      "target": "nsis"
+    },
+    "nsis": {
+      "allowToChangeInstallationDirectory": true,
+      "allowElevation": false,
+      "createDesktopShortcut": true,
+      "menuCategory": true,
+      "oneClick": false
+    },
+    "files": [
+      "build/**/*",
+      "node_modules/**/*"
+    ],
+    "directories": {
+      "buildResources": "assets"
+    }
+  }
+```
+
+可以在[这里](https://www.electron.build/configuration/configuration)查看Electron Builder的所有选项。
+
+创建一个assets文件夹，用于存放图片资源。
+
+最好在一个平台只构建当前平台的可执行程序，这里针对Windows平台的构建进行了详细设置。
+
+最终，package.json文件内容如下：
+
+```json
+{
+  "name": "web-designer-test",
+  "version": "0.1.0",
+  "private": true,
+  "dependencies": {
+    "electron-is-dev": "^1.1.0",
+    "react": "^16.8.6",
+    "react-dom": "^16.8.6",
+    "react-scripts": "3.0.1"
+  },
+  "main": "public/main.js",
+  "homepage": "./",
+  "description": "Web页面设计器",
+  "scripts": {
+    "start": "rescripts start",
+    "build": "rescripts build",
+    "test": "rescripts test",
+    "eject": "react-scripts eject",
+    "electron-dev": "concurrently \"yarn start\" \"wait-on http://localhost:3000 && electron .\"",
+    "postinstall": "electron-builder install-app-deps",
+    "preelectron-pack": "yarn build",
+    "electron-pack": "electron-builder -mw",
+    "electron-pack-win": "electron-builder -c.extraMetadata.main=build/main.js --win --x64"
+  },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "@rescripts/cli": "^0.0.11",
+    "@rescripts/rescript-env": "^0.0.10",
+    "concurrently": "^4.1.1",
+    "electron": "^5.0.8",
+    "electron-builder": "^21.1.5",
+    "wait-on": "^3.3.0"
+  },
+  "author": {
+    "name": "lniwn",
+    "email": "lniwn@live.com",
+    "url": "https://oaoa.me"
+  },
+  "build": {
+    "appId": "me.oaoa.web-designer-test",
+    "productName": "WebDesignerTest",
+    "copyright": "Copyright © 2019 ${author}",
+    "mac": {
+      "category": "public.productivity.utilities"
+    },
+    "win": {
+      "icon": "assets/icon.png",
+      "target": "nsis"
+    },
+    "nsis": {
+      "allowToChangeInstallationDirectory": true,
+      "allowElevation": false,
+      "createDesktopShortcut": true,
+      "menuCategory": true,
+      "oneClick": false
+    },
+    "files": [
+      "build/**/*",
+      "node_modules/**/*"
+    ],
+    "directories": {
+      "buildResources": "assets"
+    }
+  }
+}
+
+```
+
+由于Electron默认入口文件为`build/Electron.js`，如果想自定义，需要在参数中指定入口文件，否则编译会报错
+
+`"electron-pack-win": "electron-builder -c.extraMetadata.main=build/main.js --win --x64"`
+
+最后，执行打包命令
+
+```shell
+yarn electron-pack-win
+```
+
+会在dist文件夹下生成对应安装包
+
+文件夹结构如下：
+
+```txt
+F:\Project\electron\web-designer-test
+├.env
+├.gitignore
+├.rescriptsrc.js
+├.webpack.config.js
+├assets
+│  ├icon.png
+├build
+│  ├asset-manifest.json
+│  ├favicon.ico
+│  ├index.html
+│  ├main.js
+│  ├manifest.json
+│  ├precache-manifest.3ef21b1d6090801b808aaff5b52f1a17.js
+│  ├service-worker.js
+│  ├static
+├dist
+│  ├.icon-ico
+│  ├builder-effective-config.yaml
+│  ├WebDesignerTest Setup 0.1.0.exe
+│  ├WebDesignerTest Setup 0.1.0.exe.blockmap
+│  ├win-unpacked
+├node_modules
+├package.json
+├public
+│  ├favicon.ico
+│  ├index.html
+│  ├main.js
+│  ├manifest.json
+├README.md
+├src
+│  ├App.css
+│  ├App.js
+│  ├App.test.js
+│  ├index.css
+│  ├index.js
+│  ├logo.svg
+│  ├serviceWorker.js
+├yarn.lock
+
+```
+
+
+
+*参考文档*
+
+- https://www.codementor.io/randyfindley/how-to-build-an-electron-app-using-create-react-app-and-electron-builder-ss1k0sfer
+- https://juejin.im/post/5c356a396fb9a049e30848f0
\ No newline at end of file
diff --git a/content/posts/_index.md b/content/posts/_index.md
new file mode 100644
index 0000000..fd09995
--- /dev/null
+++ b/content/posts/_index.md
@@ -0,0 +1,8 @@
+---
+title: "文章"
+date: 2019-07-26T21:25:01+08:00
+draft: false
+toc: false
+images:
+---
+