首页
学习
活动
专区
圈层
工具
发布

自用后台的快速开发

前言 工作中,很多自己维护的系统需要开发后台管理系统,这类系统大多在内网使用,进行简单的数据CURD,虽然不一定是重要的项目,但是有一套管理后台,避免以后的维护过程中一直操作SQL,对于提高运维效率,减少维护过程中发生故障也是很有用的...在近1年的日志系统后台开发过程中,尝试过几个管理后台的开发,使用同样的技术,快速搭建,快速开发,感觉挺好用的,于是将这些内容分享出来,希望对大家有所帮助。...如果文章中有出现纰漏、错误之处,还请看到的小伙伴多多指教,先行谢过~ 项目简介 前端:react-admin 后端:ThinkPHP (一)前端:react-admin react-admin 是由...image.png image.png 在react-admin的线上预览环境中,可以找到自己想要的大部分控件和功能,于是决定选择这个框架,下载回来,然后按照步骤自己搭建,顺利的跑起来就成功了一半。...REST风格的后端框架,一找一大堆,简单列举几个: SlwRest maven+SpringMVC gorest thinkphp 可以说各类语言都有,我们选择后端框架,除了考虑可以轻松实现restful

1.6K40

基于 React + Umijs + Nest 全栈开发的后台系统

系统功能设计 动态国际化语言配置 记录登录用户的 CURD 操作日志 用户和角色权限的一对一映射,根据角色关联的菜单权限生成动态路由菜单 登录用户发布消息公告,后端使用 SSE 推送,可登录多个用户查看效果...(Mysql版本为8.x) Redis 项目运行 1、 安装 Mysql 并导入 /mysql/xmw_admin.sql 文件,修改 /Xmw_server/.development.env 文件中的数据库配置...2、 拉取项目代码 git clone https://github.com/baiwumm/react-admin.git cd react-admin // 进入前端 cd Xmw_web //...在菜单 系统管理-菜单管理 中按照规则添加菜单,可打开多个标签页参考,路由配置参考:路由 在菜单 系统管理-角色管理 中编辑状态中勾选相应的菜单,保存刷新页面,即可看到路由菜单生效 功能模块 - 登录...技术文档 - React文档 - Nest文档 - And-design文档 - Umi文档 - 系统设置 - 用户管理 - 菜单管理 - 角色管理 - 国际化 - 操作日志

