단기집중과정 101
10 모듈
5 주

작동 방식

복사하려면 클릭

이 섹션에서는 AppMaster의 웹 디자이너가 어떻게 작동하는지 자세히 살펴봅니다. 웹 애플리케이션을 쉽게 디자인하고 사용자 정의할 수 있는 강력한 도구에 대해 알아보세요.


코드가 없는 AppMaster 웹 앱 빌더를 사용 하면 인터페이스 디자인뿐만 아니라 비즈니스 로직 및 타사 서비스와의 통합을 포괄하는 애플리케이션을 개발할 수 있습니다. AppMaster Web Designer를 사용하면 단 하나의 도구를 사용하여 빠르고 확장 가능하며 사용자 친화적인 애플리케이션을 쉽게 만들 수 있습니다.

상호 작용

AppMaster로 웹 애플리케이션을 개발하기 위한 초기 단계는 인터페이스를 디자인하는 것입니다. 개발 프로세스에는 세 가지 수준의 작업이 포함됩니다.

  • 레이아웃 : 애플리케이션의 모든 유형의 화면에 대한 템플릿을 디자인합니다.
  • 페이지 : 이전에 디자인한 레이아웃을 사용하여 페이지를 만듭니다.
  • UI 구성 요소 : 개별 사용자 인터페이스 요소를 구축합니다.

공들여 나열한 것

Build and using layouts in AppMaster Web Designer

레이아웃은 웹 애플리케이션의 구성 요소를 구성하기 위한 프레임워크를 제공하여 일관된 페이지 구조를 생성할 수 있도록 합니다. 레이아웃에는 관련 웹 애플리케이션 페이지에 적용되는 공통 구성 요소, 논리 및 스타일이 포함될 수 있으므로 여러 페이지에 걸쳐 반복적인 요소가 필요하지 않습니다.

예를 들어 웹 애플리케이션의 모든 페이지에 탐색 패널이 필요한 경우 레이아웃에 탐색 패널 구성 요소를 추가할 수 있습니다. 레이아웃에 대한 모든 변경 사항은 관련 페이지에 자동으로 적용됩니다. 특정 페이지에 다른 구조가 필요한 경우 로그인 및 등록 페이지와 같은 추가 레이아웃을 만들 수 있습니다.

레이아웃을 사용하면 인터페이스 생성 시간 단축, 프로젝트 지원 간소화, 작업 애플리케이션 변경 단순화 등의 이점이 있습니다. 또한 레이아웃은 조건에 따라 페이지에 다양한 레이아웃을 할당하여 A/B 테스트를 용이하게 합니다. 레이아웃을 통한 탐색은 전체 페이지 다시 로드를 방지하고 동적 콘텐츠만 새로 고치므로 애플리케이션 성능이 향상되고 메모리가 절약됩니다.

페이지

Build and usage pages in AppMaster Wed Designer

애플리케이션 인터페이스의 다음 계층은 페이지입니다. 이전에 생성된 레이아웃을 기반으로 생성되고 고유한 설정이 있으며 페이지의 컨텍스트에 따라 필요한 UI 구성 요소를 추가하여 확장됩니다.

예를 들어 웹 사이트를 구축하는 경우 머리글과 바닥글이 포함된 레이아웃을 모든 웹 앱 페이지에 연결한 다음 각 페이지에 바닥글과 머리글을 만들지 않고도 콘텐츠로 채울 수 있습니다.

UI 요소

Using UI elements with drag-and-drop in AppMaster Web Designer

UI 요소는 웹 애플리케이션의 기본 구성 부분입니다. 텍스트, 버튼, 이미지, 표 등과 같은 콘텐츠 요소를 나타냅니다.

"드래그 앤 드롭" 인터페이스를 사용하면 요소를 작업 공간으로 쉽게 이동할 수 있으며 향후 웹 애플리케이션이 어떻게 보일지 즉시 확인할 수 있습니다. 원자 요소를 서로 중첩하여 더 복잡한 구성 요소를 만들 수 있습니다. 모든 애플리케이션 부분은 레이아웃 및 페이지를 포함한 UI 요소로 구성됩니다.

따라서 AppMaster Web App Designer는 웹 애플리케이션 구축을 위한 WYSIWYG("What You See Is What You Get") 편집기로 제공됩니다.

맞춤화

AppMaster Web Designer web app Theme Builder

또한 더 빠른 웹 앱 개발을 위해 기본 및 추가 색상, 크기, 타이포그래피 등과 같은 공통 요소 스타일을 설정할 수 있는 테마 빌더를 사용하여 애플리케이션의 모양을 사용자 정의할 수 있습니다.

애플리케이션 설정에서 브라우저 및 검색 결과(애플리케이션 이름, 설명, 파비콘)에 애플리케이션 보기를 설정할 수 있습니다.

비즈니스 로직

애플리케이션 인터페이스가 생성되면 다음을 포함하는 비즈니스 로직 구성을 시작할 수 있습니다.

  • 로컬 데이터베이스 생성 (곧!) .
  • 전역 변수 생성.
  • 구성요소 작업 및 애플리케이션 트리거를 구성합니다.
  • 일반적인 비즈니스 프로세스 구축.
  • 일정에 따라 비즈니스 프로세스 실행 (곧!) .
  • 다양한 언어에 대한 현지화 설정 (곧!) .

제3자 서비스

모듈 라이브러리의 타사 서비스를 통합하여 웹 애플리케이션의 기능을 향상시킬 수 있습니다. 여기에서 소셜 네트워크 인증 모듈(Google, Apple, Linked In, Facebook), 캘린더, 다양한 지도 모듈, 결제 서비스 등을 찾을 수 있습니다. 사용 가능한 통합의 전체 목록은 AppMaster Web App Designer (곧!) 의 모듈 섹션에서 확인할 수 있습니다.

Was this article helpful?
아직도 답을 찾고 계십니까?