前端组件库

搭建web app常用的样式/组件等收集列表(移动优先)


  • 一个常用的PHP类库, 资源以及技巧列表 awesome-php 推荐

0. 前端自动化(Workflow)

1. 前端UI框架(Frameworks)

2. JavaScript 框架汇总

3. 前端游戏框架

4. ui组件库(CSS Framework)

5. 基础模版

6. 排版

7. 网格系统

8. 路由和链接(Routing And URLs)

9. UA 识别

10. 表单处理

10.1 表单验证(Form Validator)/表单提示

10.2 < input > 相关

10.3 < select > 相关

10.4 单选框/复选框相关

10.5 上传组件

10.6 日期选择

10.7 取色

10.8 标签插件(Tag)

10.9 自动完成插件

10.10 样式修正

11. 图表绘制/图形库(Graphics)

12. 日期格式化 & 时间轴

13. 页面交互

13.1 Slider

13.2 瀑布流

13.3 懒加载/加载监听/预加载

13.4 图片轮播(幻灯片)/图片展示

13.5 图片剪裁/图片处理/图片转换

13.6 进度条/加载动画(Loading)

13.7 侧滑插件(offcancas)

13.8 菜单(Menu)

13.9 滚动侦测(ScrollSpy)

13.10 滚动加载更多/下拉刷新(Pull to Refresh)

13.11 平滑滚动插件(Smooth Scroll)

13.12 全屏滚动/全屏切换

13.13 分屏滚动

13.14 转场效果

13.15 固定元素(Sticky)

13.16 触控事件

13.17 拖拽组件

13.18 隐藏或展示页面元素

13.19 滚动条(Scrollbar)

13.20 视差滚动(Parallax Scrolling)

13.21 缩放 (Zooming)

14. 代码高亮插件/代码编辑器

15. 字体图标 ( Font Icon )

16. 动画(Animate)

17. 本地存储

18. 模板引擎

19. 通知组件/弹框组件/模态窗口

20. 提示控件(Tooltips)

21. 对话框/遮罩层/弹出层(lightbox)

22. 文档/表格/PDF

23. 目录树插件

24. 前后端交互

24.1 Ajax模块

24.2 SSE (Server-Sent Events)

SSE API用于创建到服务器的单向连接,服务器通过这个连接可以发送任意数量的数据.

24.3 Web Sockets

25. 音频/视频

26. 按钮

27. 富文本编辑器/Markdown编辑器/Markdown解析器

28. 内容提取(Readability)

29. 颜色(CSS Colors)/SVG/Canvas

30. 选项卡(Tabs)

31. 文本处理

32. 布局(Layout)

33. 演示/幻灯片

34. 国际化(i18n)

35. 邮件模板(Email Templates)

36. 移动端优化(Optimizing Mobile Performance)

37. HTTP请求相关

38. 下载组件

39. 加密/转码

  • crypto-js - JavaScript library of crypto standards.
  • ulid - 生成UUID类库
  • RSA in JavaScript - 用RSA加密实现Web数据加密传输
  • nanoid - 一款非常小巧的唯一ID生成工具
  • harmankang/Lab62 - 一个简单的人类可读的随机 ID 生成库
  • dropbox/zxcvbn - 评估密码强度的 JS 库,强度越强,密码越不容易破解

40. 调试

41. 实用工具/其他插件

ES6( ECMAScript 2015 )

ES6转码器(ES6 to ES5)

  • Babel - 一个广泛使用的ES6转码器,可以将ES6代码转为ES5代码,从而在现有环境执行
  • babelify - 将babel引入到Gulp, Grunt, npm run等构建过程
  • traceur-compiler - Traceur is a JavaScript.next-to-JavaScript-of-today compiler

ES6入门

设计模式( JavaScript Patterns )

在线工具( Online Tools )

前端开发工具

1. 开发工具

2. 调试工具

3. 模拟数据( Mock )

4. 接口管理

  • RAP - Web接口管理工具,开源免费,接口自动化,MOCK数据自动生成,自动化测试,企业级管理

5. 浏览器扩展(Chrome Extensions)

6. 在线工具

图片在线优化工具

Font Icon 在线生成工具

前端参考集

书籍( Frontend-related Books )