react drag
1.0.0
(이 프로젝트는 저자의 졸업 디자인입니다)
비즈니스 시나리오, 구성 요소의 추상화 및 분할 등에 대한 시각적 편집 시스템에 대한 관련 연구를 통해 우리는 소수의 프론트 엔드 개발자의 문제, 더 많은 페이지 요구,보다 반복적 인 요구 사항 및 낮은 재사용 성의 문제를 해결하기 위해 노력하고 있습니다. React 기반 프론트 엔드 시각화 플랫폼을 기반으로 시스템을 구현하십시오. 이 플랫폼은 사용자에게 프론트 엔드 페이지를 시각적으로 편집하고 해당 반응 코드를 생성하는 기능을 제공 할 수 있습니다. 기술자에게는 보편적 인 페이지 빌딩 플랫폼을 만들 수 있습니다.
이 시스템의 프론트 엔드 부분은 React 기술을 View 프레임 워크로 사용합니다. 이 시스템은 제어를 라우팅하기 위해 UMI 프레임 워크를 사용하고 상태 관리에 DV를 사용합니다. 프론트 엔드는 서버의 렌더링을위한 중간 계층으로 Node.js에 의존하여 페이지의 첫 번째 화면의 렌더링 속도를 더욱 향상시킵니다. 프론트 엔드 디스플레이 부분에서는 페이지, 레이아웃 및 구성 요소를 통해 완료됩니다. 국가 관리 섹션에서는 모델과 협력하고 DVA의 Connect를 통해 뷰를 데이터에 연결하십시오. 동시에 프론트 엔드 요청의 경우 서비스 계층을 통해 구현됩니다. 일반적으로 사용되는 몇 가지 방법을 도구 세트로 사용하십시오. 특별한 의미를 가진 변수를 공통적으로 배치하십시오.
이 시스템의 모듈에는 주로 사용자 관리, 조직 관리, 페이지 드래그 및 드롭 편집, 페이지 미리보기 및 내보내기 및 구성 요소 관리의 5 가지 주요 모듈이 포함됩니다. 그중에서도 JWT는 프론트 엔드 로그인 인증 방법으로 사용되므로 사용자 인증 모듈이 추가됩니다. 시스템의 핵심 기능 프로세스는 사용자가 시스템에 로그인하고 시각적 페이지 편집 영역으로 들어가고 편집 할 구성 요소를 선택하고 페이지를 서버에 저장하고 관련 코드를 빌드하고 해당 압축 패키지를 생성하는 패키지를 선택한다는 것입니다.
