Launch HN: Artemis (YC S22) – 주석을 사용하여 코드에 인터랙티브한 인터페이스 제공하기

안녕하세요 Hacker News 여러분, 저희는 Artemis Labs(https://artemisdevtool.com)의 공동 창업자인 Austin, Manvir, 그리고 Kyle입니다. 저희는 여러분의 인라인 주석(in-line comments)을 코드를 시각화, 테스트, 문서화 및 공유하는 데 사용할 수 있는 UI로 변환합니다. 이는 엔지니어와 과학자들이 고품질의 스크립트를 빠르게 생성할 수 있도록 돕습니다.

Artemis는 제가 Caltech 로봇 공학 연구실에서 고품질 스크립트를 만드는 데 얼마나 많은 시간과 노력이 소요되는지 직접 목격한 곳에서 탄생했습니다. 엔지니어들은 자신들의 도구를 다른 사람들이 접근하고 사용할 수 있도록 만들기 위해 슬라이드 덱(slide decks), 하이브리드 Markdown / LaTeX 문서, 그리고 데모 GUI를 만드는 데 수백 시간을 소비하고 있었습니다. 학습하는 입장에 있었던 사람으로서, 품질 높은 문서화와 인터랙티브한 인터페이스가 없다면 아주 작은 스크립트조차 해독하거나 사용하는 것이 거의 불가능할 수 있다는 것을 알고 있습니다. 이러한 방식들이 효과는 있었지만, 엄청난 시간 낭비였으며 문서화는 빠르게 노후화되었습니다.

Artemis는 이 문제에 대한 해결책으로 고안되었습니다. 저희는 개발자들이 상당한 시간을 투자하거나, 코드베이스(codebases)를 수정하거나, 워크플로(workflows)를 크게 변경하지 않고도 고품질의 인터페이스와 문서화를 생성할 수 있는 도구를 원했습니다.

작동 방식은 간단합니다. 먼저 코드베이스에 특수한 주석을 추가하세요. Artemis는 이 주석(이하 "앵커(anchors)")을 사용하여 코드에 대한 GUI를 자동으로 생성합니다. 그런 다음 저희의 커맨드 라인 유틸리티(command-line utility)를 사용하여 프로그램을 실행하세요. Artemis는 한쪽에는 코드를, 다른 한쪽에는 새로운 인터페이스를 표시하는 오프라인 브라우저 창에서 실행됩니다. 이것이 어떻게 보이는지 확인하려면 여기에서 데모 영상을 시청할 수 있습니다: https://www.youtube.com/watch?v=IDL12DkS2Hc.

이 인터페이스는 수직으로 스크롤되며, 코드가 실행됨에 따라 새로운 GUI 요소들이 관련 시점에 "카드(cards)" 형태로 차례대로 나타납니다. 예를 들어, 프로그램이 두 숫자를 입력받아 더한다면, 인터페이스는 먼저 한 카드에 변수들을 위한 입력 필드(input fields)를 보여줍니다. 숫자를 입력하고 "계속(continue)"를 누르면, 결과가 표시되는 새로운 카드가 나타납니다.

앵커(anchor)에는 세 가지 유형이 있습니다: 입력(input), 출력(output), 그리고 문서화(documentation)입니다. 입력(input)은 인터페이스를 통해 프로그램의 변수를 변경할 수 있게 해주며, 출력(output)은 프로그램의 결과물을 그래프, 텍스트 등으로 나타냅니다. 문서화(documentation)는 프로그램이 실행되는 동안 무엇이 일어나고 있는지 설명하는 인터페이스 요소를 생성할 수 있게 해줍니다. 문서화(documentation)는 텍스트, Markdown, LaTeX, 구문 강조(syntax-highlighted)가 적용된 코드 스니펫(code snippets), 멀티미디어, 링크 등 다양한 형태를 취할 수 있습니다.

이 모든 앵커(anchor)는 동일한 형식을 따릅니다. 주석 안에 "@"로 시작하여 그 유형인 "input", "output" 또는 "doc"를 입력하면 됩니다. "doc" 앵커의 경우, 문서 카드에 나타내고자 하는 내용을 바로 추가하면 됩니다. 입력(input)과 출력(output)의 경우, "data=x"라고 입력하여 해당 앵커가 어떤 변수에 작용하는지 지정해야 하며, 여기서 x는 사용자의 변수입니다.

우리는 텍스트 입력(text inputs)이나 텍스트, 표, 그래프 형태의 출력(outputs)과 같은 기본 앵커(anchor) 세트를 제공하지만, 일반적인 Python을 사용하여 사용자만의 앵커(anchor)를 직접 만들 수도 있습니다. Seaborn을 사용하여 통계 데이터를 빠르게 표시하기 위한 커스텀 앵커(custom anchor)를 만들고 싶으신가요? Matplotlib에서 고급 3D 플롯(3D plots)을 자동으로 렌더링하고 싶으신가요? Artemis는 이러한 작업들을 훨씬 쉽게 만들어 줍니다.

우리가 앵커(anchor)가 주석을 통해 작동하도록 선택한 이유는 사용자가 코드나 작업 방식을 변경할 필요가 없도록 하기 위해서입니다. 서로 다른 환경 사이를 전환할 필요가 없습니다. 사용자는 선호하는 IDE에 머물면서, 다른 곳으로 이동할 필요 없이 IDE에 더 많은 기능을 가져올 수 있습니다.

예를 들어, 저희는 사용자가 노트북을 사용할 필요 없이 시각화 도구로서의 Jupyter 기능을 포함하고 있습니다. 저희의 경험상, 노트북은 완전한 Python 환경에 비해 다소 제약이 많습니다. 노트북을 위해 코드를 재구성해야 하고, 프로그램을 IPython 커널에서 실행해야 하며, 종종 새로운 서드파티 (third-party) 라이브러리나 위젯 (widgets)을 임포트 (import)해야 하기 때문입니다. Artemis를 사용하면 코드 옆에 UI 요소와 문서가 함께 표시되는 노트북의 인터랙티브 (interactivity)한 특성을 얻으면서도, 전문적인 수준의 코드베이스 (codebases) 및 툴링 (tooling)과 함께 작동할 수 있습니다.

Artemis 인터페이스는 오프라인에서 실행 가능한 HTML 파일로 내보낼 수 있습니다. 이는 저희를 휴대 가능하고 효과적인 문서화/워크스루 (walkthrough) 도구로 만들어주는 핵심 기능입니다. 이러한 인터페이스는 이메일로 보낼 수 있을 만큼 충분히 작으며, 웹 페이지에 임베드 (embed)할 수도 있습니다. 제삼자가 귀하의 HTML 파일을 열면, 귀하가 Artemis로 프로그램을 실행할 때 보는 것과 정확히 동일한 화면, 즉 왼쪽에 인터페이스가 있고 오른쪽에 코드가 있는 화면을 보게 됩니다.

저희는 이 방식의 가장 명백한 활용 사례가 인터랙티브한 계산 도구를 빠르게 구축하거나 복잡한 프로그램을 위한 테스트 스캐폴딩 (test scaffolding)을 만드는 것이라고 생각했습니다. 하지만 이 방식은 동료나 관리자에게 프로그램을 설명하거나, 사람들에게 프로그램 사용법을 가르치는 코드 워크스루 (code walkthroughs)를 만드는 데에도 매우 유용하다는 것이 밝혀졌습니다. 실제 작동 모습은 여기에서 확인할 수 있습니다: https://www.youtube.com/watch?v=V4c3Q6lHFPo.

Mayo Clinic의 엔지니어들은 저희의 Markdown, LaTeX, 멀티미디어 문서화 기능과 커스텀 앵커 (custom anchor) 출력을 결합하여 내부 도구를 위한 단계별 워크스루를 제작하는 방식으로 Artemis를 사용하고 있습니다.

Artemis는 바로 사용할 준비가 되어 있으며, 저희 웹사이트에서 무료 체험을 제공합니다. 설정 및 설치는 1분밖에 걸리지 않지만, 저희는 귀하의 질문에 직접 답변해 드리거나 워크스루를 제공해 드리는 것도 매우 기쁘게 생각합니다. 저희는 사용자를 직접 만나는 것을 좋아합니다!

저희의 현재 가격 모델은 기본 Artemis의 경우 월 $15입니다. 커스텀 앵커(custom anchors, 입력/출력/문서(doc) 외의 항목)를 생성하고 인터페이스를 HTML 파일로 내보낼 수 있는 프로(pro) 버전도 있습니다. 또한 규모가 큰 팀을 위해 기업용(enterprise)