前端框架学习入门指引

1,227 阅读1分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第1天,点击查看活动详情

前端框架学习入门指引

  • 前端框架分类及对比
  • UI 框架与 JS 框架
  • UI 框架的选型
  • JS 框架的选型

image.png

框架和库

  • 类库:JQuery,Lodash
  • JS库:React, Vue, Angular
  • 工具:Webpack(Build) , Jest(Test) , ESLint(Lint) , Template(EJS) , 应用类(Echarts/D3/three)

UI框架选型

  • 判断使用场景(PC , 移动Web , 小程序 , 响应式)
  • 组件丰富,成熟的模板 , 方便集成
  • 成熟的社区 , 成熟的生态

Layui及layui-admin介绍

image.png

iView UI

一款基于Vue.js的高质量UI组件库

image.png

Ant Design

  • Ant Design of React
  • Ant Design of Vue

image.png

移动端的UI框架

Mint UI

基于 Vue.js 的移动端组件库

image.png

Cube UI

基于 Vue.js 实现的精致移动端组件库

image.png

Vant

轻量、可靠的移动端 Vue 组件库

image.png

JS框架选型

  • 团队的技术能力
  • 应用场景(后台?性能要求?时间要求)
    • 看那个需求更紧急
  • 成熟的社区,,成熟的生态 Vue的Star数量最多,成长最快,但是主要还是国内使用的多。主要原因:方便集成、学习成本低
  1. 根据团队技术能力选择框架,按需取用
  2. 了解框架背后的原理,并思考如何自己实现一个JS框架
  3. 多读官方文档,求助社区,高效开发