VanillaFront

Va.FileDropUploadField — 라벨 + 드래그앤드롭 파일 업로드Va.FileDropUpload가 순수 드롭 영역이라면, Va.FileDropUploadField는 그 위에 폼 라벨·필수 표시·검증 메시지를 얹은 완성 폼 필드입니다. Field 계열 아키텍처 그대로, 내부에 Va.FileDropUpload를 소유하는 Composition 구조. 폼 안에서 드래그앤드롭 업로드가 필요할 때 정석.클래스: Va.FileDropUploadField — va_component.js:12653short name: fileDropUploadField상속: Va.Field (다른 Field 형제들과 같음)내부 컴포넌트: Va.FileDropUpload 인스턴스 (fieldComponent)isContain..

Va.FileDropUpload — 드래그앤드롭 파일 업로드 영역드래그앤드롭이 주된 UI인 파일 업로드 컴포넌트. 사용자가 파일을 창 안에 끌어다 놓으면 자동으로 읽어 이벤트를 dispatch합니다. 파일 내용을 텍스트로 읽을지 DataURL(base64)로 읽을지 옵션으로 선택 가능.클래스: Va.FileDropUpload — va_component.js:12504short name: fileDropUpload상속: Va.Component (PureField 아님!)isContainer: true베이스 CSS: va-file-upload-div1. 기본 사용{ tagName: 'fileDropUpload', text: '파일을 여기 놓으세요', fileType: 'binary', ..

Va.ImageFile — 이미지 파일 업로드 + 미리보기일반 Va.File에 이미지 미리보기·드래그앤드롭·우클릭 편집 기능이 통합된 컴포넌트. 프로필 사진, 게시글 대표 이미지, 상품 사진 같은 이미지 특화 업로드 UI를 한 번에 제공합니다.클래스: Va.ImageFile — va_component.js:9954short name: imageFile상속: Va.PureField (File과 형제)isContainer: true베이스 CSS: va-image-file1. 기본 사용{ tagName: 'imageFile', src: '/uploads/profile.jpg', // 초기 이미지 shape: 'circular', onChange: 'onImageChange'}렌..

왜 VanillaFront를 만들었나?한국 UI 프레임워크 시장의 현실한국의 사내 시스템·엔터프라이즈 웹 개발에는 오랜 관행이 있다. 그리드·차트·다이어그램 같은 전문 컴포넌트가 필요하면 사실상 몇 개 안 되는 상용 UI 프레임워크 중 하나를 고른다. 대안이 없어서가 아니다. 이 도구들이 오래 자리를 잡아서 "일단 이거로 시작" 이 표준이 되어버렸기 때문이다.문제는 이 표준의 진입 비용이다.라이선스 벽정확한 가격은 벤더별·계약별로 다르지만, 시장에서 통용되는 대략의 감각은 이 정도다:카테고리대표 제품가격대 (대략)종합 UI 플랫폼국내의 N제품, W제품, eX제품프로젝트/도메인당 수천만 원 ~ 수억 원 이 가격표를 보는 세 부류의 개발팀이 있다:대기업·공공 SI — 프로젝트 예산에 라이선스가 이미 편성되어..

Va.FileField — 라벨 + 파일 업로드 필드Va.File이 순수 파일 입력이라면, Va.FileField는 그 위에 폼 라벨·필수 표시·검증 메시지를 얹은 완성 폼 필드입니다. Field 계열 아키텍처 그대로, 내부에 Va.File을 소유하는 Composition 구조. 첨부파일이 있는 폼에 정석.클래스: Va.FileField — va_component.js:9491short name: fileField상속: Va.Field (다른 Field 형제들과 같음)내부 컴포넌트: Va.File 인스턴스 (fieldComponent)isContainer: true베이스 CSS: va-field1. 기본 사용{ tagName: 'fileField', label: '첨부파일', fileBu..