Electron-vue 데스크톱 앱 찍먹하기

Electron 소개

Electron은 웹 기술을 사용하여 데스크톱 애플리케이션을 개발할 수 있는 오픈 소스 프레임워크다. HTML, CSS, JavaScript를 이용하여 데스크톱 애플리케이션을 구축할 수 있으며, Chromium 브라우저와 Node.js 런타임을 기반으로 한다고 한다. Electron을 사용하면 웹 개발자들은 웹 기술을 활용하여 다양한 운영체제에서 동작하는 데스크톱 애플리케이션을 만들 수 있다.

주요 특징

1. 웹 기술 활용: HTML, CSS, JavaScript를 사용하여 데스크톱 애플리케이션을 개발할 수 있어 웹 개발자들에게 친숙한 환경을 제공함.
2. 크로스 플랫폼: Electron을 사용하면 Windows, macOS, Linux 등 다양한 플랫폼에서 동작하는 애플리케이션을 개발할 수 있음.
3. Chromium 브라우저: Electron은 Chromium 브라우저 엔진을 기반으로 하여 웹 페이지나 UI를 렌더링함.
4. Node.js 통합: Node.js를 통해 파일 시스템 액세스, 네트워킹, 프로세스 관리 등의 기능을 활용할 수 있음.
5. 네이티브 기능 접근: C++나 Objective-C로 작성된 네이티브 코드를 통해 하드웨어와의 상호작용 및 특정 플랫폼 기능을 사용할 수 있음.

---

아
대충 알아봤으니 찍어먹어 보자.

개발 환경 설정하기

# Vue CLI 전역 설치
npm install -g @vue/cli

# electron-vue 프로젝트 생성
vue create my-electron-app
cd my-electron-app
vue add electron-builder

Electron 빌드 과정 중에 ERR_ELECTRON_BUILDER_CANNOT_EXECUTE 에러가 발생할 수 있다.
node.js를 16 버전으로 다운그레이드 하자

yarn install
yarn electron:serve

잘 나오는 거 같다