사용 안내서 취소

Dreamweaver에서 사용자 정의 서버 비헤이비어 추가

  1. Dreamweaver 사용 안내서
  2. 소개
    1. 반응형 웹 디자인 기초
    2. Dreamweaver의 새로운 기능
    3. Dreamweaver를 통한 웹 개발 - 개요
    4. Dreamweaver / 일반 질문
    5. 키보드 단축키
    6. Dreamweaver 시스템 요구 사항
    7. 기능 요약
  3. Dreamweaver 및 Creative Cloud
    1. Creative Cloud로 Dreamweaver 설정 동기화
    2. Dreamweaver의 Creative Cloud Libraries
    3. Dreamweaver에서 Photoshop 파일 사용
    4. Adobe Animate 및 Dreamweaver를 사용하여 작업
    5. Libraries에서 웹에 최적화된 SVG 파일 추출
  4. Dreamweaver 작업 영역 및 보기 옵션
    1. Dreamweaver 작업 영역
    2. 시각적 개발을 위한 Dreamweaver 작업 영역 최적화
    3. 파일 이름 또는 내용에 기초한 파일 검색 | Mac OS
  5. 사이트 설정
    1. Dreamweaver 사이트 정보
    2. 사이트의 로컬 버전 설정
    3. 게시 서버에 연결
    4. 테스트 서버 설정
    5. Dreamweaver 사이트 설정 가져오기 및 내보내기
    6. 원격 서버에서 로컬 사이트 루트로 기존 웹 사이트 가져오기
    7. Dreamweaver의 액세스 가능성 기능
    8. 고급 설정
    9. 파일 전송을 위한 사이트 환경 설정
    10. Dreamweaver에서 프록시 서버 설정 지정
    11. Creative Cloud로 Dreamweaver 설정 동기화
    12. Dreamweaver에서 Git 사용
  6. 파일 관리
    1. 파일 작성 및 열기
    2. 파일 및 폴더 관리
    3. 서버에서 파일 내려받기 및 올리기
    4. 파일 체크인 및 체크아웃
    5. 파일 동기화
    6. 파일 간 다른 내용 비교
    7. Dreamweaver 사이트에서 파일 및 폴더 숨기기
    8. Dreamweaver 사이트에 대한 디자인 노트 활성화
    9. 잠재적 게이트키퍼 악용 방지
  7. 레이아웃 및 디자인
    1. 레이아웃용 시각 도구 사용
    2. CSS를 사용하여 페이지 레이아웃 구성
    3. Bootstrap을 사용하여 반응형 웹 사이트 디자인
    4. Dreamweaver에서 미디어 쿼리 만들기 및 사용
    5. 표를 사용하여 내용 표시
    6. 색상
    7. 유동 격자 레이아웃을 사용하는 반응형 디자인
    8. Dreamweaver의 Extract
  8. CSS
    1. CSS(Cascading Style Sheets)의 이해
    2. CSS Designer를 사용하여 페이지 레이아웃 지정
    3. Dreamweaver의 CSS 프리프로세서 사용
    4. Dreamweaver에서 CSS 스타일 환경 설정 방법
    5. Dreamweaver에서 CSS 규칙 이동
    6. Dreamweaver에서 인라인 CSS를 CSS 규칙으로 변환
    7. div 태그 작업
    8. 배경에 그레이디언트 적용
    9. Dreamweaver에서 CSS3 전환 효과 만들기 및 편집
    10. 코드 서식 지정
  9. 페이지 내용 및 에셋
    1. 페이지 속성 설정
    2. CSS 머리글 속성 및 CSS 링크 속성 설정
    3. 텍스트 작업
    4. 텍스트, 태그, 속성 찾기 및 바꾸기
    5. DOM 패널
    6. 라이브 뷰에서 편집
    7. Dreamweaver에서 문서 인코딩
    8. 문서 창에서 요소 선택 및 보기
    9. 속성 관리자에서 텍스트 속성 설정
    10. 웹 페이지 맞춤법 검사
    11. Dreamweaver에서 가로줄 사용
    12. Dreamweaver에서 글꼴 조합 추가 및 수정
    13. 에셋을 사용하여 작업
    14. Dreamweaver에서 날짜 삽입 및 업데이트
    15. Dreamweaver에서 즐겨찾기 에셋 만들기 및 관리
    16. Dreamweaver에서 이미지 삽입 및 편집
    17. 미디어 오브젝트 추가
    18. Dreamweaver에서 비디오 추가
    19. HTML5 비디오 삽입
    20. SWF 파일 삽입
    21. 오디오 효과 추가
    22. Dreamweaver에서 HTML5 오디오 삽입
    23. 라이브러리 항목을 사용하여 작업
    24. Dreamweaver에서 아랍어 및 히브리어 텍스트 사용
  10. 링크 및 내비게이션
    1. 링크 및 내비게이션 정보
    2. 링크 연결
    3. 이미지 맵
    4. 링크 문제 해결
  11. jQuery 위젯 및 효과
    1. Dreamweaver에서 jQuery UI 및 모바일 위젯 사용
    2. Dreamweaver에서 jQuery 효과 사용
  12. 웹 사이트 코딩
    1. Dreamweaver에서의 코딩 정보
    2. Dreamweaver의 코딩 환경
    3. 코딩 환경 설정
    4. 코드 색상 표시 맞춤 설정
    5. 코드 작성 및 편집
    6. 코드 힌트 및 코드 완성
    7. 코드 축소 및 확장
    8. 스니펫으로 코드 재사용
    9. 코드 린트
    10. 코드 최적화
    11. 디자인 뷰에서 코드 편집
    12. 페이지의 헤드 내용 작업
    13. Dreamweaver에 서버측 포함 삽입
    14. Dreamweaver에서 태그 라이브러리 사용
    15. Dreamweaver에 사용자 정의 태그 가져오기
    16. JavaScript 비헤이비어 사용(일반 지침)
    17. 빌트인 JavaScript 비헤이비어 적용
    18. XML 및 XSLT 정보
    19. Dreamweaver에서 서버측 XSL 변환 수행
    20. Dreamweaver에서 클라이언트측 XSL 변환 수행
    21. Dreamweaver에서 XSLT의 문자 엔티티 추가
    22. 코드 서식 지정
  13. 제품 간 워크플로
    1. Dreamweaver로 확장 기능 설치 및 사용
    2. Dreamweaver의 인앱 업데이트
    3. Dreamweaver에서 Microsoft Office 문서 삽입 (Windows만 해당)
    4. Fireworks 및 Dreamweaver 작업
    5. Contribute를 사용하여 Dreamweaver 사이트의 내용 편집
    6. Dreamweaver와 Business Catalyst 통합
    7. 개인 맞춤화된 이메일 캠페인 제작
  14. 템플릿
    1. Dreamweaver 템플릿 정보
    2. 템플릿 및 템플릿 기반 문서 인식
    3. Dreamweaver 템플릿 만들기
    4. 템플릿에서 편집 가능 영역 만들기
    5. Dreamweaver에서 반복 영역 및 표 만들기
    6. 템플릿의 옵션 영역 사용
    7. Dreamweaver에서 편집 가능 태그 속성 정의
    8. Dreamweaver에서 중첩 템플릿을 만드는 방법
    9. 템플릿 편집, 업데이트 및 삭제
    10. Dreamweaver에서 xml 내용 내보내기 및 가져오기
    11. 기존 문서에서 템플릿 적용 또는 제거
    12. Dreamweaver 템플릿의 내용 편집
    13. Dreamweaver에서 템플릿 태그에 대한 구문 규칙
    14. 템플릿 영역의 강조 표시 환경 설정
    15. Dreamweaver에서 템플릿 사용 시 이점
  15. 모바일 및 멀티스크린
    1. 미디어 쿼리 만들기
    2. 모바일 디바이스의 페이지 방향 변경
    3. Dreamweaver를 사용하여 모바일 장치용 웹 앱 만들기
  16. 다이내믹 사이트, 페이지 및 웹 양식
    1. 웹 애플리케이션 이해
    2. 애플리케이션 개발용 컴퓨터 설정
    3. 데이터베이스 연결 문제 해결
    4. Dreamweaver에서 연결 스크립트 제거
    5. 다이내믹 페이지 디자인
    6. 다이내믹 콘텐츠 소스 개요
    7. 다이내믹 콘텐츠의 소스 정의
    8. 페이지에 다이내믹 콘텐츠 추가
    9. Dreamweaver에서 다이내믹 콘텐츠 변경
    10. 데이터베이스 레코드 표시
    11. Dreamweaver에서 라이브 데이터 제공 및 문제 해결
    12. Dreamweaver에서 사용자 정의 서버 비헤이비어 추가
    13. Dreamweaver를 사용하여 양식 구성
    14. 양식을 사용하여 사용자 정보 수집
    15. Dreamweaver에서 ColdFusion 양식 작성 및 활성화
    16. 웹 양식 제작
    17. 양식 요소를 위한 HTML5 지원 개선
    18. Dreamweaver를 사용하여 양식 개발
  17. 애플리케이션의 시각적 구성
    1. Dreamweaver에서 마스터 및 세부 정보 페이지 구성
    2. 검색 및 결과 페이지 빌드
    3. 레코드 삽입 페이지 구성
    4. Dreamweaver에서 레코드 업데이트 페이지 구성
    5. Dreamweaver에서 레코드 삭제 페이지 구성하기
    6. Dreamweaver에서 ASP 명령을 사용하여 데이터베이스 수정
    7. 등록 페이지 빌드
    8. 로그인 페이지 빌드
    9. 권한이 부여된 사용자 전용 페이지 빌드
    10. Dreamweaver를 사용하여 ColdFusion의 폴더 보호
    11. Dreamweaver에서 ColdFusion 구성 요소 사용
  18. 웹 사이트 테스트, 미리보기 및 게시
    1. 페이지 미리보기
    2. 여러 디바이스에서 Dreamweaver 웹 페이지 미리보기
    3. Dreamweaver 사이트 테스트
  19. 문제 해결
    1. 해결된 문제
    2. 알려진 문제

 

 

