[MyPick31] 베이스 필터링 탐구

✅ 프로젝트 마무리까지 앞으로 해야 할 일들!

1. DB(시즌아이스크림정보, 이미지) 자료 넣기(완료)
2. 로그아웃 기능 (디버깅중)-> juni가 마저 진행하기로.
3. 필터링 기능
4. 좋아요 기능
5. 런칭 전 마무리 작업
→ 런칭! 🚀

 

3. 필터링 
-> 위 두 작업이 완료된 후 같이 만들어보기👩‍💻👨‍💻 (현재진행중)
MyPick31의 핵심 기능이라, 설계를 잘 하면서 만들어야 할 것 같다.

베이스1,2 .. 를 클릭한다.
베이스1,2 .. 정보들을 서버로 보낸다
받은 베이스1, 2 .. 정보들이 모두 포함된 아이스크림을 DB에서 조회한다.
(cbase1으로 검색된 베이스 > cbase2의 정보도 검색해 결과값 반환해야)
(예를 들어, '견과류' 정보가 들어오면 견과류(cbase1)의 하위 정보인 호두, 피스타치오, 아몬드(cbase2)가 포함된 아이스크림도 함께 반환해야)
조회된 아이스크림 결과를 js로 보낸다.
js에서 조회된 아이스크림들을 각각 카드 형태로 출력한다.

토핑, 시럽에도 같은 방식으로 적용한다.

-> 베이스 옵션들(바닐라/초콜릿.. 등) 에 a태그로 값을 전달하기보단 체크박스를 써 볼까 해서 실험으로 한번 구현중.
체크된 베이스옵션들의 id명 가져오기 -> 가져온 id명으로 DB에서 찾아오기.
단점) DB명에 cbase, ctopping, csyrup 각각에 검색되기 위한 id명을 부여해 주어야 한다.
현재) 여러 베이스 옵션들을 체크했을 때 복수의 id명을 어떻게 가져오는가?
& 체크된 체크박스의 id명을 어떻게 체크되었는지 확인해 가져오는가? -> 현재는 하나라도 체크되면 true 반환..

4. 좋아요(->heart)- heart table을 DB에 따로 만들어서, 거기에 'heart를 누른 사람들'을 저장한 다음 플레이버별 좋아요 수를 집계해 다시 프론트엔드에 띄워줘야겠다.

→ 이번 달 말까지 런칭을 목표로!!! 
필터링기능만이라도 완성해 보자. 이후 좋아요, 리뷰 기능(juni가 개발중)

 

👉오늘의 진전

자바스크립트로 html 체크박스의 id값을 선택해 가져오는 것을 구글링 중.
csslab.tistory.com/116 제이쿼리 체크박스 값 가져오기 : 원하던 검색결과는 아니었지만 체크된 베이스 갯수를 구하는 건 잘 된다. 나중에 베이스/토핑/시럽 최대선택가능갯수 제한할 때 유용할 듯.

 

ungdoli0916.tistory.com/447

(즐거웅코드) 자바스크립트 checkbox 체크된 객체 value 가져오기 (name으로 확인)

자바스크립트) checkbox 체크된 객체의 value값 가져오기.
자바스크립트에서 체크된 객체의 값을 한 번에 가져오는 방법은 없는 듯.
(체크된 객체의 수는 한 번에 구할 수 있지만)
반복문을 사용해 체크된 객체인지 먼저 검사한 뒤, 그 객체의 value를 가져오는 방식의 코드이다.

위 코드를 응용해 "체크된 베이스들의 value값이 나열된 배열"을 만드는 데 성공했다!🎉
이제 이 배열의 인덱스를 통해 (또는 shift()를 통해) 체크된 베이스 값을 뽑아 쓰면 되겠다.

✅ 오늘 처리한 일

-html) 베이스에 더해 토핑, 시럽도 input type="checkbox" 로 만들고 name과 value값 주었음. (위 내용)
 

✅할일 )

DB) 위에서 준 name, value값에 맞게 db내의 데이터도 수정. API도 수정 .
각각 cbase, ctopping, csyrup값에 value와 동일한 영문이름값 주기. - cbase1_ENG
✔cbase2, ctopping2, csyrup2 들을 한 셀 안의 값으로 나열해 저장하기. -

Juni - 한글이름 그대로 value값을 주면 안 되나?

-index.html에 모든 플레이버 카드로 리스팅해주는 작업.

👾현재까지 발견된 오류들

- index외에 다른 페이지로 이동시 메뉴 버튼이 펼쳐지지 않음.
-> Juni가 처리해주기로!

-회원가입)아이디는 이메일로 하라고 적어놓기.

-로그인) 로그인이 안 되는 현상. ;; 
POST http://localhost:5000/customer_login 500 (INTERNAL SERVER ERROR)