프로그래밍 언어/jsp

<jsp> 웹 쇼핑몰 만들기 [전체 코드]

창조적생각 2021. 8. 9. 15:56

1. 첫페이지

main:welcome.jsp

header : menu.jsp

footer : footer.jsp 

 

1. welcome.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
<meta charset="UTF-8">
<title>welcome</title>
</head>
<body>
<%@ include file = "menu.jsp"%>
<div class="p-4 p-md-5 mb-4 text-white rounded bg-dark">
    <div class="col-md-6 px-0">
      <h1 class="display-4 fst-italic">도서 웹 쇼핑몰</h1>
      <p class="lead my-3">Welcome to Web Market </p>
    </div>
  </div>
  <%@ include file = "footer.jsp"%>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-U1DAWAznBHeqEIlVSCgzq+c9gqGAJn5c/t99JyeKa9xxaYpSvHU5awsuZVVFIhvj" crossorigin="anonymous"></script>
</body>
</html>
 cs

 

2. menu.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
 
<meta charset="UTF-8">
<title>메뉴</title>
</head>
<body>
<nav class="py-2 bg-light border-bottom">
    <div class="container d-flex flex-wrap">
      <ul class="nav me-auto">
        <li class="nav-item"><a href="./welcome.jsp" class="nav-link link-dark px-2 active" aria-current="page">Home</a></li>
        <li class="nav-item"><a href="./booklist.jsp" class="nav-link link-dark px-2">Book List</a></li>
        <li class="nav-item"><a href="./addBook.jsp" class="nav-link link-dark px-2">Add Book</a></li>
        <li class="nav-item"><a href="#" class="nav-link link-dark px-2">FAQs</a></li>
        <li class="nav-item"><a href="#" class="nav-link link-dark px-2">About</a></li>
      </ul>
      <ul class="nav">
        <li class="nav-item"><a href="#" class="nav-link link-dark px-2">Login</a></li>
        <li class="nav-item"><a href="#" class="nav-link link-dark px-2">Sign up</a></li>
      </ul>
    </div>
  </nav>
   
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-U1DAWAznBHeqEIlVSCgzq+c9gqGAJn5c/t99JyeKa9xxaYpSvHU5awsuZVVFIhvj" crossorigin="anonymous"></script>
</body>
</html>
 cs

 

3. footer.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
<meta charset="UTF-8">
<title>제작자</title>
</head>
<body>
<footer class="d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">
    <p class="col-md-4 mb-0 text-muted">© 2021 서성우</p>
      
  </footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-U1DAWAznBHeqEIlVSCgzq+c9gqGAJn5c/t99JyeKa9xxaYpSvHU5awsuZVVFIhvj" crossorigin="anonymous"></script>  
</body>
</html>
 cs

 

2. 도서 목록

 

상단 : menu.jsp

메인: booklist.jsp

하단: footer.jsp

 

 

1. booklist.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import = "java.util.ArrayList" %>
<%@ page import = "practice11.Book"%>
<%@ page import = "practice11.BookRepository" %>
<jsp:useBean id = "bookpage" class = "practice11.BookRepository" scope = "session" />
<!DOCTYPE html>
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
<meta charset="UTF-8">
<title>도서목록</title>
</head>
<body>
<%@ include file = "menu.jsp"%>
<%
    BookRepository BR = BookRepository.get_Instance();
    ArrayList<Book> BookList = BR.getAllBooks();
%>
<div class="p-4 p-md-5 mb-4 text-white rounded bg-dark">
    <div class="col-md-6 px-0">
      <h1 class="display-4 fst-italic">도서 목록</h1>
    </div>
  </div>
  <%  for (int i = 0; i < BookList.size();i++){
          Book book = BookList.get(i);
  
  %>
<div class="bg-light p-5 rounded">
    <h1 id = "tltle">[<%=book.get_category() %>] <%=book.get_name() %></h1>
    <p id = "description" class="lead"><%=book.get_description() %></p>
    <p id = "blank" class="lead"> </p>
    <p id = "writerpublisherprice" class="lead"><%=book.get_author() %>|<%=book.get_publisher() %>|<%=book.get_unitPrice() %>원</p>
    <a class="btn btn-lg btn-primary" href="./bookinfo.jsp?id=<%=book.get_bookId() %>" role="button">상세정보</a>
  </div>
  <%} %>
 <%@ include file = "footer.jsp"%>
 <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-U1DAWAznBHeqEIlVSCgzq+c9gqGAJn5c/t99JyeKa9xxaYpSvHU5awsuZVVFIhvj" crossorigin="anonymous"></script>
