📝 독스루 (DocThru)

https://doc-thru-fe.vercel.app/

📌 프로젝트 소개

DocThru는 기술 문서 번역을 통해 개발자들이 함께 성장할 수 있도록 도와주는 챌린지 기반 협업 번역 플랫폼입니다.

사용자는 원하는 번역 챌린지에 참가 신청을 할 수 있습니다.
지정된 문서를 웹 기반 에디터에서 번역하고, 다른 사용자로부터 피드백을 받을 수 있습니다.
관리자는 번역 챌린지를 승인/거절하거나, 사용자의 번역물을 목록 및 상세 조회할 수 있습니다.

🗓️ 개발 기간

2025년 3월 24일 (월) ~ 4월 16일 (화)
총 약 3주간 진행

👨‍👩‍👧‍👦 팀원 정보

이름	프론트엔드 주요 담당 역할
김희성	공통 컴포넌트, 로그인, 회원가입, 챌린지 목록, 챌린지 생성 페이지
김조순	공통 컴포넌트, 챌린지 상세(승인, 모집 마감, 시간 마감), 작업물 상세 페이지
윤민호	공통 컴포넌트, 챌린지 상세(승인 대기, 삭제, 거절) 페이지
이동혁	작업물 생성(에디터) 페이지
최은비	관리자 신청 관리, 나의 챌린지 - 신청한 챌린지 페이지
김승우	버그 수정 및 유지보수

기술 스택

분류	기술스택
언어	TypeScript
스타일	Tailwind CSS
프론트 프레임워크	Next.js(App Router)
컴포넌트	Storybook
상태관리	Context API, Zustand, Tanstack-Query
에디터	React-Quill

주요 기능 소개

랜딩 페이지

회원가입

비회원 라우팅

비회원은 챌린지 목록(메인화면)만 접근이 가능함.

챌린지 목록 조회

필터링
검색
페이지네이션

챌린지 생성 및 수정

나의 챌린지

알림

관리자

챌린지 관리, 챌린지 목록

챌린지 승인

챌린지 거절

챌린지 삭제

챌린지 상세

라이브 중인 챌린지

모집 인원이 마감된 챌린지

시간이 마감된 챌린지

번역물 작성

임시저장
최종제출

번역물 상세

피드백

좋아요

프로젝트 구조

파일 트리 보기

