앱 배포와 업데이트

튜토리얼 따라하기

이것은 Electron 튜토리얼의 6부입니다.

학습 목표

이 튜토리얼을 따라왔다면, 이제 마지막 단계에 도달했다. 이번 파트에서는 앱을 GitHub 릴리스에 배포하고, 앱 코드에 자동 업데이트 기능을 통합하는 방법을 배운다.

update.electronjs.org 사용하기

Electron 개발팀은 오픈소스 앱을 위한 무료 자동 업데이트 서비스를 https://update.electronjs.org에서 제공한다. 이 서비스를 사용하려면 몇 가지 조건을 충족해야 한다:

앱이 macOS 또는 Windows에서 실행되어야 한다.
앱이 공개된 GitHub 저장소를 가지고 있어야 한다.
빌드 결과물이 GitHub releases에 배포되어야 한다.
빌드 결과물이 코드 서명되어야 한다. (macOS만 해당)

여기서는 이미 모든 코드를 공개된 GitHub 저장소에 올렸다고 가정한다.

다른 업데이트 서비스

만약 다른 저장소 호스트(예: GitLab 또는 Bitbucket)를 사용하거나 코드 저장소를 비공개로 유지해야 한다면, 단계별 가이드를 참고하여 직접 Electron 업데이트 서버를 호스팅할 수 있다.

GitHub 릴리스 배포하기

Electron Forge는 패키징된 애플리케이션을 다양한 소스로 자동 배포할 수 있는 Publisher 플러그인을 제공한다. 이 튜토리얼에서는 GitHub Publisher를 사용해 코드를 GitHub 릴리스로 배포하는 방법을 알아본다.

개인 접근 토큰 생성하기

Forge는 GitHub의 저장소에 권한 없이는 퍼블리시할 수 없다. GitHub 릴리스에 접근할 수 있도록 인증된 토큰을 전달해야 한다. 가장 간단한 방법은 public_repo 범위를 가진 새로운 개인 접근 토큰(PAT)을 생성하는 것이다. 이 범위는 공개 저장소에 대한 쓰기 권한을 부여한다. 이 토큰을 반드시 비밀로 유지해야 한다.

GitHub Publisher 설정하기

모듈 설치하기

Forge의 GitHub Publisher는 프로젝트의 devDependencies에 설치해야 하는 플러그인이다:

npm
Yarn

npm install --save-dev @electron-forge/publisher-github

yarn add --dev @electron-forge/publisher-github

Forge에서 퍼블리셔 설정하기

설치를 마친 후에는 Forge 설정에서 퍼블리셔를 구성해야 한다. 모든 옵션 목록은 Forge의 PublisherGitHubConfig API 문서에서 확인할 수 있다.

forge.config.js
module.exports = {
  publishers: [
    {
      name: '@electron-forge/publisher-github',
      config: {
        repository: {
          owner: 'github-user-name',
          name: 'github-repo-name'
        },
        prerelease: false,
        draft: true
      }
    }
  ]
}

릴리스 전 초안 작성하기

Forge가 릴리스를 초안으로 게시하도록 설정했음을 주목하라. 이렇게 하면 실제로 최종 사용자에게 게시하지 않고도 생성된 아티팩트와 함께 릴리스를 미리 확인할 수 있다. 릴리스 노트를 작성하고 배포 가능한 파일이 제대로 작동하는지 다시 확인한 후, GitHub를 통해 수동으로 릴리스를 게시할 수 있다.

인증 토큰 설정하기

Publisher가 여러분의 인증 토큰을 인식하도록 설정해야 한다. 기본적으로 Publisher는 GITHUB_TOKEN 환경 변수에 저장된 값을 사용한다.

publish 명령어 실행하기

Forge의 publish command를 npm 스크립트에 추가한다.

package.json
  //...
  "scripts": {
    "start": "electron-forge start",
    "package": "electron-forge package",
    "make": "electron-forge make",
    "publish": "electron-forge publish"
  },
  //...

이 명령어는 설정된 makers를 실행하고, 생성된 배포 가능한 파일을 새로운 GitHub 릴리스로 퍼블리싱한다.

npm
Yarn

npm run publish

yarn run publish

기본적으로 이 명령어는 호스트 운영체제와 아키텍처에 맞는 단일 배포 파일만 퍼블리싱한다. 다른 아키텍처용으로 퍼블리싱하려면 Forge 명령어에 --arch 플래그를 추가하면 된다.

릴리스 이름은 프로젝트의 package.json 파일에 있는 version 필드와 일치한다.

릴리스 태깅하기

