Vue Family Bucket을 기반으로 개발된 프런트엔드 구성요소 관리 플랫폼

프로젝트 배경

웹사이트 구축 아웃소싱 회사의 경우 디자인 과정에서 재사용 가능한 구성 요소가 많이 축적되어 있기 때문에 디자이너는 페이지를 구성하고 프런트 엔드에 전달하기 위해 구성 요소를 미세 조정하기만 하면 되는 경우가 많습니다. 이론적으로는 이러한 구성 요소를 프런트 엔드에서도 재사용할 수 있지만 실제로는 프런트 엔드에서 매번 전체 페이지를 다시 구현해야 하므로 많은 인력이 낭비됩니다.

기능 요구사항

이 프로젝트의 아이디어는 모든 구성요소를 개발하고 이를 통합된 플랫폼에 입력하여 관리하는 것입니다. 디자이너는 플랫폼으로 가서 구성요소를 선택하고 실시간으로 구성요소를 미리 보고 조정할 수 있습니다. 전체 프로세스 중에 얻을 수 있으며 플랫폼은 조정 결과를 생성합니다. 코드가 프런트 엔드에 전달되는 한 이 코드 문자열을 사용하여 디자이너가 수정한 구성 요소를 재현할 수 있습니다. 플랫폼에 추가하고, 한 번의 클릭으로 컴포넌트의 html/css/js 코드를 복사해 프로젝트에 빠르게 적용할 수 있어 컴포넌트 부분의 프론트엔드 개발 비용을 거의 0에 가깝게 만들 수 있습니다. 플랫폼은 다음 기능을 구현해야 합니다:

* 관리 구성 요소, 분류, 검색 및 정렬 지원

* 구성요소 표시 및 구성요소 온라인 미리보기/편집 지원

* 컴포넌트 핸드오버, 컴포넌트 코드 생성 및 코드 기반 컴포넌트 재현 지원

* 사용 통계, 구성 요소의 추가 최적화를 촉진하기 위해 구성 요소 사용에 대한 통계 지원

기술 스택

Vue+Vue 라우터+Vuex

프로젝트 미리보기

프런트엔드 구성요소 관리 플랫폼

소스 코드

Github

위 내용은 Vue Family Bucket을 기반으로 개발된 프런트엔드 구성요소 관리 플랫폼의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!