Tóm tắt Đề tài nghiên cứu cấp trường: Thiết kế website và cơ sở dữ liệu cho hệ thống giám sát và cảnh báo chất lượng nước nuôi trồng thủy sản trên sông Chà và BRVT

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

BỘ GIÁO DỤC VÀ ĐÀO TẠO

TRƯỜNG ĐẠI HỌC BÀ RỊA-VŨNG TÀU

--------

ĐỀ TÀI NGHIÊN CỨU KHOA HỌC CẤP TRƯỜNG Co-operative research project between BVU and UBO TÊN ĐỀ TÀI: THIẾT KẾ WEBSITE VÀ CƠ SỞ DỮ LIỆU CHO

HỆ THỐNG GIÁM SÁT VÀ CẢNH BÁO CHẤT LƯỢNG NƯỚC

NUÔI TRỒNG THỦY SẢN TRÊN SÔNG CHÀ VÀ -BRVT

Trình độ đào tạo: Chương trình trao đổi sinh viên với trường

UBO -Université de Bretagne Occidentale (Pháp)

Ngành đào tạo : Cơ khí

Chuyên ngành : Cơ điện tử

Giảng viên hướng dẫn: Ts. LÊ NGỌC TRÂN : Trương Quang Dũng Sinh viên thực hiện : Digital System : 2016-2018

Niên khóa

Lớp

1

Truong Quang Dung

Bà Rịa-Vũng Tàu, năm 2018

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

LỜI CAM ĐOAN

Trong quá trình thực hiện đề tài khoa học của mình, tôi xin cam đoan

những số liệu thu được từ quá trình thực nghiệm là hoàn toàn chính xác và

không sao chép bất cứ đề tài, công trình nghiên cứu khoa học nào. Các phần

trích dẫn nội dung từ các tài liệu tham khảo đã được ghi rõ trong phần Tài liệu

tham khảo cuối của đề tài.

Tôi xin cam đoan những điều trên là sự thật và chịu hoàn toàn trách

nhiệm về lời cam đoan này.

ASSURANCE

During the implementation of my research project, I pledge that the data

obtained from the experimental process is completely accurate and does not

copy any scientific subject or research. Excerpts from the references are listed

in the final reference section of the subject.

Baria-Vung tau, July 22th 2018

I declare that the above is true and take full responsibility for this assurance.

STUDENT

TRƯƠNG QUANG DŨNG

1

Truong Quang Dung

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

THANKS

Before beginning this work, I would first like to express my gratitude to the

teaching and administrative staff of the UBO School for their

training, the quality of their teaching and to have allowed me to do this

internship abroad.

I would also like to express my sincere thanks to Mr. Le Ngoc Tran

(Professor at Bà Ria Vung Tau University and my tutor during this internship)

for having accepted me as a trainee, and I thank Also the students who

worked with us throughout the duration of this internship and also welcomed

us to the university.

Finally, I would like to thank my family and my colleagues for all the

practical and theoretical lessons that have helped me to live this emotional

experience.

Vung Tau, July 20th 2018 Student

TRƯƠNG QUANG DŨNG

1

Truong Quang Dung

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Danh mục các từ viết tắt

HTML Hyper Text Markup Language

FTP File transfer protocol

PHP Hypertext Preprocessor

URL Universal Resource Locator

SQL Structured Query Language

PC Personal Computer

DB Databases

1

Truong Quang Dung

UI User Interfaces

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Chương 1

TỔNG QUAN VỀ DỰ ÁN “THIẾT KẾ WEBSITE VÀ CƠ SỞ DỮ LIỆU

CHO HỆ THỐNG QUAN TRẮC CHẤT LƯỢNG NƯỚC NUÔI

TRỒNG THỦY SẢN TRÊN SÔNG CHÀ VÀ”

1.1 Giới thiệu dự án

Một trong những nguồn thu nhập chính của tỉnh Bà Rịa trực thuộc miền

Nam Việt Nam đến từ ngành nuôi trồng thuỷ hải sản ven biển. Tuy nhiên, thời

