The BEST way to Create Desktop Apps (Electron)
- Electron은 HTML, CSS, JavaScript로 데스크톱 앱을 만들 수 있게 해준다. 💻
npm init -y
로 새 npm 프로젝트를 시작하고 npm install electron -D
로 Electron을 설치한다. 🚀
index.js
에서 Electron 창을 생성하고 package.json
에서 시작 스크립트를 설정한다. ⚙️
app
과 BrowserWindow
를 사용하여 앱의 생명주기를 관리하고 창을 만든다. 🖼️
win.loadFile
을 사용하여 HTML 파일을 창에 로드하여 앱의 UI를 구성한다. 🌐
preload.js
를 사용하여 Electron API를 안전하게 노출하고 파일 열기 기능을 구현한다. 🛡️
- 메인 프로세스에서 파일 다이얼로그를 처리하여 허용할 파일 형식을 필터링한다. 🎚️
- JavaScript를 사용하여 오디오 재생, 일시 정지, 시간 표시 기능을 구현한다. 🎵