是什么

LayUI MINI是基于LayUI框架开发的一套最简洁、易用的后台框架模板,它已经是一个非常完整的脚手架,有现成的页面模板可以参考甚至是直接使用。

通常来说,如果我们准备开发一套管理系统的WEB界面,一定是需要基于某个前端技术或框架来做的。实际上,可供选择的组件也比较多,比如最原始的HTML+CSS+JavaScript三件套,或者直接使用某个Bootstrap框架,如:AdminLTE,又或者是某个MVC框架,如:AngularJSVue

选择不同的框架是需要根据实际的需求而定的,不同框架实现技术不同,使用难易程度不同,适用的场景也不同。有的框架直接是一个脚手架项目,可以直接基于它就能快速地开发出业务系统的WEB界面,有的框架仅仅提供的了满足各种需求的组件,还需要开发者自己基于此搭建起不同风格的整体界面。

LayUI MINI比LayUI更易于使用的地方在于:它已经是一个现成且完整的后台管理系统框架模板,直接拿来使用即可;而LayUI本身只是提供了一些封装好的组件模块,完整的界面框架还是需要使用者根据具体需求来实现。不论如何,在涉及到具体的UI组件使用上,还是LayUI框架提供的。

由于一些未知的原因,LayUI框架的官网已经不在继续维护了,作者将LayUI完全托管于Gitee镜像在线文档地址

LayUI MINI的官网是正常运行的,详见:http://layuimini.99php.cn/

如何做

使用Lay MINI框架模板可以有2种方式:

方式一:作为独立的前端项目运行,数据通过REST接口从后端获取,需要API接口解决跨域访问问题。

方式二:如果后台管理系统是Java Web项目,可以将LayUI MINI作为静态页面部分;当然,如果是基于其他语言的Web项目,也是类似的。

上述两种使用方式都各有利弊,根据使用情况选择即可。

方式一:管理系统界面作为独立的前端项目运行

这种方式其实就是完全的前后端分离的开发模式,管理后台的数据部分由API提供,而前端界面部分独立布署,例如可以直接布署在Nginx中。

在这种模式下,由于前端和数据API部分是不能运行在相同的域名和端口的,所以前端在访问数据时会遇到跨域限制的问题,该问题需要API来解决,具体实现参考解决浏览器跨域限制方案之CORS 。这种方式的好处在于,数据与界面完全分离,互不影响。当然,与之相对应的是增加了布署工作量和复杂度。

该方式下使用LayUI MINI框架的方式非常简单,直接下载LayUI MINI的压缩包,如:layuimini-2.0.4.3-iframe.tar.gz,然后解压到指定目录,根据需要重新命名下目录名称,然后就可以开始在该框架模板的基础上开发了,根据需要创建新的页面即可。

前端开发可以使用静态服务器进行调试,参考:前端开发利器之静态服务器

方式二:作为Java Web项目的静态页面部分

此时基于LayUI MINI框架模板开发的静态页面部分,本质上使用了Servlet容器(如:Tomcat,Jetty)作为HTTP服务器。

以使用Spring Boot作为Java Web项目的开发框架为例:将LayUI MINI压缩包中解压出来的所有静态文件直接拷贝到项目目录src/main/resources/static下,启动Java Web项目,访问:http://host:post/index.html就可以访问到页面了。

这种方式最终是将静态页面跟数据代码一起打包为一个完整的可运行jar包运行,非常方便,这通常也是广大后端开发人员在基于LayUI MINI开发后台管理系统时常用的方式。

该方式是一种非常传统的Java Web项目开发模式,可使用一些模板引擎技术进行数据渲染,如:freemarker。

如果希望修改前端界面之后无需重启程序就能生效,可以通过参数spring.web.resources.static-locations指定静态资源目录即可。

总结

LayUI MINI框架完全做到了拿来即用的目标,非常简单,但是很强大,甚至比AdminLTE还更加简洁和方便。

LayUI MINI框架的基础LayUI框架,所以其中涉及的各种组件的用法直接参考LayUI框架文档即可。

【参考】

layui学习笔记

