webpack入门之打包html,css,js,img(一)
webpack到底是什么，网上一大堆介绍的东西，越看越不知道说的什么，所以今天打算自己来记录一下这段时间学习webpack的成果，webpack就是打包文件用的，html，css，js,img，为什么通过他打包？说白了就是我们可以提前使用新的东西，es6现在浏览器支持的其实并不是很好，但这不是问题，你可以采用es6去写脚本，然后通过webpack去打包成es5，vue项目里面的vue文件也是一样的，也是需要webpack打包成浏览器能够识别的文件才能正常使用，废话不多说，咱们搞起找个磁盘，新建一个demo文件，cmd进去（首先要安装Node.js，Node.js自带了软件包管理器npm），依次执行，npminit-y,生成package.json文件npminstallwebpack-g全局安装webpacknpminstallwebpack--save-dev项目中安装成功以后构建如下的文件建构，（bootstrap,jquery,layer,可暂时不建）index.
实现WebSocket和WAMP协议的开源库WampSharp
WebsocketApplicationMessagingProtocol协议：https://github.com/wamp-proto/wamp-proto1.基础档案引入：WAMP协议是一种建立在Websocket之上可以进行publish&subscribe和rpc的通信协议。它实现了类似ZeroMQ中的pub&sub通信模式，同时将这种模式用于传统的rpc通信，较好地解耦了通信端点之间的直接联系。基础概念：broker：pub&sub通信模式中的中间件。dealer：rpc中caller&callee通信的中间件。router：router其实就是broker和dealer的结合体。realm：realm为router中的一个活动空间，client之间通信以realm为活动区间。client：通信实体，消息发布者/订阅者，接口调用者/实现者。peer：client或者router。role：peer所扮演的角色。topic：pub&sub主题，使用uri格式表达。procedu
解决 vs 出现Error MC3000 给定编码中的字符无效
在xaml写中文注释，发现编译失败ErrorMC3000给定编码中的字符无效我的xaml写了一句代码
基于Abp的WebApi容器
简述对Abp的动态webapi的改造过程注册1.首先通过反射将《服务类型》通过ApiControllerBuilder构建成成DynamicApiControllerInfo2.在DynamicApiControllerInfo中同时构建DynamicApiActionInfo3.Ioc注入DynamicApiController
[.Net] 用 C# 自己动手编写一个 Web 服务器，第五部分——视图引擎
视图引擎在上一篇文章中，我们实现了Session，并在过程中为HttpListenerContext提供了更高层的封装。在Controller返回的结果中我们可以看到服务器动态执行的结果，不过目前它们是以原始字符串的形式存在的。从基本原理来说，返回字符串并没有什么不妥————互联网早期的CGI/Servlet都是这么做的。问题在于这种接口过于底层了。设计者希望看到HTML页面，而不是苦哈哈的自己去拼接字符串。这就是视图引擎（ViewEngine）存在的理由。视图引擎的存在已经有很长时间了。在其他框架的术语里，有时候也会称为模板引擎（TemplateEngine）或类似的说法，因为从理论上来讲它可以用来生成任何文本形式的内容，并非只能生成HTML文件。不过，用来生成页面一直是其最广泛的用法。最近，随着Nodejs的流行，各种模板引擎有爆炸性增长的趋势，在Nodejs中可用的视图引擎就不下几十种。另外一个有趣的现象是：视图引擎从早期的、依附于特定Web框架的“寄生”形态，逐渐发展为独立的、甚至可在多中不
[.Net] 用 C# 自己动手编写一个 Web 服务器，第四部分——Session
Session在上一篇文章中，我们实现了Web服务器的路由功能，并实现了控制器的基本支持。本来，我们应该高高兴兴的继续向其中添加功能，不过马上就发现一个尴尬的问题————我们还没有Session。更具体的说，我们一直在使用的HttpListenerContext只提供了Request/Response，却没有Session属性。这意味着我们的服务器毫无记性，只能把每次请求都当作新的用户。出现这种情况也是情理之中的。基础类库之中的HttpListenerXXX系列类为我们创建Web应用提供了一个很好的起点，但实现Sesssion则是Web框架的事情，并不是Web服务器的职责。有的同学可能会问，Web服务器和Web框架的区别在哪？嗯，其实这个问题也没有严格的定义，不过一般来讲，Web服务器通常是独立于编程语言和框架的，比如Apache/Nginx都有支持多种语言/框架的能力；IIS通过插件也可以运行PHP，并且Web服务器通常更关心基础设施方面的问题，包括站点管理、HTTP压缩、证书
[.Net] 用 C# 自己动手编写一个 Web 服务器，第六部分——用户验证
用户验证和授权在上一篇文章中，我们添加了视图引擎支持，可以输出真正的动态页面了。再加上控制器（Controller）的支持，现在应用程序开发者可以自由执行业务逻辑，并输出想要的页面效果，可以说，一个真正的Web服务器已经基本成型了。不过，大多数业务系统还需要用户验证（Authentication）和授权（Authorization）的功能，允许用户在系统中登录和注销，并根据用户权限判断他（她）能够执行的操作。我们在这里不考虑用户授权（Authorization）的实现。因为对于授权机制的处理和资源的划分，各个系统存在较大差异，不太适合放到底层来实现，留给业务层决定是更合理的作法。另一方面，用户的登录/注销几乎是任何系统的基本功能，功能上不会有太大变化，如果也放到业务层来实现，就意味着每个系统都需要重复实现一遍，这明显是对开发资源的浪费。在前面的文章中，我们已经实现了Session的支持，现在我们可以在Session基础之上再增加处理User的功能。在本文系列的中间件部分我们也说过，Web流水管线由一系列中间件（Mid
分50个步骤高仿美团外卖（1）
分50个步骤高仿美团外卖（1）github地址每一个步骤都有对应的一份代码和截图，循序渐进。（1）初始化vue项目效果环境初始化安装node。官网直达安装淘宝npm镜像。npminstall-gcnpm--registry=https://registry.npm.taobao.org安装vue脚手架vue-cli。npminstallvue-cli-g创建项目用vue-cli创建项目meituanvueinitwebpackmeituanwaimai创建过程中会提示输入项目名称，都直接按enter键，vue会自动使用默认的。创建过程中会提示是否需要vue-router、eslint、unittests等，全部输入no。安装依赖，启动项目切换到项目目录cdmeituan安装依赖cnpminstall启动运行cnpmrundev如果浏览器没有自动启动运行，请查看命令行输出的打印信息，把最后的网址拷贝到浏览器地址栏即可
基于vue的无缝滚动组件
vue-seamless-scrollAsimple,SeamlessscrollingforVue.js在awesome上一直没有发现vue的无缝滚动组件，在工作之余写了个组件，分享出来希望大家一起学习进步。Demohttps://github.com/chenxuan0000/vue-seamless-scroll/index.htmlInstallationNPMnpminstallvue-seamless-scroll--saveUsageES6以下es6用法需要webpack环境编译.具体参考example-src/App.vueimportVuefrom'vue'importvueSeamlessScrollfrom'vue-seamless-scroll'newVue({components:{vueSeamlessScroll}})普通模式(scripttag)Example:具体参考test/test.html<html
【Part2】用JS写一个Blog （node + vue + mongoDB）
上一节前后端项目分别初始化完成，这一小节我就从后端项目开始写。实现mongoDB数据库的连接。整理后端目录下面是通过express-generate生成的项目的目录bin/www是项目的启动文件，启动项目除了上次说的npmstart，还可以再命令后执行nodebin/www，其实这两个命令是一样的，只不过在package.json文件中两者建立了链接，如下图node_modules不用多说，项目的依赖都安装于此public是放置一些公共资源的文件夹，我以后也不会用到它，所以把他给删掉了router下的.js文件就是我们写API的地方了，为了更直观，我把router名字改为api，把里面的文件名字分别改为post.js和admin.js.(我把api分成两个文件，一个是与文章相关的，另一个是与管理员相关的)views是页面的模板，因为我们后端只提供数据接口，所以用不到页面文件，我把他给删掉了app.js是整个项目的入口文件，相当于后端项目的大脑，它里面的文件是按顺序执行package.json是关于我们这个项目用到的依赖。需要说明的
解决单页面应用微信浏览器后台加载视频
问题单页面应用，用户使用wifi打开过一个视频后，即使销毁了video，甚至播放页面都关闭的情况下，微信浏览器仍然会在后台继续加载视频，这会浪费很多流量。最开始以为使用销毁vidoe标签后，视频即会停止加载，事实上在大部分浏览器上确实如此，但是微信内置浏览器在这方面表现不一致。在使用流量的情况下，退出播放页面后视频确实停止加载了，但是在wifi下，视频会在后台继续下载，除非退出当前单页面应用。解决问题1、最开始在组件destroy的hook时，disposevideojs实例，无效，视频继续后台下载。2、后来想让videojs加载一个空的视频资源地址欺骗微信浏览器，videojs.src("")，无效，视频还是会继续加载。3、空的字符串不生效，加载一个无效的视频资源地址，再销毁videojs实例，成功解决视频后台下载的问题。主要代码如下:destroyed(){//组件销毁时,用一个假的播放视频地址,欺骗微信浏览器,使其加载其他的视频,不继续加载我们的视频同时销毁videojsth
while(true)应用 之 实现自己的消息队列
while(true)应用之实现自己的消息队列早些时候，一直有个疑问，就是比如你从前端发一个操作之后，后台为什么能够及时处理你的东西呢？当然了，我说的不是，服务器为什么能够立即接收到你的请求之类高大上的东西。而是，假设你用异步去做一个事情，而后台有一个处理程序在处理你的申请，你的目的自然是不想让操作阻塞，所以处理肯定是处理程序主动触发的过程。那么怎样做能够让其能够及时处理问题呢？确实也困惑了我许久。（我相信也有不少同学会有类似疑问）所以我觉得有必要解解惑。需求示例1：用户请求某操作时，需要与此同时给用户发个邮件，但是这个邮件可能会很耗时，在不使用异步线程的情况下（事实上不是所有的语言都支持多线程），怎么样让用户得到快速响应，且邮件稍后即可送达？需求示例2：在高并发情况下，需要对某数据进行减操作（比如商品库存，如果超出了库存值，则将无货可发），怎样保证用户先到先得，后到就没有？针对这两个问题，解决办法自然是多的。但是本文只说一个思路，那就是主题，消息队列！当需要给用户发送邮件时，只需将该请求发送到后台进程中，后台进程进行逐
前端程序员学习的几个阶段、你正处于哪个阶段呢？
阶段一：不知道自己不知道大学期间，我和老师做过一些小项目，自认为自己很牛，当时还去过一些公司面试做兼职，但是就是不知道为什么没有回复。那个时期的我，压根不知道自己不知道，还以为自己懂很多，现在想起自己以前就好笑，那个时候还算不上程序员，顶多只能算是个业余编程爱好者。表现：假自信、过度承诺、满口我能行没问题、看不起其他程序员….。阶段二：知道自己不知道工作后，发现自己在项目中工作时遇到困难不知道怎么解决，和身边人一比发现自己知识很欠缺，这时候知道自己技不如人，很多地方都不足，需要大补才行，这个时候就是大家所说的初级程序员阶段，这个阶段必须依靠别人指导。表现：有点心虚、虚心学习、偷偷努力、羡慕牛人…阶段三：知道自己知道工作三四年后，自己的技能逐步提高，成为了项目组的技术大拿，这时候也很自信，知道自己能够解决遇到的所有问题，这时候就是高级程序员阶段了。表现：自信、比较客观、真正承诺、有点自我…阶段四：不知道自己知道工作多年后，随着自己知识的深度和广度的提高，越学发现越不懂，有时好觉得自己以前真是浪费了太多时间。虽
为什么程序员要会linux
三大操作系统概述windows,macOS,linux是当今主流三大操作系统，普通用户一般是选择windows或macOS,linux主要是占据服务器领域市场。这三个操作系统给人的感觉是：windows经济适用，档次较低;macOS高端大气上档次;Linux是极客专用，一个黑乎乎的窗口，各种花花绿绿的指令在闪烁，对着键盘噼里啪啦一通乱敲，就能窃取各种机密...普通用户对于操作系统的选择很简单，经济实用选windows，钱多讲究格调选macOS,毕竟普通用户切换操作系统的成本并不大。而程序员就不一样了，换一个操作系统，就意味着所有开发环境都要一并更换。而且在程序员群体中，操作系统有以下的鄙视链：macOS-->linux-->windows。其实操作系统的比较并不是简单粗暴的单一维度比较，用windows并不意味着low，用linux也不等同于你就是一个极客。关键在于你是如何使用。就好比编程语言的选择，php是最招人黑的语言(没有之一),但黑php的人中有不少人写的代码同样不堪入目。不过作为一个程序员，你很有必要学会lin
程序员，如何摆脱平庸？
公众账号原文https://mp.weixin.qq.com/s?__biz=MzIyNjM3MzI4MQ==&mid=2247484180&idx=1&sn=87bd277663835c2d92615bd8d8a953ae&chksm=e87038dadf07b1cc110cb448f84ae17cb0876ad98133415d2c4d65ed7b6d7d7b8a913dbbbd4e#rd
vue.js事件，属性，以及交互
vue.js事件，属性，以及交互这是我学习vue的第二天，今天主要学习了如何利用vue阻止事件冒泡，阻止事件的默认行为，键盘事件以及如何添加class、style这些属性，以及如何利用vue来进行数据交互，利用百度的一个API来写一个百度下拉列表，今天学习完之后，感触最深的就是vue主要是逻辑上的应用，减少了DOM的操作，并且vue还用到了原生的方法，所以学好js高程很有必要。一、如何利用vue阻止事件冒泡以及阻止事件的默认行为和了解什么是事件对象在介绍事件冒泡之前，我们来了解一下事件，在上篇博客中我们知道事件的一般形式为v-on:click/mouseover，但是在vue中我们更加推荐@click/mouseover这种简写的方式1、事件对象：@click="show($event)"事件对象2、阻止事件冒泡：方法有两种a).ev.cancelBubble=true;来自于原生的方法b).@click.stop推荐方法一：利用ev.cancelBubble=true阻止事件冒泡，当我们点
用js优美的写各种斐波那契数列
fibonacci在阅读BuckleScript官方文档时，发现一个斐波那契的code让我眼前一亮，实现思路是我从未想到过的。犹记得初学编程时斐波那契数列让我理解的递归的威力，现又让我从新认识了递归。这里我会总结我所有价值的斐波那契数列实现。如后续有新的认知会在文章末尾处更新。让我从新认识递归的code(代码是Ocaml,后面我会转换为js)letfibn=letrecauxnab=ifn=0thenaelseaux(n-1)b(a+b)inauxn11这段代码会在后面js的版本介绍正常递归版本先说下正常的递归版本，这个版本在我初学编程时经常遇到的，它让我知道了递归的强大。functionfibonacci(n){if(n==0)return0elseif(n==1)return1elsereturnfibonacci(n-1)+fibonacci(n-2)}代码优美逻辑清晰。但是这个版本有一个问题即存在大量的重复计算。如：当n为5的时候要计算fibonacci
vue-cli 使用小技巧
vue-cli使用小技巧1.关闭烦人的eslint语法检测，在config文件夹下设置：//UseEslintLoader?//Iftrue,yourcodewillbelintedduringbundlingand//lintingerrorsandwarningswillbeshownintheconsole.useEslint:false,//设置为false2.引入scss样式文件，在需要引入的组件代码最后加上：
精心收集的 95 个超实用的 JavaScript 代码片段（ ES6+ 编写）
翻译自：30secondsofcode精心收集的有用的JavaScript代码片段，你可以在30秒或更少的时间内理解。有了这些代码片段，获取你可以完全抛弃Lodash或Underscore。使用Ctrl+F或command+F来搜索代码片段。欢迎贡献，请阅读贡献指南。这些代码片段是用ES6编写的，使用Babel转换器来确保向后兼容性。目录Array数组Arrayconcatenation(数组拼接)Arraydifference(数组比较)Arrayincludes(数组包含)Arrayintersection(数组交集)Arrayremove(移除数组中的元素)Arraysample(数组取样随，机获取数组中的1个元素)Arrayunion(数组合集)Arraywithout(从数组中排除给定值)Arrayzip(创建一个分组元素数组)Averageofarrayofnumbers(求数字数组的平均数)Chunkarray(数组分块)Com
你可能不知道的 Date 类
Date是JS中的重要的一个内置对象，其实例主要用于处理时间和日期，其时间基于1970-1-1(世界标准时间)起的毫秒数，时间戳长度为13位（不同于Unix时间戳的长度10位）。对于日期和时间，我们有无数的使用场景，因此需要特别注意一些细节和约定。1.构造函数通过newDate()可以进行实例化，得到一个Date对象实例，值得注意的是如果直接执行Date()，将得到一个时间字符串。newDate();newDate(value);newDate(dateString);newDate(year,month[,day[,hour[,minutes[,seconds[,milliseconds]]]]]);其中对构造函数的参数说明(参考MDN)：如果没有输入任何参数，则Date的构造器会依据系统设置的当前时间来创建一个Date对象。如果提供了至少两个参数，其余的参数均会默认设置为1（如果没有提供day参数）或者0。JavaScript的时间是由世界标准时间（UT