记录一下nodejs配置mongodb的过程:

  1. mac上安装mongodb:

    1
    brew install mongodb
  2. 创建一个存在数据目录

    1
    mkdir -p ~/data/db
  3. 在用户根目录运行mongodb,指定数据存在路径为刚刚新建的目录

    1
    mongod --dbpath=./data/db

    Read More

前端开发时,经常需要用代理工具Charles或者Fiddler来抓包,或修改接口或替换文件或查看提交数据等,都是非常方便。尤其是做移动端开发时,是不是经常得配置host,或者查看页面请求的数据是否正确,相信我,此时使用Charles的远程代理是一件很幸福的事情。

当我们打开浏览器请求一个页面时候,为什么Charles就能捕获到请求?然而如果chrome使用了SwitchyOmega(配合shadowsocks,翻墙神器)或者类似的代理插件,此时Charles时捕获不到我们发的请求。

Read More

基本含义

shebang也可以称之为hashbang, 代指#!。一般出现在脚本的第一行,用于在unix系统或类unix系统中指定默认的脚本文件的解释程序。
其语法格式是:

#!interpreter [optional-arg] // 解释程序的绝对路径和可选参数

  1. 如果脚本文件中没有#!这一行,执行时会以系统默认的解释程序允许
  2. 如果#!之后的解释程序是一个可执行文件,那么执行这个脚本时,它就会把文件名及其参数一起作为参数传给那个解释程序去执行。

Read More

1.textareaplaceholder换行

问题:placeholder中的文本过长,或者需要格式化展示文本时,需要使用多行展示。
解决方案:使用angular中的数据绑定就可以轻松实现

1
<textarea rows="6" cols="45" placeholder="{{'第一行\n第二行\n第三行\n第四行'}}"></textarea>

解决方案来源:Can you have multiline HTML5 placeholder text in a textarea?

iframe高度自适应

问题: 在angular项目中需要嵌入第三方页面,通过iframe来实现,但是嵌入的页面高度未知。

解决方案:自定义一个angular指令,监听iframe的onload事件来获取iframe中内容的高度。

Read More

在用nodejs开发web程序过程中, 每次修改都需要重新启动一下服务, 虽然有pm2,forever等解决方案。
在fex上看见一个比较另类的解决方案——Node.js Web应用代码热更新的另类思路

在这里简单实现一下来解决开发过程中热启动的问题。

首先需要重新包装一下nodejs提供的require方法。在require自己写的代码时,同时需要监听文件变化,当文件发生变化时,重新加载模块。

Read More

遇到一个问题:

A标签跳转前需要做一下登录判断,如果未登录则不让跳转,使用preventDefault发现阻止不了A标签的跳转。

解决方法:

加上stopImmediatePropagation才行。当然也可以把A标签的href属性设置为空,通过js来控制跳转,但改动略大些,忽视。

于是正好借此机会整理和收集一下JavaScript中的event事件。

Read More

整理和收集一下浏览器渲染原理。

解析和展示html流程

  1. 首先下载html文件
  2. 解析html,构建dom树
  3. 和css结合生成渲染树
  4. 绘制并展示页面

Read More

近两天事情较少,准备做一个书单列表,初始阶段和之前看过的Todo基本相似。正好很久没看React,感觉好生疏,准备结合ES6重新写一个React的Todo示例。参考的源码和样式来源于todomvc

Read More

随着网页内容越来越丰富,页面的图片也越来越多,导致页面加载越来越慢。针对页面的优化,图片加载是一个重点。常见的优化方案有图片预加载,图片惰性加载。或者针对图片格式做一些优化,例如使用webp之类的。这里主要关注图片的加载方式。

Read More