</body>
</html>
 cs

 

3. 도서 상세정보

 

상단 : menu.jsp

메인: bookinfo.jsp

하단: footer.jsp

 

1.bookinfo.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import = "practice11.Book" %>
<%@ page import = "practice11.BookRepository" %>
 
<jsp:useBean id = "bookpage" class = "practice11.BookRepository" scope = "session" />
 
<!DOCTYPE html>
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
<meta charset="UTF-8">
<title>책 정보</title>
</head>
 
<body>
 
<%@ include file = "menu.jsp"%>
 
<div class="p-4 p-md-5 mb-4 text-white rounded bg-dark">
    <div class="col-md-6 px-0">
      <h1 class="display-4 fst-italic">도서 정보</h1>
    </div>
  </div>
  <%
      String id = request.getParameter("id");
      BookRepository BR = BookRepository.get_Instance();
      Book book = BR.get_Book_by_Id(id);
  %>
 <div class="bg-light p-5 rounded">
    <h1>[<%=book.get_category() %>]<%=book.get_name()%></h1>
    <p class="lead"><%=book.get_description() %></p>
    <p class="lead"><b>도서코드 :</b><%=book.get_bookId() %></p>
    <p class="lead"><b>출 판 사 :</b><%=book.get_publisher() %></p>
    <p class="lead"><b>저   자  :</b><%=book.get_author() %></p>
    <p class="lead"><b>재 고 수 :</b><%=book.getunitsInStock() %></p>
    <p class="lead"><b>총 페이지 수:</b><%=book.gettotalPage() %></p>
    <p class="lead"><b>출 판 일 :</b><%=book.get_releaseDate() %></p>
    <p class="lead"><%=book.get_unitPrice()%>원</p>
    <a class="btn btn-lg btn-primary" href="/docs/5.1/components/navbar/" role="button">바로 주문하기</a>
    <a class="btn btn-lg btn-primary" href="/docs/5.1/components/navbar/" role="button">장바구니 담기</a>
  </div>
  <%@ include file = "footer.jsp"%>
  
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-U1DAWAznBHeqEIlVSCgzq+c9gqGAJn5c/t99JyeKa9xxaYpSvHU5awsuZVVFIhvj" crossorigin="anonymous"></script>
</body>
</html>
 cs

 

 

4. 도서 등록

 

상단 : menu.jsp

메인: addbook.jsp

하단: footer.jsp

process : processaddBook.jsp

 

1. addbook.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
<meta charset="UTF-8">
<title>도서 등록</title>
</head>
<body>
<%@ include file = "menu.jsp"%>
 
<div class="p-4 p-md-5 mb-4 text-white rounded bg-dark">
    <div class="col-md-6 px-0">
      <h1 class="display-4 fst-italic ">도서 등록</h1>
    </div>
</div>
<div class = "container">
<form name = "newbook" action = "./processaddBook.jsp" class="form-horizontal" method = "post">
    <div class = "form-group row">
        <label class = "col-sm-2">도서 코드</label>
        <div class = "col-sm-3">
            <input type = "text" name = "bookId" class ="form-control">
        </div>
    </div>
    
    <div class = "form-group row">
        <label class = "col-sm-2">도서 명</label>
        <div class = "col-sm-3">
            <input type = "text" name = "name" class ="form-control">
        </div>
    </div>
    <div class = "form-group row">
        <label class = "col-sm-2">작가</label>
        <div class = "col-sm-3">
            <input type = "text" name = "author" class ="form-control">
        </div>
    </div>
    
    <div class = "form-group row">
        <label class = "col-sm-2">가격</label>
        <div class = "col-sm-3">
            <input type = "text" name = "unitprice" class ="form-control">
        </div>
    </div>
    
    <div class = "form-group row">
        <label class = "col-sm-2">상세정보</label>
        <div class = "col-sm-3">
            <textarea name = "description" cols = "50" rows = "4" class ="form-control"></textarea>
        </div>
    </div>
    
    <div class = "form-group row">
        <label class = "col-sm-2">출판사</label>
        <div class = "col-sm-3">
            <input type = "text" name = "publisher" class ="form-control">
        </div>
    </div>
    
    <div class = "form-group row">
        <label class = "col-sm-2">분류</label>
        <div class = "col-sm-3">
            <input type = "text" name = "category" class ="form-control">
        </div>
    </div>
    
    <div class = "form-group row">
        <label class = "col-sm-2">재고 수</label>
        <div class = "col-sm-3">
            <input type = "text" name = "unitInStock" class ="form-control">
        </div>
    </div>
    
    <div class = "form-group row">
        <label class = "col-sm-2">상태</label>
        <div class = "col-sm-3">
            <input type = "radio" name = "condition" value ="New">
            신간
            <input type = "radio" name = "condition" value ="Old">
            중고
        </div>
    </div>
    
    <div class = "form-group row">
        <div class = "col-sm-offset-2 col-sm-10">
            <input type="submit" class = "btn btn-primary" value = "등록">
        </div>
    </div>
