오픈소스 프로젝트
2023년에 만든 나의 UI 키트
2023년에 만들고 실제 프로젝트에서 사용한 오픈소스 UI 키트입니다. 폼, 버튼, 테이블, 차트, 캘린더, 내비게이션, 파일 업로드의 현지화된 데모를 살펴보세요.
실제 제품 작업을 위해 만든 키트
JSVar로 옮기기 전 실제 프로젝트에서 사용하던 제 원본 프런트엔드 키트입니다. 폼, 버튼, 모달, 테이블, 차트, 캘린더, 내비게이션, 파일 업로드 패턴을 포함합니다.
입력 필드
유효성 검사가 포함된 텍스트, 텍스트 영역, 전화, 이메일 및 비밀번호 필드입니다.
버튼
기본, 보조, 압축, 비활성화 및 사용자 정의 스타일 작업.
선택 필드
일반 값 및 객체 배열에 대한 단일 및 다중 선택.
로드 중
비동기 작업에 대한 로드 상태를 차단합니다.
아코디언
한 번에 하나씩 열리는 확장 가능한 콘텐츠 블록입니다.
메시지
확인 작업이 포함된 성공 및 오류 메시지입니다.
모달
명확한 수락 및 취소 흐름이 포함된 확인 대화상자입니다.
페이지 매김
제한된 이전 및 다음 컨트롤이 있는 편집 가능한 페이지 입력입니다.
토글
간단한 제품 설정을 위한 컴팩트 부울 컨트롤입니다.
팝업 패널
보조 세부정보 및 상황별 읽기를 위한 팝업 패널입니다.
언어
JSVar의 21개 로캘 메타데이터를 기반으로 구축된 언어 선택기 데모입니다.
테이블
기본 테이블, 행 세부정보 및 밀도 히트맵.
차트
누적, 그룹화, 혼합, 선, 영역 및 원형 차트 데모.
달력
시작 및 종료 값 쌍에 대한 현지화된 날짜 선택입니다.
파일 드롭
일치하는 업로드 작업이 있는 끌어서 놓기 파일 대상입니다.
네비게이션
동일한 섹션 모델의 모듈 내 섹션 탐색.
스텁
미완성 상태 또는 뷰포트 제한 상태에 대한 보호 오버레이입니다.
쇼케이스
구성요소 놀이터
사이드바를 사용하여 모든 구성 요소 제품군을 찾아보고 이식된 동작을 테스트하세요.
현재 섹션
01/17입력 필드
유효성 검사가 포함된 텍스트, 텍스트 영역, 전화, 이메일 및 비밀번호 필드입니다.
현재 섹션
입력 필드
유효성 검사가 포함된 텍스트, 텍스트 영역, 전화, 이메일 및 비밀번호 필드입니다.
문자 수: 0/1000
표준 필드
이 필드에 잘못된 값이 포함되어 있습니다.
흐림 확인됨
도메인 제안 포함
10자 이상, 대소문자 혼합, 숫자, 기호