JavaScript와 Firebase를 사용해 실시간 CGPA 계산기를 만든 방법

Source: Dev.to

학생 성적 관리의 골칫거리 해결 🎓

소프트웨어 공학 전공 학생으로서, 특정 성적을 추적하고 학기별로 CGPA를 계산하는 것이 번거롭다는 것을 깨달았습니다. 스프레드시트는 지루하고, 수동 계산은 오류가 발생하기 쉽습니다.

그래서 저는 이 문제를 해결하기 위해 AcademiaTrack이라는 웹 기반 솔루션을 만들었습니다.

🛠️ 기술 스택

• 프론트엔드: HTML5, CSS3, JavaScript
• 스타일링: Tailwind CSS (현대적이고 깔끔한 UI를 위해)
• 백엔드/데이터베이스: Firebase (사용자 점수를 안전하게 저장하기 위해)

🚀 주요 기능

• 실시간 계산: 성적을 입력하면 로직이 즉시 CGPA를 업데이트합니다.
• 데이터 영속성: Firebase 덕분에 학생들은 로그아웃 후에도 저장된 데이터를 다시 불러올 수 있습니다.
• 반응형 디자인: 대부분의 학생이 결과를 확인하는 모바일에서도 완벽히 작동합니다.

💻 코드

가장 큰 도전 과제 중 하나는 다양한 과목의 가중치 시스템을 처리하는 것이었습니다. 저는 JavaScript 배열 메서드를 사용해 입력 필드를 순회하고 가중 평균을 동적으로 계산했습니다.