前期准备:Tomcat服务器、Mybatis相关Jar包、Log4j相关Jar包、 JSTL相关Jar包 、Oracle数据库
而相关的前端显示界面使用UIkit框架
阅读需求分析:
由注册、登录、购物车、订单四个大模块
在准备好以上环境之后创建工作目录:
其中 src 存放后台相关代码 static存放静态文件 而其他则是Java Web应用常规目录 user用于存放用户相关的信息界面
开发工具:自己哪款熟悉就来哪款呗。我用eclipse。
创建好以后先编写前端的测试界面:
在先引入UIkit的条件下编写index.jsp head.jsp footer.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>首页</title> </head> <body> <%@include file="/head.jsp" %> <ul class="uk-breadcrumb" style="margin-left: 20px;"> <li><a href="index.jsp">Estore</a></li> <li class="uk-active"><span>欢迎页</span></li> </ul> <center><h2>欢迎来到Estore</h2></center> <div style="width: 75%;margin: 0 auto;"> <table class="uk-table uk-table-hover uk-table-striped uk-table-condensed"> <caption>这里是所有图书的信息</caption> <thead> <tr> <th>序号</th> <th>产品名称</th> <th>价格</th> <th>操作</th> </tr> </thead> <tfoot> <tr> <td>...</td> <td>...</td> <td>...</td> <td>...</td> </tr> </tfoot> <tbody> <tr> <td>1</td> <td><a href="user/productDetail.jsp">JavaEE</a></td> <td>69</td> <td><a class="uk-icon-shopping-cart"> 加入购物车</a></td> </tr> <tr> <td>2</td> <td>MySql</td> <td>69</td> <td><a class="uk-icon-shopping-cart"> 加入购物车</a></td> </tr> <tr> <td>3</td> <td>MyBatis</td> <td>69</td> <td><a class="uk-icon-shopping-cart"> 加入购物车</a></td> </tr> </tbody> </table> </div> <%@include file="/footer.jsp" %> </body> </html>
效果如下
剩余的jsp界面按照同样的办法,根据功能的的不同将页面内容使用静态的数值填充,将前端页面写完