前端乐园

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

持续更新中……

# 目录

# vue

# 官方

# 组件库或框架

# 文章

# 开源项目

# 常用工具

# react

# 官网

  • React 官网 https://reactjs.org/
  • React 中文网 https://react.docschina.org/
  • React-router https://reacttraining.com/react-router
  • redux https://redux.js.org/introduction/getting-started
  • redux 中文 http://cn.redux.js.org/
  • umi https://umijs.org/
  • dva https://dvajs.com
  • immutable https://github.com/immutable-js/immutable-js

# 参考资料

  • awesome https://github.com/enaqx/awesome-react
  • react-hook https://github.com/streamich/react-use
  • React.js 小书 https://juejin.im/post/58c7a16e2f301e006bd03dbe
  • React 入门看这篇就够了 https://segmentfault.com/a/1190000012921279#articleHeader0
  • 掘金最污的 React16.x 图文视频教程(2 万 5 千字长文-慎入) https://juejin.im/post/5d085be0f265da1bac401937?utm_source=gold_browser_extension
  • react demo https://gist.github.com/sAbakumoff/7b8510adcb16bded189d747e34f5e114
  • 一文速览 React 全栈 https://juejin.im/post/5d0ee2906fb9a07ea33c1f8b
  • React 同构与极致的性能优化 https://segmentfault.com/a/1190000012464033
  • 阿里开源项目 https://segmentfault.com/a/1190000016773002

# 常用库

  • react-intl
  • rc-form https://github.com/react-component/form

# 框架

  • umi https://umijs.org/
  • 飞冰 https://ice.work/
  • next.js https://github.com/zeit/next.js
  • beidou https://github.com/alibaba/beidou
  • egg-react-ssr https://github.com/ykfe/egg-react-ssr
  • react-server https://github.com/redfin/react-server
  • Vulcan.js(The full-stack React+GraphQL framework)

# Demo

# 开源项目

# typescript

# 官网

# 参考资料

  • 深入理解 TypeScript https://github.com/jkchao/typescript-book-chinese https://jkchao.github.io/typescript-book-chinese/ https://github.com/basarat/typescript-book/
  • typescript 中文 https://www.tslang.cn/
  • typescript 中文 https://ts.xcatliu.com/ https://zhongsp.gitbooks.io/typescript-handbook/content/doc/handbook/Advanced%20Types.html
  • typescript https://www.html.cn/doc/typescript/doc/handbook/tutorials/React.html
  • typescript 进阶 https://www.jianshu.com/p/13a4eb1001f1
  • awesome https://github.com/dzharii/awesome-typescript
  • TypeScript 入门指南(基础篇) https://juejin.im/post/5d3bb567f265da1b8f1b09c1
  • TypeScript 入门指南 https://mp.weixin.qq.com/s/Oyawvb5BD-OKvMuF2tQ0pw?

# react+typescript demo

  • React+redux+typescript https://github.com/piotrwitek/react-redux-typescript-guide

  • https://github.com/fi3ework/blog/tree/master/react-typescript-cheatsheet-cn

  • typescript-tutorial https://github.com/xcatliu/typescript-tutorial

  • https://github.com/Lemoncode/react-typescript-samples

  • https://github.com/rokoroku/react-redux-typescript-boilerplate

  • https://github.com/alibaba/pont(前端接口层工具)

# 文章

# 常用库

# 数据

  • Immutablejs https://github.com/immutable-js/immutable-js

# 富文本编辑器

  • simditor https://github.com/mycolorway/simditor

# 时间

  • moment

# 网络请求

# 图片

# canvas

# 其他

# 物联网

  • mosca https://github.com/mcollina/mosca
  • MQTT https://github.com/mqttjs/MQTT.js

# 文章

# demo

  • javascript-mqtt-demo-wearingTip https://github.com/coolnameismy/javascript-mqtt-demo-wearingTip
  • 面试官(7): 聊一聊 Babel? https://juejin.im/post/5c03b85ae51d450c740de19c

# js

# 正则表达式

# 函数式编程

# 兼容性

# 其他

# 开源项目

# 常用库

# es6

# 移动端

# 文章

# 常用库

  • lib-flexible https://github.com/amfe/lib-flexible

# h5 游戏

# 开源项目

# demo

  • [🎮 你见过凌晨 4 点的洛杉矶吗?](https://juejin.im/post/5e37ec2a6fb9a02fec665530)

# 微信公众号

# 实战项目

  • wechaty https://github.com/Chatie/wechaty
  • wechatBot https://github.com/gengchen528/wechatBot

# 文章

# webpack

# 官网

# webpack

# loader

# 插件

# 文章

# 性能与监控

# 文章

# 性能

# 文章

# 监控

# 开源库

  • https://github.com/BetterJS
  • https://github.com/iv-web/aegis-report
  • https://github.com/RicardoCao-Biker/Front-End-Monitoring
  • https://github.com/MriLiuJY/monitorFE
  • https://github.com/710leo/urlooker

# 文章

# 常用工具

# 开源库

# SEO

# 高质文章

# 趋势

# 微前端

# WebAssembly

# Serverless

# web components

# 动效

# 工具库

# demo

# 可视化

#

# 文章

# 数据结构与算法

# 算法

# 官网

# 文章

# 开源库

# 机器学习

# 项目

# 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 框架

# 学习网站

# 架构

# 工程化

↑ 返回目录 ↑