선택적으로, Git에서 릴리스에 태그를 추가하여 코드 히스토리의 특정 지점과 릴리스를 연결할 수 있다. npm은 버전 업데이트와 태깅을 자동으로 처리해주는 편리한 npm version 명령어를 제공한다.

보너스: GitHub Actions를 통한 배포

로컬에서 배포 작업을 진행하는 것은 번거로울 수 있다. 특히 호스트 운영체제에 맞는 실행 파일만 생성할 수 있다는 점이 문제다. 예를 들어 macOS에서 Windows용 .exe 파일을 만들 수 없다.

이 문제를 해결하기 위해 GitHub Actions와 같은 자동화 워크플로를 사용할 수 있다. GitHub Actions는 클라우드에서 Ubuntu, macOS, Windows 환경에서 작업을 실행할 수 있다. Electron Fiddle이 바로 이 방식을 사용하고 있다. 더 자세한 내용은 Fiddle의 빌드 및 릴리스 파이프라인과 Forge 설정을 참고하면 된다.

업데이터 코드 구성하기

GitHub 릴리즈를 통해 기능적인 릴리즈 시스템을 구축했다면, 이제 새로운 릴리즈가 나올 때마다 Electron 앱이 업데이트를 다운로드하도록 설정해야 한다. Electron 앱은 autoUpdater 모듈을 사용해 이를 수행한다. 이 모듈은 업데이트 서버 피드를 읽어 새 버전이 다운로드 가능한지 확인한다.

update.electronjs.org 서비스는 업데이터와 호환되는 피드를 제공한다. 예를 들어, Electron Fiddle v0.28.0은 https://update.electronjs.org/electron/fiddle/darwin/v0.28.0 엔드포인트를 확인해 새로운 GitHub 릴리즈가 있는지 확인한다.

릴리즈를 GitHub에 게시한 후, update.electronjs.org 서비스가 앱에서 동작해야 한다. 남은 단계는 autoUpdater 모듈로 피드를 구성하는 것이다.

이 과정을 더 쉽게 하기 위해, Electron 팀은 update-electron-app 모듈을 유지 관리한다. 이 모듈은 update.electronjs.org를 위한 autoUpdater 보일러플레이트를 단일 함수 호출로 설정한다. 별도의 구성이 필요 없다. 이 모듈은 프로젝트의 package.json "repository" 필드와 일치하는 update.electronjs.org 피드를 검색한다.

먼저, 모듈을 런타임 의존성으로 설치한다.

npm
Yarn

npm install update-electron-app

yarn add update-electron-app

그런 다음, 모듈을 임포트하고 메인 프로세스에서 즉시 호출한다.

main.js
require('update-electron-app')()

이것으로 끝이다! 앱이 패키징되면, 게시한 각각의 새로운 GitHub 릴리즈에 대해 자동으로 업데이트된다.

요약

이 튜토리얼에서는 Electron Forge의 GitHub Publisher를 설정해 앱의 배포 가능 파일을 GitHub 릴리스에 업로드하는 방법을 알아보았다. 플랫폼 간에 항상 배포 가능 파일을 생성할 수 있는 것은 아니므로, 여러 머신에 접근할 수 없는 경우 지속적 통합(CI) 파이프라인에서 빌드 및 배포 흐름을 설정하는 것을 권장한다.

Electron 애플리케이션은 autoUpdater 모듈을 업데이트 서버 피드로 지정해 자동 업데이트를 수행할 수 있다. update.electronjs.org는 GitHub 릴리스에 공개된 오픈소스 애플리케이션을 위해 Electron이 제공하는 무료 업데이트 서버다. 이 서비스를 사용하도록 Electron 앱을 설정하는 것은 update-electron-app 모듈을 설치하고 가져오는 것만큼 간단하다.

애플리케이션이 update.electronjs.org를 사용할 수 없는 경우, 직접 업데이트 서버를 배포하고 autoUpdater 모듈을 직접 구성해야 한다.

🌟 완료!

여기까지 진행하면 Electron 튜토리얼을 공식적으로 마친 것이다. 나머지 문서를 자유롭게 탐색하며 개발을 즐기길 바란다! 궁금한 점이 있다면 커뮤니티 Discord 서버를 방문해 보라.

학습 목표​

update.electronjs.org 사용하기​

GitHub 릴리스 배포하기​

개인 접근 토큰 생성하기​

GitHub Publisher 설정하기​

모듈 설치하기​

Forge에서 퍼블리셔 설정하기​

인증 토큰 설정하기​

publish 명령어 실행하기​

보너스: GitHub Actions를 통한 배포​

업데이터 코드 구성하기​

요약​