참고:

Dreamweaver의 현재 버전 이후로 사용자 인터페이스가 간소화되었습니다. 따라서 이 문서에 설명된 옵션 중에 Dreamweaver의 현재 버전에 없는 옵션이 있을 수 있습니다. 자세한 내용은 이 문서를 참조하십시오.

사용자 정의 서버 비헤이비어 정보

Dreamweaver에는 사이트에 동적 기능을 쉽게 추가할 수 있는 다양한 서버 비헤이비어가 내장되어 있습니다. 개발 요구에 맞는 서버 비헤이비어를 만들거나 Dreamweaver Exchange 웹 사이트에서 서버 비헤이비어를 가져와서 Dreamweaver 기능을 확장할 수 있습니다.

사용자 정의 서버 비헤이비어를 만들기 전에 Dreamweaver Exchange 웹 사이트에서 다른 서버 비헤이비어를 검색하여 자신의 웹 사이트에 추가하려는 기능을 제공하는 것이 있는지 확인해야 합니다. 이를 통해 타사 개발자가 개발하여 테스트를 거친 서버 비헤이비어 중에 필요한 기능을 제공하는 것을 찾을 수도 있습니다.

Dreamweaver Exchange 액세스

  1. Dreamweaver에서는 다음 중 한 가지 방법으로 Dreamweaver Exchange에 액세스합니다.
    • [도움말] > [Dreamweaver Exchange]를 선택합니다.

    • [윈도우] > [서버 비헤이비어]를 선택하고 플러스(+) 버튼을 클릭한 후 [서버 비헤이비어 내려받기]를 선택합니다.

    브라우저에서 Dreamweaver Exchange 웹 페이지가 열립니다.

  2. 사용자의 Adobe ID를 사용하여 Exchange에 로그인합니다. 아직 Dreamweaver Exchange ID를 만들지 않은 경우에는 지침에 따라 Adobe 계정을 만듭니다.

Dreamweaver에 포함된 서버 비헤이비어 또는 기타 Extension 설치

  1. [명령] > [Extension 관리]를 선택하여 Extension Manager를 시작합니다.
  2. [파일] > [Extension Manager에 포함된 패키지 설치]를 선택합니다.

    자세한 내용은 Extension Manager 사용 설명서를 참조하십시오.

사용자 정의 서버 비헤이비어 워크플로우

