该篇文章为本系列最后一篇文章，因为最近楼主忙于毕设，所以这也是一篇被鸽了很久很久的文章。该文章主要讲的是该项目的部署部分，包括： 如何部署将该项目部署到nginx服务器上。 为它配置证书，让它运行在https协议上等。 项目回顾 这是一个基于creat-react-app2的pwa项目。可以添加到主屏幕，可以离线运行。项目地址：...

原谅我取这样的标题，我知道 postCss 对于大多数前端开发者来说早已经很熟悉了，但是楼主作为一个初出茅庐的前端er，还有好多的工具和技术没接触过，说来惭愧。虽然平时也喜欢使用css预处理器比如 sass、less、stylus，但是关于css的其他工具确实接触的少，postCss就是一个例子，于是今天就对它了解了一番。如果你对post...

对于所有的开发者来说，掌握一门代码版本控制系统都是必须的，无论是自己做项目，团队合作，工作中的合作，都离不开版本控制系统的帮助。然而目前大多数初学的开发者还不了解或者还停留在几个常用的指令，那么毫无疑问是不够的。详细的了解 Git 和如何高效的使用 Git 是这篇文章要说的。

“大家好，我是谷阿莫，今天要将的是一个...”，哈哈哈，看到这个题我就想到这个开头。最近react 官方在 2018 ReactConf 大会上宣布 React v16.7.0-alpha(内测) 将引入 Hooks。所以我们有必要了解 Hooks，以及由此引发的疑问。

在上一篇文章记一次基于react、cra2、typescript的pwa项目由开发到部署（一）中，我们了解到了create-react-app 给我们提供了哪些pwa支持，也了解到了有哪些不足。虽然create-react-app会帮我们自动生成一个service-worker.js 去缓存我们的app shell，但是并没有提供让开发者定制service worker的方法，除非我们eject项...

上一篇“记录一次基于vue、typescript、pwa的项目由开发到部署”，发布后，忙于秋招的楼主我，终于有时间来写这篇文章。最近秋招也挺顺利，拿到了网易广州岗的offer，对目前想留在广州发展的我来说真是太合适不过了。在最近的反思中，楼主我也意识到了自己存在过于急功近利的毛病，前端是一个更新迭代很快的行业，最忌讳的...

最近秋招之余空出时间来按自己的兴趣动手做了一个项目，一个基于vue-cli3.0, vue，typescript的移动端pwa，现在趁热打铁，将这个项目从开发到部署整个过程记录下来，并将从这个项目中学习到的东西分享出来，如果大家有什么意见或补充也可以在评论区提出。先介绍一下这个项目

我们经常在项目中遇到跨域问题，比如有时候在做个人项目的时候，我们需要请求第三方的一些数据，比如请求豆瓣公开api的数据，或则qq音乐开放api 的数据等等。但是毫无疑问，在我们的web应用中直接请求这些api将出现跨域问题。所以笔者心血来潮写了个插件—— jsonpGet。我们可以通过它来向跨域api发送get请求。下面直入主...

ps: 参考文章 DotHide同学的“关于圣杯布局”，圣杯布局和双飞翼布局的区别 经典布局 圣杯布局 {代码...} 实现的效果主要在container中，left 和 rgith固定宽度，center首先渲染，且自适应宽度。 {代码...} 该方案几个注意的点： center元素位于left和right之前，可以让center先渲染，用户首先看到页面的主要内容。 contai...

推荐阅读：伯乐在线——HTTP 缓存机制一二三IMWeb前端博客——HTTP缓存控制小结IT笔录——http消息头 http缓存机制 关键头部字段 cache-control、 Pragma if-Match、if-None-Match if-Modified-Since、if-Unmodified-Since ETag Expires、Last-Modified Pragma http1.0可用，现在为了向下兼容，也设置该头部，只有一个值：no-c...

按照阮一峰老师在es6的函数扩展中的解释就是：函数调用会在内存形成一个“调用记录”，又称“调用帧”（call frame），保存调用位置和内部变量等信息。如果在函数A的内部调用函数B，那么在A的调用帧上方，还会形成一个B的调用帧。等到B运行结束，将结果返回到A，B的调用帧才会消失。如果函数B内部还调用函数C，那就还有一个C...

