프로젝트 구성

생성

YouTube 동영상 (https://youtu.be/1qLCx1rB4l8)

SP5 스튜디오를 시작한 후, 웹스퀘어 프로젝트를 아래의 방법으로 생성하십시오.

  1. Project Explorer로 이동합니다.

  2. Create a project...를 선택합니다.

Create a project

  1. WebSquare - WebSquare Project를 선택합니다.

  2. Next를 클릭합니다.

  1. 혹은 Project Explorer를 우클릭한 후, New - WebSquare Project를 선택합니다.

New – WebSquare Project

  1. 프로젝트 이름을 입력합니다.

  2. Next를 클릭합니다.

프로젝트 이름 지정

  1. Context Root를 지정합니다. 기본 값은 루트(" / ")입니다.

Context Root


Context Root는 Config.xmlWebSquare.xml 설정 파일에 영향을 줍니다.

SP4 vs. SP5 (Context Root 기본 값)


SP4: Context Root의 기본 값은 "프로젝트 이름".

vs.

SP5: Context Root의 기본 값은 " / ".

  1. 동의합니다 항목을 선택하고, Next를 클릭합니다. (권장)

프로젝트에 적용할 WRM 컴포넌트

default

공통업무용 UDC

mobile

모바일 환경에 특화된 공통업무용 UDC

WRM 컴포넌트 사용에 동의한 경우, WebContent 폴더 아래에 공통 리소스를 포함한 cm 폴더가 생성됩니다.

프로젝트 폴더 구성

cm 폴더 구성

단, WRM 컴포넌트 사용에 동의하지 않을 경우, WebContent 폴더 아래에 추가 리소스를 포함하는 cm 폴더가 생성되지 않습니다.

다음은 WRM 컴포넌트 사용에 동의하지 않고 without_UDC라는 프로젝트를 생성한 경우입니다.

WRM 컴포넌트 사용 동의에 따른 웹스퀘어 프로젝트 폴더 구성

WRM 컴포넌트 사용 동의


WebSquare5 SP5는 공통 업무용 UDC(User Developed Component)를 WRM 컴포넌트로 제공합니다. WRM 컴포넌트 사용에 동의할 경우, WebSquare5 SP5가 제공하는 WRM 컴포넌트를 사용할 수 있습니다.

단, 사용자가 WRM 컴포넌트를 수정할 경우, (주)인스웨이브시스템즈는 정상 작동을 보장하지 않습니다.

  1. Finish를 클릭합니다.

Preview 항목 설명

1 Use Config


2 Preview Type

  • Local Preview

  • Remove CIFS Preview

  • Remote FTP Preview

  • Remote SFTP Preview

Preview Info

3 Preview Type

  • Local Engine

  • Use Other Web Application Server

  • Remote Engine

  • Remote Resource

4 WebSquare Entry Point


5 websquare.xml


6 Web Root


7 WebSquare Home


서버 환경 설정 파일 편집 시 동기화할 websquare.xml 파일의 위치를 지정할 수 있습니다. 단, Use Other Web Application Server 옵션이 선택된 경우에만 활성화됩니다.

폴더 구조

다음은 웹스퀘어 프로젝트를 생성한 모습입니다. 폴더를 통해 공통 모듈을 포함한 SP5에 추가된 기능을 직관적으로 확인할 수 있습니다.

웹스퀘어 프로젝트 폴더 구조

폴더 설명

폴더

설명

_wpack_

WebContent 폴더 아래에 생성하는 XML 화면 파일을 실시간으로 JS 파일로 변환하여 저장.

cm

css

공통 리소스에 사용되는 CSS 파일 모음

images

공통 리소스에 사용되는 이미지 모음

layout


project_udc

프로젝트 컴포넌트

template

design_system

Snippet 포함 각종 디자인 리소스를 브라우저 형태로 표시

layout

레이아웃 템플릿 (화면 생성 시 선택)

page

페이지 템플릿 (화면 생성 시 선택)

snippets

Snippet 리소스

udc

Palette 뷰에서 등록될 UDC가 저장된 폴더

websquare

수정 가능한 엔진 파일.

WebSquare Configure

  • client.config.xml (클라이언트 환경 설정 파일)

  • server.config.xml (서버 환경 설정 파일)

설정

프로젝트를 우클릭한 후 Configure WebSquare Project 혹은 Properties를 클릭합니다.

웹스퀘어 프로젝트 설정

리소스 폴더

좌측의 WebSquare - Resource를 클릭하면 웹스퀘어 화면 개발시 사용하는 각종 리소스를 저장할 위치를 지정할 수 있습니다.

WebSquare – Resource Folder

폴더를 통해 공통 모듈을 포함한 SP5에 추가된 기능을 직관적으로 확인할 수 있습니다.

No.

리소스

설명

1

웹스퀘어 페이지 템플릿

페이지 리소스 (화면 생성 시 선택)

2

웹스퀘어 레이아웃 템플릿

레이아웃 리소스 (화면 생성 시 선택)

3

내장 컴포넌트 템플릿

내장 컴포넌트 확장용 리소스

4

Snippets

Snippet 리소스

5

UDC

Palette 뷰에 등록되는 UDC

6

Layout


7

Design System

Design System 뷰에서 사용될 리소스 지정.

  • local : Design System 뷰에서 사용될 리소스가 저장된 폴더. (프로젝트 별로 선택 가능.)

  • remote : Design Systems 뷰에서 사용될 URL 지정. 웹스퀘어 스튜디오 웹 API를 사용할 수 있는 모든 웹 페이지를 지원 가능.

Design System의 경우, 프로젝트 별로 리소스를 선택할 수 있습니다.

프로젝트 별 리소스 선택

WRM 컴포넌트 사용

최초 프로젝트 생성시 WRM 컴포넌트 사용에 동의하지 않은 경우, Project Common 설정을 통해 WRM 컴포넌트를 사용할 수 있습니다.