</form>
</div>
 
 
 
<%@ include file = "footer.jsp"%>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-U1DAWAznBHeqEIlVSCgzq+c9gqGAJn5c/t99JyeKa9xxaYpSvHU5awsuZVVFIhvj" crossorigin="anonymous"></script>
 
</body>
</html>
 cs

2. processaddBook.jsp
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import ="practice11.Book"%>
<%@ page import ="practice11.BookRepository"%>
 
<%
    request.setCharacterEncoding("UTF-8");
 
    String bookId = request.getParameter("bookId");
    String name = request.getParameter("name");
    String author = request.getParameter("author");
    String unitprice= request.getParameter("unitprice");
    String description= request.getParameter("description");
    String publisher= request.getParameter("publisher");
    String category= request.getParameter("category");
    String condition= request.getParameter("condition");
    String unitInStock= request.getParameter("unitInStock");
 
    Integer price;
    
    if(unitprice.isEmpty())
        price = 0;
    else price = Integer.valueOf(unitprice);
    
    long Stock;
    
    if(unitInStock.isEmpty())
        Stock = 0;
    else Stock = Long.valueOf(unitInStock);
    
    BookRepository BR = BookRepository.get_Instance();
    
    Book newBook = new Book();
    newBook.set_bookId(bookId);
    newBook.set_name(name);
    newBook.set_author(author);
    newBook.set_unitPrice(price);
    newBook.set_description(description);
    newBook.set_publisher(publisher);
    newBook.set_category(category);
    newBook.set_condition(condition);
    newBook.set_unitsInStock(Stock);
    
    BR.addBook(newBook);
    
    response.sendRedirect("booklist.jsp");
    
 
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
 
</body>
</html>
 cs

5. 도서 등록, 도서 목록 및 상세 정보 자동 갱신을 위한 자바스크립트

Book.java

BookRepository.java

 

1. Book.java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
package practice11;
 
public class Book {
public Book() {
    
}
 
private String bookId, name, author,description,
publisher, category, releaseDate, condition;
private Integer unitPrice;
private long unitsInStock, totalPage;
//setter
 
//String
public void set_bookId(String bookId) {
    this.bookId = bookId;
}
public void set_name(String name) {
    this.name = name;
}
public void set_author(String author) {
    this.author = author;
}
public void set_description(String description) {
    this.description = description;
}
public void set_publisher(String publisher) {
    this.publisher = publisher;
}
public void set_category(String category) {
    this.category = category;
}
public void set_releaseDate(String releaseDate) {
    this.releaseDate = releaseDate;
}
public void set_condition(String condition) {
    this.condition = condition;
}
//Integer
public void set_unitPrice(Integer unitPrice) {
    this.unitPrice = unitPrice;
}
//long
public void set_unitsInStock(long unitsInStock) {
    this.unitsInStock = unitsInStock;
}
public void set_totalPage(long totalPage) {
    this.totalPage = totalPage;
}
 
 
//getter
 
//String
public String get_bookId() {
    return bookId;
}
public String get_name() {
    return name;
}
public String get_author() {
    return author;
}
public String get_description() {
    return description;
}
public String get_publisher() {
    return publisher;
}
public String get_category() {
    return category;
}
public String get_releaseDate() {
    return releaseDate;
}
public String get_condition() {
    return condition;
}
 
//integer
public Integer get_unitPrice() {
    return unitPrice;
}
 
//long
public long getunitsInStock() {
    return unitsInStock;
}
public long gettotalPage() {
    return totalPage;
}
 
 
}
 
 cs

 