gian gần đây, sản lượng nuôi trồng bị suy giảm nghiêm trọng và cá chết hàng

loạt diễn ra trong thời gian dài do ô nhiễm môi trường gây ra bởi các hoạt

động của con người và do thời tiết biến đổi. Để đo lường giám sát thông số

môi trường chất lượng nước phục vụ nuôi trồng thủy sản trên sông Chà Và,

giúp bà con nông dân chủ động nuôi thủy sản, giảm thiệt hại cho môi trường

gây ra và giúp Chi cục Thủy sản tỉnh BRVT giám sát chất lượng môi trường

nước chủ động trong việc lập kế hoạch nuôi thủy sản tại địa phương.

Với mục tiêu đó, dự án WAVE (tên do nhóm nghiên cứu đặt) được triển

khai để có thể kịp thời can thiệp tình hình cũng như tìm kiếm giải pháp bảo vệ

nguồn lợi thuỷ hải sản tại tỉnh BRVT. Là kết quả của sự hợp tác giữa UBO,

khối trường học La Croix Rouge La Salle Brest (Pháp) và trường Đại học Bà

Rịa - Vũng Tàu (Việt Nam), dự án tập trung chủ yếu vào việc phát triển một

hệ thống đo, giám sát các thông số môi trường nước nước biển không dây,

phục vụ chính cho ngành nuôi trồng thuỷ sản ở Việt Nam. Có thể nói rằng đây

là một dự án khoa học đa ngành, có sự kết hợp chặt chẽ giữa khoa học điện

Page 2

tử, tin học, cơ khí, tự động hoá cũng như hóa sinh.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Hình 1: Lắp đặt hệ thống quan trắc trên bè nuôi cá trên sông Chà Và tỉnh BRVT

Hệ thống đo và giám sát chất lượng nước nuôi trồng thủy sản được giới thiệu trong hình 2.

Hình 2: Các thành phần hệ thống giám sát tự động môi trường nước

Bơm số 1 bơm nước vào bể đo để tiến hành phân tích các thông số. Sau

khi phân tích xong, thông số sẽ được các máy cảm biến gửi tới hộp điều khiển

Page 3

điện tử bằng sóng ra-đi-ô và GSM. Tại đây, các thông số sẽ được cập nhật vào

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

cơ sở dữ liệu của hệ thống và có thể truy cập thông qua giao diện máy tính và

server web.

Tiếp đó, quá trình làm sạch bể đo diễn ra: van điện tử rút hết nước trong

bể, để bơm số 2 có thể bơm nước ngọt (sạch) từ thùng chứa vào bể và các mô-

tơ có thể tiến hành làm sạch các máy cảm biến. Sau khi làm sạch xong, van

điện tử lại rút hết nước từ bể đi, lượt đo mới lại có thể bắt đầu. Quá trình đo

nước biển được tự động hoá nhờ vào việc cài đặt tần suất đo của hệ thống .

Hệ thống đo thông số nước biển hoạt động bằng năng lượng mặt trời. Hộp

điện tử có màn hình LCD và nút xoay để tiện cho việc tra cứu dữ liệu, hiệu

chuẩn máy cảm biến, tần suất của quá trình đo cũng như các phương thức

truyền phát dữ liệu (GSM/sóng ra-đi-ô).

1.2. Tổng quan về web-server

1.2.1. Khái niệm website

Website là tập hợp của rất nhiều trang web – một loại siêu văn bản ( tập

tin HTML hay XHTML) trình bày thông tin trên mạng internet – tại một địa

chỉ nhất định để người xem có thể truy cập vào xem. Trang web đầu tiên

người ta có thể truy cập từ tên miền thường được gọi là trang chủ

(homepage), người xem có thể xem các trang khác thông qua các liên kết

(hyperlinks).

Đặc điểm tiện lợi của website là thông tin có thể dễ dàng cập nhật, thay đổi,

