BEFORE
const API: APItype = {
tabType: basicURL + `/issues/form`,
createIssue: basicURL + `/issues/form`,
editDeleteMilestone: (milestoneID) => basicURL + `/milestones/${milestoneID}`,
editIssueTitle: (issueId: number) => basicURL + `/issues/${issueId}/title`,
labelURL: basicURL + '/labels',
editLabel: (id) => basicURL + '/labels/' + id,
editIssueDetailOption: (id, type) => basicURL + `/issues/${id}/${type}s`,
...(생략)...
};
때문에 API 상수관리가 필요했고
API를 사용하는 컴포넌트를 명시,
요청하는 메서드와 요청 내용으로 나누어 명시해서 필요한 API를 빠르게 찾을 수 있게 수정했다.
AFTER
const API: APItype = {
ISSUE: {
GET: { ALL: basicURL + `/issues?`, FILTER: basicURL + `/issues/search?` },
POST: basicURL + `/issues/form`,
},
ISSUE_DETAIL: {
GET: {
CLICKED: (id) => basicURL + "/issues/" + id,
OPEN: basicURL + `/issues?status=close`,
CLOSE: basicURL + `/issues?status=open`,
},
PATCH: {
FILTER: (id, type) => basicURL + `/issues/${id}/${type}s`,
TITLE: (issueId) => basicURL + `/issues/${issueId}/title`,
},
POST: {
FILE: basicURL + `/images`,
COMMENTS: (issueId) => basicURL + `/issues/${issueId}/comments`,
},
},
MILESTONE: {
GET: { ALL: (status) => basicURL + `/milestones?status=${status}` },
POST: { CREATE: basicURL + `/milestones` },
PATCH: {
EDIT: (milestoneID) => basicURL + `/milestones/${milestoneID}`,
OPEN_CLOSE: (status) => basicURL + `/milestones?status=${status}`,
},
DELETE: (milestoneID) => basicURL + `/milestones/${milestoneID}`,
},
LABEL: {
GET: basicURL + "/labels",
PATCH: (id) => basicURL + "/labels/" + id,
DELETE: (id) => basicURL + "/labels/" + id,
POST: basicURL + "/labels",
},
...(생략)...
};