1 TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN KHOA CÔNG NGHỆ PHẦN MỀM BÁO CÁO THỰC TẬP XÂY DỰNG WEBSITE COVID-19 DASHBOARD Công ty thực tập: Sở Khoa học Công nghệ Tp.HCM Trung tâm Ứng dụng Hệ thống thông tin Địa lý Tp.HCM (HCMGIS) Người phụ trách : Th.Quách Đồng Thắng : Lê Võ Hữu Trí Thực tập sinh : Nguyễn Kha Tịnh - 16521248 Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh TP Hồ Chí Minh, tháng 07 năm 2020 Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh LỜI MỞ ĐẦU Ngành công nghệ thông tin ngành khoa học đà phát triển mạnh ứng dụng rộng rãi nhiều lĩnh vực Cùng với xu hướng phát triển phương tiện truyền thông TV, Radio, báo giấy, việc sử dụng Internet ngày phổ biến Truy cập Internet, có kho thơng tin khổng lồ phục vụ nhu cầu, mục đích nhấp chuột Nhận thức nhu cầu tìm hiểu thơng tin, giải trí xã hội, đời hàng loạt website cho mục đích thương mại, giải trí, tin tức Để đáp ứng với việc cập nhật thông tin hàng ngày, tình hình xã hội, trị, thời sự, sức khỏe Do đó, em vận dụng kiến thức lập trình web để xây dựng trang web ứng dụng trực tuyến mạnh mẽ Sau ba năm học tập trường, mong muốn có thêm kinh nghiệm thực tế, muốn tham gia làm website môi trường chuyên nghiệp Vì vậy, em định chọn HCMGIS mơi trường lý tưởng, đại, chuyên nghiệp - nơi giúp em thực dự định Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh LỜI CẢM ƠN Trân trọng gửi lời cảm ơn Sở Khoa học Công nghệ Tp.HCM - Trung tâm Ứng dụng Hệ thống thông tin Địa lý Tp.HCM (HCMGIS) tạo điều kiện cho em có hội thực tập trung tâm Chân thành cảm ơn anh nhóm trainer bỏ nhiều thời gian,cơng sức để hướng dẫn em hoàn thành đợt thực tập này, n hờ có giúp đỡ nhiệt tình anh chị phòng ban, tạo điều kiện thuận lợi nhất cho em suốt thời gian thực tập trung tâm Đặc biệt cảm ơn anh Lê Võ Hữu Trí training, hướng dẫn, giúp đỡ cho em tận tình khó khăn cơng việc, đến khó khăn việc làm quen với mơi trường Cảm ơn anh chị tạo điều kiện để em tiếp xúc với môi trường làm việc chuyên nghiệp từ việc lập trình việc xung quanh Cũng xin cảm ơn thầy cô khoa Công nghệ phần mềm nhiệt tình hỗ trợ, tạo điều kiện em làm báo cáo Với điều kiện thời gian kinh nghiệm hạn chế học viên, báo cáo tránh thiếu sót Em rất mong nhận bảo, đóng góp ý kiến quý thầy để em có điều kiện bổ sung, nâng cao ý thức mình, phục vụ tốt cơng tác thực tế sau Nguyễn Kha Tịnh Tp Hồ Chí Minh Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh NHẬN XÉT CỦA KHOA Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh MỤC LỤC MỤC LỤC Chương 1: Giới thiệu trung tâm thực tập 1.Giới thiệu trung tâm HCMGIS 2.Sản phẩm trung tâm HCMGIS .7 Chương 2: Nội dung thực tập .8 1.Tìm hiểu trung tâm kỹ trung tâm .8 2.Nghiên cứu kỹ thuật 3.Thực project 12 4.Lịch làm việc 12 Chương 3: Chi tiết project .15 1.Giới thiệu WEBSITE COVID-19 DASHBOARD 15 2.Kế hoạch 19 TÀI LIỆU THAM KHẢO 19 TỔNG KẾT 20 Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh Chương 1: Giới thiêu công ty thực tập Giới thiệu trung tâm HCMGIS Trung tâm Ứng dụng Hệ thống Thông tin Địa lý TP.HCM (HCMGIS) đơn vị nghiệp trực thuộc Sở Khoa học Công nghệ TP.HCM thành lập theo Quyết định số 134/2004/QĐ-UB ngày 14 tháng năm 2004 Ủy ban nhân dân Thành phố Quyết định số 216/QĐ-UBND ngày 17 tháng 01 năm 2008 việc bổ sung nhiệm vụ cho Trung tâm Năm 2010, HCMGIS chuyển qua hoạt động theo Nghị định 115 Chính phủ tự chủ, tự chịu trách nhiệm tổ chức khoa học công nghệ công lập Sản phẩm trung tâm HCMGIS HCMGIS nghiên cứu công nghệ GIS, xây dựng tích hợp sở liệu GIS, xây dựng ứng dụng GIS, tư vấn quản lý dự án đào tạo chuyển giao công nghệ HCMGIS sử dụng đa dạng cơng nghệ GIS, định hướng ưu tiên phát triển sản phẩm tảng mã nguồn mở Các giải pháp xây dựng theo tiêu chuẩn OGC, đáp ứng yêu cầu tích hợp, trao đổi liệu hệ thống Các sản phẩm dự án HCMGIS: • Các tảng dịch vụ HCMGIS - HCMGIS Portal (https://portal.hcmgis.vn/) - HCMGIS MAPS (https://maps.hcmgis.vn/maps#/) - HCMGIS GEOSURVEY (https://geosurvey.hcmgis.vn/) Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh - HCMGIS OPENDATA (https://opendata.hcmgis.vn/) HCMGIS STORYMAPS (https://storymaps.hcmgis.vn/) … • Các ứng dụng triển khai cho Sở ngành, quận huyện, phường xã, doanh nghiệp - Hệ thống quản lý bệnh truyền nhiễm - Hệ thống quản lý vùng sản xuất rau địa bàn Thành phố - Hệ thống quản lý lâm sản động vật hoang dã … Chương 2: Nội dung thực tập Đợt thực tập với chủ đề “Tìm hiểu Yii framework” nhằm mục đích giúp sinh viên thực tập đào tạo tồn diện framework Yii để lập trình web, đồng thời rèn luyện kỹ mềm văn hóa văn phịng, làm việc nhóm, thuyết trình, ứng xử giao tiếp môi trường làm việc Tại trung tâm, sinh viên có hội học tập, khám phá làm việc môi trường phát triển chuyên nghiệp Tìm hiểu trung tâm kỹ trung tâm Thời gian : ngày Nội dung : Giới thiệu trung tâm, cách tổ chức trung tâm Được nghe người phụ trách giới thiệu trung tâm, trình thành lập phát triển (như nhắc đến trên), quy trình làm việc từ cao xuống thấp, cách thức tổ chức trung tâm Ngồi ra, thực tập sinh cịn giới thiệu cách thức làm việc trung tâm thời gian làm, quy định cần phải tuân thủ, cách sử dụng email công việc… Kết : Hiểu thêm trung tâm HCMGIS, trình thành lập phát triển Có thêm kỹ việc sử dụng email công việc, làm việc có kế hoạch, có kỷ luật, có trách nhiệm Nghiên cứu kỹ thuật 2.1 Các công cụ làm việc Thời gian : ngày Nội dung : Tìm hiểu cơng cụ sử dụng trình làm việc Trong thời gian này, supervisor hướng dẫn thực tập sinh tìm hiểu cơng cụ giúp ích cho cơng việc sau Một số phần mềm số Tortoise GIT – phần mềm quản lý source code Github đơn giản, QGIS – phần mềm tự hệ thống thơng tin địa lý, Xampp - chương trình tạo web server,… Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 2.2 Thực : Thực hành sử dụng phần mềm nêu Kết : Lập trình sử dụng cơng cụ miễn phí, giúp dễ dàng kết hợp cơng cụ với Tìm hiểu ngôn ngữ PHP Thời gian : ngày (1 tuần) Nội dung : Được training kỹ thuật PHP nâng cao, kiến thức quan trọng cho việc tối ưu lập trình web Thực : - Tham gia đầy đủ buổi training trung tâm - Làm thực hành, kiểm tra kiến thức học Kết : - 2.3 Nâng cao kỹ lập trình với ngơn ngữ PHP Có kiến thức quan trọng cho việc lập trình WEB sau Ngồi cịn biết thêm số quy tắc việc viết code cho chuẩn, dễ đọc, dễ hiểu Lập trình WEB với PHP Nội dung: Các kiến thức PHP để làm WEB đơn giản - Khái niệm PHP PHP - viết tắt hồi quy "Hypertext Preprocessor", ngôn ngữ lập trình kịch chạy phía server nhằm sinh mã html client PHP trải qua rất nhiều phiên tối ưu hóa cho ứng dụng web, với cách viết mã rõ rãng, tốc độ nhanh, dễ học nên PHP trở thành ngơn ngữ lập trình web rất phổ biến ưa chuộng - Cú pháp khai báo PHP, sử dụng biến - Các kiểu liệu phạm vi biến PHP - Toán tử PHP - Các lệnh điều khiển PHP - Mảng lập trinh PHP - Thao tác với chuỗi PHP Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 10 - Xử lý lấy liệu từ form PHP - Các hàm xử lý file upload file PHP - Lập trình hướng đối tượng PHP - Thao tác với CSDL PHP thông qua PDO Thực : - Tham gia đầy đủ buổi trainning Làm tập thực hành Tìm kiếm tài liệu mạng để tìm hiểu thêm Kết : 2.4 Hiểu khái niệm lập trình web với php Tạo web Tìm hiểu Veu.js Nội dung : Tích hợp Veujs vào lập trình Web - Định nghĩa Veu.js: Vue.js framework linh động (nguyên tiếng Anh: progressive – tiệm tiến) dùng để xây dựng giao diện người dùng (user interfaces) Khác với framework nguyên khối (monolithic), Vue thiết kế từ đầu theo hướng cho phép khuyến khích việc phát triển ứng dụng theo bước Khi phát triển lớp giao diện (view layer), người dùng cần dùng thư viện lõi (core library) Vue, vốn rất dễ học tích hợp với thư viện dự án có sẵn Cùng lúc đó, kết hợp với kĩ thuật đại SFC (single file components) thư viện hỗ trợ, Vue đáp ứng dễ dàng nhu cầu xây dựng ứng dụng trang (SPA - Single-Page Applications) với độ phức tạp cao nhiều cho kết hợp nhiều với ngôn ngữ back-end khác PHP,… Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 11 - Thực hành sử dụng Veu.js Thực : - Tham gia đầy đủ buổi training Ứng dụng veu.js vào lập trình web Kết quả: 2.5 Hiểu framework veu.js ứng dụng thành cơng Tìm hiểu Yii Nội dung : Tìm hiểu framework Yii - Định nghĩa Yii: Tiền thân Yii PRADO framework Tác giả Yii Qiang Xue, người Trung Quốc Qiang Xue bắt đầu xây dựng Yii vào khoảng 1/1/2008 Sau gần năm phát triển, tới 8/12/2008, Yii public nhanh chóng người đón nhận Yii Framework đời đáp ứng yêu cầu cho cộng đồng Web, Yii từ viết tắt từ Yes, it is! Hoặc viết ngắn gọn ba chữ đầu Easy (dễ dàng), Efficient (hiệu suất) Extensible (khả mở rộng) Yii PHP Framework mã nguồn mở hồn tồn miễn phí, có hiệu cao, giúp phát triển tốt nhất ứng dụng Web 2.0 Yii xây dựng để phát triển ứng dụng Web quy mô lớn dựa tảng component (thành phần sử dụng lại) Yii cho phép tái sử dụng tối đa thành phần hệ thống để tăng tốc độ viết ứng dụng Yii tốt framework khác tính hiệu quả, nhiều tính có tài liệu hướng dẫn đầy đủ Yii thiết kế cẩn thận từ ban đầu để đáp ứng nhu cầu phát triển ứng dụng Web nghiêm ngặt, kết kinh nghiệm phát triển ứng Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 12 dụng Web lâu năm tác giả phân tích kỹ lưỡng, tận dụng điểm mạnh framework khác - Thực hành sử dụng Yii Thực : - Tham gia đầy đủ buổi training Ứng dụng Yii vào lập trình web Kết quả: - Hiểu framework Yii ứng dụng thành công Thực project Sau tháng training thực hành, thực tập sinh nắm kiến thực nâng cao PHP, Veu.js, Yii Trong tháng thứ hai, trainer hướng dẫn thực tập sinh áp dụng kiến thức học để thực project Web với ngôn ngữ PHP Chi tiết đồ án nói phần sau Lịch làm việc Tuần Cơng việc - - - Tìm hiểu trung tâm, cách tổ chức trung tâm Làm quen với công cụ làm việc trung tâm Học cách trao đổi, làm việc qua email Tìm hiểu ngơn ngữ lập trình PHP Thực hành PHP Làm test PHP Người hướng dẫn Mức độ hoàn thành Nhận xét người hướng dẫn Anh Lê Võ Hữu Trí Anh Lê Võ Hữu Trí Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 13 - Lập trình web với Anh Lê Võ Hữu PHP Trí Thực hành tạo web PHP - Tìm hiểu Veu.js Anh Lê Võ Hữu Thực hành ứng Trí dụng Veu.js - Tìm hiểu Yii Thực hành ứng dụng Yii Lên kế hoạch Chọn Framework Setup source - - - Anh Lê Võ Hữu Trí Anh Lê Võ Hữu Trí Anh Trịnh Ngọc Thiết kế Prototype Lợi Code giao Thực tập sinh diện( front-end) Nguyễn Kha Tịnh Code logic Backend cho web Lấy liệu ca nhiễm Việt Nam từ Bộ y tế Tìm kiếm lấy liệu ca nhiễm giới từ nguồn uy tín Tạo bảng thống kê ca nhiễm Việt Nam Tạo bảng thống kê ca nhiễm Thế giới Tạo bảng đồ hiển thị vùng nhiễm Việt Nam Tạo bảng đồ hiển thị vùng nhiễm Thế Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 14 giới - - Tạo chức chia Anh Lê Võ Hữu qua Facebook Trí Viết tool auto tự cập nhật theo liệu nhất từ nguồn đảm bảo xác trung thực Kiểm thử liệu Publish trang web - Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 15 Chương 3: Chi tiết project Giới thiệu WEBSITE COVID-19 DASHBOARD Trước diễn biến phức tạp COVID-19, Trung tâm HCMGIS biết liệu rất cần thiết cho công chống lại Coronavirus Nhận thấy việc thông tin cập nhật nhanh chóng xác giúp rất nhiều cho cộng đồng phòng tránh nhiều hiểm họa virus gây ra, HCMGIS phát triển dashboard tình trạng COVID-19 Việt Nam giới 1.1 1.2 Mục tiêu Mục tiêu Covid-19 Dashboard giúp người dân có nhìn tổng quan dịch bệnh, từ đưa biện pháp phịng ngừa đảm bảo an tồn tốt nhất cho thân gia đình.Việc tất người xem bảng dashboard với liệu cập nhật nhanh nhất giúp người tự bảo vệ tốt tình hình dịch bệnh Giao diện Giao diện trang chủ: Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 16 Bảng thống kê Việt Nam: Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 17 Bảng thống kê giới: Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 18 Bản đồ hiển thị vùng dịch việt nam giới: z Thực thành viên team: - Lê Võ Hữu Trí Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 19 - Trịnh Ngọc Lợi Nguyễn Kha Tịnh Kế hoạch - Setup source công nghệ cần thiết - Thiết kế Prototype cho trang web - Tiến hành code giao diện cho web - Tiến hành code logic Back-end cho web - Lấy liệu ca nhiễm Việt Nam từ Bộ y tế - Tìm kiếm lấy liệu ca nhiễm giới từ nguồn uy tín - Tạo bảng thống kê ca nhiễm Việt Nam - Tạo bảng thống kê ca nhiễm Thế giới - Tạo bảng đồ hiển thị vùng nhiễm Việt Nam - Tạo bảng đồ hiển thị vùng nhiễm Thế giới - Tạo chức chia qua Facebook - Viết tool auto tự cập nhật theo liệu nhất từ nguồn đảm bảo xác trung thực - Kiểm thử liệu - Publish trang web Kết : - Hầu hết tính thực Publish website tới người với độ xác cập nhật liên tục TÀI LIỆU THAM KHẢO https://vuejs.org/ https://www.yiiframework.com/ Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 20 TỔNG KẾT Như vậy, vòng hai tháng ngắn ngủi, em thực phần nhỏ cho dự án trung, chức rất nhỏ giúp em hiểu cách làm việc chun nghiệp doanh nghiệp để sau khơng cịn phải bỡ ngỡ phải sống Đây điểm tựa để em phát triển lên thứ sau Chân thành cảm ơn giúp đỡ anh chị nhóm trainer, nỗ lực em để hồn thành chức Cảm ơn thầy cô khoa công nghệ phần mềm giúp em hoàn thành báo cáo Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh ... trung thực Kiểm thử liệu Publish trang web - Quách Đồng Thắng/Lê Võ Hữu Trí Nguyễn Kha Tịnh 15 Chương 3: Chi tiết project Giới thiệu WEBSITE COVID- 19 DASHBOARD Trước diễn biến phức tạp COVID- 19, ... lý lâm sản động vật hoang dã … Chương 2: Nội dung thực tập Đợt thực tập với chủ đề “Tìm hiểu Yii framework” nhằm mục đích giúp sinh viên thực tập đào tạo toàn diện framework Yii để lập trình web,... Thực hành sử dụng Yii Thực : - Tham gia đầy đủ buổi training Ứng dụng Yii vào lập trình web Kết quả: - Hiểu framework Yii ứng dụng thành công Thực project Sau tháng training thực hành, thực tập