[12.17] 장바구니 API 구현하기😏

우선, 장바구니 API를 구현하면서 문제가 있었다.

워크벤치에서 cartItems(장바구니) 테이블을 만들면서 Foreign Key 설정 중 문제였다.

Foreign Key Name과 Index Name이 중복이 되어서 그런 거였다..

그래서 간단하게 fk 제약조건 이름을 지었다.

 

[ fk_기준 테이블명_참조테이블명_참조키 ]

ex) cartItems.user_id > users.id =>  fk_cartItems_users_id

ex) likes.user_id > users.id =>  fk_likes_users_id

 

이렇게 만들기로 규칙을 만들었다. 이전에 만든 테이블들은 지나가고, cartItems 테이블부터 사용할 것이다.

cartItems 테이블을 생성했으니, 이제 본격적으로 API 구현을 해보려한다👍

 

💥 장바구니 담기 API

장바구니 담기 API는 간단하다.

말 그대로 장바구니에 상품을 넣으면 담아지는 것이니, sql 구문은 INSERT를 사용하기로 했다.

 

API 설계 당시에 REQ에 담을 내용들을 미리 적어놨었다.

let sql = 'INSERT INTO cartItems (book_id, quantity, user_id) VALUES (?, ?, ?);';

 

book_id와 quantity, user_id를 유저값으로 받아서 INSERT 한다 라는 sql 구문이다.

const {book_id, quantity, user_id} = req.body;

let sql = 'INSERT INTO cartItems (book_id, quantity, user_id) VALUES (?, ?, ?);';
let values = [book_id, quantity, user_id];
conn.query(sql, values,
    (err, results) => {
        if(err) {
            console.log(err);
            return res.status(StatusCodes.BAD_REQUEST).end();
        }

        return res.status(StatusCodes.OK).json(results);
})

 

이렇게 로직을 짰다. 다른 API와 별반 다른 부분이 없기 때문에 빠르게 넘어가겠다!

장바구니 API 역시, 다른 API들과 똑같이 CartController.js를 만들어 carts.js엔 router가 경로만 알려주게끔 로직을 짰다.

 

POSTMAN으로 확인해보니 affectedRows 1 이 잘 뜨는 걸 볼 수 있었고,

워크벤치에서 확인해봐도 데이터가 잘 들어간 걸 볼 수 있었다.

 

💥 장바구니 목록 조회 API

이제, 장바구니 목록 조회 API를 구현해보도록 하겠다.

장바구니 목록 조회 API 설계 당시에 RES 를 보면 cartItems 테이블에 없는 내용들이 포함되어있다.

id, book_id를 제외하면 books 테이블에 존재하는 컬럼들이다. 그래서 이전에 했던 API들 처럼 LEFT JOIN을 해줘야한다.

sql구문은 이렇게 될 것이다.

SELECT cartItems.id, book_id, title, summary, quantity, price
FROM cartItems LEFT JOIN books
ON cartItems.book_id = books.id;

books와 cartItems 테이블을 LEFT JOIN 해서 필요한 컬럼만 사용하게끔 SELECT 뒤에 * 가 아닌 컬럼명을 써줬다.

워크벤치에서 사용해보았을 때, 문제없이 원하는 컬럼만 잘 나오는 걸 볼 수 있다👍

이제 vscode로 실제 로직을 짜볼 예정이다!

const {user_id} = req.body;

let sql = `SELECT cartItems.id, book_id, title, summary, quantity, price
            FROM cartItems LEFT JOIN books
            ON cartItems.book_id = books.id WHERE user_id=?;`;
conn.query(sql, user_id,
    (err, results) => {
    if(err) {
        console.log(err);
        return res.status(StatusCodes.BAD_REQUEST).end();
    }
    return res.status(StatusCodes.OK).json(results);
})

user_id를 받아 해당 유저의 장바구니 목록 조회가 되도록 로직을 짰다.

이렇게 되면 전체 유저의 장바구니 목록 조회가 아니라 조건에 맞는 유저의 장바구니 목록을 조회할 수 있게된다.

cartItems 테이블에 넣은 데이터를 확인해보면,

1번 유저 => 1,2,3번 도서

2번 유저 => 1,2번 도서 를 담은 걸 볼 수 있다.

