🌱 분갈이 흙 계산기를 만들었어요 – React + Vite + Netlify
✨ 결과물 분갈이 흙 계산기 바로가기 📬 소스코드 GitHub: https://github.com/namikimlab/potting-soil-calculator 🪴 왜 만들었을까? 화분에 식물을 심을 때, 흙이 얼마나 필요한지 계산하는 게 은근히 번거롭습니다. 화분의 모양, 크기, 높이, 개수에 따라 달라지기 때문인데요. 초보 가드너나 원예 입문자들이 직관적으로 흙 용량을 계산할 수 있는 도구가 있었으면 좋겠다는 생각에서 이 프로젝트를 시작했습니다. 🔧 이런 기술을 썼어요 이 계산기는 프론트엔드만으로 구성된 React 웹앱입니다. React + TypeScript: 안정적인 컴포넌트 기반 구조 Vite: 빠른 개발 환경 구성 및 빌드 Tailwind CSS: 가볍고 직관적인 스타일링 Netlify: 정적 사이트 배포 및 HTTPS 자동 적용 Google Analytics (GA4): 방문자 추적 Jest + ts-jest: 100% 유닛 테스트 커버리지 📦 주요 기능 화분 모양 선택 (사각형, 원통형, 원뿔형, 기타) 각 모양에 맞는 사이즈 입력 계산된 결과에 따라 흙 용량(L) 출력 20L + 8L 분갈이흙 제품 조합 추천 마사토(배수용 자갈)도 함께 제안 반응형 웹 지원 (모바일 최적화) SEO를 위한 Open Graph 메타태그, favicon, sitemap.xml, robots.txt 설정 💡 이런 점을 신경 썼습니다 실제 구매로 이어지도록 설계 단순한 계산기 수준이 아니라, 구매 버튼까지 연결되도록 구성했습니다. ...