Hướng dẫn Node.js Express FrameWork – Học trong 10 phút

Trong hướng dẫn này, chúng ta sẽ nghiên cứu về Express framework. Khung này được xây dựng theo cách nó hoạt động như một khung ứng dụng web Node.js tối giản và linh hoạt, cung cấp một bộ tính năng mạnh mẽ để xây dựng ứng dụng web đơn, nhiều trang và ứng dụng web lai.

Express.js là gì?

Express.js là khung máy chủ ứng dụng web Node js, được thiết kế đặc biệt để xây dựng các ứng dụng web một trang, nhiều trang và lai.

Nó đã trở thành khung máy chủ tiêu chuẩn cho node.js. Express là phần phụ trợ của thứ được gọi là ngăn xếp MEAN.

MEAN là một nguồn mở và miễn phí JavaScript phần mềm dùng để xây dựng các trang web động và các ứng dụng web có các thành phần sau;

1) MongoDB – Cơ sở dữ liệu NoSQL tiêu chuẩn

2) Express.js – Khung ứng dụng web mặc định

3) Angular.js - JavaScript MVC framework được sử dụng cho các ứng dụng web

4) Node.js – Framework được sử dụng cho các ứng dụng mạng và phía máy chủ có thể mở rộng.

Khung Express.js giúp dễ dàng phát triển một ứng dụng có thể được sử dụng để xử lý nhiều loại yêu cầu như yêu cầu GET, PUT, POST và DELETE.

Cài đặt và sử dụng Express

Express được cài đặt thông qua Node Package Manager. Điều này có thể được thực hiện bằng cách thực hiện dòng lệnh sau

npm cài đặt nhanh

Lệnh trên yêu cầu trình quản lý gói Node tải xuống các mô-đun tốc hành cần thiết và cài đặt chúng cho phù hợp.

Hãy sử dụng khung Express mới được cài đặt của chúng tôi và tạo một ứng dụng “Hello World” đơn giản.

Ứng dụng của chúng tôi sẽ tạo một mô-đun máy chủ đơn giản sẽ lắng nghe trên cổng số 3000. Trong ví dụ của chúng tôi, nếu một yêu cầu được thực hiện thông qua trình duyệt trên số cổng này thì ứng dụng máy chủ sẽ gửi phản hồi 'Hello' World' tới máy khách .

Cài đặt và sử dụng Express

var express=require('express');
var app=express();
app.get('/',function(req,res)
{
res.send('Hello World!');
});
var server=app.listen(3000,function() {});

Giải thích mã:

  1. Trong dòng mã đầu tiên, chúng tôi đang sử dụng hàm yêu cầu để bao gồm “mô-đun tốc hành”.
  2. Trước khi có thể bắt đầu sử dụng mô-đun express, chúng ta cần tạo một đối tượng của nó.
  3. Ở đây chúng ta đang tạo một hàm gọi lại. Hàm này sẽ được gọi bất cứ khi nào có ai duyệt đến thư mục gốc của ứng dụng web của chúng tôi. http://localhost:3000 . Hàm callback sẽ được sử dụng để gửi chuỗi “Hello World” tới trang web.
  4. Trong hàm gọi lại, chúng ta đang gửi lại chuỗi “Hello World” cho máy khách. Tham số 'res' được sử dụng để gửi nội dung trở lại trang web. Tham số 'res' này là thứ được cung cấp bởi mô-đun 'request' để cho phép một người gửi nội dung trở lại trang web.
  5. Sau đó, chúng tôi đang sử dụng chức năng nghe để làm cho ứng dụng máy chủ của chúng tôi lắng nghe các yêu cầu của khách hàng trên cổng số 3000. Bạn có thể chỉ định bất kỳ cổng khả dụng nào ở đây.

Nếu lệnh được thực thi thành công, kết quả sau sẽ hiển thị khi bạn chạy mã trên trình duyệt.

Đầu ra:

Express.js

Từ đầu ra,

  • Các bạn có thể thấy rõ rằng chúng ta nếu duyệt tới URL của localhost trên cổng 3000 thì sẽ thấy dòng chữ “Hello World” hiển thị trên trang.
  • Bởi vì trong mã của chúng tôi, chúng tôi đã đề cập cụ thể đến việc máy chủ nghe trên cổng số 3000, nên chúng tôi có thể xem đầu ra khi duyệt tới URL này.

Tuyến đường là gì?

Định tuyến xác định cách ứng dụng phản hồi yêu cầu của khách hàng đến một điểm cuối cụ thể.

Ví dụ: khách hàng có thể thực hiện yêu cầu http GET, POST, PUT hoặc DELETE cho nhiều URL khác nhau, chẳng hạn như các URL được hiển thị bên dưới;

