Life Calendar

Table of Contents

1. About The Project
   • Built With
2. Getting Started
   • Link
3. Pages
4. Contact

🔍 About The Project

어느 날 유튜브를 보다가 우연히 Life Calendar라는 것을 알게되었습니다.

하지만 기존의 Life Calendar는 위와 같이 출력을 해서 색칠을 하는 방식이었는 데, '만약 주마다 기록을 할 수 있게 만들면 더 좋은 도구가 될 수 있지 않을까?' 라는 생각으로 프로젝트를 시작하게되었습니다. 현재는 기록뿐만 아니라 태그도 추가할 수 있고 그래프도 볼 수 있습니다.

🔨 Built With

• Svelte
• CKEditor5
• Chart.js
• Firebase
• Netlify

✨ Getting Started

🔗 Link

Life Calendar

📄 Pages

✅ 홈

노션 홈페이지의 디자인을 참고하여 만들었습니다.

✅ 로그인

• class101 로그인 페이지의 디자인을 참고하여 만들었습니다.
• sns로 로그인을 하거나 이메일로 회원가입을 한 뒤 이메일로 로그인을 할 수 있습니다.
• 예외 처리가 가능합니다.

✅ 회원가입

• 예외 처리가 가능합니다.

✅ 태어난 연도 입력

• 사용자가 로그인을 했는 데 연도 정보가 없을 때 나오는 화면입니다.
• 본인이 태어난 연도를 입력합니다.

✅ 연간 달력

• 기록하고 싶은 연도를 클릭하여 모달창에 기록할 수 있습니다.

✅ 월간 달력

• 기록하고 싶은 월을 클릭하여 모달창에 기록할 수 있습니다.
• 주간 모달창에서 입력한 내용으로 그려진 그래프를 확인할 수 있습니다.

✅ 주간 달력

• 기록하고 싶은 주를 클릭하여 모달창에 기록할 수 있습니다.
• 태그를 입력할 수 있습니다. (태그를 통해 분류가 가능합니다.)
• 테이블에 본인이 만들고 싶은 습관 같은 것들을 입력할 수 있습니다. (운동 분류와 팔굽혀펴기, 턱걸이 항목을 기본값으로 설정했습니다.)
• 기록한 요일 수에 따라 색깔을 다르게 했습니다. (1일: 가장 연함, 7일: 가장 진함.)

➕ 그 외

• 월간, 주간 달력에서 행의 오른쪽에 있는 화살표를 클릭하면 10년 단위로 달력을 접었다 폈다 할 수 있습니다.
• 도움말에는 마크다운 작성법을 적었습니다.

Contact

Email - ansrud45@gmail.com

Project Link - https://github.com/dinomoon/life-calendar