본문으로 건너뛰기

05. 화면 저작 (HTML/JS 작성)

목록·입력 화면을 HTML과 JavaScript로 직접 작성하고, 공통 컨트롤과 레이아웃을 적용하는 방법을 배웁니다. 이 주제부터 게시판 화면(BOD010, BOD011, BOD012)을 만듭니다.

이 주제를 배우면​

빈 HTML 파일에서 시작해 조회 조건, 목록 그리드, 입력 폼을 갖춘 화면을 직접 작성할 수 있게 됩니다.

선수 지식​

학습 목표​

  • 화면의 기본 골격과 syn-datafield/syn-options/syn-events 세 속성의 역할을 설명합니다.
  • BOD010 목록 화면에 조회 조건과 그리드를 작성합니다.
  • BOD011/BOD012 입력 화면과 공통 레이아웃을 작성합니다.

학습 경로​

순서문서완료 후 남길 결과
1화면 저작 개념세 속성의 역할과 이름 일치 원칙을 설명한다
2목록 화면 작성BOD010 조회 조건과 그리드를 작성한다
3입력 화면과 레이아웃BOD011/BOD012 입력 폼과 레이아웃을 작성한다

완료 조건​

  • BOD010.html에 조회 조건과 목록 그리드를 작성했습니다.
  • BOD011.html, BOD012.html에 입력 폼을 작성했습니다.
  • syn-datafield 이름을 표로 정리해 다음 주제에서 재사용할 준비를 했습니다.

연결 자료​

이전 · 다음 주제​

이전: 04. 도메인 모델과 데이터베이스 · 다음: 06. 화면 동작과 거래 연결