Search
💸

토스팀 Frontend Developer 기술 과제 안내: 소비 내역

생성형 AI 활용은 부정행위에 포함되며 합격 여부에 영향을 줄 수 있습니다.
타인의 도움을 받는 행위(대리 응시, 답안 공유 등)는 모두 금지합니다.

과제 소개

기술과제는 총 4번의 기능 구현 이터레이션리팩토링 과제로 구성되어 있어요.
기술과제의 제한 시간은 최대 6시간입니다.
먼저 4번의 기능 구현 이터레이션을 최대 5시간 안에 해결합니다.
이터레이션 간 시간 배분은 자유로우며 모두 해결하지 못했더라도 5시간이 지나기 전에 제출 후, 리팩토링 과제를 진행해주세요.
이후 리팩토링 과제를 최대 1시간 안에 해결합니다.
각 과제의 제한 시간을 넘기지 않도록 시간에 유의해주세요.
디테일을 챙길 수 있도록 과제를 꼼꼼히 읽어주세요.

문제해결 가이드

문제를 푸는 시간이 제한되어 있습니다. 기한 안에 과제를 제출할 수 있도록 시간에 유의해주세요.
화려한 방법보다는 평소에 하던 가장 익숙한 방법으로 문제를 해결할 것을 권장합니다.
실행 환경은 node 18 이상과 Google Chrome 등 모던 브라우저를 권장해요.
완성을 위해 필요한 라이브러리가 있다면 자유롭게 사용해주세요.
의문점이 있다면 스스로 합리적인 가설을 세우고 계속 진행해주세요.
사용자 경험을 개선하고 싶은 지점이 있다면 구현에 포함 시키거나 README 등 문서로 남겨주세요.
각 요구사항을 해결할 때마다 Git 커밋을 생성해주세요.

사전 설정

과제를 진행하기 전, 아래 안내사항에 따라 사전 설정을 진행해주세요.

Git 저장소 만들기

아래 파일을 내려받고 압축을 풀어주세요.
  Git 저장소 파일:
toss-consumptions.zip
182.7KB

GitHub 원격 저장소 만들기

1.
https://github.com/new 를 브라우저에서 열어, 첨부된 이미지 처럼 입력하고 [Create repository]를 클릭해주세요.
a.
Repository name: toss-consumptions
b.
Public/Private: Private
2.
레포지토리 화면에서 [Settings] > [Collaborators] 로 이동하고, [Add people] 를 클릭해주세요.
3.
toss-fe-interview 계정을 Collaborator로 초대해주세요.

작업 준비하기

다시 로컬 환경에 압축을 푼 디렉토리로 돌아와서 아래 작업을 진행해주세요.
1.
git 저장소를 설정합니다.
$ git init $ git add . $ git commit -m "initial commit"
Shell
복사
2.
로컬 레포지토리와 GitHub 원격 저장소를 연결합니다.
로컬 레포지토리에서 git remote add 명령어를 이용하여 방금 생성한 GitHub 원격 레포지토리를 연결합니다. origin 에 현재 로컬 레포지토리의 main 브랜치를 푸시합니다.
$ git remote add origin https://github.com/<내 GitHub ID>/toss-consumptions.git $ git push -u origin main
C++
복사
필요하다면 GitHub 계정의 ID/PW로 로그인을 진행해주세요.

미리 주어진 코드베이스 확인하기

1.
로컬 레포지토리 루트에서 yarn 을 이용하여 의존성을 설치해주세요.
2.
yarn dev 를 입력하여 로컬 서버를 실행해주세요.
3.
http://localhost:5173/에 접속하시면 미리 주어진 시작 화면을 확인할 수 있습니다.

이어서

본격적으로 과제를 시작하기 위해 노란색으로 강조된 링크를 따라가주세요.
 기술 과제 안내
 이터레이션 #1. 소비 내역 목록
 이터레이션 #2. 소비 통계 보기
이 문제의 저작권은 주식회사 비바리퍼블리카에 있으며, 지원자는 오로지 채용을 위한 목적으로만 이 문제를 활용할 수 있습니다. 이 문제의 전부 또는 일부를 공개, 게재, 배포, 제3자에게 제공하는 등의 일체의 “누설 행위”에 대해서는 저작권법에 의해 민・형사상의 책임을 질 수 있습니다. 이 "누설 행위"에는 문제의 문구를 변형하여 그 취지를 알 수 있도록 하는 경우도 포함됩니다.