큐즈

[배포] 오늘 하루, 당신의 감정은 얼마였나요? 데일리 감정 영수증 Mood Bill 본문

UX UI/바이브코딩

[배포] 오늘 하루, 당신의 감정은 얼마였나요? 데일리 감정 영수증 Mood Bill

Q's 2026. 1. 21. 16:05
반응형

Q's Mood Bill

 

저는 올해 초(2일)부터 매일 다이어리 도전해보자 하고 다이어리를 쓰고 있는데요. 19일째인 지금 쓴 일기가 14편입니다..ㅎ

매일 일기 쓰는 거 솔직히 귀찮고 어렵잖아요..ㅠ///ㅠ 근데 선택 조금 하고 단어 몇 개 넣는 건 간단하지 않을까...? 싶어 이번에도 바이브코딩으로 만들게 되었습니다. 감정 영수증이란 컨셉은 이미 많아서 그냥 연습삼아 했어요!

 

 

 

주요 기능 & 디자인

  • 영수증 제목 설정: 이름을 넣으셔도 되고, 좋아하는 음식을 넣으셔도 되고 자유롭습니다.
  • 테마 색상: 기본 화이트 배경 모드와 다크 모드가 존재합니다. 색상은 검정, 블루, 그린, 레드가 있어요.
  • 현재의 감정을 버튼을 눌러 선택합니다. 좌측으로 갈수록 좋은 감정, 우측으로 갈수록 부정적인 감정입니다.
  • 키워드에는 어떤 말을 넣어도 상관없습니다. 제 경우에는 오늘 먹은 음식, 한 일, 마음에 드는 시 구절... 같은 거 넣어봤어요. 엔터로 추가합니다. 너무 길게 적는 것보단 짧게 적는 게 예쁘게 나와요.
  • 오늘 사용한 에너지도 함께 기록해보세요!
  • 발급된 영수증은 이미지로 다운받을 수 있어요.

 

 

링크

 

Mood Bill

 

qsmoodbill.vercel.app

 

 

 

비하인드(TMI)

이번엔 vercel에 올리면서 좀 헤맸어요. 방문 지표를 알고 싶어서 google analytics도 연결해 봤구요(근데 vercel에서도 확인 가능한 듯...). 이렇게 간단한 것들은 코딩 공부해서 만드는 게 더 빠르겠다는 생각이 들기도 합니다. 디자인도 고치고 싶고 넣고 싶은 기능도 더 있지만... 그래도 재밌었다..ㅎㅎ

 

 

 


 

반응형

'UX UI > 바이브코딩' 카테고리의 다른 글

[무료 배포] LP 턴테이블 뮤직 플레이어 위젯  (0) 2026.01.21