Ambient Sound Mixer - JavaScript OOP Project - 3.5+ Hours
- 바닐라 JavaScript와 객체 지향 프로그래밍(OOP) 원칙을 활용하여 앰비언트 오디오 믹서 웹 앱을 구축하는 프로젝트입니다. 🎧
- 클래스, 캡슐화, 단일 책임 원칙, 재사용성을 강조하며 DOM 조작에 중점을 둔 순수 JavaScript 개발을 목표로 합니다. 🏗️
App, SoundManager, UI, PresetManager, Timer 등 5개의 클래스와 SoundData 파일로 구성된 모듈식 아키텍처를 채택하여 명확한 역할 분담을 구현합니다. 🧩
- 개별 사운드 및 마스터 볼륨 조절, 기본 프리셋, 로컬 스토리지에 저장 가능한 사용자 정의 프리셋, 슬립 타이머, 전체 재생/일시정지, 초기화, 테마 토글러 등 다양한 기능을 제공합니다. 🎛️
- ES6 모듈, 직접 인스턴스화, 중앙 집중식 상태 관리(옵저버 패턴 유사), 콜백 패턴, 이벤트 위임 등 핵심 디자인 패턴을 적용합니다. 💡
- 이러한 구조는 확장성, 테스트 용이성, 유지보수성, 성능 및 구성 요소의 재사용성을 크게 향상시킵니다. ✅
- HTML/CSS (Tailwind) 템플릿이 제공되며, 모든 JavaScript 기능은 처음부터 직접 구현하여 핵심 JS 및 OOP 학습에 집중합니다. 💻
- iOS 기기에서는 앱 내 볼륨 조절이 제한되어 물리적 장치 볼륨을 사용해야 하는 점을 명시합니다. 📱