DEVELOP/Wee.T
-
[Wee.T] 아임포트(Iamport) 결제모듈을 연동하여 결제시스템 구현하기DEVELOP/Wee.T 2022. 9. 18. 01:47
https://chai-iamport.gitbook.io/iamport/ready 결제 연동 준비하기 - 결제연동 메뉴얼 아임포트 회원가입 이후 관리자 페이지 내 결제연동 -> 테스트 연동 관리 탭에서 연동하고자 하는 PG사를 선택합니다. chai-iamport.gitbook.io 아임포트 결제 API를 사용하면 실제 결제가 가능한 서비스를 구현해볼 수 있습니다. 초기설정 메뉴얼은 해당 가이드를 참고하여 회원가입과 PG사 설정, 인증키를 발급받습니다. 결제서비스의 전체적인 흐름 구현한 전체적인 로직의 흐름은 다음과 같습니다. 1. 클라이언트에서 결제창을 통해 결제 요청을 보낸다. (아임포트 API 사용) 2. 결제 성공시 ajax통신을 사용하여 결제를 검증하는 컨트롤러로 요청을 보낸다. 3. 서버에서 검..
-
[Wee.T] 스케줄러(@Scheduled)를 사용해 주기적으로 자동실행되는 로직 구현하기DEVELOP/Wee.T 2022. 9. 16. 13:09
Wee.T에서 PT를 개설하면, 종료일이라는 개념이 없고, 횟수차감제로 운영됩니다. 이는 실제 헬스 PT가 이루어지는 방식을 재현하고자 한 것인데, 정해진 횟수를 결제하고(ex. 30회) 헬스장에 갈 때마다 횟수가 차감되어 30회를 다 채우면 종료되는 방식입니다. 이를 프로그램으로 구현하기 위해서는 날짜가 지나면 횟수가 자동으로 차감되는 로직을 구현해야 합니다. 진행상황이 업데이트 되어야하는데, 업데이트 되는 조건이 시간인 상황입니다. PT 테이블(t_class)의 ERD 중 스케줄과 등록 관계를 나타내는 관계만 나타내었습니다. 형광펜으로 표시한 컬럼들이 중요합니다. t_class_listenr(PT 수강테이블) 테이블에 PT를 등록한 사람들의 진행현황을 나타내기 위한 progress 컬럼과, 해당 PT..
-
[Wee.T] 게시글 임시저장 기능 구현하기DEVELOP/Wee.T 2022. 9. 16. 09:58
이전에 개발한 커뮤니티 REST API를 사용하여 임시저장 기능을 구현하였습니다. 컨트롤러 쪽 코드는 완성되어있기 때문에 이번에는 클라이언트에서 ajax통신으로 데이터를 주고받는 스크립트 코드 위주로 정리하였습니다. 고려한 부분은 다음과 같습니다. 1. 임시저장의 작성 / 수정 / 삭제 2. 임시저장 게시글을 불러오기 3. 임시저장한 글을 불러와서 실제 게시글 작성을 하면 해당 게시글은 임시저장 리스트에서 사라지도록 하기 DB의 게시글 테이블입니다. 게시글들은 하나의 테이블에서 관리하고, 임시저장 여부를 컬럼으로 구분하여 사용합니다. 테이블을 이렇게 설계해놓았기 때문에, 사실 임시저장의 CRUD로직은 게시글 CRUD로직과 동일합니다. comm_tempsave의 컬럼값만 다르게 넣어주면 됩니다. 임시저장 ..
-
[Wee.T] 커뮤니티 REST API 개발, Swagger를 이용한 문서 자동화 설정DEVELOP/Wee.T 2022. 9. 16. 09:54
Wee.T의 커뮤니티는 REST API 방식으로 개발하고, API 문서는 Swagger를 적용하여 자동화 하였습니다. REST API 설계시 고려했던 점 1. URI 규약을 준수하여 보다 Restful하게 만들기 2. 용도에 맞는 HTTP Method를 사용할 것(GET, POST, PUT, DELETE) Swagger를 사용한 이유? 1. API문서의 자동화가 가능하고, 내 마음대로 커스터마이징 할 수 있다는 장점이 있습니다. 2. swagger-ui 내에서 테스트가 가능하다는 점. 어떤 형식으로 리턴되는지 바로바로 확인할 수 있다는 장점 3. (주관적) 다른 API 문서 툴과 비교하여 가장 직관적이라고 생각되는 UI * 스웨거의 초기 세팅 과정은 이전 포스팅에 작성하였습니다. https://shuri..
-
[Wee.T] 쿠폰페이지 개발(조회, 등록) ajax로 처리하기DEVELOP/Wee.T 2022. 8. 21. 21:26
uri 매핑작업까지 다 마쳐셔, 본격적으로 기능구현을 시작했습니다. 이번에 구현한 페이지는 쿠폰페이지입니다. 이런식으로 동작하는 페이지를 만들었습니다. 쿠폰페이지의 기능은 크게 다음과 같이 나눌 수 있는데, 1. [쿠폰북]엔 다운로드 가능한 쿠폰들의 목록이 보여진다. 2. [내 쿠폰] 탭을 통해 보유한 쿠폰들을 조회할 수 있다. 3. [쿠폰북]의 쿠폰을 다운로드받으면 [내쿠폰] 탭에 추가된다. 4. 쿠폰코드를 직접 입력해 쿠폰을 등록할 수 있다. 이렇게 등록한 쿠폰은 바로바로 [내쿠폰] 탭에 추가된다. 2번 내쿠폰을 조회하는 부분과 4번 기능은 처음부터 ajax로 처리할 것을 염두에 두었습니다. 아무래도 등록할 때마다 새로고침되는 것보단 바로바로 추가되는 것이 좀더 완성도 높은 페이지라 생각했기 때문입니..
-
[Wee.T] 6. Request URI Mapping표 작업, 매핑 설계DEVELOP/Wee.T 2022. 8. 11. 04:39
화면 퍼블리싱 작업이 어느정도 끝나서, 백엔드 구현 전 전처리 작업에 들어갔다. 크게 이렇게 나눠서 진행하였고, 여기서 가장 중요한건 Request URI Mapping 설계작업이었다. 우선 보기 쉽게 표로 정리한 후 그대로 프로젝트에 컨트롤러와 메소드를 만들어두기로 정했다. 이 역시 처음부터 다같이 만드는 것보다 한사람이 어느정도 틀을 만들어 두는 것이 좋을 것 같아서 폴더구조 설계와 전체 페이지들의 매핑작업을 대략적으로 만들고 팀원분들께 공유했다. 기능별로 크게 대분류를 나누고, controller이름, base-uri 매핑, 그리고 목적에 따른 세부 uri매핑과 request유형, 메소드 타입과 이름, 리턴값, 설명을 작성했다. 기능 구현 전 폴더구조는 어떻게 잡아놓는게 좋을지 고민을 해봤다. 깃허..
-
[Wee.T] 와이어 프레임 작성하기, 협업 툴 사용하기DEVELOP/Wee.T 2022. 6. 18. 23:24
2022.06.06 ~ 2022.06.16 요구사항명세서를 토대로 와이어프레임을 작성했다. 먼저 와이어프레임을 작성하기 위한 툴을 회의를 통해 결정했다. 검색해본 결과 두가지 툴 중에 결정하기로 했다. 1. 카카오 오븐 https://ovenapp.io/ OvenApp.io Oven(오븐)은 HTML5 기반의 무료 웹/앱 프로토타이핑 툴입니다. (카카오 제공) ovenapp.io 2. Figma https://www.figma.com/files/ Figma www.figma.com 회의하면서 두 사이트들을 가볍게 둘러봤는데, 카카오 오븐이 처음 봤을 때 사용하기가 너무 편했고, 이미 만들어진 요소들이 많아서 제작하기 쉬울 것 같았다. 피그마는 훨씬 전문적이었고, 딱 봤을 때 생소한 것이 많아서 진입장벽이..
-
[Wee.T] 요구사항 명세서 작성하기DEVELOP/Wee.T 2022. 6. 18. 21:46
2022.06.03 ~ 2022.06.09 정한 주제를 토대로, 요구사항 명세서를 작성했다. 먼저 필요한 페이지를 크게 나누고, 페이지별로 요구사항들을 정리했다. 요구사항은 회의를 통해 다같이 진행했고, 비슷한 플랫폼의 타 웹사이트들을 참고해가며 작성했다. 초기단계라 러프하게 진행했음에도 불구하고 굉장히 많은 요구사항들이 나왔다. 엑셀시트에 정리하는 것은 조장님이 맡아서 하셨는데, 저 탭을 클릭하면 해당 부분만 보여준다. 완전 짱이다bb😍 와이어 프레임 작업을 하면서도 요구사항 명세서를 계속 수정했다. 그리고 간단히 사용할 api에 대해서도 찾아보고, 어떻게 이용할건지에 대해 정리해두었다. api를 알아보면서 의외로 복잡한 작업이 필요한 경우도 있었다. 예를 들면 주소를 검색해서 지도에 표시하는 기능을 ..