웹 개발 배우면서 쓰는 무료 도구들
HTML, CSS, JavaScript 배우기 시작했으면 이런 도구들 알아두면 좋음. 전부 무료고 브라우저에서 바로 쓸 수 있음.
JSON/데이터
JSON 포매터 - API 응답 데이터 정리해서 보기. 들여쓰기 자동으로 해줌. Base64 변환은 이미지 인라인으로 넣을 때.
정규식
정규식 테스터 - 이메일, 전화번호 검증 패턴 테스트. 처음엔 어렵지만 익숙해지면 필수임.
URL/인코딩
URL 인코더 - 쿼리스트링 인코딩. 한글이나 특수문자 포함된 URL 처리할 때. 해시 생성은 비밀번호 해싱 개념 이해.
UUID/ID
UUID 생성기 - 고유 ID 만들 때. 데이터베이스 primary key로 쓰기도 함.
타임스탬프
타임스탬프 변환 - Unix timestamp 개념 이해. 날짜 데이터 다룰 때 필수.
진법 변환
진법 변환기 - 2진수, 16진수 변환. 색상 코드나 비트 연산 이해할 때.
색상
색상 변환기 - RGB, HEX, HSL 변환. CSS에서 색상 다룰 때 필수. 컬러 팔레트는 배색 조합 찾을 때.
이미지
이미지 리사이즈 - 웹 최적화 사이즈로. 이미지 압축은 로딩 속도 개선, 파비콘 생성은 사이트 아이콘.
텍스트
글자수 세기 - textarea maxlength 테스트. 로렘 입숨은 더미 텍스트, 텍스트 변환은 대소문자.
QR/바코드
QR코드 생성 - 모바일 테스트할 때 URL QR로. 바코드는 재고 관리 시스템 만들 때.
네트워크
내 IP 확인 - 로컬 개발 환경 설정. IP 조회는 접속 로그 분석, 화면 크기는 반응형 테스트.
시간
타이머 - 뽀모도로로 코딩 집중. 디데이는 프로젝트 마감일.
비밀번호
비밀번호 생성 - 안전한 비번 생성 원리 이해.
기타
퍼센트 계산, 단위 변환, 화면 비율 - 레이아웃 계산.
개발 배우면서 이런 도구들 직접 만들어보는 것도 좋은 연습임. 다 무료.