노드로 SQL Server 쿼리.js

시작하자

노드가 있다고 가정합니다.js 가 설치되었지만 그렇지 않은 경우 여기에서 다운로드 할 수 있습니다.노드를 설정하여 시작할 것입니다.js 웹 서버 및 테스트. 그런 다음 이전과 비슷한 코드를 추가하여 SQL Server 데이터베이스에 연결하고 쿼리하십시오.Node 용 미니멀리스트 웹 서버 프레임 워크를 사용할 것입니다.js,익스프레스. 그것은 npm 패키지로 설치합니다.

으로 많은 것들을은 항상있다,더 배울 때 그래서 내가 당신이 입력한 명령을 확실히 더 읽기에 대한 명령과 그것은 옵션이 있습니다.

설정 얻기

  1. 프로젝트의 경우 디렉토리/폴더를 만듭니다.
  2. Visual Studio Code(VSCode)를 열고 폴더를 엽니다.
  3. 새 터미널 창을 열고 입력하십시오.
    npm init
    패키지를 만들 기본값을 허용합니다.json.

4. VSCode 에서 파일을 만들고 인덱스로 저장하십시오.js 입니다. 당신이 당신의 패키지에서 보면.json 파일,당신은 당신이 기본”메인”파일을 변경할 수있는 위치를 볼 수 있습니다.

기본적인 출발점

5. 터미널 창 유형에서
start npm
이 노드를 시작합니다.js 서버.

웹 서버

터미널 창 유형에서
npm install express

이 웹 프레임 워크를 설치합니다.

우리는 로큰롤 준비가되었습니다!

웹 서버의 핵심은 익스프레스 패키지를 요구하고 홀더(변수 또는 const.)웹 서버에 대한 모든 참조는이 홀더를 통해 이루어질 것입니다.

우리는 웹 서버를 시작하고 HTTP 포트에서 청취하도록해야합니다,나는 5000 을 선택할 것입니다. 8080 은 일반적이며 단지 사용할 수있는 것입니다.

우리는 웹 서버가 적어도 HTTP get 메소드에 응답하기를 원할 것입니다. 이렇게하면”타이어를 걷어차 고”작동하는지 확인하는 데 사용할 수 있습니다. 여기 MDN 에 HTTP 메소드가 더 있습니다. 우리는 GET 과 POST 를 사용할 것입니다.

  • get 은 리소스에서 검색하는 데 사용됩니다.
  • POST 는 리소스에 제출하는 데 사용됩니다.

다음 코드를 입력하면 논의 할 것입니다.

웹 서버를 들어

코어를 설정합니다.
  • 우리는 필요합니 익스프레스 패키지를 저장하기에 참조 익스프레스 컨벤션,하지만하고 원하는 이름을 지정합니다.
  • express 의 인스턴스를 초기화하여 규칙에 따라 앱에 참조를 저장하지만 원하는대로 이름을 지정하십시오.
  • 11 행에서 웹 서버가 청취 할 위치에 대한 참조를 저장합니다. 포트 5000.
  • 5 행에서는 앱을 사용하여 웹 서버의 http GET with out 인스턴스를 사용합니다.얻을. 이것은 기본적으로 루트 디렉토리(‘/’)에서 데이터를 얻는 것처럼 보입니다. 콜백 함수는 요청(req)및 응답(res)객체를 포함하므로 매우 중요합니다. Req 와 res 라는 이름은 규칙에 의한 것입니다.

요청 및 응답

  • 요청은 브라우저의 url 에서 제공됩니다. 자세한 내용은 여기에서 찾을 수있다.
  • 응답은 요청에 대한 응답입니다. 더 많은 것은 여기에서 찾아 낼 수있다.

간단히 말해서,우리의 브라우저는 요청을 할 것입고 우리는 응답을 보낼.

타이어를 걷어차십시오

  1. VSCode 에서 F5 를 누르십시오(디버그 메뉴에서 디버깅 시작을위한 줄임말.)귀하의 콘솔은 다음과 같이 보일 것입니다.