그럼 포스트맨에서도 잘 확인이 되는 지 해보겠다.

user_id가 1이기 때문에 1번 유저가 담은 장바구니 목록은 1,2,3번의 도서가 나오는 걸 볼 수 있다 굿👍

 

💥 장바구니 아이템 삭제

이번엔 장바구니에 담은 아이템 삭제를 해볼 것이다.

DELETE는 sql도 굉장히 복잡하진 않아서 이전에 했던 좋아요 삭제처럼 쉬울 것 같다.

let sql = 'DELETE FROM cartItems WHERE id=?';

sql구문은 앞에서 말했듯이 DELETE를 사용했고 id값을 URL로 받아와서 쓸 예정이다.

const {id} = req.params;

let sql = 'DELETE FROM cartItems WHERE id=?';
conn.query(sql, id,
    (err, results) => {
    if(err) {
        console.log(err);
        return res.status(StatusCodes.BAD_REQUEST).end();
    }
    return res.status(StatusCodes.OK).json(results);
})

이렇게 로직이 짜졌다. 좋아요 삭제 API와 다른 점은 받아오는 값만 다르다.

cartItems 테이블에서 id가 7번인 걸 지워보겠다.

문제없이 affectedRows 1 뜨는 걸 확인할 수 있다.

 

💥 (장바구니에서 선택한) 주문 "예상" 상품 목록 조회

SELECT * FROM Bookshop.cartItems
WHERE user_id=1
AND id IN(1,3);

user_id가 1인 유저가 고른 장바구니 아이템중 id가 1,3인 것 좀 뿌려줘 라는 뜻이다.

이 sql을 어디서 사용하느냐...........

 

현재 cartItems 테이블을 살펴보면 1번 유저가 장바구니에 1,2,3번 상품을 담아놓은 걸 볼 수 있다.

근데 담았다고 다 안 살 수도 있지않은가.... 그래서 1,3번만 골라서 산다고 가정한다면??

이럴 때 위의 sql구문을 사용하는 것이다.

 

근데 말 그대로.. 조회이다. 장바구니 목록 조회. 이미 위에서 했던 API 였던 거시다......

그래서 원래 장바구니 목록 조회 API에 selected를 추가해 선택하지 않았으면 전체 아이템 조회를..

selected가 되어있다면? selected된 상품만 조회해주기. 이렇게 하기로 했다.

const {user_id, selected} = req.body; // selected = [1, 3]

let sql = `SELECT cartItems.id, book_id, title, summary, quantity, price
            FROM cartItems LEFT JOIN books
            ON cartItems.book_id = books.id
            WHERE user_id=? AND cartItems.id IN (?)`;
let values = [user_id, selected];
conn.query(sql, values,
    (err, results) => {
        if(err) {
            console.log(err);
            return res.status(StatusCodes.BAD_REQUEST).end();
        }
        return res.status(StatusCodes.OK).json(results);
})

그래서 코드는 이렇게 변했다.

기본 sql에서 AND cartItems.id IN(?) 을 넣어주었다.

이렇게 되면 selected된 id가 ?  안에 들어가면서 selected된 상품만 조회가 될 것이다.

POSTMAN으로 확인해보면,

이렇게 1,3번의 아이템만 뿌려지는 걸 볼 수 있다.

 

사실 마지막의 장바구니 API가 조금 헷갈렸다..
selected된 상품의 조회? 흠.. 이런 건 프론트쪽에서 하는 거 아닐까? 싶었는데
백에서도 충분히 할 수 있다는 거에 대해 놀랐고.. 백에서 이렇게 먼저 해주면 프론트입장에선
진짜 고맙고 좋긴하겠다. 라는 생각이 들었다.
어제, 오늘 강의만 해도 새로운 API는 아니지만 조금 많이 바뀐 API라 한 번 더 돌려보는 게 좋을 것 같다.
실제로 자주 사용하는 API로 보이니.. 확실히 내 지식으로 만들려면 한 번 더 해야겠다😥
이번 프로젝트를 같이하는 팀도 이제 곧 끝나간다.. 사실 제대로 해보지도 못한 것 같은데 조금 아쉽다.
프로젝트도 강의도 놓치지말고 확실히해서 내 장점으로 남았으면 좋겠다 😄