Vibe coding still needs
UX development.
The faster ideas become code, the more it matters that people can understand and enjoy what you build. Learn the principles and practice of UX development through courses, tutorials, and articles.
UX Development Courses
D3 Data Visualization
From bar charts to interactive 3D globes — 6 essential D3.js v7 patterns
개발 환경 입문
터미널부터 Vercel 배포까지 — 코딩 경험 없이 시작하는 개발 환경 세팅
GSAP Animation
Scroll effects, 3D transforms, SVG drawing, smooth scroll — 17 essential GSAP patterns
Three.js for Interactive Content
Build scroll-driven 3D scenes, product viewers, particle systems, and shader effects — patterns you can ship on real projects
Vibe Coding for UX Engineering
Build production-ready UI with Claude Code — prompting, iteration, CSS, GSAP animations, JS interactions, and real project delivery
Hands-on Tutorials
Start with the finished result, then compare it with the source to quickly understand the implementation and core patterns. Apply what you need directly to your work.
Blog
Insights on UX, interaction, and front-end implementation in the age of vibe coding.
-
ECC로 Claude Code 확장하기: 설치부터 효과적인 활용까지 ECC(Everything Claude Code)는 Claude Code에 계획·테스트·리뷰·보안 점검을 연결하는 오픈소스 작업 체계다. 설치 경로를 고르고 필요한 기능만 활용하는 실전 방법을 정리했다. -
Jev란 무엇인가: 개발 워크플로에 판단 모델을 붙이는 설치·활용 가이드 TypeSafe AI의 Jev가 챗봇과 어떻게 다른지, Choice·Score·Noul을 언제 쓰는지, Playground·API·SDK로 시작하는 방법과 개발 실무 적용·검증 기준을 설명합니다. -
Claude Code 프로젝트 시작법: 재사용 가능한 하네스와 환경설정 Claude Code를 새 프로젝트에 들일 때 무엇부터 설정해야 할까? 짧은 프로젝트 지침, 실행 가능한 검증, 선택적 플러그인으로 시작하는 재사용 가능한 방법을 정리했다. -
온톨로지란 무엇인가: 실제 프로젝트의 설계·구축·검증·운영 가이드 온톨로지를 개념도에서 운영 환경까지 연결합니다. RDF·OWL·SHACL·SPARQL의 역할, 파일 구조, 예제 데이터, 검증과 배포 흐름을 한 프로젝트로 설명합니다. -
로컬 AI 이미지 생성 입문: ComfyUI와 FLUX로 첫 그림 만들기 로컬 이미지 생성이 낯설다면 앱·모델·워크플로부터 구분해 보자. ComfyUI와 FLUX.2 Klein 4B로 설치, 모델 파일 배치, 프롬프트 입력, 결과 저장까지 따라가는 실전 안내다.