- Video Demo: https://youtu.be/2U7DpiqdBRo
- Website Demo:
+ client: nvtnews.cf
+ admin: admin.nvtnews.cf
- Dưới đây là các framework/library và các phần mềm được sự dụng trong project này.
-
Nodejs
-
ReactJS
-
Express
-
MaterialUI
- Cấu trúc thư mục:
├── admin # Quản trị hệ thống
│ ├── public # Development server file
│ ├── src # Chứa file code project
| ├── assets # HTML, SASS file
| ├── components # Chứa các component như: navigation bar, navbar, widget, chart,...
| ├── pages # Các view cần hiển thị
| ├── redux
| ├── routes # Định tuyến đường đi của các page
| ├── App.js
| ├── index.js
| ├── requestMethods.js # Tạo file Kết nối admin với api
├── api # Truy vấn cơ sở dữ liệu
│ ├── config # file cấu hình kết nối database
│ ├── middleware # Xác thực các quyền sau khi người dùng đăng nhập như: Được truy cập phần quản trị, cho phép tạo bài viết, xoá, chỉnh sửa
│ ├── modules # chưa các file truy vấn đến cơ sở dữ liệu, để truy vấn dữ được chia làm 3 phần
| ├── ...Controller # Quản lý request/response API.
| ├── ...Repository # Quản lý database (manages database operations.)
| ├── ...Service # Manages business logic like manipulation data, validation, etc.
│ ├── routes # Định tuyến đường đi API
│ ├── .env.sample # file dùng để điền các client, access key, endpoint,...
│ ├── index.js # file run source source code
| └── ...
├── client # Người dùng
│ ├── public # Development server file
│ ├── src # Chứa file code project
| ├── assets # HTML, SASS file
| ├── components # Chứa các component như: navigation bar, navbar, widget, chart,...
| ├── layout # Header, Footer layout
| ├── pages # Các view cần hiển thị
| ├── redux
| ├── routes # Định tuyến đường đi của các page
| ├── App.js
| ├── index.js
| ├── requestMethods.js # Tạo file Kết nối client đến api
| └── ...
├── docker # Run database với docker
├── dynamodb # Run database local
└── ...
XEM THÊM ==> Hướng dẫn cài đặt chi tiết
Nguồn: Sharecode.vn
*Những thứ cần cài đặt để chạy blog app
*Cài đặt / Installation
Video hướng dẫn tải và cài đặt, xem chi tiết https://youtu.be/2U7DpiqdBRo
-
Download Project
-
Tại thư mục API chúng ta đổi tên file .env.sample -> .env, xem chi tiết hướng dẫn https://youtu.be/2U7DpiqdBRo?t=60
AWS_ACCESS_KEY_ID = "ENTER YOUR ACCESS KEY ID";
AWS_SECRET_ACCESS_KEY = "ENTER YOUR SECRET KEY";
AWS_DEFAULT_REGION = "ENTER YOUR REGION";
AWS_END_POINT_DDB_CONSOLE = "ENTER YOUR ENPOINT";
-
Tạo mới 1 Terminal trong Visual Code và Cài đặt các package trong thư mục API
cd api
npm install
npm start
-
Tạo mới 1 Terminal và Cài đặt các package trong thư mục Client
cd client
npm install
npm start
-
Tạo mới 1 Terminal và Cài đặt các package trong thư mục Admin
cd admin
npm install
npm start
-
Chạy lệnh này nếu bạn sử dụng DynamoDB Local
java -Djava.library.path=./DynamoDBLocal_lib -jar DynamoDBLocal.jar -sharedDb
*Fix Bug
Nếu bạn chạy thành công nhưng ứng dụng không hiển thị nội dung (nguyên do là bạn chưa tạo table và import data)
-
Mở trang admin tại
http://localhost:3005/signin
-
Lúc này trang admin xuất hiện 2 button, bạn hãy bấm theo thứ tự 1.Create Table và 2. Import Data