Ngăn xếp MEAN được sử dụng để mô tả quá trình phát triển bằng MongoDB, Express. js, góc cạnh. jS và nút. js. Trong hướng dẫn này, tôi sẽ chỉ cho bạn cách sử dụng Express. js, nút. js và MongoDB. js. Chúng ta sẽ tạo một ứng dụng Node rất đơn giản, cho phép người dùng nhập dữ liệu mà họ muốn lưu trữ trong cơ sở dữ liệu MongoDB. Nó cũng sẽ hiển thị tất cả các mục đã được nhập vào cơ sở dữ liệu

Trước khi chúng ta bắt đầu, tôi sẽ mô tả một số thuật ngữ mà bạn sẽ thường xuyên nghe thấy khi tạo ứng dụng ngăn xếp MEAN. Sau đó, chúng tôi sẽ bắt đầu xây dựng ví dụ của mình

CRUD

CRUD là từ viết tắt có nghĩa là Tạo, Đọc, Cập nhật và Xóa. Nó được sử dụng để mô tả quá trình lưu dữ liệu của bạn vào cơ sở dữ liệu. Trong ví dụ này, bạn sẽ cung cấp các ví dụ về Tạo dữ liệu mới vào cơ sở dữ liệu và sau đó Đọc dữ liệu từ cơ sở dữ liệu

API an toàn

API RESTful là giao diện chương trình ứng dụng sử dụng các yêu cầu HTTP để GET, PUT, POST và DELETE dữ liệu. Chúng tôi sẽ sử dụng API để xác định thời điểm chúng tôi thêm dữ liệu vào cơ sở dữ liệu của mình và khi chúng tôi đọc từ cơ sở dữ liệu

Tạo một ứng dụng nút

Để bắt đầu, tôi khuyên bạn nên tạo một cơ sở dữ liệu mới chứa ứng dụng của chúng ta. Đối với bản demo này, tôi đang tạo một thư mục có tên là nút-demo. Sau khi tạo thư mục, bạn sẽ cần thay đổi thư mục đó

mkdir node-demo
cd node-demo

Khi chúng tôi ở trong thư mục, chúng tôi sẽ cần tạo một ứng dụng và chúng tôi có thể thực hiện việc này bằng cách chạy lệnh

npm init

Điều này sẽ hỏi bạn một loạt câu hỏi. Dưới đây là những câu trả lời tôi đã đưa ra cho lời nhắc

lời nhắc khởi tạo npm

Bước đầu tiên là tạo một tệp chứa mã của chúng tôi cho Nút của chúng tôi. máy chủ js

touch app.js

Trong ứng dụng của chúng tôi. js, chúng ta sẽ thêm đoạn mã sau để xây dựng một Nút rất đơn giản. ứng dụng js

var express = require["express"];
var app = express[];
var port = 3000;
 
app.get["/", [req, res] => {
 res.send["Hello World"];
}];
 
app.listen[port, [] => {
 console.log["Server listening on port " + port];
}];

Những gì mã làm là yêu cầu express. ứng dụng js. Sau đó, nó tạo ứng dụng bằng cách gọi express. Chúng tôi xác định cổng của chúng tôi là 3000

Dòng

npm init

7 sẽ lắng nghe các yêu cầu từ trình duyệt và sẽ trả lại văn bản “Xin chào thế giới” cho trình duyệt

Dòng cuối cùng thực sự khởi động máy chủ và yêu cầu nó lắng nghe trên cổng 3000

Cài đặt nhanh

ứng dụng của chúng tôi. js yêu cầu Express. mô-đun js. Chúng ta cần cài đặt express để nó hoạt động bình thường. Đi đến thiết bị đầu cuối của bạn và nhập lệnh này

npm install express --save

Lệnh này sẽ cài đặt mô-đun express vào gói của chúng tôi. json. Mô-đun được cài đặt dưới dạng phụ thuộc trong gói của chúng tôi. json như hình bên dưới

bưu kiện. json

Để kiểm tra ứng dụng của chúng tôi, bạn có thể vào terminal và nhập lệnh

node app.js

Mở trình duyệt và điều hướng đến url

//localhost:3000

Bạn sẽ thấy như sau trong trình duyệt của mình

Tạo trang web để lưu dữ liệu vào cơ sở dữ liệu MongoDB

