저 코드 개발 도구에서 Angular 프로젝트 자동 생성

Magic xpa란?



Magic xpa Application Platform(이하, Magic xpa)은 로우 코드 개발 툴이라고 불리는 개발 툴의 하나입니다. 언어 코딩이 필요 없으며 애플리케이션 설계 정보(모델, 테이블, 로직, 화면 설계 등)를 리포지토리에 정의하여 비즈니스 애플리케이션을 개발할 수 있습니다.

「Magic xpa」의 최신 버전, 「Magic xpa 4.6」의 Web Client 기능에 의해, Magic xpa로 개발한 업무 어플리케이션의 Web UI부를 Angular 프로젝트로서 자동 생성할 수 있게 되었으므로, 그 개요에 대해 소개합니다 합니다.

Web Client 기능의 특징


  • Angular가있는 SPA 유형의 웹 응용 프로그램을 쉽게 만들 수 있습니다.
  • 로우 코드 개발을 통해 고품질의 SPA 유형 웹 응용 프로그램을 신속하게 구축 할 수 있습니다.
  • 한 번의 클릭만으로 Magic xpa에 정의 된 리포지토리 정보를 기반으로 Angular 프로젝트를 자동으로 생성합니다.
  • 순수한 JavaScript, HTML5 및 CSS3로 구성되며 브라우저에서 작동합니다.

    - Angular의 풍부한 기능, 라이브러리, HTML5 기술을 최대한 활용할 수 있습니다.





    웹 클라이언트 사용을 위한 준비



    다음을 설치합니다.
    1. Node.js
    htps : // 그래서 js. 오 rg / 엔 / 도 w 응 아 d /

    2. Angular CLI(※현재는 Angular v8 추천)
    명령 실행 → npm install -g @angular/c@8.3.25

    3. Visual Studio Code
    htps : // 여기.ゔぃすあ lsつぢお。 코m/

    4. Chrome 브라우저

    5. Magic xpa 4.6

    Web Client 개발의 거친 흐름



  • Magic xpa로 프로그래밍
  • Magic xpa 개발 환경 (IDE) 인 Magic xpa Studio에서 비즈니스 응용 프로그램을 만듭니다.
  • 로직 개발은 Magic xpa에서 저 코드 개발로 수행됩니다 (각 리포지토리 정의)
  • Magic xpa Studio의 웹 애플리케이션 생성을 이용하여 화면 레이아웃 생성
  • *.css, *.ts, *.html의 세 파일이 생성됩니다.
  • 생성 된 화면 컨트롤과 로직 간의 연결은 유지됩니다.
  • 컨트롤의 위치, 크기, 색상 등은 여기에서 설정할 수 없습니다



  • 외부 편집기로 화면 완성
  • 위에서 자동 생성 된 Angular 프로젝트를 기반으로 화면을 편집합니다.
  • *.css 및 *.html을 외부 편집기에서 편집 (Visual Studio Code 권장)하여 UI 디자인을 마무리합니다.


  • 요약



    Magic xpa의 Web Client 기능을 통해 B to B, B to C용 SPA 유형의 웹 애플리케이션을 효율적으로 만들 수 있습니다. UI 디자인에는 Angular의 자유를 활용하면서 DB 정의와 백엔드 처리 로직, 웹 UI 간의 세션 관리 및 암호화 등은 로우 코드로 빠르게 개발할 수 있습니다.

    좋은 웹페이지 즐겨찾기