ColdFusion, JavaScript, VBScript 또는 PHP에 능숙한 웹 개발자는 직접 서버 비헤이비어를 만들 수 있습니다. 서버 비헤이비어를 만들려면 다음 단계를 수행합니다.

  • 필요한 액션을 수행하는 코드 블록을 하나 이상 작성합니다.

  • 페이지의 HTML 코드에서 삽입될 코드 블록의 위치를 지정합니다.

  • 매개 변수 값이 필요한 서버 비헤이비어의 경우에는 웹 개발자가 적절한 값을 입력할 수 있는 대화 상자를 만듭니다.

  • 다른 사용자에게 제공하기 전에 서버 비헤이비어를 테스트합니다.

서버 비헤이비어 구성 관리자 사용

서버 비헤이비어 구성 관리자를 사용하여 해당 비헤이비어가 페이지에 삽입하는 코드 블록을 추가할 수 있습니다.

  1. [윈도우] > [서버 비헤이비어]를 선택하여 [서버 비헤이비어] 패널을 열고, 플러스(+) 버튼을 클릭하여 [새 서버 비헤이비어]를 선택합니다.
  2. [문서 유형] 팝업 메뉴에서 개발하려는 서버 비헤이비어의 문서 유형을 선택합니다.
  3. [이름] 상자에 서버 비헤이비어의 이름을 입력합니다.
  4. (선택 사항) 새 서버 비헤이비어를 만들 때 기존 서버 비헤이비어를 복사하여 추가하려면 [기존 서버 비헤이비어 복사] 옵션을 선택한 후, [복사할 비헤이비어] 팝업 메뉴에서 서버 비헤이비어를 선택합니다. [확인]을 클릭합니다.

    [서버 비헤이비어 구성 관리자] 대화 상자가 표시됩니다.

  5. 새 코드 블록을 추가하려면 플러스(+) 버튼을 클릭하고 코드 블록 이름을 입력한 후 [확인]을 클릭합니다.

    입력한 이름이 서버 비헤이비어 구성 관리자에 나타나고 해당 스크립트 태그가 [코드 블록] 상자에 나타납니다.

  6. [코드 블록] 상자에 서버 비헤이비어를 구현하는 데 필요한 런타임 코드를 입력합니다.
    참고:

    [코드 블록] 상자에 코드를 입력하는 경우 지정한 각 코드 블록에 대해 코드 블록이나 단일 태그만 삽입할 수 있습니다(예: myBehavior_block1, myBehavior_block2, myBehavior_blockn 등). 여러 태그나 코드 블록을 입력해야 하는 경우에는 각각에 대한 개별 코드 블록을 만들어야 합니다. 또한 다른 페이지의 코드를 복사하여 붙여 넣을 수도 있습니다.

  7. 코드 블록에서 매개 변수를 삽입할 위치에 삽입 포인터를 놓거나, 매개 변수로 대체할 문자열을 선택합니다.
  8. [코드 블록에 매개 변수 삽입] 버튼을 클릭합니다.
  9. [매개 변수 이름] 상자에 매개 변수의 이름(예: Session)을 입력한 다음 [확인]을 클릭합니다.

    코드 블록에서 매개 변수를 정의하기 전에 삽입 포인터를 놓았던 위치에 해당 매개 변수가 삽입됩니다. 문자열을 선택한 경우 코드 블록에서 선택한 문자열의 모든 인스턴스가 매개 변수 표시자로 대체됩니다(예: @@Session@@).

  10. [코드 삽입] 팝업 메뉴에서 코드 블록의 삽입 위치를 지정하는 옵션을 선택합니다.
  11. (선택 사항) 서버 비헤이비어에 대한 추가 정보를 지정하려면 [고급] 버튼을 클릭합니다.
  12. 추가 코드 블록을 작성하려면 5-11단계를 반복합니다.
  13. 서버 비헤이비어에 매개 변수를 제공해야 하는 경우에는 비헤이비어를 적용하는 사용자가 해당 매개 변수를 선택할 수 있는 대화 상자를 만들어야 합니다. 다음 링크를 참조하십시오.
  14. 서버 비헤이비어 작성 절차를 수행한 후 [확인]을 클릭합니다.

    [서버 비헤이비어] 패널에 서버 비헤이비어가 나열됩니다.

  15. 서버 비헤이비어를 테스트하여 기능이 제대로 수행되는지 확인하십시오.

고급 옵션

소스 코드와 각 코드 블록의 삽입 위치가 지정되면 서버 비헤이비어 정의를 거의 모두 마친 것입니다. 대부분의 경우, 추가 정보는 지정할 필요가 없습니다.

고급 사용자는 다음 옵션 중 하나를 설정할 수 있습니다.

식별자

코드 블록을 식별자로 처리할지 여부를 지정합니다.

기본적으로 코드 블록은 모두 식별자입니다. Dreamweaver는 문서에서 식별자 코드 블록을 발견하면 [서버 비헤이비어] 패널의 목록에 해당 비헤이비어를 표시합니다. 코드 블록을 식별자로 처리할지 여부를 지정하려면 식별자 옵션을 사용하십시오.

서버 비헤이비어의 코드 블록 중 적어도 하나는 식별자여야 합니다. 동일한 코드 블록이 다른 서버 비헤이비어에서 사용되는 경우 또는 코드 블록이 매우 단순하여 페이지에서 여러 번 발생할 수 있는 경우 그러한 코드 블록은 식별자가 될 수 없습니다.

서버 비헤이비어 제목

[서버 비헤이비어] 패널에 표시될 해당 비헤이비어의 제목을 지정합니다.

페이지 디자이너가 [서버 비헤이비어] 패널에서 플러스(+) 버튼을 클릭하면 팝업 메뉴에 새 서버 비헤이비어의 제목이 표시됩니다. 그리고 문서에 서버 비헤이비어 인스턴스를 적용하면 [서버 비헤이비어] 패널의 적용된 비헤이비어 목록에 해당 비헤이비어가 나타납니다. 플러스(+) 팝업 메뉴의 내용과 적용된 비헤이비어 목록을 지정하려면 [서버 비헤이비어 제목] 상자를 사용합니다.

이 상자의 초기값은 [새 서버 비헤이비어] 대화 상자에서 사용자가 입력한 이름입니다. 매개 변수가 정의되면 이름이 자동으로 업데이트되면서 서버 비헤이비어 이름 뒤에서 괄호로 묶여 매개 변수가 표시됩니다.