Thay vì hiển thị dòng chữ “Xin chào thế giới” khi mọi người xem ứng dụng của bạn, điều chúng tôi muốn làm là hiển thị một nơi để người dùng lưu dữ liệu vào cơ sở dữ liệu

Chúng tôi sẽ cho phép người dùng nhập tên và họ mà chúng tôi sẽ lưu trong cơ sở dữ liệu

Để làm điều này, chúng ta sẽ cần tạo một tệp HTML cơ bản. Trong thiết bị đầu cuối của bạn, hãy nhập lệnh sau để tạo chỉ mục. tệp html.
______18

Trong chỉ mục của chúng tôi. html, chúng tôi sẽ tạo một trường nhập nơi người dùng có thể nhập dữ liệu mà họ muốn lưu trữ trong cơ sở dữ liệu. Chúng tôi cũng sẽ cần một nút để người dùng nhấp vào sẽ thêm dữ liệu vào cơ sở dữ liệu

Đây là những gì chỉ số của chúng tôi. tập tin html trông giống như

 
 Intro to Node and MongoDB
 
 
 
 
Into to Node and MongoDB

 
 Enter Your Name

 
 
 
 
 

Nếu bạn quen thuộc với HTML, bạn sẽ không tìm thấy bất kỳ điều gì bất thường trong mã của chúng tôi cho chỉ mục của chúng tôi. tệp html. Chúng tôi đang tạo một biểu mẫu nơi người dùng có thể nhập tên và họ của họ, sau đó nhấp vào nút “Thêm tên”

Biểu mẫu sẽ thực hiện cuộc gọi bài đăng đến điểm cuối /addname. Chúng ta sẽ nói về điểm cuối và đăng sau trong hướng dẫn này

Hiển thị trang web của chúng tôi cho người dùng

Trước đây chúng tôi đã hiển thị văn bản “Xin chào thế giới” cho người dùng khi họ truy cập trang web của chúng tôi. Bây giờ chúng tôi muốn hiển thị tệp html mà chúng tôi đã tạo. Để làm điều này, chúng tôi sẽ cần thay đổi dòng

npm init

7 trong ứng dụng của chúng tôi. tập tin js

Chúng tôi sẽ sử dụng lệnh sendFile để hiển thị chỉ mục. tệp html. Chúng tôi sẽ cần cho máy chủ biết chính xác nơi tìm chỉ mục. tệp html. Chúng ta có thể làm điều đó bằng cách sử dụng lệnh gọi toàn cầu của nút __dirname. __dirname sẽ cung cấp dòng điện trực tiếp nơi lệnh được chạy. Sau đó, chúng tôi sẽ nối đường dẫn đến chỉ mục của chúng tôi. tệp html

Các dòng

npm init

7 sẽ cần phải được thay đổi thành

npm init

2

Khi bạn đã lưu ứng dụng của mình. js, chúng ta có thể kiểm tra nó bằng cách vào terminal và chạy

touch app.js

1

Mở trình duyệt của bạn và điều hướng đến “http. //máy chủ cục bộ. 3000”. Bạn sẽ thấy như sau

Kết nối với cơ sở dữ liệu

Bây giờ chúng ta cần thêm cơ sở dữ liệu của mình vào ứng dụng. Chúng tôi sẽ kết nối với cơ sở dữ liệu MongoDB. Tôi giả định rằng bạn đã cài đặt và chạy MongoDB trên máy tính của mình

Để kết nối với cơ sở dữ liệu MongoDB, chúng ta sẽ sử dụng một mô-đun có tên là Mongoose. Chúng ta sẽ cần cài đặt mô-đun cầy mangut giống như chúng ta đã làm với express. Đi đến thiết bị đầu cuối của bạn và nhập lệnh sau

npm init

4

Điều này sẽ cài đặt mô hình cầy mangut và thêm nó làm phụ thuộc vào gói của chúng tôi. json

Kết nối với cơ sở dữ liệu

Bây giờ chúng ta đã cài đặt mô-đun cầy mangut, chúng ta cần kết nối với cơ sở dữ liệu trong ứng dụng của mình. tập tin js. MongoDB, theo mặc định, chạy trên cổng 27017. Bạn kết nối với cơ sở dữ liệu bằng cách cho nó biết vị trí của cơ sở dữ liệu và tên của cơ sở dữ liệu