http://localhost:3000/Books
http://localhost:3000/Students

Trong ví dụ trên,

  • Nếu yêu cầu GET được thực hiện cho URL đầu tiên thì phản hồi lý tưởng nhất phải là danh sách sách.
  • Nếu yêu cầu GET được thực hiện cho URL thứ hai thì phản hồi lý tưởng nhất phải là danh sách Sinh viên.
  • Vì vậy, dựa trên URL được truy cập, một chức năng khác trên máy chủ web sẽ được gọi và theo đó, phản hồi sẽ được gửi đến máy khách. Đây là khái niệm về định tuyến.

Mỗi tuyến có thể có một hoặc nhiều hàm xử lý, được thực thi khi tuyến đó khớp.

Cú pháp chung cho một tuyến đường được hiển thị bên dưới

app.METHOD(PATH, HANDLER)

Trong đó,

1) ứng dụng là một phiên bản của mô-đun express

2) METHOD là phương thức yêu cầu HTTP (GET, POST, PUT hoặc DELETE)

3) PATH là đường dẫn trên máy chủ.

4) HANDLER là chức năng được thực thi khi tuyến đường được khớp.

Hãy xem một ví dụ về cách chúng ta có thể triển khai các tuyến đường trong express. Ví dụ của chúng tôi sẽ tạo 3 tuyến đường như

  1. Tuyến A /Node sẽ hiển thị chuỗi “Hướng dẫn về Node” nếu tuyến này được truy cập
  2. A /Tuyến đường góc sẽ hiển thị chuỗi “Hướng dẫn về góc” nếu tuyến đường này được truy cập
  3. Tuyến đường mặc định / sẽ hiển thị chuỗi “Chào mừng đến với Hướng dẫn của Guru99”.

Mã cơ bản của chúng tôi sẽ giữ nguyên như các ví dụ trước. Đoạn mã dưới đây là một tiện ích bổ sung để giới thiệu cách triển khai định tuyến.

Các tuyến đường trong Node.js

var express = require('express');
var app = express();
app.route('/Node').get(function(req,res)
{
    res.send("Tutorial on Node");
});
app.route('/Angular').get(function(req,res)
{
    res.send("Tutorial on Angular");
});
app.get('/',function(req,res){
    res.send('Welcome to Guru99 Tutorials');
}));

Giải thích mã:

  1. Ở đây chúng tôi đang xác định tuyến đường nếu URL http://localhost:3000/Node được chọn trong trình duyệt. Đối với tuyến đường, chúng tôi đang đính kèm một hàm gọi lại sẽ được gọi khi chúng tôi duyệt đến URL nút. Hàm này có 2 tham số.
  • Tham số chính mà chúng ta sẽ sử dụng là tham số 'res', tham số này có thể được sử dụng để gửi thông tin trở lại máy khách.
  • Tham số 'req' có thông tin về yêu cầu được thực hiện. Đôi khi các tham số bổ sung có thể được gửi như một phần của yêu cầu được thực hiện và do đó tham số 'req' có thể được sử dụng để tìm các tham số bổ sung được gửi.
  1. Chúng tôi đang sử dụng chức năng gửi để gửi chuỗi “Hướng dẫn về Nút” trở lại máy khách nếu tuyến Nút được chọn.
  2. Ở đây chúng tôi đang xác định tuyến đường nếu URL http://localhost:3000/Angular được chọn trong trình duyệt. Đối với tuyến đường, chúng tôi đang đính kèm chức năng gọi lại sẽ được gọi khi chúng tôi duyệt đến URL góc.
  3. Chúng tôi đang sử dụng chức năng gửi để gửi chuỗi “Hướng dẫn về Angular” trở lại máy khách nếu tuyến Angular được chọn.
  4. Đây là tuyến đường mặc định được chọn khi duyệt đến tuyến đường của ứng dụng – http://localhost:3000. Khi tuyến mặc định được chọn, thông báo “Chào mừng đến với Hướng dẫn Guru99” sẽ được gửi tới khách hàng.

Nếu lệnh được thực thi thành công, kết quả sau sẽ hiển thị khi bạn chạy mã trên trình duyệt.

Đầu ra:

Các tuyến đường trong Node.js

Từ đầu ra,

  • Bạn có thể thấy rõ rằng chúng ta nếu duyệt đến URL của localhost trên cổng 3000, bạn sẽ thấy dòng 'Welcome to Guru99 Tutorials' hiển thị trên trang.
  • Bởi vì trong mã của chúng tôi, chúng tôi đã đề cập rằng URL mặc định của chúng tôi sẽ hiển thị thông báo này.

Các tuyến đường trong Node.js