Set Session Variable (@@Name@@, @@Value@@)

기본값을 사용하는 경우에는 괄호 앞의 모든 항목이 플러스(+) 팝업 메뉴에 나타납니다(예: Set Session Variable). 적용된 비헤이비어 목록에는 Set Session Variable("abcd", "5")과 같이 이름과 매개 변수가 나란히 나타납니다.

선택할 코드 블록

사용자가 [서버 비헤이비어] 패널에서 비헤이비어를 선택할 때 선택되는 코드 블록을 지정합니다.

서버 비헤이비어를 적용하면 비헤이비어 내의 코드 블록 중 하나가 "선택할 코드 블록"으로 지정됩니다. 서버 비헤이비어를 적용한 다음 [서버 비헤이비어] 패널에서 해당 비헤이비어를 선택하면 지정된 블록이 문서 창에서 자동으로 선택됩니다. 기본적으로 Dreamweaver는 html 태그 위에 오지 않는 첫 번째 코드 블록을 선택합니다. 모든 코드 블록이 html 태그 위에 있으면 첫 번째 블록이 선택됩니다. 고급 사용자의 경우에는 선택될 코드 블록을 지정할 수 있습니다.

코드 블록 만들기

서버 비헤이비어 구성 관리자에서 만든 코드 블록은 서버 비헤이비어에 캡슐화되어 [서버 비헤이비어] 패널에 나타납니다. 해당 코드는 지정된 서버 모델에 유효한 경우 어떠한 런타임 코드라도 상관 없습니다. 예를 들어 사용자 정의 서버 비헤이비어의 문서 유형으로 ColdFusion을 선택하는 경우에는 ColdFusion 애플리케이션 서버에서 실행되는 올바른 ColdFusion 코드를 작성해야 합니다.

코드 블록은 서버 비헤이비어 구성 관리자에서 직접 만들 수도 있고 다른 소스의 코드를 복사하여 붙여 넣을 수도 있습니다. 서버 비헤이비어 구성 관리자에서 작성하는 코드 블록에는 태그나 스크립트 블록이 하나만 허용됩니다. 태그 블록을 여러 개 삽입하려면 각 코드 블록을 분리해야 합니다.

코드 블록의 조건

Dreamweaver에서 조건부로 실행되는 여러 제어문을 통합하는 코드 블록을 개발할 수 있습니다. 서버 비헤이비어 구성 관리자는 if, elseifelse 문을 사용할 수 있으며, 서버 비헤이비어 매개 변수를 사용할 수도 있습니다. 이렇게 하면 서버 비헤이비어 매개 변수 사이의 OR 관계 값에 따라 선택되는 대체 텍스트 블록을 삽입할 수 있습니다.

다음 예는 if, elseifelse 문을 보여 줍니다. 대괄호([ ])는 선택적 코드를 나타내고, 별표(*)는 0 또는 그 이상의 인스턴스 수를 나타냅니다. 특정 조건이 적용되는 경우에만 전체 코드 블록 또는 코드 블록의 일부분을 실행하려면 다음 구문을 사용합니다.

<@ if (expression1) @>    conditional
text1[<@ elseif (expression2) @>    conditional text2]*[<@ else @> 
    conditional text3]<@ endif @>

조건식은 JavaScript eval() 함수를 사용하여 실행할 수 있는 경우 어떤 JavaScript 표현식이라도 상관 없으며, @@로 표시되는 서버 비헤이비어 매개 변수를 포함할 수 있습니다. @@는 매개 변수를 JavaScript 변수 또는 키워드와 구별하기 위한 것입니다.

조건부 표현식의 효과적인 사용

if, elseelseif 지시어를 insertText XML 태그 안에서 사용하면 참여자 텍스트가 미리 처리되어 if 지시어를 해석하고 결과에 포함할 텍스트를 판별합니다. ifelseif 지시문은 표현식을 인수로 사용합니다. 조건식은 JavaScript 조건식과 동일하며 서버 비헤이비어 매개 변수도 포함할 수 있습니다. 이와 같은 지시문을 사용하면 서버 비헤이비어 매개 변수의 값 또는 매개 변수 사이의 관계에 따라 대체 코드 블록을 선택할 수 있습니다.

예를 들어 다음 JSP 코드는 Dreamweaver 서버 비헤이비어 중 조건 코드 블록을 사용하는 코드를 발췌한 것입니다.

@@rsName@@.close(); 
<@ if (@@callableName@@ != '') @> 
@@callableName@@.execute(); 
@@rsName@@ = @@callableName@@.getResultSet();<@ else @> 
@@rsName@@ = Statement@@rsName@@.executeQuery(); 
<@ endif @> 
@@rsName@@_hasData = @@rsName@@.next();

조건 코드 블록은 <@ if (@@callableName@@ != '') @>로 시작하고 <@ endif @>로 끝납니다. 코드에 따르면 사용자가 서버 비헤이비어의 [매개 변수] 대화 상자에서 @@callableName@@ 매개 변수에 값을 입력하는 경우 즉, @@callableName@@ 매개 변수 값이 null이 아니거나 (@@callableName@@ != '')인 경우 조건 코드 블록이 다음 명령문으로 대체됩니다.

@@callableName@@.execute(); 
@@rsName@@ = @@callableName@@.getResultSet();

그 외의 경우에는 코드 블록이 다음 명령문으로 대체됩니다.

@@rsName@@ = Statement@@rsName@@.executeQuery();

코드 블록 위치 지정

서버 비헤이비어 구성 관리자를 사용하여 코드 블록을 작성할 때 페이지의 HTML 코드에서 해당 블록을 삽입할 위치를 지정해야 합니다.

예를 들어 열기 <html> 태그 위에 코드 블록을 삽입하는 경우 페이지의 해당 HTML 코드 섹션에 있는 다른 태그, 스크립트 및 서버 비헤이비어에 대해 상대적으로 코드 블록의 위치를 지정해야 합니다. 페이지 코드에서 열기 <html> 태그 위에 존재할 수도 있는 레코드세트 쿼리 앞이나 뒤에 비헤이비어를 삽입하는 경우를 일반적인 예로 들 수 있습니다.

