一、阅读以下库

目前就想到这些,可以好好看一看原理,自己实现一下

  • clipboard.js
    • 复制粘贴库
    • 能够实现点击一个按钮直接 copy 文字
  • jquery.js
    • jQuery 库
    • 提高写原生项目的效率,$ 方法取元素更方便
  • jquery.lazyload.js
    • 懒加载库
    • 图片懒加载时直接给它加一个 class=’lazy’ 即可
  • swiper.js
    • swiper 库
    • 特别适用于移动端,可以做轮播、手势滑动
  • axios.js
    • axios 请求库
    • 看一看拦截器怎么用
  • masonry.js
    • 瀑布流库
    • 看一看怎么用
  • masonry.js

    二、做几个实用的组件

    原理就是提前写好 CSS 和 JS,使用时直接按使用方法复制 HTML 即可

  • 栅格系统

  • 轮播
  • 分页
  • 模态框
  • Tab 切换
  • 懒加载
  • 瀑布流
  • 木桶布局
  • 点击回到顶部
  • fullpages 全屏滚动
  • 面包屑
  • tips 提示框

可以参考这些一下组件体系比较完善的库,模仿着做

2020/11/23 更新
目前简单做了这几个

  • modal —— 模态框
  • tooltip —— 气泡提示框
  • suspension —— 悬浮框

还需要做

  • popOver —— 弹出框
  • dropDown —— 下拉菜单框

    三、熟悉学习其他语言

  • PHP

  • Python
  • Ruby
  • Java
  • C/C++/C#


四、做几个有意义的项目

  • 做一套原生 UI 组件库(Chax UI)以及 React 版(chax-react)、Vue 版(chax-vue),并持续更新
  • 使用 WordPress 搭建一个博客系统
  • 使用 Node.js 搭建一个博客系统
  • 使用所学的前端、后端知识搭建一套电商系统,有用户展示页,也有后台管理页

「@浪里淘沙的小法师」