Đây là repository chính thức cho môn Hệ cơ sở dữ liệu HK231.
(Cập nhật đầu tiên 12/1/2023): Cập nhật hệ thống đăng nhập đăng ký, sử dụng cơ chế tokenization
Link (chỉ đọc): https://www.overleaf.com/read/fkyzmchjqydn#c3e7f6
- Các bạn cài trực tiếp ứng dụng MySQL lên máy.
- Đầu tiên cài MySQL Community Server (https://dev.mysql.com/downloads/mysql/)
- Cài MySQL WorkBench để thuận tiện thao tác (https://dev.mysql.com/downloads/workbench/)
- Sau khi cài xong, chạy file
e_commerce.sql
,product_procedure.sql
trong thư mục Database
Do việc push kèm thư mục node_modules (thư mục chứa các thư viện cho NodeJS và ReactJS) sẽ khiến project trở nên rất nặng (thư mục node_modules của ReactJS có dung lượng loanh quanh 300-400 MB), cũng như git sẽ không thể track được toàn bộ thay đổi.
Do đó, hai thư mục node_modules của NodeJS và ReactJS đã phải được đưa vào .gitignore.
Vì thế, ngay sau khi clone project này về lần đầu tiên, các thành viên vui lòng tiến hành cài đặt lại các thư viện này. Cụ thể như sau:
Với NodeJS, mở terminal và gõ:
npm install
Các thư viện cần thiết cho NodeJS sẽ được cài đặt.
Với ReactJS cũng tương tự, chỉ cần chuyển vào thư mục views sau đó cài đặt. Gõ hai lệnh sau:
cd views
npm install
Các thư viện cần thiết cho ReactJS sẽ được cài đặt.
Sau khi clone project này, mở terminal tại thư mục mà project được clone (nếu đang ở thư mục views thì phải quay ra thư mục cha nha) và gõ:
npm run dev
Trang localhost:3000 sẽ khởi chạy tự động trên trình duyệt mặc định của máy sau vài giây nếu việc thiết lập thành công (nó hơi lâu một chút do phải khởi chạy cả ReactJS ở front-end lẫn NodeJS/ExpressJS ở back-end)
- Front-end:
- HTML + CSS
- Bootstrap 5 (được cài đặt như là một thư viện trong thư mục node_modules của ReactJS)
- Javascript
- jQuery
- ReactJS
- Axios (để thực hiện http request trong ReactJS)
- Back-end:
- Server code: NodeJS v20, ExpressJS
- Database: MySQL
- React - Arrow function, Hooks (useState, useEffect)
- Axios - Promised based. (https://www.youtube.com/watch?v=_zeOSnVHI2I)
- Route
- github
- Đầu tiên, mở folder để chứa project (Example: Desktop, Database)
- git clone https://github.com/vandungvo/DB_MVECom.git
- npm install
- cd views
- npm install
- cd ..
- npm run dev
- Sau đó, khi ta thay đổi code, ta muốn push lên remote repository
- git add .
- git commit -m "..."
- git pull origin master
- git push origin master.
- Đầu tiên, mở folder để chứa project (Example: Desktop, Database)
- Referencial link: https://www.youtube.com/playlist?list=PL_-VfJajZj0W8-gf0g3YCCyFh-pVFMOgy
- Tài khoản: [email protected], [email protected]
- Mật khẩu: 23571113
- File database này hiện chỉ có 1 table là user có dữ liệu. Vui lòng thêm các table khác liên quan đến module mà các bạn làm, cũng như thêm dữ liệu vào khi làm.
- Hiện tại, trang đã hiện thực tính năng đăng nhập (signin/authentication), đăng ký (signup/registration) và có cơ chế xác thực (authorization), và các thành viên được khuyến khích đọc qua code cả Front-end lẫn Back-end để hiểu và thêm cơ chế xác thực (authorization) vào các trang, các tính năng cần đăng nhập với quyền nhất định (xem minh hoạ trong chính repo này về hai trang công khai (/publicTest) và trang ẩn (/protectedTest) để hiểu và quan sát cách nó vận hành).
- Lưu ý thêm là mật khẩu của user trong database sẽ bị mã hoá, do đó khi đăng ký bất kỳ user nào mới thì phải nhớ mật khẩu. Mật khẩu cho hai tài khoản đang có sẵn trong database hiện tại là 23571113
- Trang web hiện được viết theo mô hình kết hợp giữa MVC và Layer, trong đó phần UI chứa trong thư mục
views
được xem là một layer chứa tất cả các component liên quan, sử dụng ReactJS để hiện thực. Ngoài ra tồn tại một layer API để React gọi về server NodeJS đối với các tác vụ cần database hoặc xử lý từ server. Ở server NodeJS thì vẫn tổ chức hai bộ phận là Controller và Model. - Nếu có đổi database về sau, chỉ cần thay đổi file
connect_db
và các file model đối tượng liên quan trong thư mụcmodel
. Code hiện tại đã cố gắng chia tách phần model kết nối database này với phần model của từng page trong web nhằm đảm bảo khi hiện thực hoặc đổi database, chỉ cần thay đổi kết nối trongconnect_db
và thay đổi các câu lệnh truy vấn trong các file model đối tượng liên quan, còn API mà các file đối tượng cung cấp ra là không đổi và không cần sửa (tuân thủ tối da bộ quy tắc quan trọng trong lập trình: SOLID) - Trang web có vài thiết lập liên quan đến bảo mật thông qua các thư viện:
helmet
,express-rate-limit
. - Sau mỗi thay đổi ở NodeJS server code, vui lòng
Ctrl+C
để tắt cả ReactJS và NodeJS server, sau đónpm run dev
lại để khởi chạy lại server, thì các thay đổi mới thấy được.