[코드 삽입] 팝업 메뉴에서 위치 지정 옵션을 선택하면 [상대적 위치] 팝업 메뉴에서 사용할 수 있는 옵션이 페이지의 해당 부분에 맞는 옵션으로 바뀝니다. 예를 들어 [<html> 태그 위]를 [코드 삽입] 팝업 메뉴에서 선택하면 [상대적 위치] 팝업 메뉴에서는 페이지의 해당 부분에 대한 위치 지정 옵션이 표시됩니다.

다음 표는 코드 블록 삽입 옵션과 각 옵션에 대해 사용할 수 있는 상대적 위치 지정 옵션을 보여 줍니다.

코드 삽입 옵션

상대적 위치 옵션

<html> 태그 위

  • 파일의 시작

  • 레코드세트 바로 앞

  • 레코드세트 바로 뒤

  • <html> 태그 바로 위

  • 사용자 정의 위치

</html> 태그 아래

  • 파일 끝 이전

  • 레코드세트 닫기 이전

  • 레코드세트 닫기 다음

  • </html> 태그 다음

  • 사용자 정의 위치

특정 태그에 상대적

[태그] 팝업 메뉴에서 태그를 선택한 후 태그 위치 지정 옵션 중에서 원하는 옵션을 선택합니다.

선택 영역에 상대적

선택 영역 이전

선택 영역 다음

선택 영역 바꾸기

선택 영역 주위에서 줄바꿈

사용자 정의 위치를 지정하려면 코드 블록에 가중치를 지정해야 합니다. 여러 개의 코드 블록을 특정 순서로 삽입하려면 [사용자 정의 위치]를 사용하십시오. 예를 들어 레코드세트를 여는 코드 블록 뒤에 코드 블록 세 개를 지정된 순서로 삽입하려면 세 블록의 가중치를 순서에 따라 각각 60, 65 및 70으로 지정합니다.

기본적으로 Dreamweaver에서는 <html> 태그 위에 삽입된 모든 레코드세트 열기 코드 블록에 가중치를 50씩 할당합니다. 두 개 이상의 블록에서 가중치가 일치할 경우에는 Dreamweaver에서 해당 블록들의 순서를 임의로 지정합니다.

코드 블록의 위치 지정(일반 지침)

  1. 서버 비헤이비어 구성 관리자를 사용하여 코드 블록을 작성합니다.
  2. [서버 비헤이비어 구성 관리자] 대화 상자에서 [코드 삽입] 팝업 메뉴를 사용하여 코드 블록을 삽입할 위치를 선택합니다.
  3. [서버 비헤이비어 구성 관리자] 대화 상자의 [코드 삽입] 팝업 메뉴에서 선택한 위치에 상대적인 위치를 선택합니다.
  4. 코드 블록을 모두 작성했으면 [확인]을 클릭합니다.

    [윈도우] > [서버 비헤이비어]를 선택하여 [서버 비헤이비어] 패널을 열고, 플러스(+) 버튼을 클릭하여 서버 비헤이비어를 봅니다.

  5. 서버 비헤이비어를 테스트하여 기능이 제대로 수행되는지 확인하십시오.

페이지의 다른 태그에 대한 상대적 위치에 코드 블록 삽입

  1. [코드 삽입] 팝업 메뉴에서 [특정 태그에 상대적]을 선택합니다.
  2. [태그] 상자에 태그를 입력하거나 팝업 메뉴에서 태그를 선택합니다.

    태그를 입력할 때 꺽쇠 괄호(<>)는 사용하지 마십시오.

  3. [상대적 위치] 팝업 메뉴에서 옵션을 선택하여 태그에 대한 상대적 위치를 지정합니다.

페이지 디자이너가 선택한 태그에 대한 상대적 위치에 코드 블록 삽입

  1. [코드 삽입] 팝업 메뉴에서 [선택 영역에 상대적]을 선택합니다.
  2. [상대적 위치] 팝업 메뉴에서 옵션을 선택하여 해당 선택 영역에 대한 상대적 위치를 지정합니다.

    코드 블록은 선택 영역 바로 앞이나 뒤에 삽입할 수 있습니다. 사용자 코드 블록으로 선택 영역을 대체하거나 선택 영역에 래핑할 수도 있습니다.

    선택 영역에 코드 블록을 래핑하려면 해당 선택 영역에 열기 태그와 닫기 태그 외에 아무 것도 없어야 합니다. 다음 예제를 참조하십시오.

    <CFIF Day=”Monday”></CFIF>

    코드 블록의 열기 태그 부분을 선택 영역의 열기 태그 앞에 삽입하고, 코드 블록의 닫기 태그 부분을 선택 영역의 닫기 태그 뒤에 각각 삽입합니다.

loop 지시문을 사용하여 코드 블록 반복

코드 블록 부분 또는 전체 코드 블록을 여러 번 반복하려면 다음 구문을 사용합니다.

<@ loop (@@param1@@,@@param2@@) @>    code
block<@ endloop @>

서버 비헤이비어를 만들 때 반복 구문을 사용하여 코드 블록을 지정된 횟수만큼 반복할 수 있습니다. <@ loop (@@param1@@,@@param2@@,@@param3@@,@@param_n@@) @> code block <@ endloop @>loop 지시문에서는 쉼표로 구분된 매개 변수 배열 목록을 인수로 사용할 수 있습니다. 이 경우 사용자는 매개 변수 배열 인수를 통해 단일 매개 변수에 여러 개의 값을 제공할 수 있습니다. 반복되는 텍스트는 n번 중복되며, 여기에서 n은 매개 변수 배열 인수의 길이입니다. 매개 변수 인수를 여러 개 지정할 때는 각 배열의 길이가 모두 같아야 합니다. i번째 루프 실행에서 매개 변수 배열의 i번째 요소가 코드 블록의 해당 매개 변수 인스턴스를 대체합니다.

서버 비헤이비어에 사용할 대화 상자를 만드는 경우 컨트롤을 대화 상자에 추가하여 페이지 디자이너가 매개 변수 배열을 만들 수 있도록 할 수 있습니다. Dreamweaver는 대화 상자를 만드는 데 사용할 수 있는 단순 배열 컨트롤을 제공합니다. 이 컨트롤은 [텍스트 필드 쉼표 분리 목록]이라는 컨트롤로서, 서버 비헤이비어 구성 관리자를 통해 사용할 수 있습니다. 더 복잡한 사용자 인터페이스 요소를 만들려면 해당 API 문서를 참조하여, 배열을 생성하는 컨트롤(예: 격자 컨트롤)을 사용하여 대화 상자를 만드십시오.

