Mernの' n 'と' E 'ノードの基本JSエクスプレス.js



導入

ノードとはJS ?Node.js is an open-source, cross-platform, back-end, JavaScript runtime environment that executes JavaScript code outside a web browser.オープンソース-ソースコードの使用と変更を合法的に利用可能ですので.
クロスプラットフォーム- Linux、OSXとWindowsのような異なるプラットフォーム間で動作します.
バックエンド-クライアントからの要求を受信し、それに応答するロジックが含まれています.
JPランタイム環境- JavaScriptコードを解析して実行します.
ノードはJavaScriptエンジンがGoogle Chrome Webブラウザで使用されているJavaScriptエンジン上に構築されたJavaScript環境です.これは、WebサーバーやプラットフォームAPIのWebサービスを含むサーバーサイドアプリケーションを構築するための魅力的な選択を行ういくつかの素晴らしい機能を備えています.
この記事の主な目的
  • ノードの理解アプリケーションを構築
  • ノードを使用したToDoアプリケーションの実装.js
  • Expressを使用してREST APIを実装します.js
  • 必須条件-ノードとして.JSはJavaScriptに基づいています、それはJavaScriptを知っている開発者のために始めるために学ぶのがより簡単です.これは、フロントエンドとバックエンドの両方がちょうどJavaScript知識で書かれることができることを意味します.
    移動する前に、ノードがインストールされていることを確認してください.
    インストールHere .
    始めましょう
    ノードを使用して簡単なサーバーを作成する方法を見てみましょう.js
    ファイルアプリケーションを作成します.以下のコードをペーストします.
    // File: app.js
    
    const http = require('http');
    const port = 8081;
    
    http.createServer((request, response) => {
    
        // Set response status code and response headers
        response.writeHead(200, { 'Content-Type': 'text/html' });
    
        // Set response body i.e, data to be sent
        response.write('<h1>TODO</h1>');
    
        // Tell the server the response is complete and to close the connection
        response.end();
    
    }).listen(port, () => {
    
        // Log text to the terminal once the server starts
        console.log(`Nodejs server started on port ${port}`)
    
    });
    
    実行するnode app.js 端末で.端末に次のように表示されます-
    Nodejs server started on port 8081
    
    基本的にあなたのサーバーはポート8081を開始しました!
    テストしましょうcurl :curl -X GET http://localhost:8081または訪問http://localhost:8081 上記のサーバーによって送られる応答を見るために、あなたのブラウザーで.
    それだ!あなただけの最初のノードのアプリを構築した.
    では、上記のコードで何が起こっているのでしょうか?http は組み込みのノードモジュールです.require() インポートする.
    HTTPモジュールは関数を公開しますcreateServer() HTTPサーバの作成に使用できます.
    コールバック関数をcreateServer ()関数のパラメータとして渡す必要があります.この関数はサーバがリクエストを受け取る度に実行されます.コールバック関数へのパラメータはHTTPrequest and response オブジェクト.
    我々はこれらを使用response オブジェクトメソッド-
  • writehead () -最初のパラメータはレスポンスステータスコードと2番目のレスポンスヘッダです.
  • write () -レスポンス本文をクライアントに返すように追加します.
  • end () -応答が完了したことをサーバに通知します.
    そしてもちろん、我々は任意の数を追加することができますresponse.write() 前に呼び出すresponse.end() は、より多くのデータを送信するために呼び出されます.
  • ここでは、私たちはちょうどテキストとH 1タグを送信している.
    curl commandレスポンスを出力する
    <h1>TODO<h1>
    
    ブラウザはHTMLタグをレンダリングし、h 1見出しをテキストで表示します.
  • listen ()メソッドは、サーバがリクエストを待機するポートを設定します.
    また、サーバーが起動したときに1回実行されるlisten ()にコールバック関数を追加することもできます.通常、Nodejs server started on port 8081 サーバが聞いていることを確認します.

  • ルーティング
    よろしい.したがって、現在、我々のサーバーは、ステータスコード200(それはURLとメソッドに関係なく)に、それが受ける要求(H 1タグ)を送ります.
    createServer ()メソッドの本体を以下のように変更しましょう.
    const { method, url } = request;
    //fetch request method and path by using the request object’s method and url properties.
    
    if (url == "/todos") {
    
        if (method == "GET") {
            response.writeHead(200, { 'Content-Type': 'text/html' });
            response.write('<h1>TODO</h1>');
            response.write('<p>Track your work</p>');
        } else {
            response.writeHead(501); //or response.statusCode = 501
        }
    
    } else {
        response.writeHead(404);
    }
    
    response.end();
    
    ここで、URL変数が/todosであるかどうかをチェックします.
    もしそうならば、メソッドが得られるかどうかチェックします?
    もしそうならば、ヘッダとHTMLレスポンスを返してください
    そうでなければ、501のステータスコードを
    その他、404ステータスコードを返します.
    あなたが試みるならばcurl -X GET http://localhost:8081/randomあなたはどのような応答は、サーバーから取得する予定ですか?
    URLパスは/randomですので、サーバーはステータスコードを404として応答を送ります.
    あなたが試みるならばcurl -X POST http://localhost:8081/todosはい、URLは/todosです、しかし、メソッドはポストです、現在、あなたは501としてレスポンスコードを得ます.
    明示的に設定されていない場合は- 200 OK応答ステータスコードがデフォルトで送信されます.

    リクエスト本文
    The request ハンドラに渡されるオブジェクトはReadableStream インターフェイス.このストリームは、他のストリームと同じように他の場所に耳を傾けることができます.ストリームの' data 'と' end 'イベントを聞くことでストリームからデータを取り出すことができます.
    The request.on() メソッドを使用して、ストリームイベントを探すことができます.データはチャンクに読み込まれ、バッファである.
    データ全体が読み込まれると、JSONデータをJSONを使用してJavaScriptオブジェクトとしてパースできます.parse ()関数
    let body = '';
    
        request.on('error', (err) => {
            console.error(err);
    
        }).on('data', (chunk) => {
    
            body += chunk;  //keep concatenating the chunk 
    
        }).on('end', () => {
            body = JSON.parse(body);
        });
    

    URLモジュール
    url parmatersに基づいて応答をフィルターしたいならどうすればよいですか?
    我々は、ビルトインURL モジュール
    URLモジュールは、読み取り可能な部分にWebアドレスを分割します.
    
    var url = require('url');
    var adr = 'http://localhost:8081/default.htm?year=2017&month=february';  //request.url
    var q = url.parse(adr, true);
    
    console.log(q.host); //returns 'localhost:8081'
    console.log(q.pathname); //returns '/default.htm'
    console.log(q.search); //returns '?year=2017&month=february'
    
    var qdata = q.query; //returns an object: { year: 2017, month: 'february' }
    console.log(qdata.month); //returns 'february'
    
    今、あなたがこの点まで完全な記事を経験したならば、あなたは本当にノードの知識があります.JSともちろん、常に多くの新しいものを探索することです.

    エクスプレス
    エクスプレス.jsはノードである.JSのフレームワークと簡単にAPIを構築することができます.
    ノードを使って作成したAPIを実装します.js次に、両方の実装をどのように表現するかを比較できます.JSは簡単になります.
    まず、システム上で動作するように急行しましょう.
    $ npm install express
    
    Expressでは、ノードのみを使用してWebサーバーを開発する場合に比べて、読みやすく、柔軟で、メンテナンス可能なWebサーバーを作成できますHTTP ライブラリは、最も基本的なWebサーバーのためにも複雑になることができます.

    ExpressとHTTPメソッドのルーティング
    ルートハンドラ関数を定義するための構文は以下の通りです.app.httpMethod(path, handler) {...}ここで、HttpMethodはGET、PUT、POST、DELETEなどでありえます.パスはリクエストが行く実際のルートです、そして、ハンドラーはノードでcreateSite ()を通過していた同じコールバック関数です.JSは、要求されたルートが見つかったときに実行されます.
    を実装しましょうGET API/todos 利用経路Express
    const app = express();
    
    app.get("/todos", (request,response) => {
        response.status(200);
        response.send('<h1>TODO</h1>');
    
    });
    const port = 8081;
    
    app.listen(port, function(){
    
        console.log(`Nodejs server started on port ${port}`)
    
    });
    
  • Express ()メソッドを使用してExpressサーバーを初期化します.
  • 取得するために、我々はアプリを使用します.app ()を使用します.post ()、app他のHTTPメソッドのdelete ()など.
  • 応答オブジェクトのsend ()メソッドを使用してレスポンス本文を送信します.
  • サーバーをポートにバインドするには、Expressアプリケーションでアプリケーションのメソッドを使用します.
  • JavaScriptは大文字小文字を区別する言語、アプリケーションです.get ()は動作しません.

    エクスプレスミドルウェア
    ミドルウェア機能は、我々がルートの中でするように要求と応答オブジェクトへのアクセスを持っているものです.ミドルウェアはリクエスト、レスポンスオブジェクトを変更することができ、同様に応答サイクルを終了することができます.ミドルウェアは、リクエストがサーバーに対して行われるたびに実行される関数のスタックとして考えられます.
    一般に、ミドルウェア機能は、3つのパラメタをとります:リクエストオブジェクト、レスポンスオブジェクトと「次」機能.ミドルウェアを書くときはいつでも、このNext ()関数を書き込みます.アプリケーションでミドルウェアを使用するには、アプリケーションに呼び出しを行う必要があります.use ()と引数としてミドルウェア関数を渡します.
    例えば-
    // User defined Middleware
    app.use(function(req, res, next){
       console.log('Inside Middleware function...');
       next();
    });
    
    next ()をコールしないと、ルートハンドラやミドルウェアは処理されません.まだ何らかの理由で、Next ()を呼び出したくない場合は、クライアントに応答を送信するか、クライアントがハング状態になって最終的にタイムアウトします.
    今、私たちはエクスプレスの基本的な理解を持って、急行を使用してtodoアプリケーションを完了しましょう.
    const express = require('express'); 
    //importing express
    
    const app = express();
    //initializing express app
    
    app.use(express.json())
    //express.json() middleware to parse the request body as JSON.
    
    const port = 8081
    
    let todoList = ["Complete writing blog", "Complete project"];
    
    /* Get all TODOS:   
    ** curl -v http://localhost:8081/todos
    */
    app.get("/todos", (request, response) => {
        response.send(todoList);
    });
    
    /* Add a TODO to the list
    ** curl -v -X POST -d '{"name":"Plan for next week"}' http://localhost:8081/todos -H 'content-type:application/json'
    */
    app.post("/todos", (request, response) => {
        let newTodo = request.body.name;
        todoList.push(newTodo);
        response.status(201).send();
    });
    
    /* Delete a TODO to the list
    ** curl -v -X DELETE -d '{"name":"Complete writing blog"}' http://localhost:8081/todos
    */
    app.delete("/todos", (request, response) => {
        let deleteTodo = request.body.name;
        console.log(deleteTodo);
        for (let i = 0; i < todoList.length; i++) {
            if (todoList[i] === deleteTodo) {
                todoList.splice(i, 1);
                response.status(204).send();
            }
        }
    });
    
    app.all("/todos", (request, response) => {
        response.status(501).send()
    })
    
    app.all("*", (request, response) => {
        response.status(404).send()
    })
    
    app.listen(port, () => {
        console.log(`Nodejs server started on port ${port}`)
    });
    
    何がアプリです.all () ?
    リクエストの501ステータスコードを送信するには/todos 取得、ポスト、削除以外に、我々はアプリを使用することができます.all ()は現在のルートセットの下にあります.
    Expressのすべての未実装ルートのデフォルトでは、HTMLコンテンツで404のステータスコードを返すか、また、アプリケーションを使用することができます.add ()メソッドを追加します.

    結論
    最後までのお祝い.私たちはこの記事で多くのことを学びました、あなたは今、ノードと表現の適切な知識を持っていることを望みます.これで、ノードを使用して簡単なアプリケーションを作成できます.JSフレームワーク.JSは複数のルートを聴くWebサーバを作成し、Expressを利用します.あなたのノードアプリケーションのJSライブラリ.私は、すぐにこの話題に関するより多くの記事とともに来ます.
    その時まで
    また、どうぞ❤️, あなたがこの記事が好きであるならば.