người sử dụng sẽ thấy ngay tức khắc, ở bất kì nơi nào, tiết kiệm chi phí in ấn,

bưu điện, fax, thông tin không giới hạn và không giới hạn phạm vi khu vực sử

dụng. Website là một tập hợp của một hay nhiều trang web.

1.2.2. Lịch sử ra đời

Ngày 6/8/1991 đã trở thành một cột mốc quan trọng khi những đường liên

kết tới nhưng dạng mã lệnh về www được đưa lên thảo luận alt.hypertext để

Page 4

những người khác có thể tải về và trải nghiệm. Và đó chính là ngày mà những

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

trang web phổ biến ra toàn thế giới. Ông Paul Kunz, một nhà khoa học tại

Trung tâm Gia tốc tuyến tính Stanford, người thiết lập nên một máy chủ web

ngoài Châu Âu vào tháng 12-1991 cho biết, hồi đầu những năm 1990, ý tưởng

về việc lấy được dữ liệu lưu trữ trên nhiều máy tính đơn giản như vậy đă tỏ ra

rất hấp dẫn. Vào thời điểm đó, các máy tính là những hòn đảo về thông tin.

Người dùng đăng nhập vào một hệ thống máy tính chỉ có thể truy cập vào

được nguồn tài nguyên nằm trên chiếc máy tính đó. Khi chuyển sang chiếc

máy tính khác có nghĩa họ phải đăng nhập lại và có thể phải sử dụng một tập

lệnh khác để tìm kiếm và thu thập dữ liệu. Và web đã ngay lập tức thu hút sự

quan tâm của của ông Kunz ngay sau khi Tim Berners-Lee (người đã phát

minh ra web tại phòng thí nghiệm vật lí Cern ở Genova) trình diễn khả năng

truy vấn một cơ sở dữ liệu (db) về những tài liệu vật lí được lưu trữ trên một

máy chủ IBM. Máy chủ web mà Kunz thiết lập cho phép các nhà vật lí lục lọi

trong số 200 000 bản tóm tắt dễ dàng hơn nhiều so với trước. Điều này chứng

tỏ sự hữu ích đến mức các nhà khoa học tại viện Cern đã nhanh chóng chuyển

sang tìm kiếm dữ liệu qua trang web Slac mà không dùng tới bản sao mạng

của họ nữa. Mặc dù web hấp dẫn các nhà vật lí, nhưng trong nhưng năm đầu

chỉ có rất ít những người hiểu được tiềm năng của công nghệ này. Ông Kunz

cho rằng, lí do chính là do khi đó cũng có rất nhiều công nghệ thực hiện một

việc tương tự. Rất nhiều người lấy về những tài liệu quang trọng bằng các

dịch vụ FTP và sử dụng Usenet như một phương tiện để tự bày tỏ. Đặc biệt

phổ biến khi đó là một công nghệ có tên là Gopher do Đại học Minnesota phát

triển. Công nghệ này sử dụng một giao diện thân thiện để che giấu sự phức

tạp của những máy tính kết nối mạng Internet. Nó có cái tên này này một

phần là do đội thể thao của trường Đại học này có tên là những con chuột túi

vàng Gopher được công bố vào năm 1991 và một vài năm sau đó, các con số

Page 5

thống kê cho thấy lưu lượng gopher trên mạng internet vượt xa lưu lượng giao

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

dịch web. Dự án WWW bùng nổ vào tháng 4-1993 khi trình duyệt web dành

cho máy tính cá nhân đầu tiên ra đời. Đây là sản phẩm của Marc Andreessen

tại Trung tâm Ứng dụng Siêu máy tính tại Đại học Illinois. Nhóm nghiên cứu

dự án web của viện Cern đã không đủ nhân lực để viết các trình duyệt cho các

hệ thống PC, Mac hay Unix. Trình duyệt có tên là Mosaic này đã đạt được

nhiều thành công to lớn khi nó tạo được nhiều thói quen sử dụng web đến tận

hôm nay. Thí dụ như khái niệm ban đầu về web không hề có chỗ bookmark

