从事前端开发近 2 年，积攒了一些学习资料与大家分享。在日常工作中极少应用到下述知识，示例代码完全因个人兴趣而生，不地道之处欢迎大家前来吐槽指导！
Node.js
参考资料
示例
-
简易博客系统 code
这是一个简易的博客系统，用户在该站注册后即可发布个人日记，日记可以被登录用户点赞。功能较简易，外观未经雕琢，纯粹的练习项目。详情
相关知识：Express.js、File System、MongoDB、Mongoose
该项目使用 Express.js 框架搭建，使用 MongoDB 存储数据。图片上传涉及文件存储请查阅 Node.js 文件系统。
-
多人聊天室 code
Node.js 结合了 Websocket 的简易多人聊天室，感兴趣的同学可以自行高仿个 QQ 出来。详情
相关知识：Express.js、Websocket、MongoDB、Mongoose
该项目使用 Express.js 框架搭建，使用 MongoDB 存储数据。核心内容在于全双工通讯请查阅 Websocket。
开启自恋模式 欢迎欣赏本人深度好文：
Vue.js
参考资料
示例
-
简易个人空间 code
与上面提到的博客系统类似，教科书级别的增删改查功能。详情
相关知识：Node.js、Express.js、File System、MongoDB、Mongoose、Webpack
该项目客户端使用 Vue.js 搭建，服务端使用 Express.js 搭建，使用 MongoDB 存储数据。图片上传涉及文件存储请查阅 Node.js 文件系统。工程构建使用 Webpack 建议了解。背景设计使用 Trianglify 在此推荐。
-
基于 Vue.js 组件化的思想，将播放器控件封装。并尝试了 Vue.js 的打包上线流程，遇到了点小挫折，压缩后静态资源地址错误...详情
相关知识：HTML5 Video、Webpack
该项目不涉及服务端，完全使用 Vue.js 搭建。工程构建使用 Webpack 建议了解。
React
参考资料
示例
React Native
参考资料
React Native 环境搭建指南，正在撰写中，敬请期待。
Canvas
参考资料
示例
-
-
想起计算机图形学老师的一句话“咱们数字媒体技术专业知道而其他专业同学不知道的概念比如贝塞尔曲线”，现在想想老师也是蛮自恋的...
-
使用 Canvas 实现交互非常麻烦，因为无法直接获取触发事件的元素，需要通过 isPointInPath 方法得知。
本人学习 Canvas 最大的收获便是领悟到其实现交互的方式无非旋转画布啊，重绘啊，巴拉巴拉...
Svg
示例
使用 Svg 绘制的图标无限放大后不模糊这点很赞。但其更强大的功能在于动画，可惜我的示例比较简易无法体现这点...
开启自恋模式 欢迎欣赏本人深度好文：Svg 路径动画实现旋转进度条
Three.js
参考资料
示例
-
该示例为 Canvas 与 Three.js 结合而生。表盘由 Canvas 绘制，而建模使用 Three.js。其实 Three.js 基于 Canvas，上述不太准确，意会便好。
Matter.js
参考资料
示例
Less
参考资料
Sass
参考资料
开启自恋模式 欢迎欣赏本人深度好文：Sass 学习笔记
Echarts
参考资料
示例
上面两个是基友的大作业啦，属于友情开发。
相关知识：Webpack
微信小程序
开启自恋模式 欢迎欣赏本人深度好文：
作者：呆恋小喵
我的后花园：https://sunmengyuan.github.io/garden/
我的 github：https://github.com/sunmengyuan
原文链接：https://sunmengyuan.github.io/garden/2017/06/08/share-frontend.html