61700
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    React 我爱你,但你太让我失望了

    在一些极端情况下,这两种方法都有缺点和 Bug 。但为什么我一开始就要做出选择呢? “推荐的”方式,控制组件,是超级冗长的。...但实际上我还要做默认值、验证、依赖输入和错误消息处理等操作,还需要写大量代码,我不得不借助一些第三方表单框架,但这些框架也都有各自的缺点。...飘忽不定的 (use) Effect 说到 useEffect,我个人对它有一些意见。我承认这是一个优雅的创新,它在一个统一的 API 中涵盖了挂载、卸载和更新事件,但这也能算进步吗?...https://marmelab.com/react-admin/ 所以我理解你们面临的困难,以及你们必须做出的权衡。你的工作不容易,你可能正在解决很多我都不知道的问题。...在 react-admin 中,我引入了一些 API,免去了与你直接打交道的麻烦。当人们抱怨 react-admin 的时候,我会尽我所能解决他们的问题 — 但大多数时候,他们对你都有意见。

    1.5K20

    你不知道的33个令人惊艳的React开发库

    在今天的文章中,将介绍每个 React 开发人员都应该熟悉的 33 个令人惊叹的 React 库。而且是由其他开发人员经过良好测试和维护的令人惊叹的 React 库。...从 Material UI(我们完全加载的组件库)开始,或者将您自己的设计系统引入我们的生产就绪组件中。...react-virtual image.png 仅在 TS/JS、React、Vue、Solid 和 Svelte 中以 60FPS 的速度虚拟化大量可滚动元素中的可见 DOM 节点,同时保留对标记和样式的...比以往更快地构建功能齐全、可访问的 Web 应用程序 – Mantine 包括 100 多个可定制组件和 40 个挂钩,可满足您在任何情况下的需求 react-leaflet image.png 支持地图的...React components for Leaflet maps react-admin image.png React-admin 提供最佳的开发人员体验,让您专注于业务需求并构建令人愉悦的用户界面

    2.6K20

    独立开发者必备的29个开源React后台管理模板

    它为用户提供250多个页面模板,并附有65多个现成的UI元素。...每个页面都有自己的模块,因此完整的模板是100%模块化的,只需生成带有反应的组件,就可以轻松添加新页面。除此之外,我们还使用了最新的reactstrap版本来提供灵活快捷的布局方式。...它配备了3种不同的布局,8个导航栏,顶部导航和左侧边栏颜色样式,100多个页面,每个布局中的500多个小部件和组件,以及许多小部件和定制的可重复使用组件,以帮助您使用下一个React应用程序。...Roe提供了非常简单的主题配置和开发人员友好的布局。该代码超级容易理解,并附带一个入门工具包,这将有助于开发人员快速入门。该模板在每个设备和每个现代浏览器上都完全响应和干净。...React-admin 一个前端框架,用于使用 ES6、React 和 Material Design 构建在 REST/GraphQL API 之上的浏览器中运行的数据驱动应用程序。

    11.4K10

    在ES API中求值表达式?ES 脚本介绍

    针对上述等一系列问题,都可以通过ES脚本来解决,其允许用户在一些特定的API中对自定义表达式进行求值。...通常情况下,在API中使用脚本时会需要访问文档中的一些字段或特殊的变量。..._index : 访问文档的 meta-fields 其他字段或变量的访问见: update context 查询和聚合脚本 除了每次搜索命中执行一次的脚本字段(script fields)之外,搜索和聚合中使用的脚本将针对可能与查询或聚合匹配的每个文档执行一次..._source访问字段值比doc-values慢得多,原因在于:它是针对每个结果返回多个字段进行了优化,而doc-values则针对访问许多文档中特定字段的值进行了优化。...每个上下文对应于一个或多个能使用脚本的ES API,都有相应的可用作局部变量的值,详见:Painless contexts Painless API Painless对每个上下文的方法和类都有严格的白名单

    4.3K41

    有了 MySQL,为什么还要 NoSQL?

    存储的数据格式就是 JSON(或者 BSON)。JSON 格式我们都比较熟悉,比如 Rest API 请求返回的 Response 就是 JSON 格式的。...按照行来存储有以下优势: 读一行数据就能读取到多个列,只需要一次磁盘操作就能把多个列的数据读取到内存中。 写一行数据可以对多个列进行写操作,保证了行数据的原子性和一致性。...A、B、G 记录 都有这三个词的其中一种, 所以 1,2, 3,4, 5 号记录都有相关的词被命中。...1 号记录命中 2 次, A、B 中都有 ( 命中 2 次 ) ,而且 1 号记录有 2 个词,相关性得分:2 次/2 个词=1 2 号记录命中 2 个词 A、B 中的都有 ( 命中 2 次 ) ,而且...2 号记录有 2 个词,相关性得分:2 次/3 个词= 0.67 3 号记录命中 2 个词 A、B 中的都有 ( 命中 2 次 ) ,而且 3 号记录有 2 个词,相关性得分:2 次/3 个词= 0.67

    6.9K22

    三藏一面:为什么要用 NoSQL

    存储的数据格式就是 JSON(或者 BSON)。JSON 格式我们都比较熟悉,比如 Rest API 请求返回的 Response 就是 JSON 格式的。...按照行来存储有以下优势: 读一行数据就能读取到多个列,只需要一次磁盘操作就能把多个列的数据读取到内存中。 写一行数据可以对多个列进行写操作,保证了行数据的原子性和一致性。..., 所以 1,2, 3,4, 5 号记录都有相关的词被命中。...1 号记录命中 2 次, A、B 中都有 ( 命中 2 次 ) ,而且 1 号记录有 2 个词,相关性得分:2 次/2 个词=1 2 号记录命中 2 个词 A、B 中的都有 ( 命中 2 次 ) ,而且...2 号记录有 2 个词,相关性得分:2 次/3 个词= 0.67 3 号记录命中 2 个词 A、B 中的都有 ( 命中 2 次 ) ,而且 3 号记录有 2 个词,相关性得分:2 次/3 个词= 0.67

    1.5K20

    命中索引一定能提高查询速度吗?

    索引的类型有很多,包括 B 树索引、哈希索引、全文索引等,每种索引都有其适用场景。 索引命中与查询性能 虽然索引可以加速查询,但命中索引并不意味着查询一定会更快。...以下是一些可能导致索引命中但查询速度依然缓慢的情况: 查询复杂性 多表查询:如果查询涉及多个表的连接、复杂的计算或子查询,即使命中索引,数据库仍然需要花费大量时间来处理这些复杂的操作。...数据量与索引选择性 这个是我项目中遇到的问题,加了索引后查询速度没有明显提升。索引的选择性是指索引中唯一值的比例。...选择性越高,索引列中的每个值代表的行数就越少。这样,数据库就可以更快地定位符合条件的行。 选择性越低,每个值代表的行数就越多,这将需要更长的时间来查找符合条件的行。...选择性越高,索引中存储的值就越少,索引就会更小,可以更快地加载到内存中,同时节省存储成本。 更新与维护成本 索引并不是免费的。每当对表进行插入、更新或删除操作时,相关的索引也需要更新。

    45810

    微服务扩展性和高可用-缓存(翻译)

    chapter=3 缓存策略 有状态的负载均衡技术需要服务提供者之间共享数据。 缓存是一种在多个消费端或服务端之间共享数据的技术,计算或获取数据都是非常昂贵的.数据存储和检索在一个子系统中。...该子系统提供对频繁访问数据副本的快速访问。 缓存是通过一个索引表实现的,其中有一个唯一键用于引用某些数据。消费者首先通过检查(命中)缓存,并从缓存中检索数据来访问数据。...如果数据不存在(缓存没有命中),则会发生更昂贵的索引操作,消费者或者子系统会将数据插入缓存。 写入策略 如果存储设备在不更新缓存的情况下更改, 则缓存可能会变成过期数据。...示例:Terracotta(https://www.terracotta.org/) 当程序员参与实现缓存API并可能实现缓存策略时,会发生显式缓存。程序必须将缓存API放入到流中才能使用它。...显式缓存系统可以同时用于多种编程语言和跨多个平台。 Memcached和Redis与每个主要的编程语言一起工作,并且与Java、.NET和本地C++应用程序一致。

    73140

    java8 Streams API 详解(上) -- 入门篇

    ,传统的并发编程往往因为其复杂性十分容易出错,但使用 streams api 则无需担心这个问题 2.2 Stream 是什么 stream 顾名思义,就是“流”,这个名字突出了集合对象流式处理的含义...版本的代码显然更加简洁和清晰,可读性、可维护性都有了显著提升,并且如果使用并发模式,Streams API 版本还会在性能上得到增强 由此可见,如果熟练掌握了 Streams API,那么在你的开发过程中...操作 在一系列 Intermediate 操作之后,一定需要一个终极操作,来对流中的数据做最终的处理,这个“终极操作”就是 Terminal 操作,它包括: forEach -- 对流中每个元素执行相同的操作...forEachOrdered -- 对流中每个元素有序地执行相同的操作 toArray -- 将流转换为数组返回 reduce -- 将流中所有数据汇总执行一个操作,返回一个值 collect --...将流中所有参数汇总为一个集合并返回 min -- 求流中数据最小值 max -- 求流中数据最大值 count -- 计算流中的数据量 anyMatch -- 有任何元素命中规则则返回 true,可以用于无限元素的流

    1.3K10

    Chromium 最新渲染引擎--RenderingNG

    「每个渲染进程只有一个主线程」,即使同一网站的多个标签或frame可能最终出现在同一进程中。然而,在各种浏览器API中执行的工作是有性能隔离的。...例如,Canvas API中图像位图和Blobs的生成在一个主线程辅助线程中运行。 同样地,「每个渲染进程只有一个合成器线程」。...一般来说,只有一个并不是问题,因为合成器线程上所有「真正昂贵的操作」都被委托给合成器工作线程或Viz进程,而且这些工作可以与输入路由、滚动或动画「并行进行」。...组件结构 在每个渲染过程主线程或合成器线程中,都有一些「逻辑组件」,它们以结构化的方式相互作用。...图片中共有四个局部框架树:两个用于站点A,一个用于站点B,一个用于站点C, ❝「每个局部框架树local frame tree都有自己的Blink渲染器组件」 ❞ 一个局部框架树的Blink渲染器可能与其他局部框架树处于同一渲染过程中

    2K10

    高并发场景缓存真的可靠吗?

    缓存提供的核心的能力是查询高性能与承受高qps,一般是纯内存(jvm缓存)或类内存(redis)操作,缓存 使用流程大概如图: ?...场景描述 在很多中小型企业,应用所用缓存平台都是自己搭建,有可能每个应用都有对应缓存服务器,但是像大的平台可能很多个应用公用缓存组件,比如阿里集团各个BU的应用基本上都接入Tair缓存: ?...抛出问题 在上边所描述的场景中,多个应用使用相同的缓存中间件,每个应用对缓存的依赖程度也各有差异,比如飞猪的量肯定没有天猫和淘宝大,那么缓存的QPS也必定没有两者高,站在缓存服务端的角度来看,我虽然是一个大的缓存集群...,但是也并不意味着每个接入的应用拥有无限QPS访问和无限的带宽,那么再反过来站在应用端角度来思考,如果 我介入了一个缓存集群,但是缓存的QPS和带宽都有上限,那么当我应用的并发量足够大的时候,QPS或者带宽超过限制的时候...在此处输入标题 在互联网大环境中,很多复杂的场景并不能单纯的依靠一种手段来做到尽善尽美,有时候几种技术实现融合到一起能够更好地解决问题,对于本篇所讲述的高并发场景下,单纯的依靠缓存来解决高QPS

    1.4K30

    Go 语言内存管理(一):系统内存管理

    内存命中率 你可能已经发现,上述的访问步骤中,从第 4 步开始都是些很繁琐的操作,频繁的执行对性能影响很大。毕竟访问磁盘是非常慢的,它会引发程序性能的急剧下降。...假设在 n 次内存访问中,出现命中的次数是 m,那么 m / n * 100% 就表示命中率,这是衡量内存管理程序好坏的一个很重要的指标。...CPU Cache 的出现就是为了解决这个问题,在 CPU 和 主存之间再加了 Cache,用来缓存一块内存中的数据,而且还不只一个,现代计算机一般都有 3 级 Cache,其中 L1 Cache 的访问速度和寄存器差不多...举个例子 让我们通过一个例子来验证下命中率的问题,下面的函数是循环一个数组为每个元素赋值。...现在我们知道了每个程序都有自己一套独立的地址空间可以使用,比如 0x0000 ~ 0xffff ,但我们在用高级语言,无论是 C 还是 Go 写程序的时候,很少直接使用这些地址。

    2.7K54

    一个重量级HTTP api的304优化分析与突发失效问题解决

    大小(解压后近3MB),单api如此大的数据传输对于网络带宽和传输速度都有明显的影响。...调用只需要0.1ms,*1000之后也会变成100ms,所以服务端对于每个item的normalize结果都做了一个短期的本地cache,命中缓存的情况下1000个normalize所花费的时间由100ms...return self cache混用问题的引入 近期app新增加了一个游戏模式,服务端对于该模式下的用户每次均会从一个100+item的池子中按一定策略随机选定一个返回,该item在返回前一样会调用normalize...问题出在这里:主页list item normalize与新游戏模式下item normalize使用的是同一个本地cache,出于节约拷贝开销的考虑,本地cache命中返回的其实是一个对象引用,而新模式在...时也会读到这些被额外修改过的缓存对象,同一个用户两次主页 list api请求如果读取到的1000 item中存在任意一个item受到新游戏模式修改影响就可能导致最终数据不一致--另外线上Python服务为多主机

    30710

    一起学Elasticsearch系列-索引的批量操作

    Elasticsearch 提供了 _mget 和 _bulk API 来执行批量操作,它允许你在单个 HTTP 请求中进行多个索引获取/删除/更新/创建操作。这种方法比发送大量的单个请求更有效率。...基于 mget 的批量查询 mget(multi-get) API用于批量检索多个文档。它可以通过一次请求获取多个文档的内容,并提供了一些参数来控制检索行为。...每个结果都有_source字段,其中包含了文档的实际内容。同时,还有一个found字段指示是否找到了对应的文档。...它可以通过一次请求同时处理多个操作,提高数据的写入效率。 bulk API中,请求是通过一行一行的JSON数据进行定义的。每个操作(索引、删除、更新)都需要按照特定格式写在一行中。...bulk请求可以一次性执行多个操作,提高效率,但也会增加单个请求的复杂性和长度。 下面是bulk API的请求示例、响应示例以及一些常用参数的含义。

    1K10

    如何用好缓存?全面梳理(第二篇)

    做到专业的人做专业的事。 ? 任何事情都有其两面性,将缓存从应用服务器中剥离出来。需要跨服务器走网络传输。所以分布式缓存的不足:网络传输带来的性能损耗 网络传输的损耗 ~1ms。...可能存在极低概率并发问题!一种场景。 两个线程并发写:A、B线程。变更数据库和变更缓存是两个独立的操作,而我们并没有对操作做任何的并发控制。...在调用系统的 API 读写文件的时候,并不会直接去读写磁盘上的文件,应用程序实际操作的都是 PageCache,也就是文件在内存中缓存的副本。 Kafka 的吞吐量很高,具体原因?...有 Cache 的地方就必然存在失效问题。保证数据的一致性。 ? 单一的缓存节点受到机器内存、网卡带宽和单节点请求量的限制,不能承担比较高的并发,因此我们考虑将数据分片,每个节点上存储部分数据。...在增加和删除节点时,只有少量的 Key 会“漂移”到其它节点上,大部分的 Key 命中的节点还是会保持不变。可以有效解决因扩容问题带来的大量的缓存失效。

    73520

    高性能服务器架构思路( 五 ) : 分布式缓存

    在分布式程序架构中,如果我们需要整个体系有更高的稳定性,能够对进程容灾或者动态扩容提供支持,那么最难解决的问题,就是每个进程中的内存状态。...我们希望进程在读取数据的时候,能有最高的性能,最好能和在堆内存中读写类似,又希望这些缓存数据,能被放在多个进程内,以分布式的形态提供高吞吐的服务,其中最关键的问题,就是缓存数据的同步。...其次我们需要让这个“表”能在多个进程中都存在。如果每个进程中的数据都毫无关联,那问题其实就非常简单,但是如果我们可能从A进程把数据写入缓存,然后在B进程把数据读取出来,那么就比较复杂了。...这种做法由于每次操作都需要查询租约,所以性能会稍微低一些;但如果缓存命中率不高,这种做法能把缓存的操作分担到多个进程上,而且也无需清理缓存,这比租约清理的策略适应性更好。 修改广播。...而我们每个DSN服务器,都具备了大量的其他域名的缓存数据。 总结 在高性能的服务器架构中,常用的缓存和分布两种策略,往往是结合到一起使用的。

    5.4K21

    高性能服务器架构思路(五)——分布式缓存

    在分布式程序架构中,如果我们需要整个体系有更高的稳定性,能够对进程容灾或者动态扩容提供支持,那么最难解决的问题,就是每个进程中的内存状态。...我们希望进程在读取数据的时候,能有最高的性能,最好能和在堆内存中读写类似,又希望这些缓存数据,能被放在多个进程内,以分布式的形态提供高吞吐的服务,其中最关键的问题,就是缓存数据的同步。 ?...其次我们需要让这个“表”能在多个进程中都存在。如果每个进程中的数据都毫无关联,那问题其实就非常简单,但是如果我们可能从 A 进程把数据写入缓存,然后在B进程把数据读取出来,那么就比较复杂了。...这种做法由于每次操作都需要查询租约,所以性能会稍微低一些;但如果缓存命中率不高,这种做法能把缓存的操作分担到多个进程上,而且也无需清理缓存,这比租约清理的策略适应性更好。 修改广播。...而我们每个 DNS 服务器,都具备了大量的其他域名的缓存数据。 总结 在高性能的服务器架构中,常用的缓存和分布两种策略,往往是结合到一起使用的。

    47630
    领券