hay favourites. Cũng trong nhưng năm 1993, trường Đại học Minnesota bắt

đầu Gopher, do đó rất nhiều người đã xem xét chuyển sang sử dụng một công

nghệ khác. Ed Vielmetti, một trong nhưng người dùng web đầu tiên và hiện là

một trợ lí nghiên cứu tại trường Đại học Thông tin Michigan, nói rằng trong

suốt những năm đầu tiên, công nghệ web đã thực sự chứng tỏ sự hữu ích của

nó đối với những người dùng internet trung bình. Các hệ thống Gopher và

FTP thông thường vẫn do các công ti hay tổ chức lớn thiết lập. Còn Usenet thì

lại không tồn tại lâu bởi vậy nó buộc những người đưa ra một quan điểm phải

thường xuyên đăng lại ý kiến của mình. Ban đầu, người ta đã sử dụng các

web như để tự bày tỏ mình theo 1 cách thức mà các công nghệ khác không

cho phép. Ông Vielmetti cho rằng các mã lệnh web rất ít lỗi và thu hút người

ta sử dụng nó. Vào cuối năm 1994, lưu lượng giao dịch web cuối cùng đã

vượt qua giao dịch Gopher và từ đó đến nay chưa bao giờ tụt lại. Hiện trên

mạng Internet đã có gần 100 triệu website và có rất nhiều người đã xem web

và mạng internet là một. Nhưng ông Groff cho rằng phải đến tận hôm nay thì

web mới được như sự hình dung của những người tạo ra nó. Theo ý đồ ban

đầu của họ thì web là một phương tiện mà con người có thể đọc và đóng góp

nội dung cho nó. Những công cụ mới như các site chia sẻ ảnh, mạng công

cộng, nhật kí cá nhân, từ điển mã nguồn mở và những thứ khác đang thực

Page 6

hiện rất tốt lời hứa ban đầu này.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

1.2.3. Các yêu cầu tối thiểu của một trang web

Để một website hoạt động cần phải có tên miền (domain), không gian lưu

trữ (host server) và nội dung (các trang web). Tên miền là tên địa chỉ chính

của website, ví dụ như: www.google.com là tên miền của website hay địa chỉ

để người dùng có thể truy cập vào website.

Lưu trữ website: Dữ liệu thông tin của website phải được lưu trữ trên 1

máy tính (máy chủ - server) luôn hoạt động và kết nối mạng Internet. Một

server có thể lưu trữ nhiều website, nếu website này bị sự cố chẳng hạn tắt

trong một thời điểm nào đó không ai có thể truy cập được những website lưu

trữ trên server tại thời điểm bị sự cố. Tùy theo nhu cầu lưu trữ thông tin mà

doanh nghiệp có thể thuê dung lượng thích hợp cho lượng host hoặc cài đặt

máy chủ host sao cho phù hợp.

Host: là một không gian lưu trữ trên ổ đĩa của một máy chủ server để lưu

nội dung website nhằm làm cho bất kì ai cũng có thể truy cập vào những

nội dung này bất kì lúc nào, bất kì nơi nào, nói cách khác host là nơi lưu trữ

website để duy trì hoạt động của website trên mạng. Máy tính lưu những nội

dung website này được gọi là máy chủ Server phải hoạt động 24/24. Một

website nhất định phải có host thì nhất mới hoạt động được.

Dung lượng host là độ độ rộng, hay còn gọi là không gian trống của ổ đĩa

trên máy chủ để lưu trữ databases của website, đơn vị đo dung lượng thường

là Gigabyte hay Megabyte.

Băng thông hay dung lượng đường truyền là đại diện cho tốc độ đường

truyền hay nói cách khác là độ rộng của một dải tần số mà các tín hiệu điện tử

chiếm giữ trên một phương tiện truyền dẫn, đơn vị đo thông thường là

Page 7

Mb/tháng.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Chương

THIẾT KẾ HỆ THỐNG WEBSITE CHO HỆ THỐNG ĐO CHẤT

