作为一只后端程序员,想要开发一个管理系统,自己包揽前后端工作。
怎么又简单,又好看?
程序框架已经搭好,java spring-boot,查了下thymeleaf是spring-boot推荐的模板框架,那就用它啦。
1. dependencies
compile('org.springframework.boot:spring-boot-starter-thymeleaf')
2. application.properties
测试时选择不使用缓存
spring.thymeleaf.cache=false
3. 目录结构
根据官方推荐
- 把页面(比如hello.html)放在 \src\main\resources\templates 下
- 把静态资源(比如1.jpg, jquery.js)放在 \src\main\resources\static 下
4. 找不到静态资源怎么办?
按照网上给的一些demo,写好了controller,html,可是html中的静态资源找不到,资源在static/css文件夹下。尝试了修改路径,怎么改都不成。
<link href="../../static/css/bootstrap.min.css"
th:href="@{/css/bootstrap.min.css}" rel="stylesheet" type="text/css" />
在各个可疑目录下都放了一张1.jpg图像,尝试访问,还是返回404。查了日志,发现静态资源被拦截了。
解决办法如下:
@Configuration
@EnableWebMvc
public class MvcConfiguration extends WebMvcConfigurerAdapter {
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/**")
.addResourceLocations("classpath:/static/");
super.addResourceHandlers(registry);
}
}
5. 怎样不重启刷新html?
加上配置:
spring.thymeleaf.cache=false
如果使用的开发工具是 idea ,修改 html 后使用 Ctrl + Shift + F9,Rebuild一下工程就可以了。
6. 想要好看怎么办?
写前端代码的能力战五渣,又想要一个看起来吊炸天的页面,用模板!!!
在网上搜索bootstrap主题模板,比如我下的这个,http://usebootstrap.com/download-theme/adminlte 很适合做管理系统。
下载后解压到工程的static文件夹下,就可以看到模板效果了。预览方式:
- 我用的Intellij IDEA 2017,在其中打开html文件,鼠标hover到文件中,右上方就有浏览器图标,点一下就能预览啦。
- 127.0.0.1:port/index.html 把工程在本地启动起来,访问。
给张模板截图,左侧那一排,各种组件的样例。自己照着参考下就好啦。
最后吐槽一下这个模板,把头部、底部、左侧边栏这些公共区域写在几个公共文件里不好么?代码拷贝了无数份,写的哪哪儿都是。