조건 지시문 안에 중첩시킬 수 있는 조건 또는 반복(loop) 지시문 수에는 제한이 없습니다. 예를 들어 표현식이 true이면 반복되도록 지정할 수 있습니다.

다음 예제에서는 이러한 반복 코드 블록을 사용하여 서버 비헤이비어를 만드는 방법을 보여 줍니다. 여기에서는 저장 프로시저에 액세스하는 데 사용된 ColdFusion 비헤이비어를 사용합니다.

<@ loop (@@param1@@,@@param2@@,@@param3@@,@@param_n@@) @>    code block 
<@ endloop @>
<CFSTOREDPROC procedure="AddNewBook" 
    datasource=#MM_connection_DSN# 
    username=#MM_connection_USERNAME# 
    password=#MM_connection_PASSWORD#> 
<CFPROCPARAM type="IN" dbvarname="@CategoryId" value="#Form.CategoryID#" 
    cfsqltype="CF_SQL_INTEGER"> 
<CFPROCPARAM type="IN" dbvarname="@ISBN" value="#Form.ISBN#" 
    cfsqltype="CF_SQL_VARCHAR"> 
</CFSTOREDPROC>

이 예제에서 CFSTOREDPROC 태그에는 0개 이상의 CFPROCPARAM 태그가 포함될 수 있습니다. 하지만 loop 지시문을 지원하지 않으면 CFPROCPARAM 태그를 삽입된 CFSTOREDPROC 태그 안에 포함할 수 없습니다. loop 지시문을 사용하지 않고 서버 비헤이비어로 작성한 경우에는 이 예제를 두 참여자 즉, 주 CFSTOREDPROC 태그와 참여자 유형이 다양한 CFPROCPARAM으로 나누어야 합니다.

loop 지시문을 사용하여 다음과 같은 프로시저를 작성할 수 있습니다.

<CFSTOREDPROC procedure="@@procedure@@" 
datasource=#MM_@@conn@@_DSN# 
username=#MM_@@conn@@_USERNAME# 
password=#MM_@@conn@@_PASSWORD#> 
<@ loop (@@paramName@@,@@value@@,@@type@@) @> 
    <CFPROCPARAM type="IN" 
    dbvarname="@@paramName@@" 
    value="@@value@@" 
    cfsqltype="@@type@@"> 
<@ endloop @> 
</CFSTOREDPROC>
참고:

"@>" 뒤에 나오는 각 행은 무시됩니다.

사용자가 [서버 비헤이비어 구성 관리자] 대화 상자에 다음 매개 변수 값을 입력한 경우,

procedure = "proc1" 
conn = "connection1" 
paramName = ["@CategoryId", "@Year", "@ISBN"] 
value = ["#Form.CategoryId#", "#Form.Year#", "#Form.ISBN#"] 
type = ["CF_SQL_INTEGER", "CF_SQL_INTEGER", "CF_SQL_VARCHAR"]

서버 비헤이비어는 다음 런타임 코드를 페이지에 삽입합니다.

<CFSTOREDPROC procedure="proc1" 
datasource=#MM_connection1_DSN# 
username=#MM_connection1_USERNAME# 
password=#MM_connection1_PASSWORD#> 
<CFPROCPARAM type="IN" dbvarname="@CategoryId" value="#Form.CategoryId#" 
    cfsqltype="CF_SQL_INTEGER"> 
<CFPROCPARAM type="IN" dbvarname="@Year" value="#Form.Year#" 
    cfsqltype="CF_SQL_INTEGER"> 
<CFPROCPARAM type="IN" dbvarname="@ISBN" value="#Form.ISBN#" 
    cfsqltype="CF_SQL_VARCHAR"> 
</CFSTOREDPROC>
참고:

조건 지시문 표현식의 일부로 사용하는 경우를 제외하고는 반복(loop) 구문 밖에서 매개 변수 배열을 사용할 수 없습니다.

loop 지시문의 _length 및 _index 변수 사용

loop 지시문에는 포함 if 조건에 사용할 수 있는 두 가지 내장 변수가 있습니다. 이 변수는 _length_index입니다. _length 변수는 loop 지시문이 처리하는 배열의 길이를 나타내고, _index 변수는 loop 지시문의 현재 인덱스를 나타냅니다. 변수가 loop로 전달되는 실제 매개 변수가 아닌 지시문으로만 인식되도록 하려면 @@로 변수를 묶지 마십시오.

