[T.Viewer 개발일기] 13. Release 준비

Tizen Log Viewer의 개발을 시작하게 된 계기는, 작년에 타이젠을 이용한 해커톤 행사에서 참가자들로부터 로그 보는 것이 너무 불편하다고 많이 의견을 받았기 때문이다. 간단하게 만들어 볼라고 개인적으로 시작을 했는데, 늘 그렇듯 먹고 사는 일에 치여서 미루고 미루다가 올해 또 해커톤을 한다고 해서...바짝 준비했다.ㅋㅋ 막상 사람들에게 소개하려고 하니 그것도 준비가 적잖히 필요한것 같다.

(2020 온라인 해커톤) 서울 하드웨어 해커톤 탑메이커 - 언택트 시대 필요한 기술 편

우선, 가벼운 오픈소스 프로젝트이기 때문에 별도의 사이트나 배포처를 만들지 않고, 오로지 github 만으로 채널을 단일화해서 진행을 해보려고 한다. 몇가지 참조해 볼 만한 프로젝트를 찾아봤는데, VS Code 프로젝트가 너무 좋았다.

This repository ("Code - OSS") is where we (Microsoft) develop the Visual Studio Code product. Not only do we work on code and issues here, we also publish our roadmap, monthly iteration plans, and our endgame plans. This source code is available to everyone under the standard MIT license.

github을 아주 잘 쓰고 있는 것 같다! 형식과 내용 모두 컨닝해야겠다. 그리고 wiki도 잘 쓰고 있는데...그것도 컨닝해야겠다.ㅋ 짱이당.

다시 쓰는 README

기존의 것이 기본적인 내용은 있었다만 내용이 충실하지는 않았던것 같다. 몇몇 사람이 어떻게 사용하는지 묻기도 했으니...ㅠ

이번 기회에 다른 프로젝트는 README를 어떻게 작성하였는지 살펴보았다. 정해진 형식은 없지만 주요하게 전면에 내세우는 내용들은 비슷했다.

• 2~3문장으로 이루어진 간단한 소개 with 시선을 끄는 스냅샷
• 설치 & 사용 방법
• 프로젝트 참여 방법
• 라이센스

핵심은 간결하게 작성하는 것이다. 자세한 내용은 다른 글이나 wiki의 링크로 대체하여 최대한 간결함을 유지한다. 언어는 주로 영어인데, 나는 실사용자를 고려해서 국문과 함께 작성하기로 했다.

어려운 영어가 필요한 부분은 없지만 거부감을 느낄 수도 있고, 정보 전달 과정에서 손실이 발생한다. 같은 내용을 작성해도 놓치고 넘어가는 부분이 발생한다.ㅠ

라이센스 고지

Electron, Vuetify, Ace Editor등 오픈소스들을 유용하게 잘 쓰고 있는데, 그 사실을, 라이센스 고지를 어떻게 해야 할지 몰라서 검색을 해봤다.

외부 라이브러리의 라이센스 고지 방법

딱히 고지 않해도 큰일은 없을 것 같지만, 감사함을 꼭 표시하고 싶었다.

