[Umbraco 강좌] 3. Umbraco 설치

이 내용은 ASP.NET MVP로 활동하고 계신 박용준님이 작성하신, 오픈소스 기반 웹사이트 제작 엔진인 Umbraco로 처음 웹사이트를 구축 및 개발하기 위한 시리즈 강좌입니다. 많은 도움 되시길 바랍니다.
==================================================================================================

소개

안녕하세요. 박용준입니다.

Umbraco CMS는 많은 수의 사이트에서 사용되고 심지어는 Windows XP와 같은 로컬 컴퓨터를 포함한 클라우드 서비스인 Microsoft Windows Azure와 같은 클라우드 서버에서도 실행 가능하도록 설치가 가능합니다. 설치 시간은 많이 잡아봤자 5분 내외의 짧은 시간입니다.

이번 시간은 Umbraco CMS를 로컬 컴퓨터에 설치하는 과정에 대해서 설명하고자 합니다.

따라하기

1. 앞서 다운로드 받은 Umbraco CMS 소스에 마우스 오른쪽 버튼을 클릭한 후 [Open as as Web Site with Microsoft WebMatrix] 메뉴 항목을 클릭합니다.

2. WebMatrix로 Umbraco 소스가 열립니다. 아래 그림과 같이 [실행] 메뉴를 클릭하면, 현재 운영체제에 설치되어있는 웹 브라우저 리스트가 출력됩니다. 이 중에서 원하는 웹 브라우저로 Umbraco 웹 사이트를 실행시킵니다. 필자의 경우에는 Windows 7에 기반 내장되어 있는 Internet Explorer를 사용하도록 하겠습니다.

3. Umbraco를 WebMatrix로 실행하면 아래 그림과 같이 Umbraco 처음 설치화면이 나타납니다. 나중에 설치가 완료되면 현재화면은 더 이상 나타나지 않습니다. 이처럼, Umbraco는 설치를 포함한 모든 작업을 웹에서 실행할 수 있습니다.

4. 두 번째 설치 진행화면은 Umbraco에 대한 라이선스를 소개하는 페이지입니다. 시간이 나면 한번 정도 읽어보시고 그렇지 않으면 [Accept and Continue] 버튼을 클릭하여 다음으로 진행합니다.

5. 아래 그림은 Umbraco CMS에서 사용할 데이터베이스를 지정하는 화면입니다. SQL Server 시리즈 및 MySQL 등의 데이터베이스를 기본으로 사용할 수 있습니다. 이번 과정에서는 로컬 데이터베이스인 SQL Server CE(Compact Edition)를 사용하도록 하겠습니다. 만약, 학습이 아닌 실제 원격 서버에 배포를 위한다면 SQL Server 정식 버전 또는 Express 버전을 사용하심을 추천해 드립니다. 데이터베이스 선택 후 [Install] 버튼을 클릭하여 설치를 계속 진행합니다.

6. 아래 그림은 데이터베이스 설치진행 화면입니다. 완료가 되면 [Continue] 버튼을 클릭하여 다음으로 진행합니다.

7. [Create User] 페이지입니다. Umbraco CMS를 책임질 최고 관리자 권한을 설정하는 페이지입니다. 5개의 항목을 정확히 입력 후 [Create User] 버튼을 클릭하여 다음으로 진행합니다.

8. [Starter Kit] 설정 페이지입니다. Umbraco는 기본적으로 사용자가 설치 및 운영하기 편리하도록 5개 정도의 템플릿을 기본으로 제공합니다. 예를 들어 Umbraco를 사용하여 블로그를 운영하고자 한다면 두 번째 메뉴를 선택하여 기본 블로그 환경으로 Umbraco를 실행할 수 있습니다. 필자는 학습의 편의를 위해서 가장 깔끔한 버전인 [Simple] 버전을 선택하여 설치하도록 하겠습니다.

