프론트엔드 개발을 하면서 어떤 에디터, 테스트 도구 쓸까 라는 고민해 보신 적 있으신가요?개발 환경 구축부터 테스트, 최적화에 필요한 도구들을 정리해 봤습니다. 필요할 때마다 찾아보세요!🔧 개발자 도구코드 에디터 & IDEVS Code - 마이크로소프트 코드 에디터WebStorm - JetBrains JavaScript IDECursor - AI 기반 코드 에디터코드 스니펫 & 템플릿30 seconds of code - 짧은 코드 스니펫CodePen - 프론트엔드 코드 공유HTML5 Boilerplate - HTML5 템플릿API & 모킹JSON Placeholder - 가짜 REST APIRandom User Generator - 랜덤 사용자 데이터Lorem Ipsum - 더미 텍스트 생성기MSW -..

프론트엔드 개발을 하면서 어떤 CSS 프레임워크, 애니메이션 라이브러리 쓸까 라는 고민해 보신 적 있으신가요?UI 구현과 시각적 표현에 필요한 도구들을 정리해 봤습니다. 필요할 때마다 찾아보세요!🛠️ 디자인 & 프로토타이핑 도구디자인 도구Figma - 협업 디자인 도구Sketch - macOS 전용 디자인 도구프로토타이핑 도구Framer - 인터랙티브 프로토타이핑ProtoPie - 코드 없는 프로토타이핑디자인 to 코드Figma Dev Mode - Figma 디자인을 코드로Anima - 디자인을 React/Vue 코드로 변환온라인 디자인 도구Canva - 온라인 디자인 도구🎬 애니메이션 & 모션JavaScript 애니메이션 라이브러리GSAP - 고성능 JavaScript 애니메이션Motion - Re..

프론트엔드 개발을 하면서 좋은 아이콘, 이미지, 폰트 어디서 구하지 라는 고민해 보신 적 있으신가요?무료 또는 CC0 라이선스로 사용 가능한 디자인 에셋을 정리해 봤습니다. 필요할 때마다 찾아보세요!📊 일러스트레이션 & 아이콘벡터 일러스트레이션Illustroke - AI 기반 벡터 일러스트레이션 생성Storyset - 무료 편집 가능한 일러스트레이션Blush - 믹스 앤 매치 일러스트레이션Open Peeps - 손으로 그린 일러스트레이션 라이브러리unDraw - 오픈소스 일러스트레이션ManyPixels - 2,500개 이상의 무료 일러스트레이션아이콘 & 일러스트레이션 마켓플레이스IconScout Illustrations - 일러스트레이션 마켓플레이스IconScout 3D - 3D 일러스트레이션 모음Ic..