package.json을 보면 정리가 잘 되어 있다. 실제 제품에 포함되는 것은 몇개 안되는데, core-js가 뭐지..;; npm 사이트에서 찾아봤는데, 폴리필 라이브러리구나. 저자가 구직중이라고 적어놨네ㅋ

  "dependencies": {
    "ace-builds": "^1.4.7",
    "core-js": "^3.1.2",
    "electron-store": "^6.0.0",
    "electron-window-state": "^5.0.3",
    "typeface-roboto": "0.0.75",
    "vue": "^2.6.10",
    "vuetify": "^2.1.0"
  },
  "devDependencies": {

소스 저장소에도 파일을 만들어서 올리고, 메뉴에도 추가해야겠다.

OSS Notice | T.Viewer
Copyright (c) 2019, msalt.net Jeong Seongmoon

This application use Open Source Software (OSS). You can find the source code of these open source project, along with applicable license information, below. We are deeply grateful to these developers for their work and contributions.

1. Ace Editor
  - https://github.com/ajaxorg/ace
  - Copyright (c) 2010, Ajax.org B.V.
  - BSD License
1. Vue
  - https://github.com/vuejs/vue
  - Copyright (c) 2013-present, Yuxi (Evan) You
  - MIT License
1. Vuetify
  - https://github.com/vuetifyjs/vuetify
  - Copyright (c) 2016-2020 John Jeremy Leider
  - MIT License
1. core-js
  - https://github.com/zloirock/core-js
  - Copyright (c) 2014-2020 Denis Pushkarev
  - MIT License
1. electron-store
  - https://github.com/sindresorhus/electron-store
  - Copyright (c) Sindre Sorhus
  - MIT License
1. electron-window-state
  - https://github.com/mawie81/electron-window-state
  - Copyright (c) 2015 Jakub Szwacz, Marcel Wiehle
  - MIT License

Application Menu

사실 이건 진작에 처리를 했어야 하는데, 막상 릴리즈 할 때가 되니까 눈에 들어왔다. 다행이도 딱히 많이 작성할 만한 내용은 없는 것 같다고 스스로 판단하고 적당히 작성했다.

메뉴쪽 개발에 대해서 인지했을 때는 부담이 상당히 컸는데, 정말 electron이 너무 잘 해놔서 아주 손쉽게 구성이 가능했다. 사랑받는 프레임웍은 뭐가 달라도 다르구나.ㅋ

템플릿 형태로 내용만 바꿔서 구성이 가능하다. role을 미리 정의해놔서 되돌리기, 복사하기 등의 기능도 손쉽게 추가 할 수 있다. 내가 요즘 고민하고 있는 일이랑 비슷하구나.ㅎ

const template = [
    {
        label: 'File',
        submenu: [
            {
                role: 'quit'
            }
        ]
    },
    {
        label: 'Help',
        submenu: [
            {
                label: 'User Guide',
                click () { 
                    electron.shell.openExternal('https://github.com/msaltnet/T.Viewer/wiki/%EC%A3%BC%EC%9A%94-%EA%B8%B0%EB%8A%A5-%EB%B0%8F-%EC%82%AC%EC%9A%A9%EB%B2%95');
                }
            },
            {
                type: 'separator'
            },
            {
                label: 'Source Code',
                click () { 
                    electron.shell.openExternal('https://github.com/msaltnet/T.Viewer');
                }
            },
            {
                label: 'OSS Notice',
                click () { 
                    dialog.showMessageBox({
                        type: "info",
                        title: "OSS Notice",
                        message: "Open Source Sorftware Notice",
                        detail: "\nOSS Notice | T.Viewer\nCopyright (c) 2019, msalt.net Jeong Seongmoon\n\nThis application use Open Source Software (OSS). You can find the source code of these open source project, along with applicable license information, below. We are deeply grateful to these developers for their work and contributions.\n\nAce Editor\n  - https://github.com/ajaxorg/ace\n  - Copyright (c) 2010, Ajax.org B.V.\n  - BSD License\n\nVue\n  - https://github.com/vuejs/vue\n  - Copyright (c) 2013-present, Yuxi (Evan) You\n  - MIT License\n\nVuetify\n  - https://github.com/vuetifyjs/vuetify\n  - Copyright (c) 2016-2020 John Jeremy Leider\n  - MIT License\n\ncore-js\n  - https://github.com/zloirock/core-js\n  - Copyright (c) 2014-2020 Denis Pushkarev\n  - MIT License"
                    });
                }
            },
            {
                label: 'About',
                click () { 
                    dialog.showMessageBox({
                        type: "info",
                        title: "T.Viewer",
                        message: "T.Viewer",
                        detail: "Version: 1.0.0\nDate: 2020. 7. 31"
                    });
                }
            }
        ]
    }
];

템플릿을 작성한 다음 적용하는 코드를 두 줄 넣어 주면 메뉴 끝!

  const menu = Menu.buildFromTemplate(template)
  Menu.setApplicationMenu(menu)

사용 설명서 작성

항상 내가 꿈꾸는 프로그램은 설명서가 필요 없는 프로그램이다. 그렇게 만들려고 노력을 많이 하지만, 막상 사용자들에게 피드백을 받아보면 그것은 환상이라는 것을 알게된다. 잘잘못을 떠나서 누군가에게는 너무 당연한 것이, 누군가에게는 어처구니 없는 방법으로 받아드려 질 수 있다는 것을 알게되었기 때문이다. 그럼에도 불구하고, 가장 많은 사람들이 시행착오 없이 사용할 수 있도록, 아주 대중적인 심성 모형, Mental Model을 차용하려고 노력한다.

그런 노력으로 아이콘도 가능하면 이미 다른 프로그램에서 동일한 의미로 사용되고 있는 것과 같은 것을 사용했음에도, 줄바꿈이나 자동 스크롤은 직관적으로 이해가 어렵다는 의견도 있었다. 하지만, 이런 경우도 큰 문제가 되지 않는 것이 한 번만 눌러보면 금방 이해할 수 있다. 바로 적용되고, 쉽게 설정/해제 할 수 있기에 그런 부분이 보완이 된다.

한 장짜리 가이드 이미지와 비디오 가이드를 작성하려 했으나, 비디오보다는 짤방이 나을것 같아서...ㅋ

T.Viewer User Guide

code signing

데탑 프로그램도 서명이 필요하다는 것은 알고 있었지만 이렇게 복잡하고, 비용이 많이 들어 갈 줄은 몰랐다. 정리를 잘해 놓은 글이 있어서 붙여 놓는다.

electron code signing

돈도 돈이지만, 사업자 등록증도 있어야 하고, 시간도 오래걸리고 갱신도 생각해야 한다. 오픈소스 프로젝트를 위한 패키지도 있다고 하는데, 그것도 폴란드 인증소로부터 최초 USB동글을 받아야 해서 시간이나 비용이 상당이 걸린다.

어쩔 수 없이, 사용 설명서와 별개로 설치 설명서를 만들게 되었다.ㅠ 설명서 싫어.

마치며

뭐 대단한 것 하나 한 것이 없지만, 막상 이것 저것 신경을 써야 하는 것이 쉽지만은 않았다. 그래도 프로젝트 셋업부터 릴리즈까지 모든 과정을 직접 경험해 볼 수 있어서 좋았다. 설치할 때 경고 없애려 인증서도 알아보는 것도 무척 귀찮은 일이었다. 쉬울 것만 같았던 일도 막상 직접해보면 손이 많이 간다는 사실을 다시 확인했다. 이 후의 계획은 어떻게 될지 모르겠지만, 어째든 그런대로 일단락하게 되어서 속이 시원하다.ㅋ