LƯỢNG NƯỚC NUÔI TRỒNG THỦY SẢN

2.1. Khái quát chung về thiết kế website

Bước đầu tiên trong công đoạn thiết kế một website là phải có những quyết

định chắc chắn về việc sẽ “xuất bản” cái gì với website của mình. Không có

chủ định và mục tiêu rõ rang thì cả website sẽ trở nên lan man, sa lầy và cuối

cùng đi đến một điểm khó quay trở lại. Thiết kế cẩn thận và định hướng rõ

rang là những chìa khóa dẫn đến thành công trong việc xây dựng trang web.

Trước khi xây dựng một website nên:

• Xác định đối tượng người sử dụng của website

• Website có mục đích gì

• Thiết lập chủ đề chính của website

• Thiết kế các khối thông tin chủ đề mà website cung cấp.

Nên bắt đầu với việc xác định nguồn tài nguyên về nội dung, hình ảnh

thông tin cần thiết để tạo nên website phù hợp với mục đích đề ra đó là

nguồn thông tin sẽ duy trì cho website hoạt động sau này.

. . Các bước thực hiện thiết kế website

2.2.1. Chuẩn bị:

- Host server và databases:

Để website của hệ thống Wave đi vào hoạt động chúng ta cần một host

server để lưu trữ thông tin và databases của website. Trước hết, ta cần 1 PC để

cài đặt server và chiếc máy tính đấy sẽ phải bật và kết nối với internet 24/24

để duy trì hoạt động của website, giúp cho website được hoạt động ổn định.

Page 8

- Cài đặt server và databases:

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Việc cài đặt server giờ đây rất dễ dàng vì nó được tích hợp sẵn trên các

phiên bản window. Công cụ chúng ta dùng ở đây là Internet Information

Services(IIS). Mặc định công cụ này đã bị nhà phát hành Microsoft ẩn đi, để

sử dụng chúng ta chỉ cần kích hoạt lại nó để có thể sử dụng máy tính mình

như 1 host server.

- Để kích hoạt thanh công cụ IIS, chúng ta truy cập vào Control Panel –

Programs and Features – Turn Windows features on or off

Sau khi chọn hết như trong hình ta chỉ cần ấn ok để hệ thống tự động cài cho

chúng ta. Sau đó chỉ cần khởi động lại là chúng ta đã có 1 hệ thống host

server để lưu trữ website. Mặc định đường dẫn của server để ta xem hoạt

Page 9

động của server là https://localhost hay https://127.0.0.1

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Khi IIS hoạt động, ta nhập 1 trong 2 địa chỉ trên vào trình duyệt ta sẽ có

được kết quả như thế kia.

Sau khi server hoạt động chúng ta cần 1 database để trợ giúp cho hoạt

động của website cũng như lưu trữ dữ liệu mà hệ thống WAVE đã thu thập

được và gửi lên server. Ở đây ta sử dụng hệ thống SQL là MySQL để thiết lập

database cũng như lưu trữ giữ liệu cho toàn bộ hệ thống.

Việc cài đặt MySQL trên PC cũng vô cùng dễ dàng, ta chỉ cần tải về bộ

cài đặt MySQL Installer được nhà phát triển cung cấp miễn phí trên mạng

Page 10

Internet.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Giao diện của MySQL Installer

Việc cài đặt MySQL khá dễ dàng, chỉ cần chấp nhận các thỏa thuận sử

Page 11

dụng và chọn loại thiết lập là Developer Default.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Để database có thể hoạt động được trên máy chủ ta chỉ cần chọn đúng

Standalone MySQL Server / Classic MySQL Replication như hình trên.

Đây mà giao điện cài đặt thông số cho server, ta chỉ cần chon

Development Machine và giữ nguyên các thông số mặc định (TCP/IP port

Page 12

3306) cho Connectivity.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Đây là màn hình thiết lập mật khẩu quản trị và chọn Add User để them

