toyanyan/web-project

前端练手小项目

VK的前端进阶之路...

博客-- VK Blog

博客开通后，原在github写的前端相关总结和文章都搬家啦，传送门

文章目录：

1.VK的秋招前端奇遇记(一)

2.VK的秋招前端奇遇记(二)

3.VK的秋招前端奇遇记(三)

4.VK的秋招前端奇遇记(四)

5.番外篇：前端面试&笔试算法 Algorithm

6.JS时间机制之Microtasks & Tasks & Queues

7.Generator 异步原理

8.React是如何工作的

9.可能是最好的正则表达式课程的笔记啦

...更多

D3数据可视化

1. D3初印象，画一个笑脸吧 认识SVG，熟悉SVG的常用操作，在线预览
2. D3之柱状图 学习D3的数据读取方法，比例尺、坐标轴和柱状图的绘制方法，在线预览
3. 更新中...

项目清单

1. 轮播图 -- 利用CSS3 transition属性，写出简介的轮播图插件 原生js
2. 别踩白块 -- Jquery初识，获取元素，动态生成div, jQuery元素的属性、方法实现动态效果和游戏逻辑 演示地址：别踩白块在线
3. 拼图游戏 -- Jquery进阶应用。 对鼠标事件"mousedown" "mousemove" "mouseup" 的应用实现拖拽； 数组保存、指导拼图位置； 数组乱序方法的应用； 演示地址：拼图游戏在线
4. 炫酷菜单导航 -- CSS3属性的应用： 通过transform: rotateZ()属性以及transition属性实现动态效果； 演示地址：导航在线
5. 贪吃蛇游戏 -- 原生JS深入学习，oop面向对象编程。 蛇身跟随蛇头运动逻辑，蛇头碰撞检测(包括墙壁和蛇身)； 键盘事件的练习(keydown) 演示地址：贪吃蛇在线
6. Canvas动画应用-- 利用Canvas绘制动画弹球，oop面向对象编程，碰撞检测，速度回弹等。 演示地址：Canvas小球

React项目实战

应聘美团前端实习岗位时所做的一款数据查询组件，基于React框架，主要实现了：

• 整体UI的设计，根据所给界面，进行CSS布局和渲染；

• 查询功能的实现，可以根据关键字、日期、标签等进行数据的检索和查询；

• 表格翻页组件，可以根据需求，请求数据并将所有数据按需展示；

• 输入数据的关键字验证与提示功能

演示地址：后台管理系统