[Day1] 快速利用Servlet+jsp 搭建一个购书系统 - KelovpString

/ 0评 / 0

    前期准备: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界面按照同样的办法,根据功能的的不同将页面内容使用静态的数值填充,将前端页面写完

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注