Trong ứng dụng của chúng tôi. js sau dòng cho cổng và trước ứng dụng. sử dụng dòng, nhập hai dòng sau để truy cập cầy mangut và kết nối với cơ sở dữ liệu. Đối với cơ sở dữ liệu, tôi sẽ sử dụng “node-demo”

npm init

0Tạo lược đồ cơ sở dữ liệu

Khi người dùng nhập dữ liệu vào trường đầu vào và nhấp vào nút thêm, chúng tôi muốn nội dung của trường đầu vào được lưu trữ trong cơ sở dữ liệu. Để biết được định dạng của dữ liệu trong cơ sở dữ liệu, chúng ta cần có Schema

Đối với hướng dẫn này, chúng ta sẽ cần một Lược đồ rất đơn giản chỉ có hai trường. Tôi sẽ gọi trường FirstName và LastName. Dữ liệu được lưu trữ trong cả hai trường sẽ là Chuỗi

Sau khi kết nối với cơ sở dữ liệu trong ứng dụng của chúng tôi. js, chúng ta cần xác định Schema của mình. Đây là những dòng bạn cần thêm vào ứng dụng. js

npm init

1

Khi chúng tôi đã xây dựng Lược đồ của mình, chúng tôi cần tạo một mô hình từ nó. Tôi sẽ gọi mô hình của mình là “DataInput”. Đây là dòng bạn sẽ thêm tiếp theo để tạo chế độ của chúng tôi

npm init

2Tạo API RESTful

Bây giờ chúng tôi có kết nối với cơ sở dữ liệu của mình, chúng tôi cần tạo cơ chế theo đó dữ liệu sẽ được thêm vào cơ sở dữ liệu. Điều này được thực hiện thông qua API REST của chúng tôi. Chúng tôi sẽ cần tạo một điểm cuối sẽ được sử dụng để gửi dữ liệu đến máy chủ của chúng tôi. Khi máy chủ nhận được dữ liệu này thì nó sẽ lưu trữ dữ liệu trong cơ sở dữ liệu

Điểm cuối là tuyến đường mà máy chủ của chúng tôi sẽ lắng nghe để lấy dữ liệu từ trình duyệt. Chúng tôi đã có một tuyến đường mà chúng tôi đã tạo trong ứng dụng và đó là tuyến đường đang lắng nghe tại điểm cuối “/” là trang chủ của ứng dụng của chúng tôi

Động từ HTML trong API REST

Giao tiếp giữa máy khách [trình duyệt] và máy chủ được thực hiện thông qua một động từ HTTP. Các động từ HTTP phổ biến nhất là

touch app.js

2.

Bảng sau đây giải thích chức năng của từng động từ HTTP

Như bạn có thể thấy từ những động từ này, chúng tạo thành nền tảng cho các hoạt động CRUD mà tôi đã nói trước đây

Xây dựng điểm cuối CRUD

Nếu bạn còn nhớ, biểu mẫu trong chỉ mục của chúng tôi. html đã sử dụng phương thức đăng để gọi điểm cuối này. Bây giờ chúng ta sẽ tạo điểm cuối này

Trong điểm cuối trước đây của chúng tôi, chúng tôi đã sử dụng động từ http GET GET để hiển thị chỉ mục. tệp html. Chúng ta sẽ làm điều gì đó tương tự nhưng thay vì sử dụng “GET”, chúng ta sẽ sử dụng “POST”. Để bắt đầu, đây là khung của điểm cuối của chúng tôi sẽ trông như thế nào

npm init

3Express Middleware

Để điền vào nội dung của điểm cuối của chúng tôi, chúng tôi muốn lưu trữ FirstName và LastName do người dùng nhập vào cơ sở dữ liệu. Các giá trị cho FirstName và LastName nằm trong phần nội dung của yêu cầu mà chúng tôi gửi đến máy chủ. Chúng tôi muốn nắm bắt dữ liệu đó, chuyển đổi nó thành JSON và lưu trữ vào cơ sở dữ liệu

Thể hiện. js phiên bản 4 đã xóa tất cả phần mềm trung gian. Để phân tích dữ liệu trong phần thân, chúng tôi sẽ cần thêm phần mềm trung gian vào ứng dụng của mình để cung cấp chức năng này. Chúng tôi sẽ sử dụng mô-đun body-parser. Chúng tôi cần cài đặt nó, vì vậy trong cửa sổ đầu cuối của bạn, hãy nhập lệnh sau

