[UtilCraft] 올인원 온라인 도구 플랫폼 (JSON 포맷터, 이미지 리사이즈 등)

UtilCraft

URL: https://utilcraft.com

(1) 자기소개

개발자로 일하면서 업무에 필요한 온라인 도구들을 자주 찾아 쓰게 되는데, 매번 여러 사이트를 돌아다니는 게 번거로워서 직접 만들게 된 프로젝트입니다. Next.js 14 / TypeScript / Tailwind CSS로 개발했고, Claude Code를 활용한 바이브 코딩으로 빠르게 프로토타입을 만들어나갔습니다.

(2) 서비스 소개

UtilCraft는 업무나 개발할 때 필요한 온라인 도구들을 한 곳에 모아놓은 플랫폼입니다. PDF 변환, 이미지 편집, JSON 포맷터, 패스워드 생성기, QR 코드 생성 같은 도구들을 브라우저에서 바로 사용할 수 있습니다. 가장 큰 특징은 모든 처리가 클라이언트 사이드에서 진행되어 파일이 서버로 업로드되지 않는다는 점입니다. 개인정보 걱정 없이 안전하게 사용할 수 있습니다.

현재 제공 중인 주요 기능:

• 문서 도구: 마크다운 에디터

• 이미지 도구: 이미지 리사이즈, 이미지 압축

• 계산 도구: 단위 변환기, 퍼센트 변환기

• 개발자 도구: JSON 포맷터, 색상 변환기

• 생산성 도구: 패스워드 생성기, QR 코드 생성기

• 게임: 간단한 브라우저 게임들

아직 도구와 게임이 많지 않지만, 사용자 피드백을 받으면서 지속적으로 추가해나갈 예정입니다!

(3) 시작하게 된 계기

개발하다 보면 JSON 포맷하거나 이미지 리사이즈하거나 Base64 인코딩할 일이 자주 생기는데, 매번 구글 검색해서 사이트 들어가서 쓰는 게 비효율적이더라고요. 특히 파일을 서버에 올려야 하는 경우에는 보안도 신경 쓰이고요.

그래서 "내가 자주 쓰는 도구들을 깔끔하게 모아둔 사이트를 만들면 어떨까?"라는 생각으로 시작했습니다. 처음엔 저만 쓸 용도였는데, 만들다 보니 다른 개발자나 직장인들도 비슷한 불편함을 느낄 것 같아서 제대로 된 서비스로 만들기로 결정했습니다.

(4) 개발

기술 스택:

• Frontend: Next.js 14 (App Router), TypeScript, Tailwind CSS

• 상태 관리: Zustand

• UI: Radix UI + Custom Components

• 서버 & 배포: Oracle Cloud Server (자체 배포), Vercel (프론트엔드)

• 개발 도구: Claude Code를 활용한 바이브 코딩

(5) 바라는 것

현재는 기본적인 도구들만 있지만, 피드백을 받으면서 계속해서 새로운 도구와 게임을 추가해나갈 계획입니다. 장기적으로는 개발자뿐만 아니라 일반 직장인, 학생들도 부담 없이 쓸 수 있는 "필수 도구 플랫폼"으로 자리잡으면 좋겠습니다.