BizFlow M -(2)

1-2 What is AppDev Studio

UI

AppDev

• AppDev Studio
  • forms의 interface와 다른 entities와 상호작용 하는 법을 designing
  • Toolbar
    • form 저장
    • History 추적
    • publishing
  • Left-hand Panel
    • different forms, blocks, UI components를 가짐
  • Right-hand Panel
    • attributes, styling 추가
    • data entities와 components 사이에 상호작용 추가
  • the Canvas
    • form의 디자인이 구현되는 곳
  • Bottom Panel
    • form 내에서 JSON objects 표시
• AppDev Data Modeler
  • Form에서 사용하는 Data entities, resources 생성

Left-Hand Panel

• workspaces의 list 표시
• workspace 클릭시, list of projects 표시
• project 클릭시, a list of forms 표시

Right-Hand Panel

• 8 tabs
  • Attribute
    • attributes 변경
    • component에 style 추가
  • Layout
    • different layout 변경
    • margin, padding 값과 함께 Layout의 width 조정
  • Data
    • component와 연결된 현재 data entity에 관련된 정보
  • Condition
    • component에 규칙이나 조건 추가
  • Event
    • 클릭과 같은 이벤트가 component에서 trigger될때 실행될 함수 추가
  • Link
    • 코드를 이용해서 component를 세심하게 조절
    • Only in Advanced-Level Projects
  • Validation
    • data entities에 입력된 사용자 입력을 검증
  • Relationship
    • 현재 사용하고 있는 data entity와 다른 entity와의 현재 관계를 보여줌

Toolbar

• complete other miscellaneous functions
  1. Save button
     • 변동사항 저장
  2. Form Callback function
     • form이나 block에서의 변동이 감지될 때마다 호출되는 기능을 저장하는 panel
     • In Intermediate levels
  3. Extend CSS and Java function
     • component에 CSS style과 JavaScript 기능을 적용 및 확장
  4. Clock button
     • 저장 하기전 이전 변동사항으로 되돌릴 수 있는 reverse function
  5. Publish History button
     • view the different URLs for the forms in project
     • 새로 copy를 생성할 필요 없이 published application을 업데이트
  6. Publish button
     • when you want to first get your project out into the public
     • 누를 때마다 복사본을 생성 (저장공간 낭비주의)
  7. Preview button
     • publish 전에 application 미리보기 (mobile, tablet, desktop)

Bottom Panel & Project Manager

• Project Manager
  • workspace 내 hierarchy를 관리하는 도구
  • block, form, project or workspace를 생성, 수정, 삭제할 수 있는 유일한 곳
  • 다른 유저에 권한 부여
• Bottom panel
  • Chat
    • 같은 프로젝트를 하는 users와 developers와 협력 (Communication)
  • Form Data
    • 사용자 입력이 form에서 어떻게 저장되었는지 확인
  • Form State
    • keep track of the different states of the form