Từ đầu ra,

  • Bạn có thể thấy rằng nếu URL đã được thay đổi thành /Node, thì tuyến Node tương ứng sẽ được chọn và chuỗi “Hướng dẫn về Node' được hiển thị.

Các tuyến đường trong Node.js

Từ đầu ra,

  • Bạn có thể thấy rằng nếu URL đã được thay đổi thành /Angular, tuyến Node tương ứng sẽ được chọn và chuỗi “Hướng dẫn về Angular” được hiển thị.

Máy chủ Web mẫu sử dụng express.js

Từ ví dụ trên, chúng ta đã thấy cách có thể quyết định đầu ra nào sẽ hiển thị dựa trên định tuyến. Kiểu định tuyến này được sử dụng trong hầu hết các ứng dụng web hiện đại. Phần khác của máy chủ web là sử dụng các mẫu trong Node js.

Khi tạo các ứng dụng Node nhanh chóng, cách dễ dàng và nhanh chóng là sử dụng các mẫu cho ứng dụng. Có rất nhiều framework có sẵn trên thị trường để tạo mẫu. Trong trường hợp của chúng tôi, chúng tôi sẽ lấy ví dụ về khung ngọc bích để tạo khuôn mẫu.

Jade được cài đặt thông qua trình quản lý gói Node. Điều này có thể được thực hiện bằng cách thực hiện dòng lệnh sau

npm cài đặt ngọc

Lệnh trên yêu cầu trình quản lý gói Node tải xuống các mô-đun ngọc cần thiết và cài đặt chúng cho phù hợp.

LƯU Ý: Trong phiên bản mới nhất của Node Jade đã không còn được dùng nữa. Thay vào đó hãy sử dụng pug.

Hãy sử dụng khung ngọc mới cài đặt của chúng tôi và tạo một số mẫu cơ bản.

Bước 1) Bước đầu tiên là tạo một mẫu ngọc. Tạo một tệp có tên là index.jade và chèn mã bên dưới. Đảm bảo tạo tệp trong thư mục “lượt xem”

Máy chủ web mẫu sử dụng Express.js

  1. Ở đây chúng tôi chỉ định rằng tiêu đề của trang sẽ được thay đổi thành bất kỳ giá trị nào được truyền khi mẫu này được gọi.
  2. Chúng tôi cũng chỉ định rằng văn bản trong thẻ tiêu đề sẽ được thay thế bằng bất kỳ nội dung nào được chuyển trong mẫu ngọc bích.

Máy chủ web mẫu sử dụng Express.js

var express=require('express');
var app=express();
app.set('view engine','jade');
app.get('/',function(req,res)
{
res.render('index',
{title:'Guru99',message:'Welcome'})
});
var server=app.listen(3000,function() {});

Giải thích mã:

  1. Điều đầu tiên cần chỉ định trong ứng dụng là “công cụ xem” sẽ được sử dụng để hiển thị các mẫu. Vì chúng ta sẽ sử dụng ngọc để hiển thị các mẫu của mình nên chúng ta chỉ định điều này cho phù hợp.
  2. Chức năng kết xuất được sử dụng để hiển thị một trang web. Trong ví dụ của chúng tôi, chúng tôi đang hiển thị mẫu (index.jade) đã được tạo trước đó.
  3. Chúng tôi đang chuyển các giá trị của “Guru99” và “Chào mừng” cho các tham số “tiêu đề” và “tin nhắn” tương ứng. Các giá trị này sẽ được thay thế bằng các tham số 'title' và 'message' được khai báo trong mẫu index.jade.

Nếu lệnh được thực thi thành công, kết quả sau sẽ hiển thị khi bạn chạy mã trên trình duyệt.

Đầu ra:

Máy chủ web mẫu sử dụng Express.js

Từ đầu ra,

  • Chúng ta có thể thấy rằng tiêu đề của trang được đặt thành “Guru99” và tiêu đề của trang được đặt thành “Chào mừng”.
  • Điều này là do mẫu ngọc bích được gọi trong ứng dụng nút js của chúng tôi.

Tổng kết

  • Express framework là framework phổ biến nhất được sử dụng để phát triển các ứng dụng Node js. Express framework được xây dựng dựa trên framework node.js và giúp theo dõi nhanh quá trình phát triển các ứng dụng dựa trên máy chủ.
  • Các tuyến được sử dụng để chuyển hướng người dùng đến các phần khác nhau của ứng dụng web dựa trên yêu cầu được đưa ra. Phản hồi cho mỗi tuyến có thể khác nhau tùy thuộc vào nội dung cần hiển thị cho người dùng.
  • Mẫu có thể được sử dụng để chèn nội dung một cách hiệu quả. Jade là một trong những công cụ tạo khuôn mẫu phổ biến nhất được sử dụng trong các ứng dụng Node.js.