Báo cáo Xây dựng ứng dụng di động dành cho hội thảo ATiGB của trường Đại học sư phạm kỹ thuật - Đại học Đà Nẵng

ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT BÁO CÁO TỔNG KẾT ĐỀ TÀI KHOA HỌC VÀ CÔNG NGHỆ CẤP TRƯỜNG XÂY DỰNG ỨNG DỤNG DI ĐỘNG DÀNH CHO HỘI THẢO ATiGB CỦA TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT – ĐẠI HỌC ĐÀ NẴNG Mã số: T2019-06-135 CHỦ NHIỆM ĐỀ TÀI : ThS. ĐỖ PHÚ HUY ĐÀ NẴNG, 09/2020 ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT BÁO CÁO TỔNG KẾT ĐỀ TÀI KHOA HỌC VÀ CÔNG NGHỆ CẤP TRƯỜNG 2019 XÂY DỰNG ỨNG DỤNG DI ĐỘNG DÀNH CHO HỘI THẢO ATiGB CỦA TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT – ĐẠI HỌC ĐÀ NẴNG Mã số: T2019-06-135 Xác nhận của cơ quan chủ trì đề tài Chủ nhiệm đề tài (ký, họ và tên, đóng dấu) (ký, họ và tên) DANH SÁCH CÁC THÀNH VIÊN THAM GIA VÀ ĐƠN VỊ CHỦ TRÌ DANH SÁCH THÀNH VIÊN: không ĐƠN VỊ CHỦ TRÌ: trường Đại học Sư phạm Kỹ thuật - ĐHĐN MỤC LỤC MỞ ĐẦU .................................................................................................................. 1 CHƯƠNG I: CƠ SỞ LÝ THUYẾT .......................................................................... 4 1. Mô hình xây dựng ứng dụng ........................................................................ 4 2. Giao diện lập trình ứng dụng (API) .............................................................. 5 2.1. API là gì? .............................................................................................. 5 2.2. Ưu điểm và nhược điểm ........................................................................ 6 3. Ngôn ngữ lập trình (React Native) ............................................................... 7 3.1. Tổng quan về React Native ................................................................... 7 3.2. Ưu điểm và nhược điểm ........................................................................ 7 4. Ngôn ngữ lập trình Laravel hỗ trợ xây dựng API ......................................... 8 4.1. Tổng quan về Laravel .................................................................................. 8 4.2. Ưu điểm và nhược điểm............................................................................... 8 4.3. Những tính năng hữu ích của Laravel .......................................................... 8 5. Hệ quản trị cơ sở dữ liệu My SQL ............................................................... 9 CHƯƠNG II: PHÂN TÍCH THIẾT KẾ HỆ THỐNG...............................................10 1. Phân tích hiện trạng ....................................................................................10 2. Các nội dung cần tìm hiểu trong bài toán ....................................................10 3. Phân tích bài toán cần xây dựng ..................................................................16 4. Sơ đồ Use case............................................................................................17 4.1. Các trường hợp được hỗ trợ trong chương trình ..........................................17 5. Đặc tả Use Case ..........................................................................................17 5.1. Đăng nhập ............................................................................................17 5.2. Đổi mật khẩu........................................................................................18 5.3. Xem danh sách bài báo.........................................................................20 5.4. Xem thông tin tài khoản cá nhân ..........................................................21 5.5. Quên mật khẩu .....................................................................................22 5.6. Xem danh sách nhà tài trợ ....................................................................23 5.7. Xem thông tin bài báo ..........................................................................24 5.8. Xem lịch sự kiện ..................................................................................25 5.9. Xem danh sách tác giả ..........................................................................26 6. Xây dựng tập API hỗ trợ ứng dụng .............................................................26 6.1. Đăng nhập ..................................................................................................26 6.2. Lấy thông tin hội thảo .................................................................................27 6.3. Lấy danh sách bài báo .................................................................................28 7. Sơ đồ ERD .................................................................................................28 Các thực thể chính tham gia trong bài toán: .........................................................29 Sơ đồ thực thể được mô tả như hình sau: .............................................................29 8. Xây dựng cơ sở dữ liệu ...............................................................................30 8.1. Các bảng dữ liệu tiêu biểu...........................................................................30 CHƯƠNG III: TRIỂN KHAI VÀ ĐÁNH GIÁ KẾT QUẢ ......................................37 1. Thiết kế giao diện .......................................................................................37 1.1. Màn hình Đăng nhập ............................................................................37 1.2. Màn hình tổng quan ứng dụng ..............................................................38 1.3. Màn hình chương trình hội thảo ...........................................................39 1.4. Màn hình những diễn giả chính của hội thảo ........................................40 1.5. Màn hình danh sách người tham gia .....................................................42 1.6. Màn hình danh sách bài báo .................................................................43 1.7. Màn hình tài khoản người dùng ............................................................44 1.8. Các màn hình khác ...............................................................................46 KẾT LUẬN VÀ KIẾN NGHỊ HƯỚNG PHÁT TRIỂN ...........................................51 DANH MỤC HÌNH ẢNH Hình 1. Mô hình xây dựng ứng dụng ......................................................................... 4 Hình 2: Cách hoạt động của API .............................................................................. 5 Hình 3:Danh sách thành viên ban tổ chức ...............................................................11 Hình 4: Danh sách thành viên ban khoa học ............................................................12 Hình 5: Chương trình làm việc phiên tổng thể .........................................................13 Hình 6: Chương trình làm việc báo cáo tổng thể .....................................................14 Hình 7:Chương trình làm việc theo phiên làm việc tại từng tiểu ban........................15 Hình 8: Chương trình làm việc báo cáo theo từng phiên làm việc ở từng tiểu ban ...16 Hình 9: Sơ đồ Use Case tổng quát ...........................................................................17 Hình 10: Sơ đồ hoạt động đăng nhập .......................................................................18 Hình 11. Sơ đồ hoạt động đổi mật khẩu ...................................................................19 Hình 12. Sơ đồ hoạt động xem danh sách bài báo ....................................................20 Hình 13. Sơ đồ hoạt động xem thông tin tài khoản ...................................................21 Hình 14. Sơ đồ hoạt động quên mật khẩu .................................................................22 Hình 15: Sơ đồ hoạt động Xem danh sách nhà tài trợ ..............................................23 Hình 16: Sơ đồ hoạt động Xem thông tin bài báo .....................................................24 Hình 17: Sơ đồ hoạt động Xem lịch sự kiện .............................................................25 Hình 18: Sơ đồ hoạt động Xem danh sách tác giả ....................................................26 Hình 19: Sơ đồ ERD ................................................................................................29 Hình 20: Màn hình chính cho người quản lý ............................................................34 Hình 21:Danh sách hội nghị trong hệ thống ............................................................35 Hình 22: Danh sách người tham dự ở phía người quản lý ........................................35 Hình 23: Chương trình hoạt động của hội thảo trên web quản lý .............................36 Hình 24:Màn hình gửi thông báo cho thành viên sử dụng ứng dụng ........................36 Hình 25: Màn hình đăng nhập ứng dụng .................................................................37 Hình 26: Màn hình tổng quan ứng dụng ..................................................................38 Hình 27: Màn hình chương trình hội thảo ................................................................39 Hình 28:Màn hình chi tiết của hoạt động trong lịch trình ........................................40 Hình 29: Màn hình các diễn giả chính trong hội thảo ..............................................41 Hình 30: Màn hình người tham dự hội thảo .............................................................42 Hình 31: Danh sách bài báo trong hội thảo .............................................................43 Hình 32: Chi tiết bài báo .........................................................................................44 Hình 33: Màn hình tài khoản người dùng ................................................................45 Hình 34: Màn hình danh sách nhà tài trợ ................................................................46 Hình 35: Màn hình giới thiệu thông tin hội thảo ......................................................47 Hình 36: Màn hình danh sách thông báo từ hội thảo ...............................................47 Hình 37: Màn hình đánh giá hội thảo từ người dùng ...............................................48 Hình 38: Màn hình ban thành viên trong hội thảo ...................................................49 Hình 39: Mô hình kết nối lấy dữ liệu lên ứng dụng di động......................................50 Hình 40: Các thông tin hiển thị ở phía màn hình ứng dụng di động .........................50 DANH MỤC CÁC TỪ VIẾT TẮT ATiGB Applying New Technology in Green Building API Application Programming Interface MVC Model-View-Control WPF Window Presentation Foundation ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐH SƯ PHẠM KỸ THUẬT CỘNG HOÀ XÃ HỘI CHỦ NGHĨA VIỆT NAM Độc lập - Tự do - Hạnh phúc THÔNG TIN KẾT QUẢ NGHIÊN CỨU 1. Thông tin chung: - Tên đề tài: Xây dựng ứng dụng di động dành cho hội thảo ATIGB của trường đại học Sư phạm Kỹ thuật – Đại học Đà Nẵng. - Mã số: T2019-06-135 - Chủ nhiệm: Đỗ Phú Huy - Cơ quan chủ trì: ĐH Sư Phạm Kỹ Thuật - Thời gian thực hiện: 12 tháng 2. Mục tiêu: Xây dựng ứng dụng di động hỗ trợ hội thảo nhằm mục đích đáp ứng được tính khoa học, công nghệ và tiết kiệm chi phí. Ứng dụng này sẽ được phát triển và tiến tới triển khai sử dụng tại hội thảo ATIGB trong tương lai. 3. Tính mới và sáng tạo: Hiện nay có rất nhiều hội thảo của các trường đại học diễn ra hằng năm trên khắp cả nước. Tuy nhiên, hiện vẫn có rất ít hội thảo có ứng dụng di động hỗ trợ cho người tham gia hội thảo để kịp thời nắm bắt thông tin và nội dung của hội thảo trong nhà trường. 4. Tóm tắt kết quả nghiên cứu: Tìm hiểu cách thức quản lý, liên lạc và giao tiếp của hội thảo khoa học hằng năm ATIGB của trường đại học Sư phạm Kỹ thuật để lên yêu cầu và xây dựng ứng dụng di động hỗ trợ người tham gia hội thảo, kịp thời đưa thông tin đến người tham gia hội thảo. 5. Tên sản phẩm: Ứng dụng di động hỗ trợ người tham gia hội thảo ATIGB. 6. Hiệu quả, phương thức chuyển giao kết quả nghiên cứu và khả năng áp dụng: sẽ được triển khai thực hiện thí điểm cho hội thảo ATIGB tổ chức tại trường đại học Sư phạm Kỹ thuật trong tương lai. 7. Hình ảnh, sơ đồ minh họa chính - Màn hình chính ứng dụng di động - Màn hình chương trình hội thảo trên ứng dụng di động - Màn hình các bài báo chính trong hội thảo trên ứng dụng di động Ngày tháng năm 2020 Hội đồng KH&ĐT đơn vị (ký, họ và tên) Chủ nhiệm đề tài (ký, họ và tên) XÁC NHẬN CỦA TRƯỜNG ĐẠI HỌC SƯ PHẠM KỸ THUẬT INFORMATION ON RESEARCH RESULTS 1. General information: Project title: Building mobile application for Atigb Conference of University of Technical Education - Danang University. Code number: T2019-06-135 Coordinator: University of Technical Education - Danang University Implementing institution: University of Technical Education - Danang University Duration: from 09/2019 to 08/2020 2. Objective(s): Building mobile application to support conference to meet the science, technology and save costs. This application will be developed and proceeded for use at the ATIGB conference in the future. 3. Creativeness and innovativeness: Currently there are many conferences of universities taking place every year across the country. However, there are still very few conferences using mobile applications to support workshop participants to timely grasp the information and content of conferences. 4. Research results: Learn how to manage, contact and communicate at the annual ATIGB science seminar of the University of Engineering and Technology to make the requirements and build a supporting mobile application which allow the conference in reaching the participants easily. 5. Products: Atigb conference participant support mobile application. 6. Effects, transfer alternatives of research results and applicability: implementing to the ATIGB conference held at the University of Technical Education in the future. MỞ ĐẦU ThS. Đỗ Phú Huy Trang 1 MỞ ĐẦU 1. Tổng quan tình hình nghiên cứu thuộc lĩnh vực đề tài Công nghệ thông tin ngày càng phát triển, tăng cơ hội thúc đẩy nhiều thay đổi trong vấn đề tin học hóa nghiệp vụ quản lý, giúp con người giải quyết được rất nhiều bài toán khó, giảm thiểu việc lãng phí thời gian và việc tiêu hao nguồn lực con người. Cụ thể, việc nhiều ứng dụng di động ra đời đã cho phép người dùng tiếp xúc với thông tin một cách nhanh chóng, linh động mọi lúc mọi nơi. Các ứng dụng di động ngày nay trở thành công cụ không thể thiếu khi muốn truyền tải thông tin một cách linh hoạt nhất đến người dùng. 2. Tính cấp thiết khi chọn đề tài Với tình trạng ô nhiễm môi trường, khí hậu chuyển biến như hiện nay thì các biện pháp phát triển đi kèm với giảm thiểu ô nhiễm môi trường đang là xu hướng. Không nằm ngoài xu hướng này thì trường Đại học Sư phạm Kĩ Thuật Đà Nẵng đã tổ chức hội thảo thường niên ATiGB( Applying New Technology in Green Building). Hội thảo khoa học quốc gia “Ứng dụng công nghệ mới trong công trình Xanh, ATiGB” do Trường Đại học Sư phạm Kỹ thuật – Đại học Đà Nẵng (Việt Nam) tổ chức thường niên từ năm 2014. Các lĩnh vực khoa học chính của hội thảo đều hướng tới mục tiêu cuối cùng là công trình xanh, cụ thể như: • Tiết kiệm năng lượng • Giảm phát thải các khí CO2, CFC • Sử dụng các loại vật liệu thân thiện môi trường • Các giải pháp qui hoạch, xây dựng xanh Tuy nhiên, việc quản lý và tạo ứng dụng di động hỗ trợ cho hội thảo vẫn chưa có để người dùng có thể tiếp cận một cách nhanh chóng nhất. Việc quản lý và mở rộng đối tượng tham gia hội thảo là điều mà nhà trường hướng tới. Điều đó đòi hỏi phải có một hệ thống tốt để hỗ trợ thực hiện công việc. Việc tạo ra ứng dụng di động hỗ trợ các đối tượng liên quan như người quan tâm hội thảo, độc giả, người viết bài, người phản biện dễ dàng theo dõi thao tác trên di động nhằm đáp ứng MỞ ĐẦU ThS. Đỗ Phú Huy Trang 2 kịp thời công việc. Mục tiêu của đề tài này là xây dựng một ứng dụng di động giao diện trực quan, dễ dàng sử dụng, hỗ trợ cho hội thảo của nhà trường. Đó cũng là một yêu cầu cấp thiết hỗ trợ cho hội thảo hiện nay. Xuất phát từ thực tế trên, đề tài “Xây dựng ứng dụng di động dành cho hội thảo Atigb của trường đại học Sư phạm Kỹ thuật – Đại học Đà Nẵng” sẽ phần nào giải quyết được những vấn đề đã và đang được đặt ra và là một trong những đề tài mang tính cấp thiết đối với hội thảo được tổ chức hằng năm của nhà trường. 3. Mục tiêu đề tài Xây dựng ứng dụng di động nền tảng Android và IOS, gồm các chức năng: 1. Hiển thị nội dung agenda của hội thảo 2. Hiển thị nội dung danh sách các bài báo đăng kí trong hội thảo 3. Hiển thị danh sách các diễn giả và người tham gia hội thảo 4. Giới thiệu hội thảo 5. Tìm kiếm bài báo trong hội thảo 4. Đối tượng và phạm vi nghiên cứu • Quy trình quản lý, liên lạc và giao tiếp của hội thảo khoa học hằng năm ATiGB của trường đại học Sư phạm Kỹ thuật. • Phạm vi nghiên cứu: Trường đại học Sư phạm Kỹ thuật – Đại học Đà Nẵng 5. Đặc tả phần mềm Tìm hiểu quản lý, liên lạc và giao tiếp của hội thảo khoa học hằng năm ATiGB của trường. Xây dựng ứng dụng di động hỗ trợ hiển thị thông tin đến người dùng. 6. Nội dung và kết cấu báo cáo Báo cáo gồm 3 phần: Mở đầu, nội dung, kết luận. Phần nội dung gồm 3 chương: - CHƯƠNG 1: CƠ SỞ LÝ THUYẾT o Chương này trình bày tổng quan về việc sử dụng các phần mềm hỗ trợ xây dựng ứng dụng, các công cụ thường xuyên sử dụng để xây dựng nền MỞ ĐẦU ThS. Đỗ Phú Huy Trang 3 tảng cho bài toán. Mô tả một số công nghệ mới hỗ trợ phát triển ứng dụng, vì sao phải sử dụng một số công nghệ này. - CHƯƠNG 2: PHÂN TÍCH THIẾT KẾ HỆ THỐNG o Chương này trình bày một hướng tiếp cận trong việc phân tích hệ thống. Trình bày những hướng chức năng cơ bản cho người dùng, các chức năng này sử dụng như giải pháp trong việc quản lý chương trình. Ngoài ra, chương này trình bày các sơ đồ lớp, sơ đồ tuần tự, sơ đồ chức năng, sơ đồ cơ sở dữ liệu. - CHƯƠNG 3: TRIỂN KHAI VÀ ĐÁNH GIÁ KẾT QUẢ o Trên cơ sở tìm hiểu và phân tích bài toán liên quan, đặc biệt là các chức năng hệ thống. Từ các phân tích hệ thống và dữ liệu có được, chương trình xây dựng thử nghiệm để kiểm chứng trước khi đưa vào thực tế sử dụng. CHƯƠNG 1: CƠ SỞ LÝ THUYẾT ThS. Đỗ Phú Huy Trang 4 CHƯƠNG I: CƠ SỞ LÝ THUYẾT 1. Mô hình xây dựng ứng dụng Để xây dựng được ứng dụng di động là sản phẩm của đề tài, một mô hình của hệ thống được dựng lên để đáp ứng được tất cả công việc. Trong hệ thống gồm các phần chính sau: 1. Ứng dụng di động 2. API hỗ trợ tương tác trong hệ thống. 3. Web server thực hiện các nghiệp vụ, hỗ trợ người quản lý tương tác, xử lý với dữ liệu và cung cấp thông tin cho ứng dụng di động. 4. Cơ sở dữ liệu (database): lưu trữ dữ liệu của hệ thống, cụ thể được thiết kế để lưu trữ thông tin của hội thảo. Hình 1. Mô hình xây dựng ứng dụng CHƯƠNG 1: CƠ SỞ LÝ THUYẾT ThS. Đỗ Phú Huy Trang 5 2. Giao diện lập trình ứng dụng (API) 2.1. API là gì? API – Application Programming Interface – giao diện lập trình ứng dụng, là phương thức kết nối giữa các thư viện và ứng dụng khác nhau với mục đích cuối là giúp ứng dụng của người dùng có thể truy cập đến một tệp các hàm thực hiện chức năng như tương tác hoặc trao đổi thông tin với nhau. Vì là mã nguồn mở nên bạn được sử dụng bất kì client nào có hỗ trợ XML, JSON. Điểm cộng của API là có cấu hình đơn giản hỗ trợ chức năng RESTful Hình 2: Cách hoạt động của API RESTful API được định nghĩa là một tiêu chuẩn dùng trong việc thiết kế API cho các ứng dụng web để tiện cho việc quản lý các resource. RESTful API đang là kiểu thiết kế được sử dụng phổ biến nhất đối với dân lập trình hiện nay. API mô tả cũng như quy định các hoạt động mong muốn mà thư viện cung ứng. Một API có thể có nhiều cách triển khai hoạt động khác nhau. API cũng có thể giúp cho một chương trình được viết bằng ngôn ngữ này nhưng có thể sử dụng được thư viện viết bằng ngôn ngữ khác. Nếu dựa trên quyền truy cập thì có thể phân API thành các loại sau: API mở (Open API): Có sẵn, công khai, không hạn chế quyền truy c