9. [Starter Kit] 내에서 추가로 어떤 UI로 보여질지를 결정해주는 스킨(Skin)을 선택하는 화면입니다. 스킨 선택화면에서는 [Preview] 아이콘 또는 [Install] 아이콘을 통해서 미리 보기 및 바로 설치를 진행할 수 있습니다. [Preview] 아이콘을 클릭합니다.

10. 미리 보기 페이지에서 특정 스킨을 선택 후 설치할 수 있습니다.

11. 스킨 설치 페이지에서는 상단의 [Customize Skin] 버튼을 눌러서 로고/이미지/하단 텍스트 등을 변경할 수 있습니다.

12. 변경된 스킨은 아래 그림의 [Save and publish] 버튼을 클릭하여 저장 후 실행시킬 수 있습니다.

13. 설치가 완료되면 2개의 화면(사용자 모드와 관리자 모드)이 열립니다. 사용자 모드는 기본적인 실행화면이고 관리자 모드는 Umbraco에서는 백오피스(BackOffice)로 불리우며 사용자 페이지를 편집 및 여러 가지 관리 기능을 할 수 있습니다.

14. 아래 그림은 설치 완료 후의 [Simple] Starter Kit을 사용한 메인 페이지의 모습을 볼 수 있습니다.

마무리

여기까지 Umbraco 클리어 버전의 소스를 바탕으로 웹에서 실행 가능하도록 Umbraco를 설치하는 과정을 보여드렸습니다.

다음 시간부터는 이 소스를 바탕으로 콘텐트 등의 여러 가지 페이지 및 기능들을 추가하면서 하나의 완성된 웹 사이트를 만들어가는 과정을 보여드리도록 하겠습니다.

끝.

관련글

• Umbraco-1. Umbraco 소개
• Umbraco-2. Umbraco 개발 환경 구축
• Umbraco-3. Umbraco 설치
• Umbraco-4. 사용자 모드와 관리자 모드(백오피스)
• Umbraco-5. 새로운 페이지(Page) 만들기
• Umbraco-6. 한글 언어팩(Languages) 적용하기
• Umbraco-7. 콘텐트 페이지 편집, 삭제, 메뉴 정렬 등 소개
• Umbraco-8. 캔버스 내용 편집
• Umbraco-9. 미디어 파일 관리
• Umbraco-10. 사용자(User) 관리
• Umbraco-11. 스타일 추가 및 변경
• Umbraco-12. 템플릿(Templates)과 마스터페이지(MasterPages)
• Umbraco-13. Umbraco 페이지 필드(태그(Tags))
• Umbraco-14. 문서 타입(Document Types)
• Umbraco-15. 문서 타입(Document Types)에 속성 추가
• Umbraco-16. 부모 문서 타입(Document Types) 사용하기
• Umbraco-17. 문서 타입(Document Types) 내보내기 및 가져오기
• Umbraco-18. 문서 타입(Document Types) 자식 노드 허용
• Umbraco-19. 기본 매크로(Macros) 사용하기
• Umbraco-20. 새로운 매크로(Macro) 만들기
• Umbraco-21. 매크로(Macro)에 파라미터 전달
• Umbraco-22. 사진 갤러리(Gallery) 만들기 1
• Umbraco-23. 사진 갤러리(Gallery) 만들기 2 : XSLT 사용하기
• Umbraco-24. 사진 갤러리(Gallery) 만들기 3 : jQuery 슬라이드 쇼 플러그인 적용
• Umbraco-25. 회원(Members) 관리
• Umbraco-26. 사전(Dictionaries)
• Umbraco-27. 패키지(Packages)
• Umbraco-28. HTML 레벨의 스킨 파일 적용 1
• Umbraco-29. HTML 레벨의 스킨 파일 적용 2 : 상단 메뉴
• Umbraco-30. HTML 레벨의 스킨 파일 적용 3 : 서브 메뉴와 사이트 맵
• Umbraco-31. HTML 레벨의 스킨 파일 적용 4 : 서브 타이틀
• Umbraco-32. 배포 : Umbraco CMS를 원격 서버에서 실행