iixy
0.01D
V2EX  ›  Java

用 springboot 写一个简单的 web 项目,不分离,搭配什么前端框架好?

  •  1
     
  •   iixy · Sep 25, 2020 · 9526 views
    This topic created in 2231 days ago, the information mentioned may be changed or developed.
    想自己独立完成一个 web 项目,自己对后端比较熟悉,前端那些一知半解。用的 springboot 框架,搭配什么前端 ui 类框架比较好,易于学习,界面美观的。
    有推荐 vue-element-admin,查了查好像过于复杂(功能上的),而且还得单独部署的样子。
    bootstrap 好像又过于简单了。
    是不是 layui elementui 这种会比较合适一些?
    另外对于前端的打包也不太了解,有没有集成到 springboot 项目里直接调用的?
    49 replies  •  2020-10-12 11:15:29 +08:00
    misaka19000
    misaka19000
    Sep 25, 2020
    1
    jQuery
    coang
    coang
    Sep 25, 2020
    2
    去看看 guns 吧.. 有分离有不分离..
    sambawy
    sambawy
    Sep 25, 2020
    3
    H+
    oma1989
    oma1989
    Sep 25, 2020
    4
    jQuery EasyUI
    lipcao
    lipcao
    Sep 25, 2020❤️3
    5
    thymeleaf 就够用了吧,画个页面直接 thymeleaf 渲染
    tangkaichuan
    tangkaichuan
    Sep 25, 2020 via Android
    6
    springboot 中可以放前端资源不用单独部署。还可以配置成打包的时候把前端部分分离出来,和 jar 包同目录,直接跑起来就能访问,方便前端资源更新
    iixy
    iixy
    OP
    Sep 25, 2020
    7
    @lipcao thymeleaf 好像没组件
    fallinlovewith
    fallinlovewith
    Sep 25, 2020❤️1
    8
    @gransh
    她的 th:fragment 算不?
    lower
    lower
    Sep 25, 2020
    9
    不想打包,直接引用 ui 库的 js 也可以的呀
    idoggy
    idoggy
    Sep 25, 2020 via Android
    10
    前端 npm 打包后就是传统的静态资源,放在 Java 的资源目录里就可以了。jQuery 除非你急着赶作业,不然还是了解下主流前端更好。
    binbinyouliiii
    binbinyouliiii
    Sep 25, 2020
    11
    thymeleaf 我记得好难用的,写完第二天就看不懂了。
    用 freemarker 。
    liqingcan
    liqingcan
    Sep 25, 2020
    12
    目前自己的项目 www.3kkg.com 没有前后端分离,前端模板使用的是 jfinal 的 enjoy 。用习惯了感觉贼好用。没错。我是来贴一个自己的链接的。哈哈
    lipcao
    lipcao
    Sep 25, 2020
    13
    @binbinyouliiii 以前搞过 jsp EL 表达式,java 小脚本。。thymeleaf 和 jsp 差不多的,后端拿数据去前端填数据就可以了,不需要前端参与,很适合楼主啊
    ming168
    ming168
    Sep 25, 2020
    16
    情况一样,前端真的一窍不通
    QingXuJiaZhi
    QingXuJiaZhi
    Sep 25, 2020
    17
    不想深入研究前端的话,最好还是用 bootstrap,简单易用节省时间,简单网站完全够用。
    iixy
    iixy
    OP
    Sep 25, 2020
    18
    @cmdOptionKana bootstrap 还需要搭配模板吗?
    sdbybyd
    sdbybyd
    Sep 25, 2020
    19
    react 挺简单的
    QingXuJiaZhi
    QingXuJiaZhi
    Sep 25, 2020
    20
    @gransh 模板搭不搭都行,有些框架比如 symfony ( PHP )直接从后端支持 bootstrap 。

    但其实差别不大,我自己喜欢单独用 bootstrap,后端一律返回 json 给前端,不管什么东西都转成 json 塞给前端,然后前端只要拿到一个 json,用 JavaScript 就非常容易处理了。
    EminemW
    EminemW
    Sep 25, 2020
    21
    还是分离吧,不要学 java 那些有的没的模板语言,没意义。vue 用 cdn 引入挺简单的
    yungo8
    yungo8
    Sep 25, 2020 via Android
    22
    elementUI 够简单的了,vue 真的是香。

    我之前是在 jsp 里面用 jstl 和 easyUI 以及原生 js 的码农,后面半天就简单上手了 vue,去 tm 的操作 dom
    MoreSunshine
    MoreSunshine
    Sep 25, 2020
    23
    react 或 vue 前端发展必然趋势,越逃避越不会 越不会越会被淘汰
    yungo8
    yungo8
    Sep 25, 2020 via Android
    24
    @EminemW 我就说用引入方式的,作为后端开发还真不会模块化开发……
    zzl22100048
    zzl22100048
    Sep 26, 2020
    25
    AlpineJS + TailWindCSS
    fox0001
    fox0001
    Sep 26, 2020 via Android
    26
    不推荐 jQuery 了,还不如直接 JavaScript 原生。简单项目的话,找个开源的 CSS 项目就好了
    heiybb
    heiybb
    Sep 26, 2020 via Android
    27
    Vuetify 自己手动撸一个 很快的
    KuroNekoFan
    KuroNekoFan
    Sep 26, 2020
    28
    gwt
    xgq89757
    xgq89757
    Sep 26, 2020
    29
    ant design pro
    ghost024
    ghost024
    Sep 26, 2020
    30
    bootstrap+themeleaf 我一般都是找一个人家写好的 bootstrap 模板,然后用 themeleaf 改一下,超级好用
    securityCoding
    securityCoding
    Sep 26, 2020
    31
    应该前后端分离 , 你提到的 vue-element-admin 单页面应用部署起来前端挂一个 ng 也很简单的
    libook
    libook
    Sep 26, 2020
    32
    没有明确需求就直接选型是大忌。

    如果只是开发一些简单的交互页面的话,原生 JS 足以,document.querySelector()和 document.querySelectorAll()搞定元素选择,Element.classList 、HTMLElement.style 搞定样式变化;如果觉得用 fetch 麻烦的话,顶多加一个 Axios 。

    建议以 WebComponents 的方式写,日后需求复杂了想引入框架会比较方便。

    前端开发的知识可以去 MDN 上看,大多都有中文教程。
    leafre
    leafre
    Sep 26, 2020
    33
    不分离就 jquery bootstrap/layui freemarker
    huayumo
    huayumo
    Sep 26, 2020
    34
    同意楼上的,jquery 和 bootstrap,这些东西对以后装组件很方便的
    1oNflow
    1oNflow
    Sep 26, 2020 via iPhone
    35
    jQuery bootstrap mustache,我觉得是最简单的一套组合
    clf
    clf
    Sep 26, 2020
    37
    前后端分离其实可以不需要单独部署的,把打包完的前端页面整合到 Springboot 里就好了。开发的时候前端用一下前端代理,部署直接 build 到项目的指定目录即可。

    当然,如果是没接触过前端开发,用 jQuery 等挺好,先熟悉传统前端页面开发再去涉及 Vue 、React 、Angular 这些前端框架。

    如果还在大学,方向是 Web 相关的,建议 Vue 、React 一定要学,毕竟不懂前端的后端以及不懂后端的前端,都是有一定发展限制的。
    youla
    youla
    Sep 26, 2020
    38
    可以引用 vue.min.js 做开发,比 jquery 方便感觉。
    GBdG6clg2Jy17ua5
    GBdG6clg2Jy17ua5
    Sep 26, 2020 via iPhone
    39
    我感觉楼主更想要的是 ui 组件,那用 lanui 吧
    MisakaMikoto
    MisakaMikoto
    Sep 26, 2020
    40
    用 parcel 打包,写个 main 文件,然后 import 按需加载模块页面文件。这样就可以写新特性了,也能用 npm 直接 import $ from 'jquery'
    chinaq
    chinaq
    Sep 26, 2020
    41
    最简单的就是 layui-admin,另外像 vue-admin 、Ant Design Pro 也可以去 github 上找管理后台,各种 ui 框架都上手一遍,不费事的。
    kanepan19
    kanepan19
    Sep 26, 2020
    42
    老:
    模板引擎: 个人很不习惯 thymeleaf 模板的方式, 可以用 freemarker 和 velocity
    自用 springboot + velocity
    velocity 官方不支持了,可以用 velocity-spring-boot-starter
    前端用 bootstrap

    新:
    springboot + elementUI 或者 ant design
    hdfg159
    hdfg159
    Sep 26, 2020 via Android
    43
    明显 jquery
    EminemW
    EminemW
    Sep 27, 2020
    44
    @yeqizhang vue 可以直接用 cdn 引入使用的,不需要用 npm 那些,你看一下 vue 很简单的,我感觉比 jQuery 好理解多了
    zlllllei
    zlllllei
    Sep 27, 2020
    45
    vue 看官网教程,配上 element,半天就可以上手开撸了。 不过我以前的前端同事告诉我,element 已经停止维护很久了,有些 bug,但问题不大。
    yunyi93
    yunyi93
    Sep 27, 2020
    46
    用 springboot 自带的 Thymeleaf,再加上 javascript 足以。
    suzic
    suzic
    Sep 27, 2020 via Android
    47
    mdui
    chachae
    chachae
    Sep 29, 2020 via iPhone
    48
    不分离我推荐 beetl+bootstrap+jq,当然不分离的话 vue 搭配 element 也是可以的,只不过跟前者比起来就毫无优势
    liuxiaohua
    liuxiaohua
    Oct 12, 2020
    49
    layui 吧
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Privacy   ·   Solana   ·   3025 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 125ms · UTC 12:15 · PVG 20:15 · LAX 04:15 · JFK 07:15
    ♥ Do have faith in what you're doing.