**2018.03.06 更新：**非PWA网站也能通过独立窗口而非浏览器打开。具体看「注意事项」。

PWA是什么

引用自Harttle.Land的说法：

PWA(Progressive Web Apps)是 Google 最近在提的一种 Web App 形态 （或者如 Wikipedia 所称的“软件开发方法”）。 Harttle 能找到的关于 PWA 最早的一篇文章是 2015年6月 Alex Russell 的一篇博客： Progressive apps escaping tabs without losing our soul， 让 Web App 从标签页跳出来，同时保持 Web 的灵魂。

如 Alex 所述，PWA 意图让 Web 在保留其本质（开放平台、易于访问、可索引）的同时， 在离线、交互、通知等方面达到类似 App 的用户体验。按 Google 官方的解释 PWA 具有这些特性：Reliable, Fast, Engaging。

它比原生应用更轻量，但是却比现有的Web APP的功能更加丰富。最大也是最关键的区别是它能够脱离浏览器的「束缚」（虽然依然是基于浏览器的技术），能够把PWA网站添加到你的桌面上，不管是PC操作系统还是手机操作系统，类似于一个原生应用一样，并且拥有媲美原生应用的体验。

它也能拥有原生APP应用一般的启动闪屏，它也能像原生APP应用一般能有消息推送——不过要知道，它源自Web，通常只有传统APP的体积的十分之一甚至更小。它不用等待下载安装的时间，打开网页的时候就已经「下载」并且「安装」完毕。

要想体验这项技术，如果你是安卓用户，那最新版的Chrome已经支持；如果你是iOS用户，可以等待3月份的11.3版本更新；如果你是PC电脑用户，那么来看看怎么在电脑上也体验体验PWA吧。

前言

前段时间，我用electron-vue开发了一款跨平台（目前支持Mac和Windows）的免费开源的图床上传应用——PicGo，在开发过程中踩了不少的坑，不仅来自应用的业务逻辑本身，也来自electron本身。在开发这个应用过程中，我学了不少的东西。因为我也是从0开始学习electron，所以很多经历应该也能给初学、想学electron开发的同学们一些启发和指示。故而写一份Electron的开发实战经历，用最贴近实际工程项目开发的角度来阐述。希望能帮助到大家。

预计将会从几篇系列文章或方面来展开：

1. electron-vue入门
2. Main进程和Renderer进程的简单开发
3. 引入基于Lodash的JSON database——lowdb
4. 跨平台的一些兼容措施
5. 通过CI发布以及更新的方式
6. 开发插件系统——CLI部分
7. 开发插件系统——GUI部分
8. 想到再写…

说明

PicGo是采用electron-vue开发的，所以如果你会vue，那么跟着一起来学习将会比较快。如果你的技术栈是其他的诸如react、angular，那么纯按照本教程虽然在render端（可以理解为页面）的构建可能学习到的东西不多，不过在main端（electron的主进程）应该还是能学习到相应的知识的。

如果之前的文章没阅读的朋友可以先从之前的文章跟着看。

前言

前段时间，我用electron-vue开发了一款跨平台（目前支持Mac和Windows）的免费开源的图床上传应用——PicGo，在开发过程中踩了不少的坑，不仅来自应用的业务逻辑本身，也来自electron本身。在开发这个应用过程中，我学了不少的东西。因为我也是从0开始学习electron，所以很多经历应该也能给初学、想学electron开发的同学们一些启发和指示。故而写一份Electron的开发实战经历，用最贴近实际工程项目开发的角度来阐述。希望能帮助到大家。

预计将会从几篇系列文章或方面来展开：

1. electron-vue入门
2. Main进程和Renderer进程的简单开发
3. 引入基于Lodash的JSON database——lowdb
4. 跨平台的一些兼容措施
5. 通过CI发布以及更新的方式
6. 开发插件系统——CLI部分
7. 开发插件系统——GUI部分
8. 想到再写…

说明

PicGo是采用electron-vue开发的，所以如果你会vue，那么跟着一起来学习将会比较快。如果你的技术栈是其他的诸如react、angular，那么纯按照本教程虽然在render端（可以理解为页面）的构建可能学习到的东西不多，不过在main端（electron的主进程）应该还是能学习到相应的知识的。

如果之前的文章没阅读的朋友可以先从之前的文章跟着看。

前言

前段时间，我用electron-vue开发了一款跨平台（目前支持Mac和Windows）的免费开源的图床上传应用——PicGo，在开发过程中踩了不少的坑，不仅来自应用的业务逻辑本身，也来自electron本身。在开发这个应用过程中，我学了不少的东西。因为我也是从0开始学习electron，所以很多经历应该也能给初学、想学electron开发的同学们一些启发和指示。故而写一份Electron的开发实战经历，用最贴近实际工程项目开发的角度来阐述。希望能帮助到大家。

预计将会从几篇系列文章或方面来展开：

1. electron-vue入门
2. Main进程和Renderer进程的简单开发
3. 引入基于Lodash的JSON database——lowdb
4. 跨平台的一些兼容措施
5. 通过CI发布以及更新的方式
6. 开发插件系统——CLI部分
7. 开发插件系统——GUI部分
8. 想到再写…

说明

PicGo是采用electron-vue开发的，所以如果你会vue，那么跟着一起来学习将会比较快。如果你的技术栈是其他的诸如react、angular，那么纯按照本教程虽然在render端（可以理解为页面）的构建可能学习到的东西不多，不过在main端（electron的主进程）应该还是能学习到相应的知识的。

年末了，赶着刚考完两门考试，在最后4门考试来临之前抽空写一下今年的小结。

2017-12-17 WEEK186 一级恐惧

一级恐惧——————————————Primal Fear

前言

作为一个比较常用markdown写文章、博客的人，在markdown里插入图片对我而言一直一个比较繁琐的活。以前每周写电影推荐的时候，我要在markdown里插入一张电影海报，我需要如下的操作：

1. 打开豆瓣的网站，选一张满意的海报，下载
2. 打开七牛的网站，登录，点点点，找到上传，上传
3. 关闭上传窗口，找到地址，复制地址，再关闭七牛
4. 粘贴到markdown里

每次都需要繁琐的打开网页进行一些必要而枯燥的操作。这样很麻烦。在用过mac上一款很不错的小工具应用iPic后我非常喜欢它的简洁操作。不过它免费版本并不支持七牛图床。所以我就想着，能不能自己写一个类似的工具呢？结合自己的使用习惯再顺便加点功能。

于是我就开始自己的图片上传工具的开发了。它叫做PicGo。