Skip to content

Latest commit

 

History

History
1246 lines (917 loc) · 62 KB

FRONTEND.md

File metadata and controls

1246 lines (917 loc) · 62 KB

前端乐园

本文收集学习过程中使用到的资源。

持续更新中……

所有可以用 JavaScript 编写的应用程序最终都会用 JavaScript 编写 -- Jeff Atwood @2007

目录

vue

官方

vue3

vite

组件库或框架

vue3

  • nutui(京东移动端组件库)

文章

开源项目

vue ssr

https://github.com/zbysir/go-vue-ssr

常用工具

husky

  • husky(git hook)
  • yorkie(git hook 与 husky 功能相同) 注意:一定要使用 npm 安装 eslint 和 husky,因为在 windows 操作系统下, 用 yarn 安装依赖,不会触发 husky pre-commit 钩子命令。 还有就是注意 husky 的版本,否则也可能不触发 git 钩子

常用组件或工具

nuxt

常见问题

monorepo

lerna

turborepo

react

官网

参考资料

常用库

框架

  • Vulcan.js(The full-stack React+GraphQL framework)

解决方案

服务端渲染

Demo

开源项目

typescript

官网

参考资料

react+typescript demo

文章

常用库

数据

富文本编辑器

文章

markdown

时间

  • moment
  • dayjs(时间格式转换)

网络请求

  • axios
  • mande(fetch链式工具库)
  • [fetch/node-fetch]

图片

canvas

其他

物联网

文章

demo

js

console

正则表达式

函数式编程

兼容性

其他

开源项目

  • layout-ui(可视化布局 纯 css 布局 Layout-UI)
  • resume(A service that creates a résumé based on your GitHub repos/activity.)
  • 10 个后台管理 UI 框架
  • muuri(Responsive, sortable, filterable and draggable grid layouts)
  • odoo(免费开源的企业数智化管理平台)

常用库

es6

babel

移动端

文章

常用库

常见问题

h5 游戏

开源项目

demo

微信公众号

实战项目

文章

webpack

官网

webpack

loader

插件

文章

性能与监控

文章

性能

文章

监控

开源库

文章

常用工具

开源库

SEO

高质文章

趋势

微前端

标准

框架

WebAssembly

Serverless

web components

框架

组件

打包

动效

工具库

demo

可视化

开源项目

文章

微软power apps google app maker 阿里妈妈创意中心 云凤蝶 imgcook 飞冰

低代码

数据结构与算法

算法

官网

文章

开源库

机器学习

项目

js-core

文章

代码规范

canvas

开源项目

  • spritejs (Draw graphics on a canvas through DOM-like APIs. Vue & React/Preact supported. )

测试

文章

单元测试

测试框架:

  • 推荐 jest,功能比较完善,包含断言(facebook 开发)
  • mocha + chai/expect
  • karma + mocha + chai

用 sinonjs 生成函数

站在程序员的角度测试 unit 测试是把代码看成是一个个的组件。从而实现每一个组件的单独测试,测试内容主要是组件内每一个函数的返回结果是不是和期望值一样。

  • jest(推荐)
  • karma(Spectacular Test Runner for JavaScript )
  • mocha(simple, flexible, fun javascript test framework for node.js & the browser)
  • enzyme(JavaScript Testing utilities for React )
  • vue-test-utils(JavaScript Testing utilities for vue )
  • sinonjs(模拟生成函数)

文章

e2e 测试

站在用户角度的测试 e2e 测试是把我们的程序堪称是一个黑盒子,我不懂你内部是怎么实现的,我只负责打开浏览器,把测试内容在页面上输入一遍,看是不是我想要得到的结果。

文章

视觉回归测试

简单来说就是测试应用整体界面是否达到了 UI 设计图的要求。

性能测试

Chrome DevTools

api 测试

文章

自动化

  • Auto.js(安卓平台上的 JavaScript 自动化工具)
  • taobaoVisitingVenues(双十一活动自动化地操作淘宝浏览店铺得喵币脚本 for Android)
  • travis-ci(自动触发 GitHub 项目测试)

网络请求

pwa

其他必备知识

常用技术

git

安全

框架

编译器 compiler

AST

html

数据响应式

框架

jquery

ui 框架

学习网站

架构

工程化

值得注意的库

-技术选型

web ide

效率

↑ 返回目录 ↑