nicenote/docs/fea/website/index.md
2021-10-19 14:52:56 +08:00

280 lines
8.2 KiB
Markdown

---
nav:
title: 前端
path: /fea
group:
title: 💊 学习文档
order: 1
path: /website
---
## 💊 学习文档
### 外包模板
<table>
<tr>
<td width="240" align="center">
<a target="_blank" href="https://panjiachen.github.io/vue-element-admin-site/zh/">
<img src="https://panjiachen.github.io/vue-element-admin-site/home.png" width="42" />
<br />
<strong>vue-admin</strong>
<div>Vue 中台解决方案</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://pro.ant.design/zh-CN/">
<img src="https://pro.ant.design/favicon.png" width="42" />
<br />
<strong>antd-pro</strong>
<div>react 中台解决方案</div>
</a>
</td>
</tr>
</table>
### 前沿技术
<table>
<tr>
<td width="240" align="center">
<a target="_blank" href="https://deno.land/">
<img src="https://deno.land/logo.svg" width="42" />
<br />
<strong>deno</strong>
<div>新生代 node</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://lerna.js.org">
<img src="https://lerna.js.org/images/lerna-hero.svg" width="42" />
<br />
<strong>Lerna</strong>
<div>包管理器</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://ant.design">
<img src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" width="42" />
<br />
<strong>antd</strong>
<div>react UI框架</div>
</a>
</td>
</tr>
</table>
### 动画库
<table>
<tr>
<td width="240" align="center">
<a target="_blank" href="https://airbnb.io/lottie/#/README">
<img src="https://airbnb.io/lottie/images/logo.webp" width="42" />
<br />
<strong>Bodymovin</strong>
<div>UI动画生成库</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://matthew.wagerfield.com/parallax/">
<img src="http://matthew.wagerfield.com/parallax/favicon.png" width="42" />
<br />
<strong>parallaxJs</strong>
<div>视差动画库</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://dixonandmoe.com/rellax/">
<img src="http://matthew.wagerfield.com/parallax/favicon.png" width="42" />
<br />
<strong>rellaxJs</strong>
<div>mini 视差动画库</div>
</a>
</td>
</tr>
<tr>
<td width="240" align="center">
<a target="_blank" href="https://svgjs.dev/docs/3.0/">
<img src="https://svgjs.dev/docs/3.0/assets/images/logo-svg-js-01d-128.png" width="42" />
<br />
<strong>SvgJs</strong>
<div>svg工具库</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://mojs.github.io/">
<img src="https://mojs.github.io/assets/img/logo.svg" width="42" />
<br />
<strong>MoJs</strong>
<div>motion动画库</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://zzz.dog/">
<img src="https://zzz.dog/img/solids.png" width="42" />
<br />
<strong>zdogJs</strong>
<div>伪3D引擎库</div>
</a>
</td>
</tr>
</table>
### React 方向
<table>
<tr>
<td width="240" align="center">
<a target="_blank" href="https://antv.vision/zh">
<img src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" width="42" />
<br />
<strong>antv</strong>
<div>react 数据可视化方案</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://nicecoders.github.io/">
<img src="http://jzx-h5.oss-cn-hangzhou.aliyuncs.com/logo.png" width="42" />
<br />
<strong>NiceCode</strong>
<div>聚合工具库</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://ant.design">
<img src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" width="42" />
<br />
<strong>antd</strong>
<div>react UI框架</div>
</a>
</td>
</tr>
<tr>
<td width="240" align="center">
<a target="_blank" href="https://ahooks.js.org/">
<img src="https://ahooks.js.org/logo.svg" />
<br />
<strong>ahooks</strong>
<div>react hook 拓展库</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://mobile.ant.design/index-cn">
<img src="https://zos.alipayobjects.com/rmsportal/wIjMDnsrDoPPcIV.png" width="42" />
<br />
<strong>ant-mobile</strong>
<div>react 移动端UI框架</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://motion.ant.design/index-cn">
<img src="https://zos.alipayobjects.com/rmsportal/TOXWfHIUGHvZIyb.svg" width="42" />
<br />
<strong>ant-motion</strong>
<div>react 动效库</div>
</a>
</td>
</tr>
<tr>
<td width="160" align="center">
<a target="_blank" href="https://qiankun.umijs.org/">
<img src="https://gw.alipayobjects.com/zos/bmw-prod/8a74c1d3-16f3-4719-be63-15e467a68a24/km0cv8vn_w500_h500.png" width="42" />
<br />
<strong>qiankun</strong>
<div>微应用框架</div>
</a>
</td>
<td width="160" align="center">
<a target="_blank" href="https://umijs.org">
<img src="https://gw.alipayobjects.com/zos/bmw-prod/598d14af-4f1c-497d-b579-5ac42cd4dd1f/k7bjua9c_w132_h130.png" width="42" />
<br />
<strong>UmiJS</strong>
<div>react 企业级应用框架</div>
</a>
</td>
</tr>
<tr>
<td width="240" align="center">
<a target="_blank" href="https://scaffold.ant.design">
<img src="https://zos.alipayobjects.com/rmsportal/HXZvKsbcQljpFToWbjPj.svg" width="42" />
<br />
<strong>scaffold</strong>
<div>脚手架市场</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://nextjs.org/">
<img src="https://nextjs.org/static/favicon/safari-pinned-tab.svg" width="42" />
<br />
<strong>NextJs</strong>
<div>服务端渲染方案</div>
</a>
</td>
</tr>
</table>
### Vue 方向
<table>
<tr>
<td width="240" align="center">
<a target="_blank" href="https://cn.vuejs.org/">
<img src="https://cn.vuejs.org/images/logo.svg" width="42" />
<br />
<strong>vue</strong>
<div>渐进式框架</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://www.iviewui.com/">
<img src="https://file.iviewui.com/dist/d6fcbeecd3f5ff1b1dd0a0f68bdf6ce7.svg" width="42" />
<br />
<strong>IView</strong>
<div>vue UI框架</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://zh.nuxtjs.org/">
<img src="https://zh.nuxtjs.org/_nuxt/icons/icon_512x512.c20795.png" width="42" />
<br />
<strong>Nuxt</strong>
<div>vue 服务端渲染方案</div>
</a>
</td>
</tr>
</table>
### Node 方向
<table>
<tr>
<td width="240" align="center">
<a target="_blank" href="https://antv.vision/zh">
<img src="https://gw.alicdn.com/tfs/TB1eGsrk79l0K4jSZFKXXXFjpXa-347-340.png" width="42" />
<br />
<strong>midway</strong>
<div>企业级 node 框架</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://cnodejs.org/">
<img src="https://static2.cnodejs.org/public/images/cnode_icon_64.png" width="42" />
<br />
<strong>CNode</strong>
<div>Node.js 开源技术社区</div>
</a>
</td>
<td width="240" align="center">
<a target="_blank" href="https://www.koajs.com.cn/">
<img src="https://tva1.sinaimg.cn/large/008i3skNly1gu7waxo9bxj60jk09s3ym02.jpg" width="42" />
<br />
<strong>Koa</strong>
<div>Node 开发框架</div>
</a>
</td>
</tr>
</table>