|
1 - WebMatrix 및 ASP.NET 웹 페이지와 함께 시작하기
이 장에서는 마이크로 소프트 WebMatrix, 웹 개발자를위한 세계 최고의 경험을 제공하는 무료 웹 개발 기술을 소개합니다.
1. 무엇 WebMatrix입니까?
WebMatrix 웹사이트를 구축할 수있는 가장 쉬운 방법인 웹 개발 도구를 무료로 제공합니다. 경량으로 설정됩니다. 그것은 IIS에서 익스프레스(개발 웹 서버), ASP.NET (웹 프레임 워크) 및 SQL Server 압축을 (임베디드 데이터베이스)가 포함되어 있습니다. 그것은 또한 웹사이트 개발을 합리화하고 쉽게 인기있는 오픈 소스 애플 리케이션에서 웹 사이트를 시작할 수있게 간단한 도구가 포함되어 있습니다. 기술과 코드가 Visual Studio 및 SQL Server로 원활하게 WebMatrix 전환으로 개발할 수 있습니다.
당신이 수있는 WebMatrix를 사용하여 만드는 웹 페이지는 동적 즉, 그들은 사용자 입력 또는 데이터베이스 정보와 같은 기타 정보를 기반으로 자신의 내용이나 스타일을 변경할 수 있습니다. 동적 웹 페이지를 프로그램에, 당신은 Razor 문법과 C #이나 비주얼 베이직 프로그래밍 언어와 함께 ASP.NET을 사용합니다.
2. 설치 WebMatrix
WebMatrix를 설치하려면, 당신은 쉽게 설치 및 웹 관련 기술을 구성하게하는 무료 응용 프로그램입니다 Microsoft의 웹 플랫폼 설치, 사용할 수 있습니다.
다음 URL에서 다운로드 :
http://go.microsoft.com/fwlink/?LinkID=205867
웹 플랫폼 설치를 선택 주목 WebMatrix를 설치하려면 추가를 누른 다음 실행합니다.
3. WebMatrix 시작하기
시작하면, 새로운 웹사이트와 간단한 웹 페이지를 만들어드립니다.
4. 웹 페이지 만들기
WebMatrix에서 파일 작업 영역을 선택합니다. 이 작업 영역은 파일 및 폴더 작업하실 수 있습니다. 왼쪽 창에서 귀하의 사이트의 파일 구조를 보여줍니다.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Hello World Page</title> </head> <body> <h1>Hello World Page</h1> <p>Hello World!</p> </body> </html> |
5. 관리 도구와 함께 Helpers 인스톨
당신이 WebMatrix가 설치되어 이제 사이트를 만들어, ASP.NET 웹 페이지 관리 도구 및 Helpers를 설치하기위한 패키지 관리자를 사용하는 방법을 배울 수 있습니다. WebMatrix 일반적인 프로그래밍 작업을 단순화하는 헬퍼가(구성 요소)가 포함되어 있습니다. (일부 헬퍼가 이미 WebMatrix 포함되어 있습니다,하지만 또 다른 헬퍼를 설치할 수 있습니다.) appendix에서 사용 가능한 모든 헬퍼의 목록을 찾을 수 있습니다. 다음 절차에서는 ASP.NET 웹 Helpers 라이브러리를 설치하려면 관리 도구를 사용합니다. 이 시리즈에 튜토리얼 및 기타 자습서에서 이러한 헬퍼의 일부를 사용합니다.
참고: C # 및 Visual Basic 버전에서 템플릿 기본 웹 사이트를(제빵, 캘린더, 포토 갤러리, 그리고 초보자 사이트) 사용할 수 있습니다. Visual Basic을 WebMatrix에서 ASP.NET 웹 페이지 관리 도구를 사용하여 템플릿을 설치할 수 있습니다. 그리고,이 섹션 및 검색을위한 VB에서 설명하는 관리 도구를 연 다음은 필요한 템플릿을 설치합니다. 웹 사이트는 Microsoft 서식라는 폴더의 사이트 루트 폴더에 템플릿이 설치되어있습니다.
다음 섹션에서는, 당신은 그것에 동적 페이지를 작성하기 위해 default.cshtml 페이지에 코드를 추가하는 방법을 쉽게 확인할 수 있습니다.
6. ASP.NET 웹 페이지 코드를 사용하여
이 절차에서는, 서버의 날짜 및 시간을 페이지에 표시하는 간단한 코드를 사용하는 페이지를 만들어드립니다. 예를 들면 여기가 당신이 ASP.NET 웹 페이지의 HTML에 코드를 삽입할 수 있도록 Razor 구문을 소개합니다. (다음 장에서 이것에 대해 자세한 내용을 보실 수 있습니다.) 코드에 대해 이전 챕터에서 읽었던 헬퍼 중 하나를 소개합니다.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Hello World Page</title> </head> <body> <h1>Hello World Page</h1> <p>Hello World!</p> <p>The time is @DateTime.Now</p> </body> </html> |
당신이 선택하는 트위터의 사용자 드롭다운 리슨트 처럼 무엇인가 보다 복합적인 것을 원한다고 가정합니다. Helper를 사용할 수 있습니다. 알려져 있듯이, Helper는 일상적인 작업을 단순화하는 구성요소입니다. 이경우에, 그렇지않다고 생각하는 모든 작업은 패치되고 트위터에 표시됩니다.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>Twitter Feed</title> </head> <body> <h1>Twitter Feed</h1> <form action="" method="POST"> <div> Enter the name of another Twitter feed to display: <input type="text" name="TwitterUser" value=""/> <input type="submit" value="Submit" /> </div> <div> @if (Request["TwitterUser"].IsEmpty()) { @Twitter.Search("microsoft") } else { @Twitter.Profile(Request["TwitterUser"]) } </div> </form> </body> </html> |
7. Visual Studio에서 ASP.NET Razor 페이지에 프로그램
ASP.NET Razor 페이지 프로그램은 WebMartrix와 Visual Studio 2010 풀버전 또는 웹 개발자 버전 중 하나와 함께 사용하면, InetlliSense 기능과 디버거를 향상시킬 수 있는 프로그래밍 도구를 얻을 수 있어 생산성을 향상시킬 수 있습니다. IntelliSense는 HTML, 자바 스크립트, 및 C# 및 Visual Basic(ASP.NET Razor Page 프로그램밍에서 사용하는 언어) 등에서 그들의 속성을 보여줍니다.
디버거가 실행되는 동안 당신이 프로그램을 막을 수 있습니다. 그런 다음 변수 값 같은 것들을 검사할 수 있고, 그것이 실행되는 방식을 볼 수 있는 프로그램을 통해 단계별로 디버깅할 수 있습니다.
Visual Studio가 설치되어있다면, WebMatrix에서 편집할 때, 사이트 내부에서 Visual Studio를 발진시켜 IntelliSense와 디버거를 활용할 수 있습니다.
8. 나만의 텍스트 편집기를 사용하여 만들기 및 ASP.NET 페이지 테스트
ASP.NET 웹 페이지를 만들고 테스트 테스트하기위해 WebMatrix 편집기를 사용하지 않아도됩니다. 페이지를 만들려면, 당신은 메모장을 비롯한 모든 텍스트 편집기를 사용할 수 있습니다. 그냥 파일 이름 확장자 .cshtml를 사용하여 페이지를 저장해야합니다. (또는Visual Basic을 사용하려는 경우 .vbhtml)
테스트하기 위해 가장 쉬운 방법은 .cshtml 페이지를 WebMatrix 실행 버튼을 사용하여 웹 서버 (IIS가 익스프레스)를 시작하는 것입니다. WebMatrix 도구를 사용하지 않으려면, 그러나, 당신은 명령줄에서 웹 서버를 실행하고 특정 포트 번호로 연결할 수 있습니다. 그런 다음 당신이 .cshtml 브라우저에서 파일을요청하면 해당 포트를 지정합니다.
Windows에서 명령은 관리자 권한이 다음과 같은 폴더로 변경과 프롬프트를 엽니다 :
C:\Program Files\IIS Express
64-bit systems은:
C:\Program Files (x86)\IIS Express
실제 경로를 사용하여 다음 명령을 입력 :
예) iisExpress.exe /port:35896 /path:C:\BasicWebSite
상기 포트는 이미 다른 프로세스에 의해 소유되진 오래 사용하는 포트와 같이 중요하지 않습니다. (1024 이상의 포트 번호는 일반적으로 비어있습니다.)
경로 값이 들어,. cshtml 파일은 테스트하려는하는 웹사이트의 경로를 사용합니다.
이 명령은 실행한 후에, 당신은 브라우저를 열고 다음과 같이 cshtml 파일을 찾습니다. :
http://localhost:35896/default.cshtml
|
첫댓글 감사합니다.