Hướng dẫn react mysql github - phản ứng mysql github

React - Node/Express - MySQL Demo

Mô tả ứng dụng

Cấu trúc cơ bản

Ứng dụng này là một công cụ đánh giá hiệu suất nhân viên cơ bản. Nó có chức năng sau:

• Liệt kê tất cả nhân viên
• Thêm/Xóa/Cập nhật/Xem Nhân viên
• Thêm/Cập nhật/Xem Đánh giá hiệu suất

Dưới đây là ảnh chụp màn hình của trang "Nhân viên":

Công nghệ được sử dụng

• Phản ứng ở phía khách hàng
• Node.js/express ở phía máy chủ
• Cơ sở dữ liệu MySQL

Hướng dẫn cài đặt và chạy

Mã được chia thành hai phần:

• phía máy chủ (trong thư mục

  mysql> use books;
  mysql> show tables;
  

  2)
• phía máy khách (trong thư mục

  mysql> use books;
  mysql> show tables;
  

  3) Ứng dụng cần cả máy chủ và máy khách để chạy đồng thời. Trong môi trường phát triển, điều này đạt được bằng cách chạy hai trong các cửa sổ đầu cuối riêng biệt.

Cơ sở dữ liệu MySQL

• Hướng dẫn cài đặt và chạy
• Mã được chia thành hai phần:

