![bg.jpg](/2017/01/07/web-particleground/bg.jpg)
首先可以来看下这个插件的demo:https://jnicol.github.io/particleground/
一种比较常见的粒子背景,有连线,有3d视差效果。
代码:github地址
源代码很短,本文也算不上啥解析文章,只是阅读笔记。
1.基本的粒子动画原理
在canvas画布上绘制复数实心圆点即粒子,每个粒子都有它的粒子对象实例,用于记录它的大小、位置信息以及速度,通过timeout来更新粒子的位置形成粒子动画。大概类似下面这样:
|
|
一些前端记录和MAD相关
首先可以来看下这个插件的demo:https://jnicol.github.io/particleground/
一种比较常见的粒子背景,有连线,有3d视差效果。
代码:github地址
源代码很短,本文也算不上啥解析文章,只是阅读笔记。
在canvas画布上绘制复数实心圆点即粒子,每个粒子都有它的粒子对象实例,用于记录它的大小、位置信息以及速度,通过timeout来更新粒子的位置形成粒子动画。大概类似下面这样:
|
|
使用基于hexo的静态博客,本地是hexo搭建的动态页面,部署时使用自带命令生成静态html文件,之后push到github后通过gitpage呈现。文章书写主要依靠markdown和html。
静态博客,免费服务器,免费域名lenrinfvck.github.io。
虽然是静态页面,但是可以借由很多第三方云服务使用一些动态功能呢,如回复统计一类的。
自己使用 node+express+mongodb,部署在阿里云服务器上,linux主机预装centOS的裸机。所有动态数据存入数据库动态展示,文章使用了动态编译markdown的形式,同时也自行构建了一些语法功能,如嵌入标签分类和时期等。
代码部署在coding的git上,使用webhook自动同步到服务器。
动态博客,阿里云计流量28.8元/月,域名lenrinfvck.cn (服务器到期) 39元/年,维护博客本身就很烦,更难得写文章。忙起来后就没咋弄了,坑掉了。
环境:
NodeJs: 4.0+
git: 1.8+
官方说明: webhook说明
基于git的githook功能,coding提供的webhook服务,github也有类似服务。
监听对远程仓库的操作,执行相应操作,此处webhook提供的处理是发送一个http请求到指定url地址。这时就可以在部署服务器上开个路由监听这个地址的访问,如果是coding发出的,则git pull拉去代码,并重启服务等。
在此处新建一个监听,填入目标URL地址和加密口令,一般是监听push事件。
关于vagrant安装和使用:vagrant使用
本次是在virtual+vagrant下安装的centos,在此基础上安装LAMP环境.
centos.box下载:http://www.vagrantbox.es/
相关版本:
LINUX系统: centOS6.4 i386 Minimal
[服务器]: 阿里云ECS,1核512MB,流量收费(¥28.8/月,¥0.72/GB)
[系统]:CentOS6.5 32位
[环境]:Node + Express + Mongodb3.0.6
[本机]:OSX EI Capitan
Linux,OSX直接以ssh链接,Win使用putty链接