Cách cài đặt MERN Stack cho các ứng dụng dựa trên JS trên Ubuntu 20.04

[theanh]

Ngăn xếp MERN được tạo thành từ bốn thành phần: MongoDB, Express, React và Node. Nó cung cấp một gói các công nghệ JavaScript được sử dụng để xây dựng các trang web JS động.

MongoDB là một hệ thống cơ sở dữ liệu NoSQL mã nguồn mở và được sử dụng rộng rãi nhất để phát triển các ứng dụng web mạnh mẽ. Express.js là một khuôn khổ ứng dụng web Node.js được sử dụng để phát triển các ứng dụng dựa trên web lai. React.js là một khuôn khổ JavaScript mã nguồn mở được sử dụng để tạo giao diện front-end cho các ứng dụng di động. Node.js là một môi trường JavaScript cho phép các nhà phát triển chạy mã trên máy chủ.

Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn cách cài đặt ngăn xếp MERN trên Ubuntu 20.04.

Điều kiện tiên quyết​

• Máy chủ chạy Ubuntu 20.04.
• Mật khẩu gốc được cấu hình trên máy chủ.

Bắt đầu​

Trước tiên, hãy cập nhật các gói hệ thống lên phiên bản đã cập nhật bằng cách chạy lệnh sau:

apt-get update -y

Sau khi tất cả các gói được cập nhật, bạn có thể tiến hành bước tiếp theo.

Cài đặt MongoDB Server​

Theo mặc định, phiên bản MongoDB mới nhất không được bao gồm trong kho lưu trữ mặc định của Ubuntu 20.04. Vì vậy, bạn sẽ cần thêm kho lưu trữ MongoDB vào hệ thống của mình.

Trước tiên, hãy cài đặt tất cả các phụ thuộc bắt buộc bằng lệnh sau:

apt-get install gnupg2 wget curl unzip git -y

Sau khi cài đặt tất cả các phụ thuộc, hãy thêm khóa GPG MongoDB bằng lệnh sau:

wget -qO- https://www.mongodb.org/static/pgp/server-4.4.asc | apt-key add -

Tiếp theo, thêm kho lưu trữ MongoDB bằng lệnh sau:

echo "deb [ arch=amd64,arm64 ] https://repo.mongodb.org/apt/ubuntu focal/mongodb-org/4.4 multiverse" | tee /etc/apt/sources.list.d/mongodb-org-4.4.list

Tiếp theo, hãy cập nhật kho lưu trữ và cài đặt máy chủ MongoDB bằng lệnh sau:

apt-get update -y
apt-get install mongodb-org -y

Sau khi MongoDB đã được cài đặt, hãy khởi động dịch vụ MongoDB và cho phép dịch vụ này khởi động khi khởi động lại hệ thống:

systemctl start mongod
systemctl enable mongod

Tiếp theo, hãy xác minh trạng thái của dịch vụ MongoDB bằng lệnh sau:

systemctl status mongod

Bạn sẽ thấy đầu ra sau:

? mongod.service - Máy chủ cơ sở dữ liệu MongoDB Đã tải: đã tải (/lib/systemd/system/mongod.service; disabled; vendor preset: enabled) Đang hoạt động: đang hoạt động (đang chạy) kể từ Thứ sáu 2021-07-23 12:21:17 UTC; 5 giây trước Tài liệu: https://docs.mongodb.org/manual PID chính: 8774 (mongod) Bộ nhớ: 58,8M CGroup: /system.slice/mongod.service ??8774 /usr/bin/mongod --config /etc/mongod.conf23 tháng 7 12:21:17 ubuntu systemd[1]: Đã khởi động MongoDB Database Server.

Tiếp theo, hãy xác minh cài đặt MongoDB bằng lệnh sau:

mongo --eval 'db.runCommand({ connectionStatus: 1 })'

Bạn sẽ nhận được kết quả sau:

Phiên bản shell MongoDB v4.4.7đang kết nối tới: mongodb://127.0.0.1:27017/?compressors=disabled&gssapiServiceName=mongodbPhiên ngầm định: session { "id" : UUID("59c89093-9e9d-413b-aafa-ae0a4ddda087") }Phiên bản máy chủ MongoDB: 4.4.7{ "authInfo" : { "authenticatedUsers" : [ ], "authenticatedUserRoles" : [ ] }, "ok" : 1}

Tạo Người dùng quản trị MongoDB​

Đầu tiên, hãy kết nối với phiên bản MongoDB bằng lệnh sau:

mongo

Sau khi kết nối, hãy đổi cơ sở dữ liệu thành admin bằng lệnh sau:

> use admin

Tiếp theo, hãy tạo người dùng quản trị và đặt mật khẩu bằng lệnh sau:

> db.createUser({user: "admin", pwd: passwordPrompt(), roles: [{ role: "userAdminAnyDatabase", db: "admin"}]})
Nhập mật khẩu:

Bạn sẽ nhận được kết quả sau:

Đã thêm người dùng thành công: { "user" : "admin", "roles" : [ { "role" : "userAdminAnyDatabase", "db" : "admin" } ]}

Tiếp theo, thoát khỏi shell MongoDB bằng lệnh sau:

> quit()

Cài đặt Node.js​

Theo mặc định, phiên bản Node.js mới nhất không có trong kho lưu trữ mặc định của Ubuntu. Vì vậy, bạn sẽ cần thêm kho lưu trữ nguồn Node vào hệ thống của mình.

Để thêm kho lưu trữ nguồn Node, hãy chạy lệnh sau:

curl -sL https://deb.nodesource.com/setup_14.x | bash -

Sau khi kho lưu trữ được thêm vào, hãy cài đặt Node.js bằng lệnh sau:

apt-get install nodejs -y

Sau khi cài đặt, hãy xác minh phiên bản Node.js bằng lệnh sau:

node --version

Bạn sẽ thấy kết quả đầu ra sau:

v14.17.2

Bạn cũng có thể xác minh phiên bản NPM bằng lệnh sau:

npm --version

Bạn sẽ thấy kết quả đầu ra sau:

6.14.13

Cài đặt React.js​

Trước tiên, bạn sẽ cần cài đặt công cụ create-react-app để tạo ứng dụng React.js.

Bạn có thể cài đặt bằng lệnh sau:

npm install -g create-react-app

Sau khi cài đặt, hãy tạo ứng dụng React.js bằng lệnh sau:

create-react-app myapp

Bạn sẽ thấy kết quả đầu ra sau:

Thành công! Đã tạo myapp tại /root/myappBên trong thư mục đó, bạn có thể chạy một số lệnh: npm start Khởi động máy chủ phát triển. npm run build Đóng gói ứng dụng thành các tệp tĩnh để sản xuất. npm test Khởi động trình chạy thử nghiệm. npm run eject Xóa công cụ này và sao chép các phụ thuộc bản dựng, tệp cấu hình và tập lệnh vào thư mục ứng dụng. Nếu bạn làm như vậy, bạn không thể quay lại!Chúng tôi khuyên bạn nên bắt đầu bằng cách nhập: cd myapp npm startChúc bạn hack vui vẻ!

Tiếp theo, hãy thay đổi thư mục thành myapp và khởi động ứng dụng bằng lệnh sau:

cd myapp
npm start 0.0.0.0

Bạn sẽ thấy đầu ra sau:

Đã biên dịch thành công!Bây giờ bạn có thể xem myapp trong trình duyệt. http://localhost:3000Lưu ý rằng bản dựng phát triển chưa được tối ưu hóa.Để tạo bản dựng sản xuất, hãy sử dụng npm run build.

Bây giờ bạn có thể truy cập ứng dụng React.js bằng URL

http://your-server-ip:3000

. Bạn sẽ thấy bảng điều khiển React.js của mình trên trang sau:



Bây giờ, hãy nhấn CTRL+C trong thiết bị đầu cuối của bạn để đóng ứng dụng.

Cài đặt Express.js​

Trước tiên, hãy cài đặt express-generator bằng lệnh sau:

npm install -g express-generator

Sau khi cài đặt, hãy tạo một dự án mới bằng lệnh sau:

express myproject

Bạn sẽ nhận được kết quả sau:

cảnh báo: công cụ xem mặc định sẽ không phải là jade trong các bản phát hành trong tương lai cảnh báo: sử dụng `--view=jade' hoặc `--help' để biết thêm các tùy chọn create : myproject/ create : myproject/public/ create : myproject/public/javascripts/ create : myproject/public/images/ create : myproject/public/stylesheets/ create : myproject/public/stylesheets/style.css create : myproject/routes/ create : myproject/routes/index.js create : myproject/routes/users.js create : myproject/views/ create : myproject/views/error.jade create : myproject/views/index.jade create : myproject/views/layout.jade create : myproject/app.js create : myproject/package.json create : myproject/bin/ create : myproject/bin/www thay đổi thư mục: $ cd myproject install dependency: $ npm install chạy ứng dụng: $ DEBUG=myproject:* npm start

Bây giờ, hãy thay đổi thư mục thành dự án của bạn và cài đặt tất cả các phụ thuộc NPM bằng lệnh sau:

cd myproject
npm install

Bây giờ, hãy khởi động máy chủ web Express bằng lệnh sau:

npm start 0.0.0.0

Bây giờ, hãy mở trình duyệt web của bạn và truy cập ứng dụng Express bằng URL

http://your-server-ip:3000

. Bạn sẽ thấy trang sau:

Kết luận​

Xin chúc mừng! bạn đã cài đặt thành công ngăn xếp MERN trên máy chủ Ubuntu 20.04. Bây giờ bạn có thể bắt đầu phát triển ứng dụng MERN. Hãy thoải mái hỏi tôi nếu bạn có bất kỳ câu hỏi nào.