과제 사전 설정
1.
이전 이터레이션에서 merge한 main 브랜치를 받아옵니다.
2.
작업용 브랜치 feature2 을 생성합니다.
$ git checkout main
$ git pull
$ git checkout -b feature2
Shell
복사
3.
생성한 feature2 브랜치가 이터레이션 #2 과제를 제출할 브랜치가 됩니다.
과제 내용
구현 요구 사항
위 화면과 같이 걸음 통계 페이지를 구현해주세요.
페이지 이동
1.
주어진 디자인을 참고하여 만보기 페이지에서 걸음 통계 페이지로 이동할 수 있도록 수정해주세요.
a.
통계 페이지로 이동할 때는 /src/utils/navigate.ts 의 navigateToPage 함수를 사용해주세요.
b.
통계 페이지의 코드는 /src/pages/StepStatisticsPage 경로의 하위 컴포넌트를 사용해주세요.
걸음수 표시
1.
상단의 현재 걸음 수 아래에 1초 마다 기기에서 가져온 현재 걸음 수를 표시해주세요.
2.
30초에 한번씩 현재 걸음 수를 서버로 전송해주세요.
3.
ProgressBar에 현재 걸음 수 기준 데이터를 표시해주세요.
a.
최솟값: 0, 최댓값: 10,000 으로 출력해주세요.
보상 받기 버튼
1.
사용자가 포인트를 받을 수 있는 경우 보상 받기 버튼을 활성화해주세요.
a.
지금까지 받지 않은 지난 모든 미션의 보상을 한꺼번에 수령하게 해주세요.
i.
버튼의 텍스트에 모든 미션의 포인트를 더해서 출력해주세요.
ii.
ex) 1,000 걸음, 5,000 걸음 보상을 받지 않았으며 각 미션이 10원 보상을 주는 경우 = 20원 받기
b.
사용자가 포인트를 받을 수 없는 경우 가장 달성이 가까운 미션의 보상을 표기하고 버튼을 비활성화 해주세요.
i.
ex) 10원 받기 비활성화 버튼 출력
c.
버튼 클릭 시 서버로 포인트 받기 요청을 보내도록 구현해주세요.
i.
요청 시, 현재 걸음 수를 서버로 전송해주세요.
2.
모든 미션의 포인트를 받았으면 버튼을 숨겨주세요.
세부 예시 보기
서버 API 문서
걷기 미션 목록
•
path: GET /api/step-mission/list
•
response
{
missions: [
{
stepCount: number, // 미션 성공 걸음 수
id: number, // 미션 id
rewardAmount: number, // 미션 리워드 금액
}
]
}
TypeScript
복사
미션 리워드 수령
•
path: POST /api/step-mission/${missionId}/reward
•
request body
{
currentStepCount: number, //현재 걸음수
}
JavaScript
복사
•
response
{
rewardAmount: number, // 미션 성공으로 지급된 포인트 금액
}
TypeScript
복사
내 정보
•
path: GET /api/me
•
response
{
pointAmount: number, // 현재 보유 포인트
rewardedList: number[] // 달성한 미션 id 목록
}
TypeScript
복사
걸음수 동기화
•
path: POST /api/step-mission/sync-step
•
request body
{
currentStepCount: number, //현재 걸음 수
}
JavaScript
복사
•
response
true
TypeScript
복사
앱브릿지 @toss-next/toss-app-bridge API 문서
현재 걸음 수 정보
•
method name: getStepCount
•
response
Promise<{
stepCount: number;
}>
TypeScript
복사
과제 제출하기
과제 제출하기
1.
작업이 완료되면 feature2 브랜치를 GitHub 원격 저장소에 푸시해주세요.
2.
작업이 잘 되었다면 GitHub에 다시 접속했을 때 [Compare & Pull Request] 초록색 버튼을 확인하실 수 있어요.
3.
[Compare & Pull Request] 버튼을 누르고 Pull Request를 생성해주세요. main 브랜치에 병합하는 형태가 되도록 Pull Request를 생성해주세요.
a.
Pull Request의 본문은 자유롭게 작성해주세요.
4.
main 브랜치에 병합해주세요.
이어서
다음 이터레이션을 수행하기 위해 노란색으로 강조된 링크를 따라가주세요.
이 문제의 저작권은 주식회사 비바리퍼블리카에 있으며, 지원자는 오로지 채용을 위한 목적으로만 이 문제를 활용할 수 있습니다. 이 문제의 전부 또는 일부를 공개, 게재, 배포, 제3자에게 제공하는 등의 일체의 “누설 행위”에 대해서는 저작권법에 의해 민・형사상의 책임을 질 수 있습니다. 이 "누설 행위"에는 문제의 문구를 변형하여 그 취지를 알 수 있도록 하는 경우도 포함됩니다.