người dùng mới vào databases. Ở đây password sẽ để mặc định là “123456”

để đồng bộ với website.

Ở bước tiếp theo, giữ Configure MySQL Server as a Windows Service và

Start the MySQL Server at System Startup được bật. Chạy dịch vụ bằng

Standard System Account. Chọn Next để qua bước lưu trữ tài liệu và nhấn

Execute để kết thúc quá trình thiết lập.

Sau khi kết thúc quá trình, ta có thể truy cập vào cơ sở dữ liệu thông qua

phần mềm mặc định trên Windows là Command Prompt. Để có thể truy cập

được MySQL thông qua Command Prompt, ta nhập trên Command Prompt

lệnh sau “cd C:\Program Files\MySQL\MySQL Server 5.X\bin” sau đó

nhập “mysql -u root -p”. Sau đó nhập mật khẩu là “1 3456”.

Sơ đồ thiết lập databases cho toàn bộ hệ thống để đồng bộ với hệ thống

Page 13

cũng như website. Sau khi cài đặt xong server và databases, ta cần thiết lập

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

port forwarding trên router để các máy khác có thể truy cập từ xa thông qua

Internet vào đúng IP của máy tính. Trước tiên ta cần tìm được địa chỉ ip của

PC thông qua câu lệnh “ipconfig” trên Command Prompt.

Nhập địa chỉ Defaut Gateway vào trình duyệt web để có thể truy cập vào

Page 14

router.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Màn hình sau khi nhập địa chỉ trên trình duyệt web

Sau khi đăng nhập vào router, ta tìm đến mục Port Fowarding.

Sau đó them ip của máy và nhập port vào, ở mục protocol chọn TCP/UDP

sau đó ấn Add để xác nhận cài đặt và tích tiếp vào mục enable để kích hoạt.

2.2.2. Thiết kế website cho hệ thống quan trắc chất lượng nước

- Ý tưởng thiết kế

Do đây là trang web được xây dựng để hiển thị và theo dõi dữ liệu của hệ

thống WAVE nên hoạt động chính của website sẽ có 2 hoạt động chính là

Page 15

Live Overview (Dữ liệu hiện thời) và Biểu đồ.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Live Overview ở đây sẽ cập nhật các dữ liệu hiện thời mới nhật vừa được

cập nhật trong databases để hiện thị cho người dùng biết muối, độ bão hòa,

Oxy, nhiệt độ… của nước. Nó sẽ được hiện thị trực tiếp trên trang Dashboard.

Trang Dashboard này bao gồm các dữ liệu hiện thời và 1 phần nhỏ biểu đồ

của từng cảm biến và các dữ liệu thu được.

Biểu đồ: Nơi hiển thị chi tiết tất cả dữ liệu của từng cảm biến thu được

sau đó thể hiện 1 cách trực quan qua biểu đồ giúp người dùng dễ dàng quan

sát.

- Tiến hành:

Page 16

+ Xây dựng bố cục website:

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Xây dựng bố cục website ở đây là việc xây dựng hình ảnh, bố cục của website

sao cho phù hợp, làm bật lên được nội dung chính của website, khiến cho

website không bị lan man. Sau khi suy nghĩ và tham khảo, website sẽ được

xây dựng bằng Flat UI Design.

Flat Design ở đây là thiết kế web phẳng có thể nói mà một dạng thiết kế 2D,

không sử dụng các hiệu ứng phức tạp như đổ bóng, tạo hình khối … mà chọn

phong cách rất đơn giản, dễ nhìn mang lại cảm giác trực quan và dễ chịu cho

người truy cập. Flat Design được phát triển và hình thành dựa trên xu hướng

thiết kế tối giản (minimalism), vì vậy giao diện web phẳng được thiết kế đơn

giản hóa tất cả các yếu tố từ hình ảnh, bố cục cho đến các chi tiết nhỏ

Màu chủ đạo của website ở đây được chọn là xanh nhằm phù hợp với mục

đích của hệ thống là đo và giám sát chất lượng của nước. Cùng với màu xanh,