原文地址：[链接] 了解几个跨域的方案，并且通过简单实践进行体会。 如何实践？ 但是，我们如何进行实践呢？在哪发请求？向什么服务器发请求？很简单，就在当前网页，打开控制台，输入请求的代码 {代码...} 那么我们就可以以当前页面url作为origin，向[链接]:8888/ ，发送请求GET请求了。同时在本地创建一个node服务 {代...

原文地址：[链接] mvc mvc分为 model，view，controller三个部分 model 模型层，管理应用程序的数据，以及对数据的一些处理方法，当它改变的时候，会通知它的观察者 view 视图层，是model的可视化表示，一个view对应着一个model controller 控制器，是model和view之间的中介，当用户操作view时，复杂更新model mvc 几点...

多页应用中每个html页面作为一个功能组件，通过刷新，请求等方式，组合这些htm页面。前端充当一个展示层，项目的重心偏向后端，往往由后端来主导项目。

通过一个vnode对象去对应一个dom元素，vnode的属性对应反映dom元素的属性。然后我们可以定义一个toVnode方法，把一个dom tree转为virtual dom tree。

原文地址：[链接] 模块化主要体现的是一种分而治之的思想。分而治之是软件工程的重要思想，是复杂系统开发和维护的基石。模块化则是前端最流行的分治手段。 分而治之：将一个大问题分解成多个较为独立的与原问题性质相同的小问题，将所有的小问题的解答组合起来即可得到大问题的答案。 模块化的意义 模块化的工程意义首...

vue的响应式数据绑定 原文地址：[链接]关键词：Object.defineProperty、观察者模式 vue中的响应式数据绑定是通过数据劫持和观察者模式来实现的。当前学习源码为vue2.0源码关键目录 {代码...} 当我们实例化一个vue应用的时候，会伴随着各种的初始化工作，相关的初始化工作代码在init.js文件中 {代码...} 在这里可以看到对...

原文链接： JavaScript常用设计模式 设计模式 设计模式是一种在长时间的经验与错误中总结出来可服用的解决方案。 设计模式主要分为3类： 创建型设计模式：专注于处理对象的创建 Constructor构造器模式，Factory工厂模式，Singleton单例模式，builder生成器模式 结构型设计模式：对象间组合，建立对象之间的关系 Decorato...

外观模式是指提供一个统一的接口去访问多个子系统的多个不同的接口，为子系统中的一组接口提供统一的高层接口。使得子系统更容易使用，不仅简化类中的接口，而且实现调用者和接口的解耦。外观模式在我们的日常工作中十分常见。

建造者模式（builder pattern）比较简单，它属于创建型模式的一种，将一个复杂的对象分解成多个简单的对象来进行构建，将复杂的构建层与表示层分离，使得相同的构建过程可以创建不同的表示的模式便是建造者模式。

装饰者模式提供比继承更有弹性的替代方案。装饰者用于包装同接口的对象，用于通过重载方法的形式添加新功能，该模式可以在被装饰者的前面或后面加上自己的行为以达到特定的目的。简单的理解：给对象动态添加职责的方式称为装饰着模式。举一个简单的例子：

桥接（Bridge）是用于把抽象化与现实化解耦，使得二者可以独立变化，这种类型的设计模式属于结构型模式，它通过提供抽象化和现实化之间的桥接结构，实现二者的解耦。

什么是适配器模式 所谓 适配器模式 就是用一个新的接口对现有的接口进行包装，处理类与API的不匹配。使用这种模式的对象又叫作包装器。比如我们有一个接口： {代码...} 然后我们有一个对象数据： {代码...} 我们可以发现，我们的数据和接口的参数是不匹配的，无法直接参入obj调用该api。这时候怎么办呢？我们可以定义一...

原型模式 （Prototype pattern）：通俗点讲就是创建一个共享的原型，并通过拷贝这些原型创建新的对象。用于创建重复的对象，这种类型的设计模式属于创建型模式，它提供了一种创建对象的不错选择。

单例模式的定义：一个类仅有一个实例，并且可以在全局访问。什么时候需要用到单例模式呢？其实单例模式在日常开发中的使用非常的广泛，例如各种浮窗、像登录浮窗等，无论我们点击多少次，都是同一个浮窗，浮窗从始至终只创建了一次。这种场景就十分适合运用单例模式。

设计模式（design pattern）概念：是一套反复使用、思想成熟、经过分类和无数实战设计经验的总结。是为了代码可重用、可扩展、可解耦、更容易被人理解和保证代码可靠性。