- 博客(74)
- 收藏
- 关注
RSS订阅原创 React useReducer 终极使用教程
到这里 useReducer 的使用场景和用法例子讲解都已经介绍完成了，最后我们回顾一下，首先类比于redux的reducer，useReducer 的思路和redux一样，不同点是在于useReducer 最终操作的对象是state。在使用上，就拿最简单的button组件为例子，点击的时候触发dispatch，根据type修改state。复杂一点的，可以结合useContext使用，满足多个组件共享state的情况。...
2022-08-31 17:40:10
1072
3
原创 React Table 表格组件使用教程 排序、分页、搜索过滤筛选功能实战开发
在日常开发中，特别是内部使用的后台系统时，我们常常会需要用表格来展示数据，同时提供一些操作用于操作表格内的数据。简单的表格直接用原生 HTML table 就好，但如果要在 React 中实现一个功能丰富的表格，其实是非常不容易的。在本站之前的文章《最好的 6 个 React Table 组件详细亲测推荐》 中有提到过 react-table 这个库，如果对这个库不太了解的同学可以先了解一下，这里不再赘述。简而言之，react-table 是一个非常强大的库，它与常见的表格组件不同，它不负责渲染 HTML
2022-07-12 17:25:40
6863
原创 后端实战手把手教你写文件上传接口：如何使用 Node.js + MongoDB 开发 RESTful API 接口（Node.js + Express + MongoDB）
本教程手把手教你搭建一套后端文件上传 API 接口，它使用 Node.js + Express + MongoDB 构建的后端服务。本文详细描述通过 Node.js 与数据库通讯。整个服务搭建起来后，我们使用 Postman 对整个后端服务进行测试。本教程每段代码我都亲手测过，保证百分百没有错误，请打开你的 terminal 跟随本教程一起操作，从这里开始，成为一名后端工程师。...
2022-07-12 16:56:29
1810
原创 后端实战教程:如何使用 Node.js 开发 RESTful API 接口（Node.js + Express + Sequelize + MySQL）
本教程手把手教你搭建一套使用 Node.js + Express + Sequelize + MySQL 构建的后端服务，详细描述通过 Node.js 与数据库通讯。整个服务搭建起来后，我们使用 Postman 对整个后端服务进行测试。本教程每段代码我都亲手测过，保证百分百没有错误，请打开你的 terminal 跟随本教程一起操作，从这里开始，成为一名后端工程师。全栈实战教程：后端实战教程：使用 Node.js + MySQL 开发 RESTful API 接口（Node.js + Express + Se
2022-07-11 19:33:00
2889
2
原创 React + Node.js 全栈实战教程 - 手把手教你搭建「文件上传」管理后台
本教程手把手带领大家搭建一套通过 React + Node.js + Mongodb 上传文件的后台系统，只要你跟随本教程一步步走，一定能很好的理解整个前后端上传文件的代码逻辑。前端我们使用 Reactjs + Axios 来搭建前端上传文件应用，后端我们使用 Node.js + Express + Multer + Mongodb 来搭建后端上传文件处理应用。当然，本教程还会教给大家如何写一个可以限制上传文件大小、有百分比进度条、可报错、可显示服务器上文件列表、可点击下载文件的前端操作界面。最后完成的上传
2022-07-11 16:57:56
1560
原创 在 Vue3 + Element Plus 中生成动态表格，动态修改表格，多级表头，合并单元格
在 Vue 中，表格组件是使用频率及复杂度排名第一的组件，前端经常需要根据后台返回的数据动态渲染表格，比如动态表格如何生成，因为表格的列并不是固定的，在未知表格具体有哪些列的场景下，前端如何动态渲染表格数据。又或者需要把表格单元格进行合并处理，比如第一列是日期，需要把相同的日期进行合并，这样表格看起来会更加清晰。 本文手把手教你如何在 Vue3 + Element Plus 中创建表格、生成动态表格、创建动态多级表头、表格行合并、列合并等问题。如果你正在搭建后台管理工具，又不想处理前端问题，推荐使用卡拉云
2022-06-08 20:49:01
15942
4
原创 最好用的 6 个 React Tree select 树形组件测评与推荐
React 树形选择器（React tree select）组件在搭建 React 的 app 中特别常用，React tree select 除了简单的树形结构外，还有非常多样的功能来配合不同场景的使用。比如搜索过滤，前端添加删除树枝，前端编辑修改子树名，拖拽排序，对用户操作事件记录等。本文记录了我自己使用多年最好用的 6 款 React tree select 组件，每一款都经过我实际测试，推荐给大家。...
2022-06-06 15:39:46
3378
1
原创 5款 React 实时消息提示通知(Message/Notification)组件推荐与测评
React 消息提示通知组件（Message / Notification）是我们日常开发中经常使用的组件，它可用作与用户交互的反馈提示，信息提交成功、错误、操作警告等场景使用。原生JavaScript 提供了alert、prompt、confirm 等方法，这三个方法的不支持定制化，使用场景严重受限，特别是 alert 在浏览器外弹窗，体验非常糟糕。因此要想给用户提供良好的使用体验，我们需要封装一个定制化较好的 React 消息提示组件，这种组件看似简单，但也存在非常多深坑要小心，例如遮罩层、消失时间、点
2022-06-04 09:58:08
3804
原创 顶级好用的 React 表单设计生成器，可拖拽生成表单
React 前端开发中，表单组件是排在前三的高频使用的组件，如何快速构建表单，节省力气，避免重复造轮子呢，选择一款适合自己的前端表单设计生成器就非常重要了。本文介绍 3 款顶级好用的 React 表单设计器，其中最后一款卡拉云，是新一代低代码开发工具，不仅能自动生成各类表单，还可以拖拽生成其他常见的前端组件，一行代码连接前后端数据，可快速接入数据库/api。它是表单设计器的超集，可直接生成属于你的后台管理工具，无敌好用。......
2022-06-01 16:36:00
1079
原创 最好用的 6 款 Vue 实时消息提示通知(Message/Notification)组件推荐与测评
Vue 消息提示通知组件（Message / Notification）是我们日常开发中经常使用的组件，它可用作与用户交互的反馈提示，信息提交成功、错误、操作警告等场景使用。原生 JavaScript 提供了 alert、prompt、confirm 等方法，这三个方法的不支持定制化，使用场景严重受限，特别是 alert 在浏览器外弹窗，体验非常糟糕。因此要想给用户提供良好的使用体验，我们需要封装一个定制化较好的 Vue 消息提示组件，这种组件看似简单，但也存在非常多深坑要小心，例如遮罩层、消失时间、点击
2022-05-30 17:56:18
12996
原创 Vue3 Typescript + Axios 全栈开发教程：手把手教你写「待办清单」APP
本文完整版：《Vue3 Typescript + Axios 全栈开发教程：手把手教你写「待办清单」APP》Vue3 Typescript + Axios 全栈开发教程前端 Vue3 Typescript 项目结构安装 Vue3 ，使用 npm 安装 Vue接着我们创建一个 Vue 的项目，运行命令：处理前端问题太麻烦？「新增 ToDo 组件」 - AddTodo.vue「ToDO 列表组件」 - TodoList.vue「 ToDo 内容更新组件」 - Todo.vueVue3 的源码使用 Type.
2022-05-30 17:19:38
1547
原创 React 实现 PDF 文件在线预览 - 手把手教你写 React PDF 预览功能
在 React 项目中，很多场景都需要 PDF 文件预览功能，比如合同 ERP，销售CRM，内部文档 CMS 管理系统，都需要内置 PDF 文件在线预览功能。本文手把手教你搭建一套 PDF 预览组件嵌入到 React 项目中，实现 PDF 文件预览的所有常见功能。跟随本教程学习完成后，你会搭出以下 PDF 在线预览效果的 React PDF 预览组件
2022-05-30 16:27:38
4904
2
原创 Vue3 TypeScript 使用教程 - 实战 Vue3 element-plus 开发「待办清单」
Vue3 的源码使用 TypeScript 全部重构，而 TypeScript 是 JS 的一个超集，主要提供对 ES6 的支持以及更棒的代码可读性和高维护性。可以说 Vue3 Typescript 已经成为开发标配。本文带领大家从搭建环境开始，手把手带领大家用 Vue3 Typescript + element-plus 开发一个极简「待办清单」app，在实战中学习 Vue3 TypeScript。如果你正在搭建后台管理工具，又不想处理前端问题，推荐使用卡拉云 ，卡拉云是新一代低代码开发工具，可一键接入常
2022-05-27 17:23:39
2137
原创 React Echarts 使用教程 - 如何在 React 中加入图表（内附数据看板实战搭建案例）
Ehcarts 作为数据展示的组件，应用场景丰富，所以在 React 里引入 Echarts 图表是每个前端必会技能。而 Echarts配置项多且复杂，每个配置项都会细分很多个配置小项，并且还对外暴露了一套 API，包括图表实例，事件监听等，还是有一定的上手难度。本文手把手教大家如何在 React 里使用 Echarts，并结合实际使用场景，分享我是如何处理图表自适应等具体问题。 最后来一个实战教学，教大家如何结合 ant-design React UI 框架，开发企业级的「数字币走势数据看板」，帮助大家加
2022-05-27 15:56:59
4379
原创 7 款最棒的 React 移动端 UI 组件库 - 特别针对国内使用场景推荐
优秀的 React UI 移动端组件库和模版框架，帮我们节省开发时间，提高开发效率，统一设计语言。更棒的是内置的功能复杂，我们自己很难处理的常用组件，比如表格、表单、富文本编辑器、时间日期选择器、实时拖拽组件等，再进一步，还有帮我们把组件的轮子装好的 React admin 后台管理系统。本文推荐 7 款适用于中文使用者习惯的开源 React 移动端 UI 库，特别针对国内使用场景推荐。
2022-05-25 16:49:11
17136
2
原创 7 款最棒的开源 React UI 组件库和模版框架测评 - 特别针对国内使用场景推荐
优秀的 React UI 组件库，帮我们节省开发时间，提高开发效率，统一设计语言。更棒的是内置的功能复杂，我们自己很难处理的常用组件，比如表格、表单、富文本编辑器、时间日期选择器、实时拖拽组件等，再进一步，还有帮我们把组件的轮子装好的 React admin 后台管理系统。本文推荐 7 款适用于中文使用者习惯的开源 React UI 库，特别针对国内使用场景推荐。.........
2022-05-24 16:57:42
3263
原创 多款顶级好用的 Vue 表单设计器测评推荐，可拖拽生成表单
Vue 前端开发中，表单组件是排在前三的高频使用的组件，如何快速构建表单，节省力气，避免重复造轮子呢，选择一款适合自己的前端表单设计器就非常重要了。本文介绍 4 款顶级好用的 Vue 表单设计器，其中最后一款卡拉云，是新一代低代码开发工具，不仅能自动生成各类表单，还可以拖拽生成其他常见的前端组件，一行代码连接前后端数据，可快速接入数据库/api。它是表单设计器的超集，可直接生成属于你的后台管理工具，无敌好用。
2022-05-23 16:25:38
12799
原创 最好用的 8 款 React Datepicker 时间日期选择器测评推荐
React 时间日期选择器（date-timepicker）组件,与表单、富文本、表格、拖拽等组件一样，是大家用 React 搭建项目时使用最频繁的组件之一。React DateTimePicker 除了基础选择日期时间外，还有非常多样的功能配合不同场景使用，比如 12/24小时，禁止选择某些日期，高亮某些日期，夜间模式，多语言，酒店订单的特别场景等。本文记录了我自己使用多年最好用的 8 款 React DateTimePicker 组件，每一款都经过我实际测试，推荐给大家。
2022-05-22 20:21:59
8458
原创 Vite 与 Vue Cli 对比 - 尤雨溪: Vite 会取代 vue-cli 吗？
尤雨溪在发布 Vite 之后写了一条推，感觉不会在用 webpack 了（Vue-cli 基于 Webpack 开发，并配置了 Webpack 打包规则），Sean 是 Webpack 核心开发者，会一些中文，在尤大这条下面直接感叹。Vue-cli 一直是 Vue 2 默认官方脚手架工具，Vue-cli 基于 Webpack 开发。Vue 3 发布后，尤大同时发布了 Vite ，那么 Vue 3 同时有两个前端打包工具 Vite 和 Vue CLI，那么他们俩应该怎么选呢？
2022-05-20 21:59:29
21288
1
原创 最好用的 6 款 MongoDB GUI 管理工具横向测评 - 免费和付费到底怎么选?
MongoDB 是一个面向文档的 NoSQL 数据库，全球有四分之一的开发者不同程度的使用过 MongoDB。虽然官方在 MongoDB 里内嵌了 Mongo Shell 命令行，但对数据库稍微频繁点的操作，来回敲代码，复制粘贴也挺抓狂的。
2022-05-09 09:41:23
10697
原创 Vue + Node.js 搭建「文件上传」管理后台
本教程手把手带领大家搭建一套通过 Vue + Node.js 上传文件的后台系统，只要你跟随本教程一步步走，一定能很好的理解整个前后端上传文件的代码逻辑。前端我们使用 Vue + Axios + Multipart 来搭建前端上传文件应用，后端我们使用 Node.js + Express + Multer 来搭建后端上传文件处理应用。当然，本教程还会教给大家如何写一个可以限制上传文件大小、有百分比进度条、可报错、可显示服务器上文件列表、可点击下载文件的前端操作界面。最后完成的上传文件工具后台如下图，跟.
2022-04-22 14:26:21
1288
原创 5 款最棒的 Vue 移动端 UI 组件库 - 特别针对国内使用场景推荐
在 Vue 3 正式版发布一段时间后，各大组件库、框架纷纷对 Vue 3 做了支持和优化，特别是 Vue 移动端组件库，有了跨越式的升级。几家头部大厂也全面拥抱 Vue 3 ，陆续发布了支持 Vue 3 的移动端 UI 组件库，非常值得安利一波。本文筛选了国内常用的 Vue 移动端 UI 组件库，选出了 5 款来自国内互联网一线大厂或是商业化较好的企业 / 个人长期维护的免费移动端 UI 库分享给大家。
2022-04-20 12:17:05
35223
2
原创 Retool 是什么，怎么样？Retool 低代码开发工具测评
Retool 是面向企业的低代码开发平台。使用 Retool 可快速搭建后台管理工具，比如快速构建admin 后台管理、销售 ERP、客户 CRM、数据分析看板、amazon 云端文件上传管理等基于数据库或 API 的企业工具。新事物刚出现，没亲身体验前，总是很难理解。我们总会把新事物与我们已认知的东西来做对比，有人说 Retool 是帮你配置好的 Vue & React 、是可视化拖拽编程平台、是在线前端生成器（并不是）。这些说法都只描述了 Retool 很小的一个点，Retool 是新一代低代码开.
2022-04-11 21:51:06
4870
原创 使用和风天气 API 10分钟搭建天气预报数据看板
和风天气 API 是免费天气 API 中最好用的之一，我曾在《最好用的免费天气 API 接口测评》文章里测评了多款天气 API，和风天气在其中是性价比最高的，不仅非商业无限免费，而且免费和付费几乎同权，甚至未来七天天气预测、空气质量、天文气象这种在其他 API 中付费的选项，在和风天气里也是免费的。
2022-04-11 01:31:11
2387
1
原创 ECharts 饼图颜色设置教程 - 4 种方式设置饼图颜色
ECharts 饼状图中的每个扇形颜色其实都可以自定义或者随机显示颜色。比如 X 轴是各销售渠道名，那么你可以需要使用全局统一的识别色彩，那么就需要指定每个扇面的颜色。本文讲解 4 种配置修改 ECharts 饼图颜色的方法。
2022-04-10 13:56:15
28195
1
原创 订单管理系统(OMS)搭建实战 - 低代码拖拽定制订单管理系统
订单管理系统是很多公司，特别是电商公司最常用的内部系统之一。订单管理系统的使用者通常是仓管或者运营人员，它常被用于管理用户订单，比如添加或者修改一条发货记录，与快递 API 集成以便自动更新订单号等场景。
2022-04-09 02:37:08
2400
原创 Element Plus for Vue 3 入门教程
Element Plus 是为了适配 Vue 3 对 Element UI 进行的重构。Vue 3.0 的这次大版本升级，对于第三方组件库来说是一件好事，那些已经修修补补无数次，还无法彻底解决的问题，在这次面向 Vue 3.0 重构时，一次性全部解决。
2022-04-07 12:31:41
3167
原创 Element Plus 和 Ant Design Vue 对比测评，哪个更好？
Vue 3 发布后，各家第三方库开始陆续重构并支持 Vue 3 ，国内两大知名框架 Element Plus 和 Ant Design Vue 也相续发布新版支持 Vue 3。到底应该怎么选择呢？本文从多个纬度对两个框架进行对比和测评。
2022-04-07 12:04:25
18765
原创 Vue DevTools 使用指南 - 如何安装和使用 Vue DevTools 调试 Vue 组件
Vue Devtools 是 Vue 官方发布的调试浏览器插件，可以安装在 Chrome 和 Firefox 等浏览器上，直接内嵌在开发者工具中，使用体验流畅。Vue Devtools 由 Vue.js 核心团队成员 Guillaume Chau 和 Evan You 开发。
2022-04-02 03:38:22
21484
3
原创 Echarts 折线图完全配置指南 - 手把手教你设置 Echarts 折线图详细教程
本文首发：《Echarts 折线图完全配置指南》Echarts 折线图是图表中最常用的显示形式之一。使用 Echarts 做出基本的折线图很简单，但要是想把多组数据放在一张图表中，展示的漂亮又直观就不容易了。本文将带领大家从最基本的折线图，一步步完善，最终做出可读性很高的可视化图表。根据本教程在卡拉云中搭建的折线图 Demo，你可以立即注册卡拉云，跟随本教程学习跟随本教程你将学到1.折线外观属性折线增加弧线平滑过渡折线图变为散状圆点实线改为虚线折线指定颜色增加数据显示表格外观属.
2022-03-29 03:26:14
15941
原创 Video.js 使用教程 - 手把手教你基于 Vue 搭建 HTML 5 视频播放器
Video.js 是最强大的网页嵌入式 HTML 5 视频播放器的组件库之一，也是大多数人首选的网页视频播放解决方案。复杂的网页视频渲染，在引入 Video.js 后，轻松解决。本教程手把手教你搭建一套基于 Vue 的 Video.js 视频播放页。跟随本教程学习，最终你可以自己搭建一套可以播放本地视频文件及网络流媒体的网页视频播放器。学习如何修改 video.js 的默认样式来实现播放按钮自定义形状(圆形)、居中及播放时间的显示与否， 如何播放 m3u8 格式，以及如何使用 video 的属性、事件及
2022-03-29 03:09:23
41692
2
原创 React Router 6 (React路由) 最详细教程
**React Router** 经历多个版本的发展，现在已经到了 **React Router 6**。虽然网络上写 React-Router 路由本身的教程很多，但真正讲到 React-Router 6 的并不多。同时因为第 6 版引入了很多新的概念，以及大量使用 Hook，因此网上的很多旧教程已经不实用了。
2022-03-29 02:27:13
9927
4
原创 最好的 6 个 React Table 组件详细亲测推荐
在日常开发中，特别是内部使用的后台系统时，我们常常会需要用表格来展示数据，同时提供一些操作用于操作表格内的数据。简单的表格直接用原生 HTML table 就好，但如果要在 React 中实现一个功能丰富的表格，其实是非常不容易的。
2022-03-22 01:39:46
8376
原创 最好的 6 款 React 后台管理系统模板和框架
React admin框架繁多，在本文里我们介绍 React 下最好的 6 款后台系统，每款均严格测试后，整理它们的优缺点方便你来挑选。同时我们给出一些实用建议，帮你避免选型时不注意可能导致的埋坑。
2022-03-21 10:07:05
18127
原创 手把手教你用 Vue 搭建带预览的「上传图片」管理后台
手把手教你开发带预览的 Vue 图片上传组件，即图片上传管理后台。只要你跟本教程一步一步走，最终能很好的理解整个前后端传图的工程逻辑。前端我们使用 Vue + Axios + Multipart 来搭建前端上传图片应用，后端我们使用 Node.js + Express + Multer 来搭建后端上传图片的后端处理。
2022-03-21 09:40:39
2177
2
原创 7 种最棒的 Vue Loading 加载动画组件测评与推荐 - 穷尽市面上所有加载动画效果（Vue loader）类型
Vue Loading 加载动画组件 (Vue-loader) 看起来很简单不重要，实际上它是保证用户留存的关键一环。选择好 Loading 加载动画，用户留存率翻倍。本文介绍 7 种不同的加载动画 UI 效果（Vue loader），每一种都有其对应的使用场景。举例，旋转加载动画适合短时间加载，旋转加载还能更细分，比如在按钮上的旋转加载，适合提交数据的极短时间，旋转动画在全局的适合多表格数据加载，旋转动画图片可自定义的适合高度定制化的 APP / 网站等。再举例，进度条类的加载动画适合长时间加载，进度
2022-03-16 23:49:15
8162
原创 最棒的 7 个 Laravel admin 后台管理系统推荐 - 卡拉云
Laravel 已经凭借自己的易用性及低门槛成为 github 上 stars 第一的 PHP 框架，本文将介绍我精心为大家挑选出来的 Laravel admin 后台管理系统，从抽象程度最低（灵活但代码量大）到抽象程度最高（代码量小但不灵活）来帮助大家选择合适自己的 Laravel admin 后台管理系统。...
2022-03-16 23:30:54
10646
原创 如何在 Vue 中使用 Chart.js - 手把手教你搭可视化数据图表
很多 Vue 项目中都需要 PDF 文件预览功能，比如合同 ERP，销售CRM，内部文档CMS管理系统，内置 PDF 文件在线预览功能。本文手把手教你搭建一套 PDF 预览组件嵌入到 Vue 项目中，实现 PDF 文件在线预览等 PDF 预览的所有常见功能。
2022-03-08 00:01:45
1590
原创 appsmith 怎么用？评价如何
AppSmith 是印度一家创业公司开发的低代码开发工具，它的原型是另一家名叫 Retool 的美国的创业公司。AppSmith 从 2019 年开始开发，到现在已经发行了 1.x 版本，也就是处于正式发行状态。那么 Appsmith 到底怎么样？它的评价如何？对比卡拉云它有哪些优缺点呢？
2022-03-07 23:29:22
1600
原创 React Draggable 实现拖拽 - 最详细中文教程 - 卡拉云
React Draggable 是 react 生态中，最好用的拖拽实现库之一。如果你的应用中需要实现拖拽功能，可以尝试用[react-draggable](https://github.com/react-grid-layout/react-draggable)，它可以满足多数情况下的拖拽需求，比如一个弹出设置浮窗，可以相互遮挡的容器之类。在所有 react 拖拽库里(即 react dnd, drag and drop)，react-draggable 算是把功能性和易用性平衡得最好的拖拽库了。
2022-03-07 23:08:05
12900
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人