iixy
0D
V2EX  ›  Java

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

  •  1
     
  •   iixy · Sep 25, 2020 · 9004 views
    This topic created in 2094 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
        1
    misaka19000  
       Sep 25, 2020
    jQuery
    coang
        2
    coang  
       Sep 25, 2020
    去看看 guns 吧.. 有分离有不分离..
    sambawy
        3
    sambawy  
       Sep 25, 2020
    H+
    oma1989
        4
    oma1989  
       Sep 25, 2020
    jQuery EasyUI
    lipcao
        5
    lipcao  
       Sep 25, 2020   ❤️ 3
    thymeleaf 就够用了吧,画个页面直接 thymeleaf 渲染
    tangkaichuan
        6
    tangkaichuan  
       Sep 25, 2020 via Android
    springboot 中可以放前端资源不用单独部署。还可以配置成打包的时候把前端部分分离出来,和 jar 包同目录,直接跑起来就能访问,方便前端资源更新
    iixy
        7
    iixy  
    OP
       Sep 25, 2020
    @lipcao thymeleaf 好像没组件
    fallinlovewith
        8
    fallinlovewith  
       Sep 25, 2020   ❤️ 1
    @gransh
    她的 th:fragment 算不?
    lower
        9
    lower  
       Sep 25, 2020
    不想打包,直接引用 ui 库的 js 也可以的呀
    idoggy
        10
    idoggy  
       Sep 25, 2020 via Android
    前端 npm 打包后就是传统的静态资源,放在 Java 的资源目录里就可以了。jQuery 除非你急着赶作业,不然还是了解下主流前端更好。
    binbinyouliiii
        11
    binbinyouliiii  
       Sep 25, 2020
    thymeleaf 我记得好难用的,写完第二天就看不懂了。
    用 freemarker 。
    liqingcan
        12
    liqingcan  
       Sep 25, 2020
    目前自己的项目 www.3kkg.com 没有前后端分离,前端模板使用的是 jfinal 的 enjoy 。用习惯了感觉贼好用。没错。我是来贴一个自己的链接的。哈哈
    lipcao
        13
    lipcao  
       Sep 25, 2020
    @binbinyouliiii 以前搞过 jsp EL 表达式,java 小脚本。。thymeleaf 和 jsp 差不多的,后端拿数据去前端填数据就可以了,不需要前端参与,很适合楼主啊
    Cbdy
        14
    Cbdy  
       Sep 25, 2020
    Ariver
        15
    Ariver  
       Sep 25, 2020
    ming168
        16
    ming168  
       Sep 25, 2020
    情况一样,前端真的一窍不通
    QingXuJiaZhi
        17
    QingXuJiaZhi  
       Sep 25, 2020
    不想深入研究前端的话,最好还是用 bootstrap,简单易用节省时间,简单网站完全够用。
    iixy
        18
    iixy  
    OP
       Sep 25, 2020
    @cmdOptionKana bootstrap 还需要搭配模板吗?
    sdbybyd
        19
    sdbybyd  
       Sep 25, 2020
    react 挺简单的
    QingXuJiaZhi
        20
    QingXuJiaZhi  
       Sep 25, 2020
    @gransh 模板搭不搭都行,有些框架比如 symfony ( PHP )直接从后端支持 bootstrap 。

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

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

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

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

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

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

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

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