일정 관리 서비스 Taskify

당신을 위한 새로운 일정관리, Taskify

웹에서든 모바일에서든 편리하게 사용해보세요!

프로젝트 소개

Taskify는 팀원들과 일정을 공유하고 관리하기 위해 만들어진 서비스입니다.

자유롭게 대시보드를 생성하고, 대시보드 안에서 여러 칼럼들을 두어 할 일을 관리할 수 있습니다.

또한 이메일로 팀원을 자신의 대시보드에 초대해 할 일을 공유할 수 있습니다.

배포 주소

https://taskify-schedule.vercel.app/

팀원 소개

박소현	김선혜	조연아	홍재원
@ParkSohyunee	@HaydenDevK	@yunajoe	@Hongjw030

😆 박소현

• 페이지 : 마이대시보드 페이지, 대시보드 수정페이지
• 공통 : 사이드바 컴포넌트, 대시보드 목록, 생성, 수정 컴포넌트, 구성원, 초대내역 컴포넌트
• 기능
  • 대시보드 생성, 수정, 삭제 기능
  • 대시보드 목록, 구성원 내역, 초대 내역 페이지네이션 구현
  • 초대하기, 초대 취소 기능
  • 구성원 삭제 기능

😋 김선혜

• 페이지 : 마이대시보드 페이지, 대시보드 상세 페이지
• 공통 : 칼럼 모달 컴포넌트, 칼럼 리스트 컴포넌트, 초대 받은 대시보드 컴포넌트
• 기능
  • 칼럼 생성, 수정, 삭제 기능
  • 초대 받은 대시보드 응답(수락, 거절) 기능
  • 초대 받은 대시보드 제목 검색 기능
  • 초대 받은 대시보드 무한스크롤 기능

😊 조연아

• 페이지 : 대시보드 상세페이지
• 공통 : 할일 카드 생성 컴포넌트, 할일 카드 수정 컴포넌트, 할일 카드 상세 컴포넌트, 공통 모달 컴포넌트
• 기능
  • 할일 카드 생성, 수정, 삭제 기능
  • 태그 기능, 이미지 업로드 기능, 캘린더에서 날짜 선택 기능
  • 할일 카드 상세에서 댓글 생성, 수정, 삭제 기능
  • 댓글 무한스크롤 기능

😙 홍재원

• 페이지 : 로그인 페이지, 회원가입 페이지, 마이페이지, 랜딩페이지, 404페이지
• 공통 : navBar 컴포넌트, 회원가입 및 로그인 form 컴포넌트, 프로필 및 비밀번호 변경 컴포넌트
• 기능
  • 회원가입, 로그인, 로그아웃 기능
  • 네브바에 멤버 보여주기
  • 프로필 사진 업로드 기능, 프로필 수정 기능
  • 비밀번호 변경 기능
  • 미들웨어 및 interceptor

시작 가이드

git clone https://github.com/codeit-team-project/taskify.git

yarn add

기술 스택

Tools

Config

Development

Comumnication

주요 기능 및 디자인

메인 페이지

서비스를 소개하는 메인 페이지입니다.

데스크탑 화면	모바일 화면

로그인, 회원가입 페이지

이메일 주소와 비밀번호를 입력해 로그인, 회원가입을 할 수 있습니다.

중복된 이메일, 잘못된 주소의 이메일은 회원가입을 할 수 없게 체크하고, 인풋에 값이 모두 채워지지 않았다면 폼을 제출할 수 없게 막습니다.

회원가입	로그인

회원가입 실패 시	로그인 실패 시

회원가입 에러 문구	로그인 에러 문구

마이 대시보드 페이지

로그인에 성공한 후 바로 리다이렉트 되는 페이지입니다.

사이드 바, 내비게이션, 대시보드 목록, 초대받은 대시보드 목록으로 이루어져있습니다. 사용자 본인이 만든 대시보드는 이름 옆에 왕관 아이콘이 자동으로 추가됩니다.

마이 대시보드 페이지 초기	마이 대시보드 페이지 샘플

사용자는 초대를 수락하거나 거절할 수 있고, 대시보드를 새로 생성할 수 있습니다.

대시보드 생성	초대 수락 및 거절

대시보드 상세 페이지

사이드바의 대시보드를 누르면 각 대시보드의 상세페이지로 이동합니다.

내비게이션에서는 대시보드의 타이틀, 멤버 리스트를 보여주고, 사이드바에선 현재 위치한 대시보드를 표시해줍니다. 생성된 대시보드에는 자동으로 Todo, onProgress, Done 컬럼이 생성되며 사용자가 직접 컬럼을 추가, 삭제할 수 있습니다.

대시보드 상세 페이지	대시보드 컬럼 추가

대시보드 컬럼 이름 변경	대시보드 컬럼 삭제

사용자는 각 컬럼에서 할 일을 추가할 수 있습니다.

컬럼 내 카드 추가	컬럼 내 카드 삭제

컬럼 내 카드 디자인	컬럼 내 카드 댓글

대시보드 수정 페이지

만약 사용자가 해당 대시보드의 관리자일 경우 내비게이션의 관리 버튼을 눌러 edit 페이지로 이동할 수 있습니다.

사용자가 관리자일 경우	사용자가 관리자가 아닐 경우

대시보드 이름, 구성원, 초대 내역 리스트, 대시보드 삭제 버튼이 있습니다.

대시보드 편집 페이지	대시보드 초대 기능

마이 페이지

내비게이션의 드롭다운 메뉴를 통해 마이페이지로 이동할 수 있습니다.

프로필 영역에선 자신의 이미지 사진과 닉네임을 변경할 수 있으며, 이메일은 변경 불가능합니다.

프로필 수정	비밀번호 수정

에러 페이지

기본적으로 잘못된 url로 접근 시 공통 404 페이지로 이동합니다.

만약 대시보드 상세 페이지에서 잘못된 대시보드 id url로 접근 시 대시보드 404 ui가 보입니다.

404 페이지	대시보드 404 페이지