📦src
 ┣ 📂api
 ┃ ┣ 📂Translation
 ┃ ┃ ┣ 📜api.ts
 ┃ ┃ ┗ 📜hook.ts
 ┃ ┣ 📂admin
 ┃ ┃ ┗ 📜admin.ts
 ┃ ┣ 📂auth
 ┃ ┃ ┣ 📜AuthApi.ts
 ┃ ┃ ┣ 📜AuthHook.ts
 ┃ ┃ ┗ 📜AuthStore.ts
 ┃ ┣ 📂challenge
 ┃ ┃ ┣ 📜ChallengeApi.ts
 ┃ ┃ ┗ 📜ChallengeHooks.ts
 ┃ ┣ 📂feedback
 ┃ ┃ ┣ 📜api.ts
 ┃ ┃ ┗ 📜hook.ts
 ┃ ┣ 📂like
 ┃ ┃ ┣ 📜api.ts
 ┃ ┃ ┗ 📜hook.ts
 ┃ ┣ 📂notification
 ┃ ┃ ┗ 📜notification.api.ts
 ┃ ┗ 📜url.ts
 ┣ 📂app
 ┃ ┣ 📂_components
 ┃ ┃ ┗ 📜ClientLayout.tsx
 ┃ ┣ 📂admin
 ┃ ┃ ┣ 📂challenges
 ┃ ┃ ┃ ┣ 📂[id]
 ┃ ┃ ┃ ┃ ┣ 📂components
 ┃ ┃ ┃ ┃ ┃ ┣ 📜cardDetail.tsx
 ┃ ┃ ┃ ┃ ┃ ┣ 📜index.tsx
 ┃ ┃ ┃ ┃ ┃ ┣ 📜nav.tsx
 ┃ ┃ ┃ ┃ ┃ ┣ 📜status.tsx
 ┃ ┃ ┃ ┃ ┃ ┗ 📜statusBottom.tsx
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂components
 ┃ ┃ ┃ ┃ ┗ 📜ChallengeTable.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┗ 📜layout.tsx
 ┃ ┣ 📂auth
 ┃ ┃ ┣ 📂login
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂signup
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┗ 📜layout.tsx
 ┃ ┣ 📂main
 ┃ ┃ ┣ 📂challenge
 ┃ ┃ ┃ ┣ 📂[id]
 ┃ ┃ ┃ ┃ ┣ 📂components
 ┃ ┃ ┃ ┃ ┃ ┣ 📜ListItems.tsx
 ┃ ┃ ┃ ┃ ┃ ┣ 📜MostRecommend.tsx
 ┃ ┃ ┃ ┃ ┃ ┣ 📜Participation.tsx
 ┃ ┃ ┃ ┃ ┃ ┗ 📜Title.tsx
 ┃ ┃ ┃ ┃ ┣ 📂edit
 ┃ ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂_components
 ┃ ┃ ┃ ┃ ┣ 📜ChallengeHead.tsx
 ┃ ┃ ┃ ┃ ┣ 📜ChallengeMain.tsx
 ┃ ┃ ┃ ┃ ┗ 📜Pagination.tsx
 ┃ ┃ ┃ ┣ 📂new
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📜layout.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂my-challenge
 ┃ ┃ ┃ ┣ 📂[id]
 ┃ ┃ ┃ ┃ ┣ 📂components
 ┃ ┃ ┃ ┃ ┃ ┣ 📜cardDetail.tsx
 ┃ ┃ ┃ ┃ ┃ ┣ 📜index.tsx
 ┃ ┃ ┃ ┃ ┃ ┗ 📜status.tsx
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂components
 ┃ ┃ ┃ ┃ ┣ 📜ChallengeTable.tsx
 ┃ ┃ ┃ ┃ ┣ 📜MyChallengeHead.tsx
 ┃ ┃ ┃ ┃ ┣ 📜MyChallengeMain.tsx
 ┃ ┃ ┃ ┃ ┗ 📜Pagination.tsx
 ┃ ┃ ┃ ┣ 📜layout.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂privacy-policy
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┣ 📂translation
 ┃ ┃ ┃ ┗ 📂[id]
 ┃ ┃ ┃ ┃ ┣ 📂_components
 ┃ ┃ ┃ ┃ ┃ ┣ 📜Author.tsx
 ┃ ┃ ┃ ┃ ┃ ┣ 📜Content.tsx
 ┃ ┃ ┃ ┃ ┃ ┣ 📜FeedBack.tsx
 ┃ ┃ ┃ ┃ ┃ ┣ 📜Title.tsx
 ┃ ┃ ┃ ┃ ┃ ┗ 📜modal.tsx
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┗ 📂translation-work
 ┃ ┃ ┃ ┣ 📂[id]
 ┃ ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┃ ┃ ┣ 📂_components
 ┃ ┃ ┃ ┃ ┣ 📜Editor.tsx
 ┃ ┃ ┃ ┃ ┣ 📜PatchCard.tsx
 ┃ ┃ ┃ ┃ ┣ 📜PatchMain.tsx
 ┃ ┃ ┃ ┃ ┣ 📜PostCard.tsx
 ┃ ┃ ┃ ┃ ┗ 📜PostMain.tsx
 ┃ ┃ ┃ ┗ 📜page.tsx
 ┃ ┣ 📂notification
 ┃ ┃ ┣ 📂components
 ┃ ┃ ┃ ┣ 📜NotificationBell.tsx
 ┃ ┃ ┃ ┗ 📜ProfileCard.tsx
 ┃ ┃ ┗ 📜page.tsx
 ┃ ┣ 📜layout.tsx
 ┃ ┣ 📜loading.tsx
 ┃ ┗ 📜page.tsx
 ┣ 📂core
 ┃ ┗ 📂provider
 ┃ ┃ ┣ 📜AuthProvider.tsx
 ┃ ┃ ┣ 📜ReactQueryProvider.tsx
 ┃ ┃ ┗ 📜ToastProvider.tsx
 ┣ 📂lib
 ┃ ┣ 📂api
 ┃ ┃ ┗ 📜admin.ts
 ┃ ┗ 📜utill.ts
 ┣ 📂shared
 ┃ ┣ 📂Img
 ┃ ┃ ┣ 📂arrow-icon
 ┃ ┃ ┃ ┣ 📂circle
 ┃ ┃ ┃ ┃ ┣ 📜down.svg
 ┃ ┃ ┃ ┃ ┗ 📜up.svg
 ┃ ┃ ┃ ┣ 📂next-arrow
 ┃ ┃ ┃ ┃ ┣ 📜big-arrow.svg
 ┃ ┃ ┃ ┃ ┗ 📜small-arrow.svg
 ┃ ┃ ┃ ┣ 📂no-stick
 ┃ ┃ ┃ ┃ ┣ 📜black.svg
 ┃ ┃ ┃ ┃ ┣ 📜gray.svg
 ┃ ┃ ┃ ┃ ┣ 📜icon_arrow_left.svg
 ┃ ┃ ┃ ┃ ┗ 📜icon_arrow_right.svg
 ┃ ┃ ┃ ┣ 📂normal
 ┃ ┃ ┃ ┃ ┣ 📜down.svg
 ┃ ┃ ┃ ┃ ┣ 📜link_click.svg
 ┃ ┃ ┃ ┃ ┗ 📜right.svg
 ┃ ┃ ┃ ┗ 📂toggle
 ┃ ┃ ┃ ┃ ┣ 📜down.svg
 ┃ ┃ ┃ ┃ ┗ 📜up.svg
 ┃ ┃ ┣ 📂bell-icon
 ┃ ┃ ┃ ┣ 📜bass.svg
 ┃ ┃ ┃ ┗ 📜noti.svg
 ┃ ┃ ┣ 📂check-icon
 ┃ ┃ ┃ ┣ 📜check.svg
 ┃ ┃ ┃ ┣ 📜roundCheck.svg
 ┃ ┃ ┃ ┗ 📜uncheck.svg
 ┃ ┃ ┣ 📂close-icon
 ┃ ┃ ┃ ┗ 📜close.svg
 ┃ ┃ ┣ 📂deadLine-icon
 ┃ ┃ ┃ ┣ 📜big.svg
 ┃ ┃ ┃ ┣ 📜small-white.svg
 ┃ ┃ ┃ ┗ 📜small.svg
 ┃ ┃ ┣ 📂editor-icon
 ┃ ┃ ┃ ┣ 📜alignment_center.svg
 ┃ ┃ ┃ ┣ 📜alignment_left.svg
 ┃ ┃ ┃ ┣ 📜alignment_right.svg
 ┃ ┃ ┃ ┣ 📜bold.svg
 ┃ ┃ ┃ ┣ 📜bullet.svg
 ┃ ┃ ┃ ┣ 📜coloring.svg
 ┃ ┃ ┃ ┣ 📜italic.svg
 ┃ ┃ ┃ ┣ 📜numbering.svg
 ┃ ┃ ┃ ┗ 📜underline.svg
 ┃ ┃ ┣ 📂feedback-icon
 ┃ ┃ ┃ ┣ 📜active.svg
 ┃ ┃ ┃ ┗ 📜inactive.svg
 ┃ ┃ ┣ 📂filter-icon
 ┃ ┃ ┃ ┣ 📂normal
 ┃ ┃ ┃ ┃ ┣ 📜active.svg
 ┃ ┃ ┃ ┃ ┗ 📜inactive.svg
 ┃ ┃ ┃ ┣ 📜document.svg
 ┃ ┃ ┃ ┗ 📜list.svg
 ┃ ┃ ┣ 📂like-icon
 ┃ ┃ ┃ ┣ 📜big-active.svg
 ┃ ┃ ┃ ┣ 📜big-inactive.svg
 ┃ ┃ ┃ ┣ 📜small-active.svg
 ┃ ┃ ┃ ┗ 📜small-inactive.svg
 ┃ ┃ ┣ 📂logo-icon
 ┃ ┃ ┃ ┣ 📜mainLogo.svg
 ┃ ┃ ┃ ┗ 📜textLogo.svg
 ┃ ┃ ┣ 📂math-symbols-icon
 ┃ ┃ ┃ ┗ 📜plus.svg
 ┃ ┃ ┣ 📂menu-icon
 ┃ ┃ ┃ ┗ 📜Meatballs.svg
 ┃ ┃ ┣ 📂modal-icon
 ┃ ┃ ┃ ┗ 📜check.svg
 ┃ ┃ ┣ 📂out-icon
 ┃ ┃ ┃ ┣ 📂circle
 ┃ ┃ ┃ ┃ ┣ 📜big-out.svg
 ┃ ┃ ┃ ┃ ┗ 📜small-out.svg
 ┃ ┃ ┃ ┗ 📜out.svg
 ┃ ┃ ┣ 📂person-icon
 ┃ ┃ ┃ ┣ 📜big.svg
 ┃ ┃ ┃ ┣ 📜small-white.svg
 ┃ ┃ ┃ ┗ 📜small.svg
 ┃ ┃ ┣ 📂profile-icon
 ┃ ┃ ┃ ┣ 📜admin.svg
 ┃ ┃ ┃ ┗ 📜member.svg
 ┃ ┃ ┣ 📂radio-icon
 ┃ ┃ ┃ ┣ 📜radioOff.svg
 ┃ ┃ ┃ ┗ 📜radioOn.svg
 ┃ ┃ ┣ 📂search-icon
 ┃ ┃ ┃ ┗ 📜ic_search.svg
 ┃ ┃ ┣ 📂vector-icon
 ┃ ┃ ┃ ┣ 📜crown-black.svg
 ┃ ┃ ┃ ┗ 📜crown-gold.svg
 ┃ ┃ ┣ 📂visibility-icon
 ┃ ┃ ┃ ┣ 📜visibilityOff.svg
 ┃ ┃ ┃ ┗ 📜visibilityOn.svg
 ┃ ┃ ┣ 📜close.svg
 ┃ ┃ ┣ 📜ic_list.svg
 ┃ ┃ ┣ 📜ic_out_circle.svg
 ┃ ┃ ┣ 📜icon_click.svg
 ┃ ┃ ┣ 📜img_logo .svg
 ┃ ┃ ┣ 📜logo.svg
 ┃ ┃ ┣ 📜medal.svg
 ┃ ┃ ┣ 📜search.svg
 ┃ ┃ ┣ 📜send_icon.svg
 ┃ ┃ ┣ 📜send_icon2.svg
 ┃ ┃ ┗ 📜thumbnail.svg
 ┃ ┣ 📂components
 ┃ ┃ ┣ 📂button
 ┃ ┃ ┃ ┗ 📜Button.tsx
 ┃ ┃ ┣ 📂card
 ┃ ┃ ┃ ┣ 📜Card.tsx
 ┃ ┃ ┃ ┣ 📜CardSelector.tsx
 ┃ ┃ ┃ ┗ 📜CardSkeleton.tsx
 ┃ ┃ ┣ 📂chip
 ┃ ┃ ┃ ┣ 📜ChipCardStatus.tsx
 ┃ ┃ ┃ ┗ 📜chip.tsx
 ┃ ┃ ┣ 📂container
 ┃ ┃ ┃ ┗ 📜Container.tsx
 ┃ ┃ ┣ 📂dropdown
 ┃ ┃ ┃ ┣ 📜DropDown.tsx
 ┃ ┃ ┃ ┣ 📜Filter.tsx
 ┃ ┃ ┃ ┣ 📜ProfileDropdown.tsx
 ┃ ┃ ┃ ┣ 📜Sort.tsx
 ┃ ┃ ┃ ┗ 📜index.tsx
 ┃ ┃ ┣ 📂form
 ┃ ┃ ┃ ┣ 📜AuthForm.tsx
 ┃ ┃ ┃ ┗ 📜ChallengeForm.tsx
 ┃ ┃ ┣ 📂input
 ┃ ┃ ┃ ┣ 📜date.tsx
 ┃ ┃ ┃ ┣ 📜email.tsx
 ┃ ┃ ┃ ┣ 📜index.tsx
 ┃ ┃ ┃ ┣ 📜password.tsx
 ┃ ┃ ┃ ┣ 📜search.tsx
 ┃ ┃ ┃ ┗ 📜text.tsx
 ┃ ┃ ┣ 📂layout
 ┃ ┃ ┃ ┣ 📜Footer.tsx
 ┃ ┃ ┃ ┣ 📜Header.tsx
 ┃ ┃ ┃ ┣ 📜Layout.tsx
 ┃ ┃ ┃ ┗ 📜core.ts
 ┃ ┃ ┣ 📂modal
 ┃ ┃ ┃ ┣ 📜confirm.tsx
 ┃ ┃ ┃ ┣ 📜confirmCancel.tsx
 ┃ ┃ ┃ ┣ 📜index.tsx
 ┃ ┃ ┃ ┣ 📜modalBase.tsx
 ┃ ┃ ┃ ┣ 📜navigate.tsx
 ┃ ┃ ┃ ┗ 📜send.tsx
 ┃ ┃ ┣ 📂popup
 ┃ ┃ ┃ ┗ 📜popup.tsx
 ┃ ┃ ┣ 📂tab
 ┃ ┃ ┃ ┣ 📜Tab.tsx
 ┃ ┃ ┃ ┗ 📜TabGroup.tsx
 ┃ ┃ ┣ 📜AnimateLoad.tsx
 ┃ ┃ ┣ 📜CheckBox.tsx
 ┃ ┃ ┣ 📜Divider.tsx
 ┃ ┃ ┣ 📜OriginView.tsx
 ┃ ┃ ┣ 📜RadioBtn.tsx
 ┃ ┃ ┣ 📜Reply.tsx
 ┃ ┃ ┗ 📜TextBox.tsx
 ┃ ┣ 📂fonts
 ┃ ┃ ┣ 📂Quantico
 ┃ ┃ ┃ ┣ 📜Quantico-Bold.woff2
 ┃ ┃ ┃ ┣ 📜Quantico-BoldItalic.woff2
 ┃ ┃ ┃ ┣ 📜Quantico-Italic.woff2
 ┃ ┃ ┃ ┗ 📜Quantico-Regular.woff2
 ┃ ┃ ┣ 📜NotoSerifKR.woff2
 ┃ ┃ ┗ 📜PretendardVariable.woff2
 ┃ ┣ 📂hooks
 ┃ ┃ ┣ 📜useMediaQuery.ts
 ┃ ┃ ┣ 📜useToastMutation.ts
 ┃ ┃ ┣ 📜useToastQuery.ts
 ┃ ┃ ┗ 📜useUnloadWarning.ts
 ┃ ┗ 📜globals.css
 ┣ 📂stories
 ┃ ┣ 📜Button.stories.ts
 ┃ ┣ 📜Card.stories.ts
 ┃ ┣ 📜Chip.stories.ts
 ┃ ┣ 📜ChipCardStatus.stories.ts
 ┃ ┣ 📜Confirm.stories.ts
 ┃ ┣ 📜ConfirmCancel.stories.ts
 ┃ ┣ 📜Container.stories.ts
 ┃ ┣ 📜DropDown.stories.ts
 ┃ ┣ 📜Filter.stories.ts
 ┃ ┣ 📜Header.stories.ts
 ┃ ┣ 📜InputDate.stories.ts
 ┃ ┣ 📜InputEmail.stories.ts
 ┃ ┣ 📜InputPwd.stories.ts
 ┃ ┣ 📜InputPwdConfirm.stories.ts
 ┃ ┣ 📜InputSearch.stories.ts
 ┃ ┣ 📜InputText.stories.ts
 ┃ ┣ 📜Navigate.stories.ts
 ┃ ┣ 📜Reply.stories.ts
 ┃ ┣ 📜SendModal.stories.ts
 ┃ ┣ 📜Sort.stories.ts
 ┃ ┣ 📜Tab.stories.ts
 ┃ ┣ 📜TextBox.stories.ts
 ┃ ┗ 📜popup.stories.ts
 ┣ 📜constants.ts
 ┣ 📜middleware.ts
 ┗ 📜types.ts

Name		Name	Last commit message	Last commit date
Latest commit History 385 Commits
.github		.github
.husky		.husky
.storybook		.storybook
public		public
src		src
.gitignore		.gitignore
.prettierignore		.prettierignore
.prettierrc		.prettierrc
README.md		README.md
eslint.config.mjs		eslint.config.mjs
next.config.ts		next.config.ts
package-lock.json		package-lock.json
package.json		package.json
postcss.config.mjs		postcss.config.mjs
settings.json		settings.json
tailwind.config.js		tailwind.config.js
tsconfig.json		tsconfig.json
vercel.json		vercel.json
vitest.config.ts		vitest.config.ts
yarn.lock		yarn.lock

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Repository files navigation

📝 독스루 (DocThru)

📌 프로젝트 소개

🗓️ 개발 기간

👨‍👩‍👧‍👦 팀원 정보

기술 스택