내장 변수를 사용하는 한 가지 예는 page 지시문의 import 속성에 변수를 적용하는 것입니다. import 속성은 각 패키지를 쉼표로 구분해야 합니다. loop 지시문이 전체 import 속성 주변에서 확장되는 경우 루프를 처음 반복할 때 속성 이름 import=만 출력할 수 있습니다. 이때 닫는 큰따옴표(")가 포함됩니다. 루프를 마지막으로 반복할 때 쉼표는 출력되지 않습니다. 내장 변수를 사용하는 경우 다음과 같은 표현식을 사용할 수 있습니다.

<@loop (@@Import@@)@> 
<@ if(_index == 0)@>import=" 
<@endif@>@@Import@@<@if (_index == _length-1)@>"<@else@>, 
<@ endif @> 
<@endloop@>

서버 비헤이비어에 대한 매개 변수 요청

일부 서버 비헤이비어에서는 페이지 디자이너가 매개 변수 값을 제공해야 합니다. 매개 변수 값은 서버 비헤이비어 코드를 페이지에 삽입하기 전에 제공되어야 합니다.

이 대화 상자는 코드에 디자이너 제공 매개 변수를 정의하여 만듭니다. 그런 다음 서버 비헤이비어에 사용할 대화 상자를 생성합니다. 이 대화 상자는 페이지 디자이너에게 매개 변수 값을 묻는 메시지를 표시합니다.

참고:

페이지 디자이너가 선택한 특정 태그에 대한 상대적 위치에 코드가 삽입되도록 선택할 경우, 즉 코드 삽입 팝업 메뉴에서 특정 태그에 상대적 위치를 선택한 경우에는 매개 변수가 코드 블록에 자동으로 추가됩니다. 매개 변수가 태그 메뉴를 해당 비헤이비어의 대화 상자에 추가하여 페이지 디자이너가 태그를 선택할 수 있게 됩니다.

서버 비헤이비어 코드의 매개 변수 정의

  1. 제공된 매개 변수 값을 삽입할 코드의 특정 위치에 매개 변수 표시자를 입력합니다. 매개 변수의 구문은 다음과 같습니다.
    @@parameterName@@
  2. formParam 문자열을 매개 변수 표시자(@@)로 묶습니다.
    <% Session(“lang_pref”) = Request.Form(“@@formParam@@”); %>

    예를 들어 서버 비헤이비어에 다음과 같은 코드 블록이 있는 경우,

    <% Session(“lang_pref”) = Request.Form(“Form_Object_Name”); %>

    페이지 디자이너에서 Form_Object_Name의 값을 제공하도록 하려면 이 문자열을 매개 변수 표시자(@@)로 묶습니다.<% Session(“lang_pref”) = Request.Form(“@@Form_Object_Name@@”); %>

    <% Session(“lang_pref”) = Request.Form(“@@Form_Object_Name@@”); %>

또한 문자열을 강조 표시한 다음 [코드 블록에 매개 변수 삽입] 버튼을 클릭해도 됩니다. 매개 변수 이름을 입력하고 [확인]을 클릭합니다. Dreamweaver는 강조 표시된 문자열의 모든 인스턴스를, 매개 변수 표시자로 묶어 지정된 매개 변수 이름으로 바꿉니다.

Dreamweaver는 생성된 대화 상자의 컨트롤에 매개 변수 표시자로 묶인 문자열을 사용하여 레이블을 지정합니다(아래 절차 참조). 위 예제에서 Dreamweaver는 다음 레이블이 지정된 대화 상자를 만듭니다.

참고:

서버 비헤이비어 코드에 사용된 매개 변수 이름에는 공백을 사용할 수 없습니다. 따라서 대화 상자 레이블에도 공백이 사용되지 않습니다. 레이블에 공백을 사용하려는 경우에는 생성된 HTML 파일을 편집합니다.

매개 변수 이름 입력

서버 비헤이비어에 대한 매개 변수 값을 요청하는 대화 상자 만들기

  1. 서버 비헤이비어 구성 관리자에서 [다음]을 클릭합니다.
  2. 대화 상자 컨트롤의 표시 순서를 변경하려면 매개 변수를 선택한 후 위쪽 또는 아래쪽 화살표를 클릭합니다.
  3. 매개 변수의 컨트롤을 변경하려면 해당 매개 변수를 선택한 후 [표시 형식] 열에서 다른 컨트롤을 선택합니다.
  4. [확인]을 클릭합니다.

    Dreamweaver는 사용자가 정의한 각 디자이너 제공 매개 변수에 대해 레이블이 지정된 컨트롤이 있는 대화 상자를 생성합니다.

대화 상자 보기

  1. [윈도우] > [서버 비헤이비어]를 선택하여 [서버 비헤이비어] 패널을 열고, 플러스(+) 버튼을 클릭한 후 팝업 메뉴에서 서버 비헤이비어를 선택합니다.

서버 비헤이비어용으로 만든 대화 상자 편집

  1. [윈도우] > [서버 비헤이비어]를 선택하여 [서버 비헤이비어] 패널을 열고, 플러스(+) 버튼을 클릭한 후 팝업 메뉴에서 [서버 비헤이비어 편집]을 선택합니다.
  2. 목록에서 사용자 정의 서버 비헤이비어를 선택한 후 [열기]를 클릭합니다.
  3. [다음]을 클릭합니다.

    사용자 코드에 정의된 디자이너 제공 매개 변수가 모두 나열된 대화 상자가 표시됩니다.

  4. 대화 상자 컨트롤의 표시 순서를 변경하려면 매개 변수를 선택한 후 위쪽 또는 아래쪽 화살표를 클릭합니다.
  5. 매개 변수의 컨트롤을 변경하려면 해당 매개 변수를 선택한 후 [표시 형식] 열에서 다른 컨트롤을 선택합니다.
  6. [확인]을 클릭합니다.

서버 비헤이비어 편집 및 수정

Dreamweaver Exchange 웹 사이트 및 기타 다른 개발사에서 다운로드한 서버 비헤이비어를 비롯하여, 서버 비헤이비어 구성 관리자로 만든 모든 서버 비헤이비어를 편집할 수 있습니다.

페이지에 서버 비헤이비어를 적용한 다음 Dreamweaver에서 비헤이비어를 편집한 경우에는 이전 비헤이비어 인스턴스가 더 이상 [서버 비헤이비어] 패널에 나타나지 않습니다. [서버 비헤이비어] 패널은 기존 서버 비헤이비어 코드와 일치하는 코드가 해당 페이지에 있는지 검색합니다. 서버 비헤이비어의 코드가 변경되면 이 패널에서는 해당 비헤이비어의 이전 버전들을 더 이상 인식하지 못합니다.

패널에서 이전 비헤이비어 버전과 최신 비헤이비어 버전 유지

  1. [윈도우] > [서버 비헤이비어]를 선택하여 [서버 비헤이비어] 패널을 열고, 플러스(+) 버튼을 클릭한 후 [새 서버 비헤이비어]를 선택하고 이전 서버 비헤이비어의 사본을 만듭니다.

서버 비헤이비어 구성 관리자로 작성한 서버 비헤이비어 코드 편집

  1. [윈도우] > [서버 비헤이비어]를 선택하여 [서버 비헤이비어] 패널을 열고, 플러스(+) 버튼을 클릭한 후 팝업 메뉴에서 [서버 비헤이비어 편집]을 선택합니다.

    [서버 비헤이비어 편집] 대화 상자가 열리고 현재 서버 기술에 해당되는 모든 비헤이비어가 표시됩니다.

  2. 서버 비헤이비어를 선택한 후 [편집]을 클릭합니다.
  3. 해당 코드 블록을 선택하고 페이지에 삽입할 코드, 매개 변수 표시 또는 코드 블록의 위치를 수정합니다.
  4. 수정된 코드에 디자이너 제공 매개 변수가 포함되어 있지 않은 경우에는 [확인]을 클릭합니다.

    Dreamweaver는 대화 상자를 표시하지 않고 서버 비헤이비어를 다시 생성합니다. [서버 비헤이비어] 패널의 플러스(+) 팝업 메뉴에 새 서버 비헤이비어가 나타납니다.

  5. 수정된 코드에 디자이너 제공 매개 변수가 포함되어 있으면 [다음]을 클릭합니다.

    Dreamweaver에서 기존 대화 상자를 덮어쓸지 또는 새 대화 상자를 만들지 여부를 묻는 메시지를 표시합니다. 필요한 사항을 변경한 다음 [확인]을 클릭합니다.

    Dreamweaver는 모든 변경 사항을 서버 비헤이비어의 EDML 파일에 저장합니다.

코딩 지침

일반적으로 서버 비헤이비어의 코드는 간단하고 효율적이야 합니다. 웹 애플리케이션 개발자들은 자신의 페이지에 추가될 코드를 매우 까다롭게 검토합니다. 문서 유형의 언어(ColdFusion, JavaScript, VBScript 또는 PHP)에서 보편적으로 사용하는 코드 작성 원칙을 따르십시오. 주석을 추가할 때는 웹 디자이너, 대화형 작업 디자이너 또는 웹 애플리케이션 개발자 등 코드를 분석할 필요가 있는 다양한 전문가를 대상으로 하십시오. 코드의 목적이나 페이지에 삽입하는 방법을 정확히 설명하는 주석도 추가하는 것이 좋습니다.

다음은 서버 비헤이비어를 만들 때 유의해야 하는 코딩 지침입니다.

오류 검사

중요한 작업입니다. 서버 비헤이비어의 코드에서 오류를 확실하게 처리할 수 있어야 합니다. 모든 가능성을 예측해 보십시오. 예를 들어 매개 변수 요청에 실패하는 경우나 쿼리에서 레코드가 전혀 반환되지 않는 경우를 예상해 보십시오.

고유한 이름

고유한 이름을 사용하면 코드를 명확하게 식별할 수 있으며 기존의 다른 코드와 이름이 충돌되지 않게 할 수 있습니다. 예를 들어 페이지에 hideLayer()라는 함수와 ERROR_STRING이라는 전역 변수가 있는 경우, 두 이름에 대한 서버 비헤이비어의 사용 빈도가 너무 높은 코드를 삽입하면 서버 비헤이비어가 기존 코드와 충돌을 일으킬 수 있습니다.

코드 접두어

코드 접두어를 사용하면 페이지에서 사용자가 만든 런타임 함수와 전역 변수를 식별할 수 있습니다. 이 경우 한 가지 규칙은 사용자 이름의 머리 글자를 사용하는 것입니다. MM_ 접두어는 Dreamweaver 전용으로 예약된 것이므로 사용하면 안 됩니다. Dreamweaver는 모든 함수와 전역 변수 앞에 MM_ 접두어를 붙여 사용자가 작성하는 코드와의 충돌을 방지합니다.

var MM_ERROR_STRING = "..."; 
function MM_hideLayer() {

비슷한 코드 블록 방지

다른 블록의 코드와 너무 비슷하게 코드 블록을 작성하지 마십시오. 페이지에 있는 다른 코드 블록과 너무 비슷한 코드 블록을 사용하면 [서버 비헤이비어] 패널이 첫 번째 코드 블록을 두 번째 코드 블록 인스턴스로 인식하거나 그 반대 현상이 발생할 수도 있습니다. 간단한 해결책은 코드 블록에 주석을 추가하여 서로 구분하는 것입니다.

서버 비헤이비어 테스트

Dreamweaver Exchange는 서버 비헤이비어를 만들 때 다음과 같은 테스트를 수행할 것을 권장합니다.

  • [서버 비헤이비어] 패널에서 해당 비헤이비어를 적용해 봅니다. 대화 상자가 있으면 올바른 데이터로 각 필드를 채운 다음 [확인]을 클릭합니다. 비헤이비어를 적용할 때 오류가 발생하는지 확인합니다. 서버 비헤이비어의 런타임 코드가 코드 관리자에 나타나는지도 확인하십시오.

  • 서버 비헤이비어를 다시 적용한 다음 대화 상자의 각 필드에 올바른 데이터를 입력합니다. 필드를 공백으로 남겨 두거나 매우 큰 숫자나 음수, 잘못된 문자(예: /, ?, :, * 등)를 사용하거나 숫자 필드에 문자를 입력해 보기도 합니다. 잘못된 데이터를 처리하는 유효성 검사 루틴을 작성할 수 있습니다. 유효성 검사 루틴에는 여기서는 다루지 않는 하드 코딩 작업도 포함됩니다.

    페이지에 서버 비헤이비어가 성공적으로 적용된 경우에는 다음 사항을 확인하십시오.

  • [서버 비헤이비어] 패널에서 페이지에 추가된 비헤이비어 목록에 해당 서버 비헤이비어 이름이 있는지 확인합니다.

  • 서버 측 스크립트가 있는 경우에는 해당 아이콘이 페이지에 나타나는지도 확인합니다. 일반적인 서버 측 스크립트 아이콘은 노란색의 방패 모양으로 표시됩니다. 이 아이콘을 보려면 [보기] > [시각 도구] > [보이지 않는 요소]를 선택한 후 [보이지 않는 요소]를 활성화합니다.

  • [보기] > [코드]를 선택하여 코드 보기에서 잘못된 코드가 생성되었는지 확인합니다.

    서버 비헤이비어가 데이터베이스에 대한 연결을 실행하는 코드를 문서에 삽입한 경우에는 문서에 삽입된 코드를 테스트할 테스트 데이터베이스도 만드십시오. 서로 다른 데이터 세트 및 크기가 다른 데이터 세트를 생성하는 쿼리를 정의하여 연결을 테스트합니다.

    마지막으로 서버에 페이지를 업로드한 다음 브라우저에서 엽니다. 페이지의 HTML 소스를 검토하여 서버 측 스크립트에 의해 잘못된 HTML이 생성되지 않았는지 확인합니다.

쉽고 빠르게 지원 받기

신규 사용자이신가요?