AI랑 같이하는 코딩

  • 홈
  • 태그
  • 방명록

ProgressBar 1

[바이브코딩 HTML 웹앱 20일 챌린지] 13일차 - 오늘 얼마나 해냈는지 진행률로 보여주기

13일차에서는 오늘 해낸 양을 숫자와 막대로 보여주는 진행률 기능을 만듭니다. 지금까지 쌓은 할 일/습관 데이터를 바탕으로 완료 비율을 시각화하면 사용자는 하루 성취를 더 직관적으로 확인할 수 있습니다.이 기능은 단순 계산처럼 보여도 사용자 동기 유지에 매우 효과적입니다. 초보자도 완료 개수와 전체 개수만 정확히 계산하면 쉽게 구현할 수 있습니다.목차1. 오늘 만들 기능 소개2. AI에게 요청할 프롬프트3. 코드 작성과 실행 과정4. 코드 이해하기5. 오늘 만든 내용 정리6. 자주 묻는 질문7. 다음 단계로 이어가기1. 오늘 만들 기능 소개오늘 목표는 완료한 할 일과 체크한 습관을 기준으로 진행률을 계산해 보여주는 것입니다. 예를 들어 완료 5개 / 전체 8개라면 62%를 출력하고, 진행률 바 너비도 6..

바이브코딩 HTML 웹앱 20일 챌린지 2026.05.11
이전
1
다음
더보기
프로필사진

AI랑 같이하는 코딩

코딩을 완벽히 몰라도 괜찮습니다. AI와 대화하며 HTML, CSS, JavaScript로 작은 웹앱을 하나씩 만들어가는 바이브코딩 기록 블로그입니다.

  • 분류 전체보기 (79) N
    • 바이브코딩 HTML 웹앱 20일 챌린지 (20)
    • 바이브코딩 개념사전 (10)
    • 바이브코딩 워크플로우 (10)
    • 바이브코딩 프롬프트 실험실 (10)
    • 바이브코딩 오류 해결 노트 (10)
    • 바이브코딩 코드 리뷰 Before & After (10)
    • 바이브코딩 실무 웹도구 제작 노트 (9) N

최근글과 인기글

  • 최근글
  • 인기글

공지사항

Archives

Calendar

«   2026/06   »
일 월 화 수 목 금 토
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30

Copyright © AXZ Corp. All rights reserved.

티스토리툴바