반응형
기능 실행

오늘은 장바구니 기능과 마이 페이지에 구매한 책 목록을 추가하 였습니다. 기능 실행 화면은 다음과 같습니다.

구매 후 최근한 책에 대해 나와 있습니다.


소스 코드

해당 코드는 다음과 같습니다. 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 &copy;
            <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일 째가 되니 뭔가 구성이 그럴싸해진 것 같아 점점 더 만족스럽습니다. 처음에는 따라가기도 벅찼고 이해도 힘들었는데 조금씩 읽히고 수정도 직접하고 디자인까지 손보고 있으니 점점 재밌어지는 것 같습니다. 물론 잘될때만 재밌습니다. 살면서 이렇게 스트레스로 편두통이 오는게 얼마만인지 모르겠습니다.

 

화면만 보면 머리아프고 그랬는데, 그래도 이제는 '음~ 이게 문제가 될 수 있겠다.'하고 쉬운 부분을 손 볼 수 있게 되었습니다. 물론 간단한 부분들만 가능하지만요. 동기들도 잘한다, 잘한다 해주니 아주 기분이 날아오를 것 같습니다 ㅎㅎㅎㅎ 하지만 아직 갈길이 멀었으니 열심히 달려보겠습니다!

반응형