Taskify



Taskify - 일정 관리 서비스

개발 모드로 실행하기

git clone https://github.com/19-Takify/19-taskify.git

npm install

npm run dev


📂 프로젝트 소개

Taskify는 쉽고 간편하게 대시보드를 생성하고 일정을 만들어 관리 및 공유 할 수 있는 서비스 입니다.

  • 현대인의 바쁜 생활과 다양한 업무를 고려하여 사용자가 쉽고 간편하게 일정을 관리하는 서비스를 제공합니다.
  • 상대방의 일정을 확인할 수 있고 공유할 수 있어서 직장인, 모임, 동아리 등 단체 활동에 안성 맞춤인 서비스 입니다.


⚙️ TechStack





🍃 Communication




👏 팀원 구성

FE : 기송은
@q45402sk
FE : 박유빈
@yb3143
FE : 여승구
@skoo1100
FE : 이우혁
@woo29
FE : 정봉찬
@devwqc

🚩 역할 분담

인증 팀

기송은

  • 로그인 & 회원가입 페이지
  • Cookie 인증
  • 할 일 수정 모달

정봉찬

  • 로그인 & 회원가입 페이지
  • Cookie 인증
  • 컬럼 모달

기능 팀

박유빈

  • 모달 컴포넌트
  • 디자인 작업

여승구

  • 버튼 공통 컴포넌트
  • 나의 대시보드 페이지
  • 대시보드 페이지

이우혁

  • 랜딩 페이지
  • 대시보드 페이지
  • 대시보드 & 계정 관리 페이지
  • 404 페이지

📝 컨벤션

코드 컨벤션

폴더 구조

  • 공통 컴포넌트: src/components/에 작성
  • 페이지에 종속된 컴포넌트: src/pages/페이지명/components에 작성

코드 네이밍

  • 변수, 함수: 카멜 케이스로 작성
  • 상수: 대문자 + 스네이크 네이밍으로 작성
  • 클래스, 컴포넌트, 타입: 파스칼 케이스로 작성

파일 네이밍

  • components, pages: 파스칼 케이스로 작성
  • hooks: use prefix로 작성
  • 그 외: 카멜 케이스로 작성

rem

  • 1rem = 16px
  • 0.25rem(4px) 단위로 작성

type

  • 타입은 interface가 아닌 type으로 작성

Git 컨벤션

git 전략

- main: 배포 브랜치
- develop: feat 브랜치에서 PR 보내는 브랜치
- feat: 기능 개발 브랜치

Git 커밋

- feat: 새로운 기능 추가
- fix: 버그 수정
- docs: 문서 수정
- style: css 수정
- refactor: 코드 리팩토링
- test: 테스트 코드
- chore: 패키지 매니저 수정
- design: css UI 디자인 변경
- comment: 필요한 주석 추가 및 변경
- rename: 파일명 수정 및 파일 이동
- remove: 파일 삭제

💻 프로젝트 내용

랜딩 페이지

랜딩

  • taskify 소개 및 로그인, 회원가입 페이지로 이동할 수 있습니다.

로그인 & 회원가입 페이지

로그인
회원가입

  • Cookie로 AccessToken을 저장하고 인증하여 로그인과 회원가입을 할 수 있습니다.

나의 대시보드 페이지

나의 대시보드

  • 로그인에 성공하면 나의 대시보드 페이지에 접속합니다.
  • 새로운 대시보드 생성과 다른 유저가 초대한 대시보드 목록이 보입니다.

대시보드 페이지

대시보드

  • 대시보드에서 일정을 관리할 수 있는 페이지입니다.
  • 일정을 drag & drop으로 구현하여 간편하게 사용할 수 있습니다.

대시보드 관리 페이지

대시보드 관리

  • header에 관리 버튼을 누르면 대시보드 관리 페이지에 접속합니다.
  • 대시보드 이름 변경 및 삭제가 가능하고, 대시보드 구성원과 초대 한 내역이 보입니다.

계정 관리 페이지

계정 관리

  • header에 계정에 마우스를 올려 마이페이지를 클릭하면 접속합니다.
  • 프로필과 비밀번호를 변경할 수 있습니다.

404 페이지

404

  • 잘못된 링크에 접속하면 404 페이지로 이동합니다.
  • 로그인 상태에선 나의 대시보드 페이지로 이동합니다.
  • 로그아웃 상태에선 랜딩 페이지로 이동합니다.