웹 개발자가 매일 실제로 쓰는 도구 10가지
JSON 포맷팅부터 정규식 테스트, 코드 압축까지 — 웹 개발자의 진짜 일상 툴킷.
"있으면 좋은" 개발 도구가 있고, 매일 여는 도구가 있습니다. 브라우저 즐겨찾기에 박아둔 도구. 커피보다 먼저 손이 가는 도구.
웹 개발자가 실제 업무에서 매일 쓰는 도구 10가지와, 이것들이 어떻게 연결되는지 정리했습니다.
1. JSON 포맷터 — 하루에 다섯 번은 연다
API 응답, 설정 파일, 웹훅 페이로드. 오늘 하루만 해도 JSON을 최소 다섯 번은 포맷할 겁니다. 추측이 아니라 현실이에요.
API가 한 줄짜리 blob을 뱉어내면? 붙여넣기. 요청 본문 디버깅? 붙여넣기. 동료의 페이로드 리뷰? 네, 붙여넣기.
2. 정규식 테스터 — 정규식을 외우는 사람은 없다
이메일 형식 검증. 로그 파일 파싱. URL에서 ID 추출. 매번 "이제 알 때도 됐는데"라고 생각하면서, 매번 테스터를 엽니다.
실제 워크플로: 패턴 작성 → 샘플 데이터로 테스트 → 매칭될 때까지 수정. 전방 탐색 문법을 기억하는 척하는 것보다 훨씬 빠릅니다.
3. Base64 인코더/디코더 — 생각보다 자주 쓴다
CSS에 작은 이미지 삽입? Base64. 인증 토큰 페이로드 디코딩? Base64. JSON API로 바이너리 전송? 또 Base64.
전형적인 흐름: 인증 시스템에서 JWT를 받고, Base64 페이로드를 디코딩해서 클레임을 확인하고, 만료 시간이 틀렸다는 걸 발견하고, 토큰 생성 코드를 수정합니다. 그냥 평범한 화요일이에요.
4. 색상 변환기 — 디자인과 코드의 다리
디자이너가 #c96442를 보내줍니다. CSS에는 rgb()가 필요하고. 애니메이션 라이브러리는 hsl()을 원하고. Tailwind 설정에는 hex 값이 들어갑니다. 기능 하나 만들 때마다 색상을 여러 번 변환하게 됩니다.
5. 코드 압축기 — 배포 전 의식
프로덕션에 푸시하기 전에 JavaScript와 CSS를 압축합니다. 번들이 작아지고, 로딩이 빨라집니다. 페이지 로딩 3초와 1.5초의 차이죠.
6. URL 인코더 — 쿼리 스트링이 이상해질 때
사용자 입력을 URL로 전달하거나 API 파라미터에 특수 문자가 있을 때. 제대로 인코딩하지 않으면 조용히 깨집니다. 최악의 버그 — 개발 환경에서는 되는데 실제 사용자 데이터로는 실패하는 거.
7. UUID 생성기 — 새 엔티티마다 필요
새 데이터베이스 레코드, 세션 ID, API 키 플레이스홀더? UUID가 필요합니다. 빠르고, 유니크하고, 충돌 없이. 2초면 되지만 일주일에 수십 번 합니다.
8. 해시 생성기 — 체크섬과 무결성
파일 무결성 확인, 캐시 키 생성, 저장 없이 내용 비교. SHA-256 해시는 빌드 파이프라인, CDN 설정, 서브리소스 무결성 태그에 나타납니다.
9. JWT 디코더 — 인증 흐름 파악
인증이 깨지면 첫 번째 질문은 항상 "토큰에 뭐가 들어있지?"입니다. JWT를 디코딩하고, 클레임을 확인하고, 만료된 타임스탬프를 찾습니다. 30분 추측하는 대신 30초에 해결.
10. 글자 수 카운터 — 보이지 않는 제약
메타 디스크립션 (160자 이내), 트윗 길이 제한, DB 필드 제약, 커밋 메시지. 특히 정해진 공간에 맞춰야 하는 문구를 작성할 때, 생각보다 자주 글자 수를 셉니다.
이 도구들이 연결되는 방식: 실제 워크플로
디버깅 세션의 전형적인 흐름:
- API가 이상한 데이터 반환 → JSON 포맷으로 확인
- 이상한 필드 값 발견 → Base64 디코딩으로 내용 확인
- 응답에서 ID 추출 필요 → 정규식 패턴 작성
- 수정된 요청을 인코딩된 파라미터로 빌드 → URL 인코딩
- 수정 사항 배포 → 배포 전 코드 압축
가상 시나리오가 아닙니다. 그냥 수요일 오후예요.
핵심은 도구가 아니라 흐름이다
개별 도구는 단순합니다. 가치는 연결에 있습니다. 포맷, 디코딩, 검증, 인코딩을 즉시 할 수 있으면, 디버깅이 답답함에서 체계적인 과정으로 바뀝니다.
추측을 멈추고 보기 시작하는 거죠.
최고의 툴킷은 가장 화려한 게 아닙니다. 생각 없이 손이 가는, 실제 작업에서 마찰을 제거해주는 도구입니다. 이 열 가지를 즐겨찾기에 넣어두세요. 내일도 쓰게 될 겁니다.