기능 실행
오늘은 장바구니 기능과 마이 페이지에 구매한 책 목록을 추가하 였습니다. 기능 실행 화면은 다음과 같습니다.
소스 코드
해당 코드는 다음과 같습니다. html은 조금 길어 따로 작성하였습니다.
- app.py
- sql 테이블 추가
- base.html
# base.html
<!DOCTYPE html>
<html>
<head>
<title>My Ebook Page</title>
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='base.css')}}">
</head>
<body>
<header>
<a href="{{ url_for('home') }}">
<img src="{{ url_for('static', filename='logo.png') }}" alt="My Ebook Logo">
</a>
<div class="search">
<form action="{{ url_for('search') }}" method="get">
<div class="search-container">
<input type="text" name="keyword" placeholder="Search...">
<button type="submit">Search</button>
</div>
</form>
</div>
<div class="user">
{% if 'loggedin' in session %}
<a href="/logout">로그아웃</a> |
<a href="/mypage">마이 페이지</a> |
<a href="/cart">장바구니</a>
{% else %}
<a href="/login?next=/mypage">로그인</a> |
<a href="/mypage">마이 페이지</a> |
<a href="/cart">장바구니</a>
{% endif %}
</div>
</header>
<nav>
<ul>
<li><a href="{{ url_for('book_by_genre', genre='전체') }}">전체</a></li>
<li><a href="{{ url_for('book_by_genre', genre='소설') }}">소설</a></li>
<li><a href="{{ url_for('book_by_genre', genre='판타지') }}">판타지</a></li>
<li><a href="{{ url_for('book_by_genre', genre='로맨스') }}">로맨스</a></li>
<li><a href="{{ url_for('book_by_genre', genre='액션') }}">액션</a></li>
<li><a href="{{ url_for('book_by_genre', genre='공포') }}">공포</a></li>
<li><a href="{{ url_for('book_by_genre', genre='사회') }}">사회</a></li>
</ul>
</nav>
{% block content %}{% endblock %}
<footer>
<p>Copyright ©
<script>
document.write(new Date().getFullYear())
</script> Etevers e-book. All Rights Reserved.
</p>
</footer>
</body>
</html>
- cart.html
# cart.html
{% extends "base.html" %}
{% block content %}
{% with messages = get_flashed_messages() %}
{% if messages %}
<ul class="flashes">
{% for message in messages %}
<li>{{ message }}</li>
{% endfor %}
</ul>
{% endif %}
{% endwith %}
<h1>Shopping Cart</h1>
{% if cart_items %}
<table>
<thead>
<tr>
<th>책 제목</th>
<th>가격</th>
</tr>
</thead>
<tbody>
{% for item in cart_items %}
<tr>
<td>{{ item['title'] }}</td>
<td>{{ item['item_price'] }}</td>
<td>
<form action="{{ url_for('remove_from_cart', book_number=item['number']) }}" method="POST">
<button type="submit">Remove</button>
</form>
</td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr>
<td colspan="3">Total Price:</td>
<td>{{ total_price }}</td>
</tr>
</tfoot>
</table>
<a href="{{ url_for('checkout') }}">Checkout</a>
{% else %}
<p>Your cart is empty.</p>
{% endif %}
{% endblock %}
- checkout.html
# checkout.html
{% extends 'base.html' %}
{% block content %}
<h1>Checkout</h1>
<p>Thank you for your purchase!</p>
<table>
<thead>
<tr>
<th>Item</th>
<th>Price</th>
</tr>
</thead>
<tbody>
{% for item in cart_items %}
<tr>
<td>{{ item['name'] }}</td>
<td>${{ item['price'] }}</td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr>
<th>Total:</th>
<td>${{ total_price }}</td>
</tr>
</tfoot>
</table>
{% endblock %}
발생한 오류
처음에는 책을 여러권 구매할 수 있게 설정 했으나 마이페이지에 책 1권까지는 괜찮으나 2개 이상으로 추가되면 페이지 오류가 발생했습니다. 때문에 계정당 1권의 책만 구매할 수 있도록 수정 했습니다. 해당 내용은 app.py에서 add_cart 부분인 다음 사진과 같습니다.
이 코드가 계정당 1권만 구매할 수 있도록 하는 원리는 해당 경로에서 코드는 먼저 주어진 번호의 책이 존재하는지 확인하게 됩니다. 책이 존재하는 경우 'purchase' 테이블을 검색하여 현재 계정(session['account'])이 이 책을 이미 구매했는지 확인합니다. 레코드가 발견되면 책이 이미 구매되었음을 의미하며 경고 메시지가 표시됩니다. 기록이 없으면 책이 카트에 추가되고 성공 메시지가 표시됩니다.
이렇게 처리한 결과 해당 오류는 더 이상 출력되지 않았습니다. 또한 처음 이 코드를 생성하는 과정에서 "You have..." 경고문이 여러개 출력되는 버그가 발생했는데, 이는 단순히 로그가 쌓여 그렇게 출력된 것으로 보이며 새롭게 들어온 경우 정상적으로 하나만 출력되는 것을 확인했습니다.
프로젝트 남은 부분
- 책 구매 시 pdf 다운로드 기능 구현
- 영어로 되어 있는 부분 한글로 수정
- 리뷰 테이블 구성
- 책 상세페이지에 리뷰 기능 추가
- 리뷰 평점을 사용하여 책 리스트 순서 구현
10일 째가 되니 뭔가 구성이 그럴싸해진 것 같아 점점 더 만족스럽습니다. 처음에는 따라가기도 벅찼고 이해도 힘들었는데 조금씩 읽히고 수정도 직접하고 디자인까지 손보고 있으니 점점 재밌어지는 것 같습니다. 물론 잘될때만 재밌습니다. 살면서 이렇게 스트레스로 편두통이 오는게 얼마만인지 모르겠습니다.
화면만 보면 머리아프고 그랬는데, 그래도 이제는 '음~ 이게 문제가 될 수 있겠다.'하고 쉬운 부분을 손 볼 수 있게 되었습니다. 물론 간단한 부분들만 가능하지만요. 동기들도 잘한다, 잘한다 해주니 아주 기분이 날아오를 것 같습니다 ㅎㅎㅎㅎ 하지만 아직 갈길이 멀었으니 열심히 달려보겠습니다!
'프로젝트' 카테고리의 다른 글
[프로젝트] 파이썬 미니 프로젝트 Day.12/13 (0) | 2023.05.11 |
---|---|
[프로젝트] 파이썬 미니 프로젝트 Day.11 (0) | 2023.05.11 |
[프로젝트] 파이썬 미니 프로젝트 Day.9 (0) | 2023.05.11 |
[프로젝트] 파이썬 미니 프로젝트 Day.8 (0) | 2023.05.10 |
[프로젝트] 파이썬 미니 프로젝트 Day.7 (2) | 2023.05.09 |