website còn sử dụng thêm 2 màu xám và trắng làm nền, nhằm tôn lên nét chủ

đạo của màu xanh cũng như khiến website dễ nhìn hơn.

Các khối hình, menu, hình ảnh, biểu đồ … cũng được thiết kế và xây dựng tối

giản hết mức nhằm thuận tiện cho việc quan sát, không gây rối và lan man

Page 17

khiến người dùng mất tập trung. Đồng thời việc đó cũng làm việc tải website

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

trở nên nhẹ nhàng, không quá tốn thời gian vào việc load các hiệu ứng làm

cho trang web trở nên cồng kềnh.

Ở trong menu, được chia ra làm 2 phần chính là Dashboard và Thông tin:

o Dashboard: bao gồm Live Overview nhằm hiển thị tất cả các thông số

hiện thời đồng thời tóm tắt tất cả thông tin trên trang chủ. Và phần Dữ liệu

và Biểu đồ nhằm hiện thị các thông số đã được lưu trong database và sử

dụng các thông tin đó để vẽ biểu đồ chi tiết cho các cảm biến. Giúp việc

theo dõi thông tin trở nên trực quan và dễ dàng hơn

o Thông tin: Ở đây là mục giới thiệu về toàn bộ hệ thống WAVE, thành

viên của dự án và các bên liên quan.

+ Ngôn ngữ thiết kế:

Việc tạo nên được 1 website để quan sát dữ liệu là sự kết hợp của rất nhiều

Page 18

ngôn ngữ lập trình bao gồm HTML, PHP, CSS, JS

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

o HTML: Đây là ngôn ngữ được sử dụng để tạo nên một trang web, trên 1

website có thể sẽ chứa nhiều trang và mỗi trang được quy ra là 1 tài liệu

HTML. Đây là khung xương chính cho việc thiết kế website, 1 tài liệu

viết bằng ngôn ngữ HTML đảm bảo vai trò hiển thị nội dung của website

trên các trình duyệt

o PHP là ngôn ngữ lập trình kịch bản được dùng chủ yếu để phát triển các

ứng dụng viết cho máy chủ, mã nguồn mở, dùng cho mục đích tổng quát.

Nó rất phù hợp với web và thường được nhúng vào tran HTML. Do được

tối ưu hóa cho các ứng dụng web, tốc độ nhanh, gọn, cú pháp giống C và

Java. Việc sử dụng PHP thêm vào cùng với HTML nhằm trợ giúp cho

Page 19

website kết nối với databases, thu thập dữ liệu,… trở nên dễ dàng hơn

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

o CSS đây là ngôn ngữ được sử dụng để tìm và định dạng lại các phần tử

tạo được tạo ra bởi các ngôn ngữ đánh dấu mà ở đây là HTML. Hiểu đơn

giản rằng nếu HTML đóng vai trò định dạng các phần tử website như tạo

ra các đoạn văn bản, tiêu đề,… thì CSS sẽ giúp chúng ta có thể điều chỉnh

bố cục của trang web, trang trí trang web,….

o JS hay Javascript cũng là ngôn ngữ lập trình kịch bản dựa vào đối tượng.

Việc sử dụng javascript trong việc thiết kế website khiến cho website

tương tác tốt với người dùng, khiến các website trở nên sống động hơn.

+ Mô tả hoạt động của website:

Website hoạt động hoàn toàn dựa trên dữ liệu mà hệ thống thu được và gửi

lên databases. Việc sử dụng các dữ liệu được các tập tin php hỗ trợ thu thập

và hiển thị trên website. Trong phần Live Overview, website được lập trình để

tự động lấy các dữ liệu cuối cùng ở databases vừa được thêm vào website.

Còn để vẽ biểu đồ trang web sẽ lấy 10 dữ liệu cuối cùng để vẽ cho người

dùng dễ dàng so sánh sự chênh lệch giữa từng lần thu giữ liệu. Trang web sẽ