보면 콘솔에 대한 메시지입니다. 상단에는 중지/새로 고침 등을위한 컨트롤이 있습니다.

2. 브라우저로 이동하여 LocalHost:5000 을 입력하고 Enter 를 누르십시오. 당신은 다음을보아야합니다.

다!

귀하의 브라우저 만든 얻을 요청하는 응답을 다시 사용하여 고해상도.보낼 수 있습니다.

노드 SQL Server 연결

(이전에 수행 한 경우 선택 사항입니다.)터미널 창에
npm install mssql
이 SQL Server 드라이버를 설치합니다.

데이터베이스를 들어

이것은 정확히 동일한 시작하는 코드로는 나의 이전 문서에서는 그래서 나가지 않을 것이 그 위에 세부 사항입니다. 그러나 앱 객체에서의 위치가 중요 할 것입니다.

몇 가지를 참고는 다른 것입하기 전에,후에 우리의 초기 테스트,

  • 이 PerformanceRating 우리의 직원이 발송될 것입 웹 페이지에서(니다.)
  • 쿼리 결과는 응답을 사용하여 웹 페이지로 출력됩니다.

데이터베이스 연결/쿼리 예

아래 코드를 입력하십시오.

뭔가 중요한 참고로 우리는 웹 서버 및 데이터베이스 연결 및 쿼리입니다. 그러나 그들은 상호 작용하지 않습니다. 아직!

Disconnected Web Server and Database Connection

Run it with by stopping and starting the web server or refreshing

Refesh/Stop and other options

and you will see the web server is running 그리고 쿼리에서 데이터의 콘솔 출력이 있습니다. 그러나 우리는 웹 서버에서 아무것도 얻거나 웹 페이지로 아무것도 보내지 않습니다.

우리의 웹 서버를 참고 및 데이터베이스 쿼리로 출력

HTML

우리는 페이지를 제공하는 경우 사용자가를 요구할 수 있습니다. 이 페이지를 사용하면 데이터베이스 쿼리에서 사용할 수있는 매개 변수(PerformanceRating)를 보낼 수 있습니다.웹 페이지를 스타일링하는 것에 대해 걱정하지 않아도됩니다. 그것은 간단하고 요점이 될 것입니다.

우리는 또한 루트에 모든 것을 저장하고 있습니다. 모범 사례? 방법이 없습니다! 그러나 우리는 기능을 위해 가고 있습니다. 청소는 나중에 일어날 수 있습니다.

  1. 다음 웹 페이지를 만들고 색인 이름을 지정하십시오.html 및 직원.html.
  • 색인.html 은 우리의 주요 소스 페이지가 될 것입니다.
  • 직원.html 은 우리의 결과가 끝나는 곳이 될 것입니다.

Simple startup page, index.html

Note the <form action=”/Employees…
This is where our output will go.

Add the following to Employees.html

2. This next step is going to require a couple of things. 그 중 하나는 내가 색인을 제공하도록 선택하는 방법입니다.html. 당신이 읽은 다른 소스는 라우팅에 들어갈 수 있습니다. 라우팅은 매우 중요한 영역이지만 우리의 범위를 벗어납니다. 우리의 길은 여러 가지 방법 중 하나 일뿐입니다. 새로운 추가는 우리의 코드가 될 것입니다.

  • 경로—이 도움이 될 것입니다 우리 사용되는 해상도입니다.sendFile 서버의 파일을 우리가 원하는 방문자가 제공하는 우리의 사이트입니다.
  • bodyParser—은 형태로 사용할 수 있는 데이터는 한 번 게시물이 수행
  • sendFile—할 수 있습을 원하는 기본 페이지입니다.

다음과 같은 내용을 변경하는 코드,

경로, bodyParser 및 sendFile

실행에 의해 시작과 정지를 웹 서버 또는 상쾌합니다. 귀하의 브라우저에서 후,상쾌한 브라우저 확인해야 합

인덱스입니다.html 제공하여 기본

를 사용하여 HTML 양식 데이터 쿼리에서