phía máy chủ (trong thư mục

mysql> use books;
mysql> show tables;

phía máy khách (trong thư mục

mysql> use books;
mysql> show tables;

Nhập để cài đặt trên máy cục bộ của bạn Cơ sở dữ liệu MySQL (bao gồm trong gói Clone/Tải xuống)

Ngoài ra, tạo cơ sở dữ liệu mysql> use books; mysql> show tables; 4 và các bảng sau trong đó:

• Tạo bảng

  mysql> use books;
  mysql> show tables;
  

  5 (

  mysql> use books;
  mysql> show tables;
  

  6 int (11) không phải null,

  mysql> use books;
  mysql> show tables;
  

  7 varchar (30) không null) động cơ = charet mặc định innodb = utf8;
• Tạo bảng

  mysql> use books;
  mysql> show tables;
  

  8 (

  mysql> use books;
  mysql> show tables;
  

  6 int (11) không phải null,

  +-----------------+
  | Tables_in_books |
  +-----------------+
  | authors         |
  +-----------------+
  1 row in set (0.00 sec)
  

  0 int (11) không phải null,

  mysql> use books;
  mysql> show tables;
  

  7 varchar (30) không null) động cơ = innodb mặc định Charset = utf8;
• Tạo bảng

  +-----------------+
  | Tables_in_books |
  +-----------------+
  | authors         |
  +-----------------+
  1 row in set (0.00 sec)
  

  2 (

  mysql> use books;
  mysql> show tables;
  

  6 int (11) không phải null,

  +-----------------+
  | Tables_in_books |
  +-----------------+
  | authors         |
  +-----------------+
  1 row in set (0.00 sec)
  

  4 int (11) không phải null,

  +-----------------+
  | Tables_in_books |
  +-----------------+
  | authors         |
  +-----------------+
  1 row in set (0.00 sec)
  

  5 văn bản không null) động cơ = innodb mặc định charet = utf8;
• Người phục vụ

Đảm bảo rằng trong tệp 'Server/SRC/Endpoints.js' Một ổ cắm thích hợp được chỉ định cho kết nối cơ sở dữ liệu (+-----------------+ | Tables_in_books | +-----------------+ | authors | +-----------------+ 1 row in set (0.00 sec) 6). Hiện tại có ổ cắm cho MAMP - +-----------------+ | Tables_in_books | +-----------------+ | authors | +-----------------+ 1 row in set (0.00 sec) 7

• Thay đổi sang thư mục

  mysql> use books;
  mysql> show tables;
  

  2
• Tạo bảng

  +-----------------+
  | Tables_in_books |
  +-----------------+
  | authors         |
  +-----------------+
  1 row in set (0.00 sec)
  

  2 (

  mysql> use books;
  mysql> show tables;
  

  6 int (11) không phải null,

  +-----------------+
  | Tables_in_books |
  +-----------------+
  | authors         |
  +-----------------+
  1 row in set (0.00 sec)
  

  4 int (11) không phải null,

  +-----------------+
  | Tables_in_books |
  +-----------------+
  | authors         |
  +-----------------+
  1 row in set (0.00 sec)
  

  5 văn bản không null) động cơ = innodb mặc định charet = utf8;
• Người phục vụ

React-Express-MySQL

Đây là một ứng dụng web React hoạt động đầy đủ với các đặc điểm sau:

• Dựa trên created-react-app
• Node/Express phụ trợ
• Kết nối MySQL
• Mẫu Redux để xử lý trạng thái ứng dụng
• Reactrouter cho các tuyến đường xử lý
• Phản ứng cho UI
• Redux-Saga cho các công việc không đồng bộ

Đưa ứng dụng này lên và chạy

1. Bản sao kho lưu trữ này:

2. Thiết lập cơ sở dữ liệu kiểm tra

Trong nhật ký đầu cuối làm gốc và sử dụng tệp mẫu.sql có trong repo này

mysql -u root
mysql> source sample.sql;

Tại thời điểm này, bạn có thể kiểm tra kết nối thực tế với cơ sở dữ liệu.

mysql> use books;
mysql> show tables;

Bạn nên nhận được:

+-----------------+
| Tables_in_books |
+-----------------+
| authors         |
+-----------------+
1 row in set (0.00 sec)

1. Cài đặt các gói máy chủ và máy khách

cd YOUR_PATH/MyWebApp
npm install
cd client
npm install

1. Bắt đầu cả máy chủ và máy khách

cd YOUR_PATH/MyWebApp
npm start

Các dòng cuối cùng của đầu ra phải là

Starting the development server...

Compiled successfully!

The app is running at:

  http://localhost:3000/

Note that the development build is not optimized.
To create a production build, use npm run build.

Bây giờ bạn có thể trỏ trình duyệt của mình vào http: // localhost: 3000/!

Thiết lập máy chủ

• MyWebApp/server.js

Tệp là một ví dụ về những gì nó có thể trông như thế nào đối với một máy chủ: _ phục vụ tại cổng 3001 _ sử dụng chỉ mục tĩnh.html khi ở chế độ sản xuất _ kết nối với nhóm MySQL (nhóm cho phép xử lý kết nối lại) phía khách hàng có thể nói chuyện với

• MyWebApp/package.json

Nội dung nơi mượn và sửa đổi một chút từ tệp này.

• MyWebApp/start-client.js

Nội dung nơi mượn từ tệp này

Kiểm tra máy chủ

• Kiểm tra tối thiểu

Trong thư mục hàng đầu

npm install -s
npm run server

Tại thời điểm này bạn nên thấy:

NODE_ENV:  undefined
Find the server at: http://localhost:3001/

• Kiểm tra cơ sở dữ liệu

Trong nhật ký đầu cuối làm gốc và sử dụng tệp mẫu.sql có trong repo này

mysql -u root
mysql> source sample.sql

Tại thời điểm này, bạn có thể kiểm tra kết nối thực tế với cơ sở dữ liệu.

Bạn nên nhận được:

Cài đặt các gói máy chủ và máy khách

curl localhost:3001/api/books?firstName=William | jq '.'

Bắt đầu cả máy chủ và máy khách

mysql> use books;
mysql> show tables;

Các dòng cuối cùng của đầu ra phải là

Bây giờ bạn có thể trỏ trình duyệt của mình vào http: // localhost: 3000/!

Thiết lập máy chủ

Tệp là một ví dụ về những gì nó có thể trông như thế nào đối với một máy chủ: _ phục vụ tại cổng 3001 _ sử dụng chỉ mục tĩnh.html khi ở chế độ sản xuất _ kết nối với nhóm MySQL (nhóm cho phép xử lý kết nối lại) phía khách hàng có thể nói chuyện với

Nội dung nơi mượn và sửa đổi một chút từ tệp này.

Chức năng chính trong tệp này thực hiện truy vấn là

mysql> use books;
mysql> show tables;