tự động làm mới dữ liệu để liên tục cập nhật và thay đổi sao cho các thông số

sao cho chính xác nhất so với trên database.

+ Kiểm tra hoạt động của website:

Khi thử trực tiếp trên mạng cục bộ (LAN), server và databases hoạt động ổn

định. Ta có thể truy cập vào server thông qua các máy tính trong cùng 1 mạng

cục bộ. Do chưa thể truy cập vào router để mở port forwarding nên máy tính

chứa server chưa thể cấp quyền truy cập các máy và thiết bị trên mạng

internet.

Hoạt động của website cũng như việc hiện thị và cập nhật dữ liệu từ database

Page 20

hoạt động bình thường. Không xảy ra xung đột giữa website và database.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Cũng như không bị lỗi font chữ do đã được kiểm tra kĩ lưỡng và thử nghiệm

trong khi tiến hành viết code cho website. Việc kiểm tra hoạt động và lập

trình website được tiến hành song song với nhau để tránh tối đa việc xuất hiện

Page 21

lỗi và xung đột không đáng có.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

Chương 3

ĐÁNH GIÁ KẾT QUẢ VÀ KẾT LUẬN

Thông qua đề tài thiết kế và xây dựng database cho dự án Wave, em thu

được rất nhiều kinh nghiệm cho việc xây dựng và thiết kế website. Từ việc

lên kế hoạch cho việc thiết kế, lựa chọn giao diện, xây dựng nội dung của

website,… Tất cả những thứ trên giúp em củng cố thêm kiến thức trong việc

thiết kế cũng như lập trình 1 website và các thành phần đi kèm. Qua đó em

hiểu rõ hơn về sự tương tác giưa server host, website và người dùng. Nâng

cao hiểu biết của bản thân trong việc lập trình và hiểu hơn về các ngôn ngữ

như HTML, PHP, CSS và Javascript.

Trên hết, thông qua đề tài này, em có thể tiến hành nâng cấp hoạt động

của dự án Wave, khiến cho việc theo dõi dữ liệu của hệ thống không phải chỉ

qua tin nhắn điện thoại hay thông qua màn hình được lắp đặt cạnh hệ thống

tại sông Chà Và. Mà thay vào đó mở rộng tầm hoạt động của hệ thống, khiến

cho ai cũng có thể truy cập vào website để theo dõi dữ liệu 1 cách trực quan.

Giúp cho người dân và các nhà khoa học liên tục theo dõi dữ liệu từ xa thông

qua internet mà không cần phải đến tận nơi để lấy mẫu và đem về phòng thí

Page 22

nghiệm đo đạc.

Research Project 2018 Supervisor: PhD. Le Ngoc Tran

CONTENTS

LỜI CAM ĐOAN

LỜI CẢM ƠN

DANH MỤC TỪ VIẾT TẮT

CHƯƠNG 1:TỔNG QUAN VỀ DỰ ÁN “THIẾT KẾ WEBSITE VÀ CƠ SỞ

DỮ LIỆU CHO HỆ THỐNG QUAN TRẮC CHẤT LƯỢNG NƯỚC NUÔI

TRỒNG THỦY SẢN TRÊN SÔNG CHÀ VÀ”...............................................2

1.1. Giới thiệu dự án…………………………………………………………..2

1.2. Tổng quan về web-server………………………………………………...3

CHƯƠNG 2: THIẾT KẾ HỆ THỐNG WEBSITE CHO HỆ THỐNG ĐO

CHẤT LƯỢNG NƯỚC NUÔI TRỒNG THỦY SẢN………………………8

2.1. Khái quát chung về thiết kế website……………………………………...8

2.2. Các bước thực hiện thiết kế website……………………………………..8

2.2.1. Các bước chuẩn bị cho thiết kế website……………………………….8

2.2.2. Thiết kế website cho hệ thống quan trắc chất lượng nước……………15

Page 23

CHƯƠNG 3: ĐÁNH GIÁ KẾT QUẢ VÀ KẾT LUẬN……………………22