如何快速使用LayUI MINI框架的更多相关文章

  1. 快速入门系列--WebAPI--03框架你值得拥有

    接下来进入的是俺在ASP.NET学习中最重要的WebAPI部分,在现在流行的互联网场景下,WebAPI可以和HTML5.单页应用程序SPA等技术和理念很好的结合在一起.所谓ASP.NET WebAPI ...

  2. FoxOne---一个快速高效的BS框架--WEB控件属性编辑器

    FoxOne---一个快速高效的BS框架--(1) FoxOne---一个快速高效的BS框架--(2) FoxOne---一个快速高效的BS框架--(3) FoxOne---一个快速高效的BS框架-- ...

  3. FoxOne---一个快速高效的BS框架--(4)

    FoxOne---一个快速高效的BS框架--(1) FoxOne---一个快速高效的BS框架--(2) FoxOne---一个快速高效的BS框架--(3) FoxOne---一个快速高效的BS框架-- ...

  4. FoxOne---一个快速高效的BS框架--(2)

    FoxOne---一个快速高效的BS框架--(1) FoxOne---一个快速高效的BS框架--(2) FoxOne---一个快速高效的BS框架--(3) FoxOne---一个快速高效的BS框架-- ...

  5. FoxOne---一个快速高效的BS框架

    FoxOne---一个快速高效的BS框架--(1) FoxOne---一个快速高效的BS框架--(2) FoxOne---一个快速高效的BS框架--(3) FoxOne---一个快速高效的BS框架-- ...

  6. FoxOne---一个快速高效的BS框架--数据访问(Dao)

    FoxOne---一个快速高效的BS框架--(1) FoxOne---一个快速高效的BS框架--(2) FoxOne---一个快速高效的BS框架--(3) FoxOne---一个快速高效的BS框架-- ...

  7. FoxOne---一个快速高效的BS框架--生成增删改查

    FoxOne---一个快速高效的BS框架--(1) FoxOne---一个快速高效的BS框架--(2) FoxOne---一个快速高效的BS框架--(3) FoxOne---一个快速高效的BS框架-- ...

  8. 利用layui前端框架实现对不同文件夹的多文件上传

    利用layui前端框架实现对不同文件夹的多文件上传 问题场景: 普通的input标签实现多文件上传时,只能对同一个文件夹下的多个文件进行上传,如果要同时上传两个或多个文件夹下的文件,是无法实现的.这篇 ...

  9. layui前端框架

    项目中需要弹出层效果,使用了layui前端框架,主要使用了里面的弹出层特效(可以移动) html代码 要给这个标签绑定click方法 <a href='javascript:;' data-me ...

  10. 基于TILE-GX实现快速数据包处理框架-netlib实现分析【转】

    最近在研究suricata源码,在匹配模式的时候,有tilegx mpipe mode,转载下文,了解一下. 原文地址:http://blog.csdn.net/lhl_blog/article/de ...

随机推荐

  1. [转帖]Web性能优化工具WebPageTest(一)——总览与配置

    https://www.cnblogs.com/strick/p/6677836.html 网站性能优化工具大致分为两类:综合类和RUM类(实时监控用户类),WebPageTest属于综合类. Web ...

  2. vue过滤器(filter)的使用

    过滤器分全局过滤器和局部过滤器 <div id="app"> <p>电脑价格:{{price | addPriceIcon}}</p> < ...

  3. JS 逆向之 Hook,吃着火锅唱着歌,突然就被麻匪劫了!

    关注微信公众号:K哥爬虫,QQ交流群:808574309,持续分享爬虫进阶.JS/安卓逆向等技术干货! 什么是 Hook? Hook 中文译为钩子,Hook 实际上是 Windows 中提供的一种用以 ...

  4. c++ container容器(string,vector,map,queue,stack等等)

    STL和c++标准库 标准模板库STL部分包含在C++标准库中的软件库. c++标准库:即以std::开头,但是部分编译器厂商也会把STL的内容放在std:: namespace里面 由于一个常见的误 ...

  5. 从零开始配置vim(20)——模糊查询

    在讲解vim的基础功能的时候,介绍过了vim的各种查询技巧,在同一个文件中进行搜索的话,那些技巧很有用.在多个文件中我们介绍了使用vim自带的 :grep命令进行搜索,使用quickfix 列表进行跳 ...

  6. TienChin 创建菜单页面

    上一节当中我们只是给后台添加了对应的菜单,实际上对应的页面还没有存在这节主要就是创建出来页面: 促销活动: activity 统计分析: analysis 商机管理: business 渠道管理: c ...

  7. 强化学习调参技巧一: DDPG算法训练动作选择边界值_分析解决

    1.原因: 选择动作值只在-1 1之间取值 actor网络输出用tanh,将动作规范在[-1,1],然后线性变换到具体的动作范围.其次,tanh激活区是有范围的,你的预激活变量(输入tanh的)范围太 ...

  8. 【一】tensorflow【cpu/gpu、cuda、cudnn】全网最详细安装、常用python镜像源、tensorflow 深度学习强化学习教学

    相关文章: [一]tensorflow安装.常用python镜像源.tensorflow 深度学习强化学习教学 [二]tensorflow调试报错.tensorflow 深度学习强化学习教学 [三]t ...

  9. LyScript 批量搜索反汇编特征

    LyScript 插件实现对特定汇编指令片段的批量搜索功能,用户传入一个汇编指令列表,然后循环搜索该列表内的所有指令特征,如果找到了,则返回该指令的内存地址. 插件地址:https://github. ...

  10. Linux文件IO之一 [补档-2023-07-21]

    Linux文件IO 8-1C标准库IO函数的工作流程 ​ 使用fopen函数打开一个文件,之后会返回一个FILE* fp指针,fp指针指向一个结构体,这个结构体是c 标准io库中的一个结构体,这个结构 ...