npm init

4

Sau khi nó được cài đặt, chúng tôi sẽ cần yêu cầu mô-đun này và định cấu hình nó. Cấu hình sẽ cho phép chúng tôi chuyển dữ liệu cho FirstName và LastName trong phần thân tới máy chủ. Nó cũng có thể chuyển đổi dữ liệu đó thành định dạng JSON. Điều này sẽ hữu ích vì chúng tôi có thể lấy dữ liệu đã định dạng này và lưu trực tiếp vào cơ sở dữ liệu của chúng tôi

Để thêm phần mềm trung gian phân tích cú pháp nội dung vào ứng dụng của chúng tôi và định cấu hình nó, chúng tôi có thể thêm các dòng sau ngay sau dòng đặt cổng của chúng tôi

npm init

5Lưu dữ liệu vào cơ sở dữ liệu

Mongoose cung cấp chức năng lưu sẽ lấy một đối tượng JSON và lưu trữ nó trong cơ sở dữ liệu. Phần mềm trung gian phân tích cú pháp cơ thể của chúng tôi, sẽ chuyển đổi đầu vào của người dùng thành định dạng JSON cho chúng tôi

Để lưu dữ liệu vào cơ sở dữ liệu, chúng ta cần tạo một phiên bản mới của mô hình mà chúng ta đã tạo trước đó. Chúng tôi sẽ chuyển vào trường hợp này đầu vào của người dùng. Khi đã có rồi thì chúng ta chỉ cần nhập lệnh “save”

Mongoose sẽ trả lại lời hứa khi lưu vào cơ sở dữ liệu. Một lời hứa là những gì được trả lại khi lưu vào cơ sở dữ liệu hoàn tất. Lưu này sẽ kết thúc thành công hoặc nó sẽ thất bại. Một lời hứa cung cấp hai phương thức sẽ xử lý cả hai tình huống này

Nếu việc lưu vào cơ sở dữ liệu này thành công, nó sẽ quay trở lại. sau đó phân đoạn của lời hứa. Trong trường hợp này, chúng tôi muốn gửi lại văn bản cho người dùng để cho họ biết dữ liệu đã được lưu vào cơ sở dữ liệu

Nếu nó không thành công, nó sẽ trở lại. bắt phân đoạn của lời hứa. Trong trường hợp này, chúng tôi muốn gửi lại văn bản cho người dùng để thông báo cho họ biết dữ liệu chưa được lưu vào cơ sở dữ liệu. Cách tốt nhất là cũng thay đổi mã trạng thái được trả về từ 200 mặc định thành 400. Mã trạng thái 400 biểu thị rằng thao tác không thành công

Bây giờ đặt tất cả những thứ này lại với nhau ở đây là điểm cuối cuối cùng của chúng ta sẽ trông như thế nào

npm init

6Kiểm tra mã của chúng tôi

Lưu mã của bạn. Chuyển đến thiết bị đầu cuối của bạn và nhập lệnh

touch app.js

1 để khởi động máy chủ của chúng tôi. Mở trình duyệt của bạn và điều hướng đến URL “http. //máy chủ cục bộ. 3000”. Bạn sẽ thấy chỉ mục của chúng tôi. tệp html được hiển thị cho bạn

Hãy chắc chắn rằng bạn có mongo đang chạy

Nhập tên và họ của bạn vào các trường nhập liệu rồi nhấp vào nút “Thêm tên”. Bạn sẽ nhận được văn bản cho biết tên đã được lưu vào cơ sở dữ liệu như bên dưới

Truy cập mã

Phiên bản cuối cùng của mã có sẵn trong repo Github của tôi. Để truy cập mã bấm vào đây. Nếu bạn thích hướng dẫn này, hãy đánh dấu sao repo github của tôi

Nodejs kết nối với cơ sở dữ liệu MongoDB như thế nào?

Dữ liệu được trích xuất từ ​​MongoDB như thế nào?

Cụm MongoDB kết nối với Nodejs như thế nào?

Làm thế nào để MongoDB kết nối với cơ sở dữ liệu Nodejs Dữ liệu được lưu trữ trong MongoDB như thế nào?