Skip to main content

이번 주 프로젝트: Jasper

· 9 min read

이번 주에는 GitHub 알림을 관리하기 위한 Electron 기반 도구인 Jasper의 창시자를 인터뷰했다.

안녕하세요! 저는 누구일까요?

저는 마루야마 료라고 합니다. 일본에서 소프트웨어 개발자로 활동 중이며, JasperESDoc를 개발하고 있습니다.

Jasper란 무엇인가?

Jasper는 GitHub 이슈를 읽기 위한 유연하고 강력한 도구다. github.com과 GitHub Enterprise의 이슈와 풀 리퀘스트를 지원한다.

Jasper App Screenshot

왜 만들었나?

직장이나 오픈소스 활동에서 GitHub를 사용하는 사람들은 매일 많은 알림을 받는다. 이러한 알림을 구독하는 방법으로 GitHub는 이메일과 웹 알림을 제공한다. 나도 몇 년 동안 이를 사용했지만 다음과 같은 문제에 직면했다:

  • 내가 언급된 이슈, 내가 댓글을 단 이슈, 내가 주시하고 있는 이슈를 쉽게 놓치곤 했다.
  • 나중에 확인하려고 머릿속 한구석에 이슈를 두곤 했지만, 가끔 까먹곤 했다.
  • 이슈를 잊지 않기 위해 브라우저에 많은 탭을 열어두곤 했다.
  • 나와 관련된 모든 이슈를 확인하기가 어려웠다.
  • 팀의 모든 활동을 파악하기가 어려웠다.

이러한 문제를 해결하기 위해 많은 시간과 에너지를 소모하고 있었기 때문에, 나는 이러한 문제를 효율적으로 해결할 수 있는 GitHub 이슈 리더를 만들기로 결심했고, Jasper 개발을 시작했다.

Jasper을 누가 사용하나요?

Jasper는 GitHub를 사용하는 여러 회사의 개발자, 디자이너, 매니저들이 활용하고 있다. 물론 일부 오픈소스 개발자들도 사용 중이다. GitHub 내부 직원들도 Jasper를 사용하고 있다!

Jasper의 작동 원리

Jasper를 설정하면 다음과 같은 화면이 나타난다. 왼쪽부터 차례로 "스트림 목록", "이슈 목록", "이슈 본문"을 확인할 수 있다.

Jasper 시작 화면

이 "스트림"은 Jasper의 핵심 기능이다. 예를 들어, "electron/electron 저장소에서 @zeke에게 할당된 이슈"를 보고 싶다면 다음과 같은 스트림을 생성한다:

repo:electron/electron assignee:zeke is:issue

Jasper 시작 화면 2

스트림을 생성하고 몇 초 정도 기다리면, 조건에 맞는 이슈들을 확인할 수 있다.

Jasper 시작 화면 3

스트림을 활용해 무엇을 할 수 있을까?

스트림을 활용할 수 있는 다양한 조건에 대해 알아보자.

사용자와 팀

스트림이슈
mentions:cat mentions:dog사용자 cat 또는 dog가 언급된 이슈
author:cat author:dog사용자 cat 또는 dog가 생성한 이슈
assignee:cat assignee:dog사용자 cat 또는 dog에게 할당된 이슈
commenter:cat commenter:dog사용자 cat 또는 dog가 댓글을 단 이슈
involves:cat involves:dog사용자 cat 또는 dog와 관련된 이슈
team:animal/white-cat team:animal/black-doganimal/white-cat 또는 animal/black-dog가 언급된 이슈

involvesmention, author, assignee, commenter 중 하나를 의미한다.

저장소와 조직

스트림이슈
repo:cat/jump repo:dog/runcat/jump 또는 dog/run의 이슈
org:electron user:cat user:dogelectron, cat, 또는 dog의 이슈

orguser와 동일하다

속성

스트림이슈
repo:cat/jump milestone:v1.0.0 milestone:v1.0.1cat/jump에서 v1.0.0 또는 v1.0.1에 연결된 이슈
repo:cat/jump label:bug label:blockercat/jump에서 bugblocker 라벨이 모두 붙은 이슈
electron OR atomshellelectron 또는 atomshell이 포함된 이슈

리뷰 상태

스트림문제점
is:pr review:requiredcat/jump에서 리뷰가 필요한 이슈
is:pr review-requested:catcat이 리뷰를 요청한 이슈
하지만 아직 리뷰되지 않은 상태
is:pr reviewed-by:catcat이 리뷰한 이슈

이 표를 통해 확인할 수 있듯이, 스트림은 GitHub의 검색 쿼리를 사용할 수 있다. 스트림과 검색 쿼리를 사용하는 방법에 대한 자세한 내용은 다음 URL을 참고한다.

Jasper는 읽지 않은 이슈 관리, 읽지 않은 댓글 관리, 별표 표시, 알림 업데이트, 이슈 필터링, 키보드 단축키 등의 기능도 제공한다.

Jasper는 유료 제품인가요? 가격은 얼마인가요?

Jasper는 12달러입니다. 하지만 무료 체험판을 30일 동안 사용할 수 있습니다.

Jasper를 Electron 기반으로 개발한 이유는 무엇인가?

Electron의 다음과 같은 장점이 마음에 들었다:

  • 자바스크립트, CSS, HTML로 앱을 개발할 수 있다.
  • 윈도우, 맥, 리눅스 플랫폼 모두에서 동작하는 앱을 만들 수 있다.
  • Electron은 활발하게 개발되고 있으며 커뮤니티도 크다.

이러한 특징 덕분에 데스크톱 애플리케이션을 빠르고 간단하게 개발할 수 있다. 정말 훌륭한 도구다! 여러분도 제품 아이디어가 있다면 꼭 Electron을 고려해 보길 바란다.

Jasper 개발 과정에서 어떤 어려움을 겪었나요?

"스트림" 개념을 이해하는 데 어려움을 겪었다. 처음에는 GitHub의 Notifications API를 사용하려고 했다. 하지만 이 API가 특정 사용 사례를 지원하지 않는다는 것을 알게 되었다. 그 후 Issues APIPull Requests API를 Notifications API와 함께 사용하는 방법을 고민했다. 하지만 원하는 결과를 얻지 못했다. 다양한 방법을 고민하던 중 GitHub의 Search API를 폴링하는 것이 가장 유연한 방법이라는 것을 깨달았다. 이 과정에 약 한 달이 걸렸고, 이후 스트림 개념을 적용한 Jasper 프로토타입을 이틀 만에 구현했다.

참고: 폴링은 최대 10초에 한 번으로 제한된다. GitHub API의 제한 사항을 고려할 때 이는 충분히 허용 가능한 수준이다.

다음에 추가될 기능

다음과 같은 기능을 개발할 계획이다:

  • 필터링된 스트림: 스트림에 특정 조건으로 이슈를 필터링하는 기능을 추가할 예정이다. SQL의 뷰와 유사한 개념이다.
  • 다중 계정 지원: github.com과 GHE(GitHub Enterprise)를 동시에 사용할 수 있게 될 것이다.
  • 성능 개선: 현재 WebView에서 이슈를 로딩하는 속도가 일반 브라우저보다 느린 문제를 해결할 예정이다.

업데이트 소식은 @jasperappio 트위터 계정을 팔로우하면 확인할 수 있다.