담당 도메인
Donate : 책 기부 게시판은 우리 웹사이트의 핵심 기능 중 하나입니다.
우리 웹사이트의 회원들은 책 기부 게시판을 통해 쉽고 편하게 책 기부를 신청하고, 해당 기부 신청을 수정하거나 삭제하고, 이전 기부 내역이나 현재 기부 진행 상황을 조회할 수 있습니다.
세부 목차
클릭하면 해당 부분으로 이동합니다.
책 기부 게시판의 핵심 :
•
오직 회원만 책 기부를 신청할 수 있고, 비회원은 책 기부를 신청할 수 없습니다.
•
해당 기부글을 작성한 회원과 관리자만 그 기부글을 조회, 수정, 삭제할 수 있습니다.
이유 : 우리 웹사이트의 책 기부는 재단 직원이 회원의 집으로 직접 방문하여 책을 수거하는 방식이라, 기부 신청글에 이름, 연락처, 주소 등과 같은 민감한 개인정보가 많이 포함되어 있기 때문입니다.
•
이를 위해 책 기부 (신청)과 (조회, 수정, 삭제)의 접근 방식을 구분하기로 했습니다.
◦
즉, 신청은 신청페이지에서 가능합니다.
◦
조회, 수정, 삭제는 마이페이지에서만 가능합니다.
이제 웹사이트에 직접 접속하여 책 기부 게시판의 주요 기능들을 시연해 보겠습니다.
시연 순서)
비회원 상태로 책 기부 신청페이지 접근
→ 로그인 후 일반회원 상태로 책 기부 신청
→ 마이페이지로 이동하여 전체 기부내역 목록 조회
→ 해당 기부글 클릭하여 상세 조회
→ 해당 기부글 수정
→ 해당 기부글 삭제
•
주목 포인트
◦
비회원은 책 기부 게시판을 이용할 수 없다. (등록,조회,수정,삭제 모두X)
◦
해당 기부글을 작성한 회원만 그 글을 조회, 수정, 삭제할 수 있다.
◦
기부글을 신청할 때, 모든 필수 정보가 비어있지 않고, 조건에 맞게 입력되어 있을 때만 신청 버튼이 활성화된다.
이슈 : 어떻게 하면 백엔드에서 DonateServiceImpl.java 쪽에 있는 Register 나 Modify 메서드를 작성할 때, 가독성이 높은 클린 코드를 구현할 수 있을까?
•
책 기부를 신청할 때 입력해야 하는 정보가 10개 이상이라, (이름,이메일,전화번호 등등…)
Register, Modify 메서드의 로직을 짤 때, 그 안에 바로 get(), set() 메서드를 주루룩 적다보니 코드가 너무 길어지고 지저분해지는 문제가 있었습니다.
해결 : request 객체와 별도의 메서드를 활용해서, 일일이 값을 새로 넣어주거나, 일일이 새로 값을 바꿔주는 부분을 보이지 않게 뒤로 숨겨놓았습니다.
•
이렇게 하고 나니 코드의 가독성과 유지보수성이 훨씬 향상되었습니다.
•
참고 캡쳐
책 기부 신청 메서드 (donateRegister) 로직 흐름
책 기부 수정 메서드 (donateModify) 로직 흐름
•
참고 링크
작성한 이슈글
버그 :
•
책 기부 신청 페이지(DonateRegisterForm)에서, 모든 입력값이 비어있지 않으면 (즉, 입력 조건에 맞지 않는 이상한 값이더라도 일단 들어있기만 하면) 신청하기 버튼이 활성화되었습니다.
디버그 :
•
신청 버튼이 활성화 되는 조건을 수정하였습니다.
◦
기존에는 입력값이 비어있지만 않으면 true 값을 반환했지만,
( this.formData.name && … )
◦
수정 후에는 입력값이 비어있지 않고, 입력조건에 맞아야 true값을 반환합니다.
( this.rules.name[0](this.formData.name && …) === true && … )
•
참고 캡쳐
책 기부 신청 페이지 (DonateRegisterForm) 의 다음으로, 신청하기 버튼
책 기부 신청 페이지 (DonateRegisterForm) 의 버튼 활성화 제한 메서드
한계 : 시간과 실력이 부족했던 탓에, 아직 잡지 못한 버그와 구현하지 못한 기능들이 많이 남아있습니다.
ex.
•
책기부 신청페이지의 버튼활성화 버그는 고쳤지만, 책기부 수정페이지의 버튼활성화 버그는 아직 고치지 못함
•
관리자가 모든 회원의 책기부 신청을 확인하고 처리할 수 있는 기능을 아직 구현하지 못함
개선 계획 : 수료 이후에도 디버그 및 업데이트 작업을 계속해서 진행하여 프로젝트의 완성도를 더욱 높이도록 하겠습니다.