2.BookRepository.java
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
package practice11;
 
import java.util.ArrayList;
import practice11.Book;
 
public class BookRepository {
    
    private ArrayList<Book> BookList = new ArrayList<Book>();
    private static BookRepository instance = new BookRepository();
    
    public static BookRepository get_Instance() {
        return instance;
    }
public BookRepository() {
    
    Book html = new Book();
    html.set_author("황재호");
    html.set_bookId("h-h-h-h");
    html.set_category("Hello Coding");
    html.set_condition("New");
    html.set_description("워드나 ppt 문서를 만드실 수 있나요? 그러면 문제 없습니다. 지금바로 웹페이지 제작에 도전해보세요. 지금 당장 컴퓨터가 없어도 괜찮습니다.");
    html.set_name("HTML5 + CSS3");
    html.set_publisher("한빛미디어");
    html.set_releaseDate("2020-04-30");
    html.set_totalPage(300);
    html.set_unitPrice(15000);
    html.set_unitsInStock(100);
    
    Book easy = new Book();
    easy.set_author("우종중");
    easy.set_bookId("I-S-W-H");
    easy.set_category("IT 모바일");
    easy.set_condition("New");
    easy.set_description("객체 지향의 핵심과 자바의 현대적 기능을 충실히 다루면서도 초보자가 쉽게 학습할 수 있게 구성했습니다. 시각화 도구를 활용한 개념 설명과 군더더기 없는 핵심 코드를 통해 개념의 구현에 신경썼습니다.");
    easy.set_name("쉽게 배우는 자바 프로그래밍");
    easy.set_publisher("한빛아카데미");
    easy.set_releaseDate("2021-01-23");
    easy.set_totalPage(450);
    easy.set_unitPrice(27000);
    easy.set_unitsInStock(20);
    
    Book spring = new Book();
    spring.set_author("하세가와 유이치, 오오노 와타루, 토키코헤이(권은철, 전민수)");
    spring.set_bookId("I-S-H-H");
    spring.set_category("IT 모바일");
    spring.set_condition("New");
    spring.set_description("스프링은 단순히 사용 방법만 익히는 것보다 아키텍처를 어떻게 이해하고 설계하는지가 더 중요합니다. 예제를 복사해 붙여넣는 식으로 실제 개발에서 스프링을 제대로 활용할 수 없습니다.");
    spring.set_name("스프링4 입문");
    spring.set_publisher("한빛미디어");
    spring.set_releaseDate("2021-06-02");
    spring.set_totalPage(670);
    spring.set_unitPrice(27000);
    spring.set_unitsInStock(34);
    
    BookList.add(html);
    BookList.add(easy);
    BookList.add(spring);
    }
 
public ArrayList<Book> getAllBooks(){
    return BookList;
}
public Book get_Book_by_Id(String bookId) {
    Book BookbyId = null;
    
    for(int i = 0; i < BookList.size(); i++) {
        Book book = BookList.get(i);
        if (book != null && book.get_bookId() != null && book.get_bookId().equals(bookId)) {
            BookbyId = book;
        }
    }
    return BookbyId;
}
 
public void addBook(Book book) {
    BookList.add(book);
}
}
 
 
 cs

 

 

 

 

 

728x90
저작자표시 비영리

'프로그래밍 언어 > jsp' 카테고리의 다른 글

<JSP> 자바파일을 동적으로 JSP파일에 적용하기(자바빈즈, DTO, DAO)  (0) 2021.09.18
<jsp> 내장객체 2. Response  (0) 2021.08.29
<JSP> 내장객체 1. request  (0) 2021.08.28
이클립스 mysql 연동 오류 <connection profile 안뜸>해결  (0) 2021.08.24
<jsp> 스크립트 태그와 디렉티브 태그  (0) 2021.08.23

'프로그래밍 언어/jsp'의 다른글

  • 현재글<jsp> 웹 쇼핑몰 만들기 [전체 코드]

관련글

댓글

티스토리툴바