React-electron 설치 및 사용하기

시작하기

데스크톱 어플리케이션을 제작할 수 있는 electron을 사용해보도록 하겠습니다.
이 프레임워크를 사용한 프로젝트로는 깃허브의 아톰, 마이크로소프트의 비주얼 스튜디오 코드, 소스 코드 편집기, 그리고 라이트 테이블 IDE, 또 디스코드 채팅 서비스를 위한 프리웨어 데스크톱 클라이언트 등 다양한 데스크톱 어플리케이션을 제작할때 사용하고 있습니다.

use this template 버튼을 클릭하면 빠르게 내 저장소에 복사할 수 있습니다.
이후 프로젝트를 clone 하도록 합니다.

Package install

프로젝트로 루트에서 패키지를 설치해줍니다.
보일러 플레이트의 경우 yarn을 사용하고 있으므로 yarn으로 설치해 주도록 합니다.
yarn이 없을경우 글로벌로 yarn을 설치 해줍니다.

npm i -g yarn

yarn

패키지를 설치합니다.

노드 버전이 낮아 설치하는 도중 에러가 나올수 있습니다.
이때는 최신 노드 버전으로 설치해 주면 해결됩니다.

혹시 패키지 설치 혹은 컴파일 문제가 발생하는 경우 디버깅 안내서 를 참조해줍니다.

Installation Debugging Solutions

npm i -g node-gyp
rm -rf node_modules &&
yarn cache clean &&
yarn &&
yarn electron-rebuild &&
yarn dev

시작하기

yarn dev

보일러 프로젝트로 정말 쉽게 desktop app을 실행시켜 보았습니다.