이를 위해,우리가 필요한 앱을 추가합니다.게시합니다. 이것은 우리가 원하는 때 인덱스 무엇이든 참여합니다.에 대한 html 은 웹 페이지에서 게시됩니다.이것은 중요한 단계입니다. 우리의 데이터베이스 연결 및 쿼리는 앱 내부에 있어야합니다.포스트 콜백 함수.

참고 어떻게 데이터베이스 구성 요소로 이동합니다.이 응용 프로그램을 실행하려면 어떻게해야합니까?게시합니다. 콜백의 본문에는 우리의 데이터베이스 구성 요소가 있습니다.

  • line52 가 앱을 닫습니다.게시합니다.
  • 이 모든 것을 다르게 구성 할 수 있습니까? 나는 우리에게 일할 기반을 제공하기 위해 이런 식으로 그것을하고 있습니다. 그런 다음 양식 데이터를 사용하여 다른 옵션

    를 탐색 할 수 있습니다.

    라인 35,37, 50 55
    • 라인 35 을 얻을,형태에서 데이터를 선택한 요소입니다. bodyParser 는 여기에서 우리를 돕는 것입니다. 레크.몸.요소 이름.
    • 37 행,쿼리는 양식의 값을 사용합니다.
    • 50 행은 원시 쿼리 된 데이터를 직원에게 보내고 있습니다.html.

    웹 서버를 중지하고 시작하거나 새로 고침하여 실행하십시오.

    1. 웹 페이지로 이동하여 새로 고칩니다.

    2. 등급 드롭 다운에서”평균”을 선택하고”결과 가져 오기”

    3 을 클릭하십시오. 당신은 직원의 출력을 얻어야한다.html. 매력적이지는 않지만 시작입니다.

    Json 으로부터 출력 해상도입니다.보내

    우리는 지금 연결에서 우리의 앞 끝이 우리의 최종하여 우리의 프런트 엔드. 이것은 큰 문제입니다.

    마지막 단계-출력을 정리(비트.)

    이것은 가장 쉽고 어려운 부분입니다. 너무 많은 옵션이 있기 때문에 가장 어렵습니다. 우리는 기초의 기초와 함께 갈 것이므로 내부 깊은 곳에서 일어나는 일을 엿볼 수 있습니다.

    이것은 당신이 훨씬 더 자세하게 탐구하고 싶은 영역입니다. Res 의 추가 방법이 아니라”보기 엔진”의 아이디어입니다.

    그리고 향후 기사에서 이들 중 일부를 탐색 할 것입니다. 특히,내 즐겨 찾기 중 하나 인 익스프레스 핸들 바.

    지금은 출력을 구성 할 것입니다. 예. 그것을 스스로 구성하십시오. 코드에서 우리의 데이터의 테이블을 구축하고 그것을 보내! 그냥 우리의 데이터를 통해 루프.레코드 세트 및 빌드.

    은 다음을 참조

    건물의 출력

    를 원할 것입니다 줄을 추가 50-57.

    출력이 될 것으로 다음과 같이 쿼리할 때”Average”

    내장하여 우리와 함께 코드입니다.

    다음에 할 일(예)

    그것으로 놀고,더 추가하고,구조를 변경하십시오. 기초부터 시작하여 작업하십시오.

    우리는 작업으로 첫 번째 원리를 이해하는 데 도움이 무엇을 뒤에 몇 가지 레이어는 자바스크립트 템플릿 프레임워크 및 라이브러리는 이러한 일입니다.

    우리는 자체적으로 전체 스택 시스템을 구축했습니다. 예,믿거 나 말거나 우리는 가지고 있습니다.

    가장 많은 작업이 필요한 것,출력. 그러나이 전체 운동은 탐험과 기회의 세계를 열어줍니다. 그래서 우리는 확장하려는 개념

    • 더 CRUD 운영
    • 라우팅
    • View 엔진/템플릿

    은 당신이 여행을 살펴보겠습니다 더 있습니다.

    당신은 또한 즐길 수 있습니다,

    답글 남기기

    이메일 주소는 공개되지 않습니다. 필수 항목은 *(으)로 표시합니다