제 브라우저에는 보통 JSON 포매터(formatter), JSON을 TypeScript로 변환하는 컨버터, 마크다운을 문서로 변환하는 컨버터, HTML 이메일 미리보기 도구(previewer), 슬러그 생성기(slug generator), 시간대 변환기(time zone converter), URL 인코더가 각각 별도의 탭에 열려 있습니다. 그중 하나하나가 자체 웹사이트를 가지고 있고, 각자 광고와 쿠키 배너를 가지고 있으며, 심지어 400바이트의 JSON을 포매팅하기 전에 로그인하라고 요구할 가능성이 높습니다.
결정적인 계기는 고객의 이메일 템플릿을 무료 온라인 HTML 미리보기 도구에 붙여넣었는데, 그 도구가 마크업(markup)을 서버로 전송하는 것이었습니다. 그 서버가 그것으로 무엇을 했는지는 모르겠습니다. 저는 해당 탭을 닫고 그런 행동을 멈췄습니다.
그래서 제가 실제로 사용하는 도구들을 한 페이지에 모았습니다: [quoin.izzudd.my.id]
어떻게 만들었는지 고백하는 부분
이것은 100% AI가 만든 결과물입니다. 저는 이것을 마법이라고 부르며, 이 게시물에서 그것을 발표할 때 숨기지 않을 것입니다. 제가 원하는 것을 설명하면 모델이 코드를 작성하고, 저는 그것을 읽고, 잘못된 부분은 수정하며, 작동하는 부분은 유지합니다.
모델이 하지 않는 것은 사이트에 무엇을 배치할지 결정하는 것입니다. Quoin의 모든 도구는 제가 실제 업무를 하던 중, 보통 짜증이 날 때 겪었던 문제들 때문에 존재합니다. 선택(selection) 자체가 제품입니다. 코드는 대부분 생성된 것이며, 저는 이 사실을 분명히 말하는데, 그 대안인 '사랑으로 수작업 제작됨' 같은 문구로 가득 찬 글은 커밋 기록과 비교해 확인할 수 있는 주장이기 때문입니다.
이름만이 제가 방어할 부분입니다. 콰인(quoin)은 인쇄 틀에 유형을 고정하는 웨지(wedge)이자, 벽의 모서리를 곧게 유지하는 돌입니다. 작지만 모든 것을 제자리에 있게 해주는 도구입니다.
제가 하루 종일 하는 일과 그것을 커버하는 도구
- 에이전트용 구조화된 출력(Structured output for agents). JSON 스키마를 작성한 후 Pydantic, Zod 또는 TypeScript 타입과 동일한 형태가 필요합니다. 수동으로 이 변환 작업을 하면 새벽 2시에 필드 불일치(field mismatch)를 만날 수 있습니다. 그래서: 샘플 페이로드로부터 추론하여 스키마 빌더를 만들고, Pydantic, Zod, TS, Go 구조체 및 Python dataclass를 출력하는 JSON-to-types 도구가 필요합니다.
- 마크다운을 워드 또는 구글 문서로 변환하기(Markdown into Word or Google Docs). 마크다운으로 메모를 작성한 후, 누군가 문서를 요청합니다. 붙여넣고(Paste), 변환하고, Docs에 다시 붙여넣으면 서식이 살아남습니다.
- 고객용 이메일 템플릿(Email templates for customers). 발송되기 전에 수신자가 볼 HTML을 확인하고 싶습니다. 업로드 없이 라이브 미리보기(Live preview)가 필요합니다.
- 터미널에서 복사한 URL. 긴 URL이 세 줄에 걸쳐 감싸지면서(wraps), 복사할 때 개행 문자(newlines)와 들여쓰기(indentation)가 함께 오므로 브라우저에 붙여넣으면 아무것도 로드되지 않습니다. 공백을 제거하고, 그 다음 여는 것이 필요합니다.
- 파트너로부터 받은 깨진 URL. 공백, 혼합 대소문자(mixed case), 악센트, 추적용 쓰레기 데이터(tracking junk), 채팅 메시지에서 오는 후행 구두점 등이 있습니다. 정제하고(Sanitize), 슬러그화(slugify)하고, 인코딩하면 끝입니다.
- 시간대(Time zones). 저는 WIB(UTC+7)에 있습니다. 팀은 UTC, 이탈리아, 싱가포르, 홍콩에 있습니다. 감으로 변환하는 방식으로는 회의를 놓치기 쉽고, 온라인상의 컨버터 중 절반은 여름철에 약어(abbreviation)를 잘못 처리합니다.
- 지저분한 CSV 파일을 INSERT 문으로 변환하기. 개발 데이터베이스에 시드 데이터(seed data)가 필요할 때, 마법사 기능과 스키마 매핑 단계가 있는 가져오기 파이프라인 대신 바로
INSERT 문을 원합니다. Excel에서 CSV를 붙여넣고, MySQL 또는 Postgres를 선택하고, 구문을 복사하면 끝입니다. 컬럼 타입은 데이터로부터 추론되는데, 이 추론 과정에서 일부 컬럼이 잘못될 수 있습니다. 그리고 임시로 사용할 데이터(throwaway data)의 경우 저는 신경 쓰지 않습니다. 이 워크플로우에 대해 자랑스럽지는 않지만, 제가 가장 많이 사용하고 빠르기 때문에 사용합니다.
- JSON 보기. 때로는 편집할 필요가 없고, 그 구조(shape)를 볼 필요가 있습니다. 접을 수 있는 트리(Collapsible tree)와 키 및 값 전체 검색 기능이 필요합니다.
그 목록은 의도적으로 지루하고 구체적입니다. 그 어떤 것도 어려운 문제는 아닙니다. 이 도구들이 여섯 개의 사이트에 흩어져 있고, 각 사이트가 저에게 무언가를 요구하기 때문에, 모든 것이 하루에 단 10분을 소비합니다.
디자인 자체가 주관적임 (Opinionated by design)
규칙은 제가 정한 것이며 제품 논쟁의 대상이 아닙니다:
- 계정 없음. 동기화할 것이 없으므로, 로그인할 것도 없습니다.
- 탭을 벗어나는 것은 아무것도 없습니다. 모든 작업은 사용자의 기기에서 실행되는 함수입니다. API 호출(API call)도 없고, 원격 측정(telemetry)도 없고, 분석 SDK(analytics SDK)도 없습니다.
- 제품 내부에 AI가 없음. AI가 코드를 작성했습니다. 도구 자체는 결정론적(deterministic)이며, 저는 이들이 매번 동일한 답변을 하기를 바랍니다.
- 작업 공간(workspace), 대시보드(dashboard), 온보딩 투어(onboarding tour)가 없습니다. 열고, 사용하고, 닫습니다.
- 지저분해도 괜찮습니다. CSV를 INSERT로 변환하는 도구는 사용자 정의 열 유형을 추론하며 때로는 잘못 추론하기도 합니다. 공정한 거래인 시드 데이터(seed data)의 경우: 이는 마이그레이션 도구가 아니라 임시 데이터를 위한 보조 도구이며, 모든 것에 대해 정확하기보다는 빠르기를 바랍니다.
도구가 서버나 로그인, 또는 유료 티어를 필요로 한다면 추가되지 않습니다. 이 제약 조건 덕분에 제가 그렇지 않았다면 구축해야 했을 많은 기능들을 제거할 수 있었고, 이것이 제가 가장 좋아하는 부분입니다.
현재 포함된 내용
여섯 가지 그룹: JSON, 문자열(strings), 시간(time), 테이블(tables), 웹 및 HTML, 마크다운(markdown). 저는 여기에 숫자를 매기지 않을 것입니다. 왜냐하면 그 숫자는 제가 짜증을 느낄 때마다 변하기 때문이고, 그것이 요점입니다.
JSON: 비주얼라이저 및 축소화 도구(beautifier and minifier), 대화형 트리 시각화기(interactive tree visualizer), 문자열화 및 이스케이프 해제(stringify and unescape), 추론을 사용한 스키마 빌더, JSON to Pydantic/Zod/TS/Go.
문자열: HTML 엔티티, URL 구성 요소, 정규 표현식 특수 문자(regex specials), C 스타일 슬래시 및 Base64에 대한 이스케이퍼 및 언이스케이퍼; 공백 제거기(whitespace remover); 슬러그 생성기(slugifier); 기본 인코더(base encoder); 텍스트 및 Git diff.
시간: 계절별 시간대 변환기(DST-aware time zone converter)로, 여름과 겨울에 상관없이 약어가 정확합니다.
테이블: 테이블 및 CSV 편집기, 그리고 JSONL, TSV, 마크다운 및 JSON 내보내기를 지원하는 MySQL, PostgreSQL, SQLite 및 MSSQL용 CSV to SQL INSERT 문.
웹: HTML 및 이메일 미리보기.
마크다운(Markdown): 실시간 에디터 및 미리보기, 그리고 붙여넣기 준비가 된 형식으로의 변환 기능까지 제공합니다.
Ctrl+P를 눌러 명령어 팔레트(command palette)에 접근하고, 매일 사용하는 도구를 고정하며, 작성한 초안이 새로고침 후에도 유지되도록 할 수 있습니다.
계속 성장하고 있으며, 그것이 초대장입니다
Quoin은 스타트업도 아니고 되려고 노력하는 곳도 아닙니다. 제가 짜증을 느끼는 다음 순간에 도구를 추가하는 공간입니다. 만약 당신도 같은 불편함을 느낀다면, 세 가지 방법으로 참여할 수 있습니다:
- 필요한 워크플로우로 이슈(issue)를 열어주세요. 위의 규칙에 부합한다면, 그것이 구축됩니다.
- PR을 보내주세요. 도구 레지스트리(tool registry)는 하나의 파일이며, 도구 페이지 역시 하나의 파일을 사용하고 모든 페이지가 동일한 골격(skeleton)을 가지고 있기 때문에, 도구를 추가하는 것은 작은 차이점(diff)만 적용하면 됩니다.
- 포크(Fork)하세요. 규칙을 변경하거나, 서버를 추가하거나, 자체 인증(auth) 기능을 추가할 수 있습니다. 포크된 저장소를 팀 전용으로 비공개로 유지할 수도 있습니다. 이 프로젝트는 MIT 라이선스이며, 저는 당신이 실제로 필요로 하는 도구를 갖기를 바랍니다.
실시간 데모: quoin.izzudd.my.id
소스 코드: github.com/izzudd/quoin
만약 사용하다가 문제가 생기면 알려주세요. 제가 고치겠습니다. 만약 아무 문제도 없다 하더라도 괜찮습니다.